1 | 'use strict';
|
---|
2 |
|
---|
3 | var removeRule = require('./vcssom/removeRule').removeRule;
|
---|
4 |
|
---|
5 | exports.addon = function (renderer) {
|
---|
6 | // VCSSOM support only browser environment.
|
---|
7 | if (!renderer.client) return;
|
---|
8 |
|
---|
9 | if (process.env.NODE_ENV !== 'production') {
|
---|
10 | require('./__dev__/warnOnMissingDependencies')('cssom', renderer, ['createRule']); // cssom
|
---|
11 | }
|
---|
12 |
|
---|
13 | var kebab = renderer.kebab;
|
---|
14 |
|
---|
15 | function VRule (selector, prelude) {
|
---|
16 | this.rule = renderer.createRule(selector, prelude);
|
---|
17 | this.decl = {};
|
---|
18 | }
|
---|
19 | VRule.prototype.diff = function (newDecl) {
|
---|
20 | var oldDecl = this.decl;
|
---|
21 | var style = this.rule.style;
|
---|
22 | var property;
|
---|
23 | for (property in oldDecl)
|
---|
24 | if (newDecl[property] === undefined)
|
---|
25 | style.removeProperty(property);
|
---|
26 | for (property in newDecl)
|
---|
27 | if (newDecl[property] !== oldDecl[property])
|
---|
28 | style.setProperty(kebab(property), newDecl[property]);
|
---|
29 | this.decl = newDecl;
|
---|
30 | };
|
---|
31 | VRule.prototype.del = function () {
|
---|
32 | removeRule(this.rule);
|
---|
33 | };
|
---|
34 |
|
---|
35 | function VSheet () {
|
---|
36 | /**
|
---|
37 | * {
|
---|
38 | * '<at-rule-prelude>': {
|
---|
39 | * '<selector>': {
|
---|
40 | * color: 'red
|
---|
41 | * }
|
---|
42 | * }
|
---|
43 | * }
|
---|
44 | */
|
---|
45 | this.tree = {};
|
---|
46 | }
|
---|
47 | VSheet.prototype.diff = function (newTree) {
|
---|
48 | var oldTree = this.tree;
|
---|
49 |
|
---|
50 | // Remove media queries not present in new tree.
|
---|
51 | for (var prelude in oldTree) {
|
---|
52 | if (newTree[prelude] === undefined) {
|
---|
53 | var rules = oldTree[prelude];
|
---|
54 | for (var selector in rules)
|
---|
55 | rules[selector].del();
|
---|
56 | }
|
---|
57 | }
|
---|
58 |
|
---|
59 | for (var prelude in newTree) {
|
---|
60 | if (oldTree[prelude] === undefined) {
|
---|
61 | // Whole media query is new.
|
---|
62 | for (var selector in newTree[prelude]) {
|
---|
63 | var rule = new VRule(selector, prelude);
|
---|
64 | rule.diff(newTree[prelude][selector]);
|
---|
65 | newTree[prelude][selector] = rule;
|
---|
66 | }
|
---|
67 | } else {
|
---|
68 | // Old tree already has rules with this media query.
|
---|
69 | var oldRules = oldTree[prelude];
|
---|
70 | var newRules = newTree[prelude];
|
---|
71 |
|
---|
72 | // Remove rules not present in new tree.
|
---|
73 | for (var selector in oldRules)
|
---|
74 | if (!newRules[selector])
|
---|
75 | oldRules[selector].del();
|
---|
76 |
|
---|
77 | // Apply new rules.
|
---|
78 | for (var selector in newRules) {
|
---|
79 | var rule = oldRules[selector];
|
---|
80 | if (rule) {
|
---|
81 | rule.diff(newRules[selector]);
|
---|
82 | newRules[selector] = rule;
|
---|
83 | } else {
|
---|
84 | rule = new VRule(selector, prelude);
|
---|
85 | rule.diff(newRules[selector]);
|
---|
86 | newRules[selector] = rule;
|
---|
87 | }
|
---|
88 | }
|
---|
89 | }
|
---|
90 | }
|
---|
91 |
|
---|
92 | this.tree = newTree;
|
---|
93 | };
|
---|
94 |
|
---|
95 | renderer.VRule = VRule;
|
---|
96 | renderer.VSheet = VSheet;
|
---|
97 | };
|
---|