1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
|
(function() {
'use strict';
angular.module('foundation.interchange', ['foundation.core', 'foundation.mediaquery'])
.directive('zfInterchange', zfInterchange)
;
zfInterchange.$inject = [ '$compile', '$http', '$templateCache', 'FoundationApi', 'FoundationMQ'];
function zfInterchange($compile, $http, $templateCache, foundationApi, foundationMQ) {
var directive = {
restrict: 'EA',
transclude: 'element',
scope: {
position: '@'
},
replace: true,
template: '<div></div>',
link: link
};
return directive;
function link(scope, element, attrs, ctrl, transclude) {
var childScope, current, scenarios, innerTemplates;
var globalQueries = foundationMQ.getMediaQueries();
//setup
foundationApi.subscribe('resize', function(msg) {
transclude(function(clone, newScope) {
if(!scenarios || !innerTemplates) {
collectInformation(clone);
}
var ruleMatches = foundationMQ.match(scenarios);
var scenario = ruleMatches.length === 0 ? null : scenarios[ruleMatches[0].ind];
//this could use some love
if(scenario && checkScenario(scenario)) {
var compiled;
if(childScope) {
childScope.$destroy();
childScope = null;
}
if(typeof scenario.templ !== 'undefined') {
childScope = newScope;
//temp container
var tmp = document.createElement('div');
tmp.appendChild(innerTemplates[scenario.templ][0]);
element.html(tmp.innerHTML);
$compile(element.contents())(childScope);
current = scenario;
} else {
var loader = templateLoader(scenario.src);
loader.success(function(html) {
childScope = newScope;
element.html(html);
}).then(function(){
$compile(element.contents())(childScope);
current = scenario;
});
}
}
});
});
//init
foundationApi.publish('resize', 'initial resize');
function templateLoader(templateUrl) {
return $http.get(templateUrl, {cache: $templateCache});
}
function collectInformation(el) {
var data = foundationMQ.collectScenariosFromElement(el);
scenarios = data.scenarios;
innerTemplates = data.templates;
}
function checkScenario(scenario) {
return !current || current !== scenario;
}
}
}
})();
|
