|
14 | 14 | window.BlazorStyled.writeRule(sheet, updatedRule, logger);
|
15 | 15 | } else {
|
16 | 16 | try {
|
17 |
| - if (updatedRule.indexOf(":-moz") !== -1 && "MozBoxSizing" in document.body.style) { |
| 17 | + if (updatedRule.indexOf(':-moz') !== -1 && 'MozBoxSizing' in document.body.style) { |
18 | 18 | window.BlazorStyled.insertRule(sheet.sheet, updatedRule, logger);
|
19 |
| - } else if (updatedRule.indexOf(":-moz") === -1) { |
| 19 | + } else if (updatedRule.indexOf(':-moz') === -1) { |
20 | 20 | window.BlazorStyled.insertRule(sheet.sheet, updatedRule, logger);
|
21 | 21 | } else {
|
22 |
| - logger.warn("Mozilla rule not inserted: ", updatedRule); |
| 22 | + logger.warn('Mozilla rule not inserted: ', updatedRule); |
23 | 23 | }
|
24 | 24 | } catch (err) {
|
25 |
| - logger.error("Failed to insert: ", updatedRule); |
| 25 | + logger.error('Failed to insert: ', updatedRule); |
26 | 26 | logger.error(err);
|
27 | 27 | }
|
28 | 28 | }
|
|
38 | 38 | try {
|
39 | 39 | window.BlazorStyled.updatedInsertedRule(sheet.sheet, oldRule, updatedRule, logger);
|
40 | 40 | } catch (err) {
|
41 |
| - logger.error("Failed to update: ", rule); |
| 41 | + logger.error('Failed to update: ', rule); |
42 | 42 | logger.error(err);
|
43 | 43 | }
|
44 | 44 | }
|
|
48 | 48 | const sheet = document.getElementById(stylesheetId);
|
49 | 49 | if (sheet) {
|
50 | 50 | document.head.removeChild(sheet);
|
51 |
| - logger.log("Cleared stylesheet: ", stylesheetName); |
| 51 | + logger.log('Cleared stylesheet: ', stylesheetName); |
52 | 52 | }
|
53 | 53 | },
|
54 | 54 | setThemeValue: function (stylesheetId, stylesheetName, priority, name, value, development, debug) {
|
|
61 | 61 | const rule = theme.rules[i];
|
62 | 62 | if (rule.indexOf(name) !== -1) {
|
63 | 63 | if (oldValue) {
|
64 |
| - const selector = rule.substring(0, rule.indexOf("{")); |
| 64 | + const selector = rule.substring(0, rule.indexOf('{')); |
65 | 65 | const oldRule = window.BlazorStyled.parseTheme(
|
66 | 66 | stylesheetId,
|
67 |
| - rule.replace("[" + name + "]", oldValue), |
| 67 | + rule.replace('[' + name + ']', oldValue), |
68 | 68 | logger
|
69 | 69 | );
|
70 | 70 | if (oldRule) {
|
|
85 | 85 | }
|
86 | 86 | }
|
87 | 87 | } catch (err) {
|
88 |
| - logger.error("Failed to update: ", rule); |
| 88 | + logger.error('Failed to update: ', rule); |
89 | 89 | logger.error(err);
|
90 | 90 | }
|
91 | 91 | },
|
92 | 92 | getThemeValues: function (stylesheetId) {
|
93 | 93 | const theme = window.BlazorStyled.getOrCreateTheme(stylesheetId);
|
94 | 94 | return theme.values;
|
95 | 95 | },
|
96 |
| - setGlobalStyle: function (stylesheetId, name, value) { |
97 |
| - const theme = window.BlazorStyled.getOrCreateTheme(stylesheetId); |
98 |
| - theme.globalStyles[name] = value; |
99 |
| - }, |
100 |
| - getGlobalStyles: function (stylesheetId) { |
101 |
| - const theme = window.BlazorStyled.getOrCreateTheme(stylesheetId); |
102 |
| - return theme.globalStyles; |
103 |
| - }, |
104 | 96 | parseTheme: function (stylesheetId, rule, logger) {
|
105 |
| - if (rule.indexOf("[") === -1) { |
| 97 | + if (rule.indexOf('[') === -1) { |
106 | 98 | return rule;
|
107 | 99 | }
|
108 | 100 | const theme = window.BlazorStyled.getOrCreateTheme(stylesheetId);
|
109 | 101 | if (!theme.rules.find((r) => r === rule)) {
|
110 | 102 | theme.rules.push(rule);
|
111 | 103 | }
|
112 |
| - const themeValueName = rule.substring(rule.indexOf("[") + 1, rule.indexOf("]")); |
| 104 | + const themeValueName = rule.substring(rule.indexOf('[') + 1, rule.indexOf(']')); |
113 | 105 | const themeValue = theme.values[themeValueName];
|
114 | 106 | if (themeValue === undefined) {
|
115 | 107 | return undefined;
|
116 | 108 | }
|
117 |
| - const updated = rule.replace("[" + themeValueName + "]", themeValue); |
| 109 | + const updated = rule.replace('[' + themeValueName + ']', themeValue); |
118 | 110 | return window.BlazorStyled.parseTheme(stylesheetId, updated, logger);
|
119 | 111 | },
|
120 | 112 | getOrCreateTheme: function (stylesheetId) {
|
121 | 113 | if (window.BlazorStyled.themes[stylesheetId] === undefined) {
|
122 | 114 | window.BlazorStyled.themes[stylesheetId] = {
|
123 | 115 | values: {},
|
124 | 116 | rules: [],
|
125 |
| - globalStyles: {}, |
126 | 117 | };
|
127 | 118 | }
|
128 | 119 | return window.BlazorStyled.themes[stylesheetId];
|
129 | 120 | },
|
130 | 121 | initLogger: function (debug) {
|
131 |
| - this.debug = {}; |
132 | 122 | if (debug) {
|
133 |
| - for (var m in console) { |
134 |
| - if (typeof console[m] === "function") { |
135 |
| - this.debug[m] = console[m].bind(window.console); |
| 123 | + if (!window.BlazorStyled.debug.init) { |
| 124 | + for (var m in console) { |
| 125 | + if (typeof console[m] === 'function') { |
| 126 | + window.BlazorStyled.debug[m] = console[m].bind(window.console); |
| 127 | + } |
136 | 128 | }
|
| 129 | + window.BlazorStyled.debug.init = true; |
137 | 130 | }
|
| 131 | + return window.BlazorStyled.debug; |
138 | 132 | } else {
|
139 |
| - for (var m2 in console) { |
140 |
| - if (typeof console[m2] === "function") { |
141 |
| - this.debug[m2] = function () {}; |
| 133 | + if (!window.BlazorStyled.fakeDebug.init) { |
| 134 | + for (var m2 in console) { |
| 135 | + if (typeof console[m2] === 'function') { |
| 136 | + window.BlazorStyled.fakeDebug[m2] = function () {}; |
| 137 | + } |
142 | 138 | }
|
| 139 | + window.BlazorStyled.fakeDebug.init = true; |
143 | 140 | }
|
| 141 | + return window.BlazorStyled.fakeDebug; |
144 | 142 | }
|
145 |
| - return this.debug; |
146 | 143 | },
|
147 | 144 | getOrCreateSheet: function (stylesheetId, stylesheetName, priority, logger) {
|
148 |
| - const DATA_PRIORITY = "data-blazorstyled-priority"; |
149 |
| - const DATA_NAME = "data-blazorstyled-name"; |
| 145 | + const DATA_PRIORITY = 'data-blazorstyled-priority'; |
| 146 | + const DATA_NAME = 'data-blazorstyled-name'; |
150 | 147 | const sheet = document.getElementById(stylesheetId);
|
151 | 148 | if (sheet) return sheet;
|
152 |
| - const styleEl = document.createElement("style"); |
153 |
| - const id = document.createAttribute("id"); |
| 149 | + const styleEl = document.createElement('style'); |
| 150 | + const id = document.createAttribute('id'); |
154 | 151 | id.value = stylesheetId;
|
155 | 152 | styleEl.setAttributeNode(id);
|
156 | 153 | const dataName = document.createAttribute(DATA_NAME);
|
|
183 | 180 | } else {
|
184 | 181 | head.appendChild(styleEl);
|
185 | 182 | }
|
186 |
| - logger.log("Inserted stylesheet: ", styleEl); |
| 183 | + logger.log('Inserted stylesheet: ', styleEl); |
187 | 184 | return styleEl;
|
188 | 185 | },
|
189 | 186 | writeRule: function (sheet, rule, logger) {
|
190 | 187 | if (!sheet.innerText) {
|
191 | 188 | sheet.innerText = rule;
|
192 |
| - logger.log("Written: ", rule); |
| 189 | + logger.log('Written: ', rule); |
193 | 190 | } else {
|
194 | 191 | if (sheet.innerText.indexOf(rule) === -1) {
|
195 |
| - sheet.innerText = rule.startsWith("@import") ? rule + sheet.innerText : sheet.innerText + rule; |
196 |
| - logger.log("Written: ", rule); |
| 192 | + sheet.innerText = rule.startsWith('@import') ? rule + sheet.innerText : sheet.innerText + rule; |
| 193 | + logger.log('Written: ', rule); |
197 | 194 | }
|
198 | 195 | }
|
199 | 196 | },
|
200 | 197 | insertRule: function (sheet, rule, logger) {
|
201 |
| - const index = rule.startsWith("@import") ? 0 : sheet.cssRules.length; |
| 198 | + const index = rule.startsWith('@import') ? 0 : sheet.cssRules.length; |
202 | 199 | sheet.insertRule(rule, index);
|
203 |
| - logger.log("Inserted at " + index + ": ", rule); |
| 200 | + logger.log('Inserted at ' + index + ': ', rule); |
204 | 201 | },
|
205 | 202 | updateWrittenRule: function (sheet, oldRule, rule, logger) {
|
206 | 203 | if (!sheet.innerText) {
|
207 | 204 | sheet.innerText = rule;
|
208 | 205 | }
|
209 | 206 | sheet.innerText = sheet.innerText.replace(oldRule, rule);
|
210 |
| - logger.log("Updated old rule: " + oldRule + " to new rule: " + rule); |
| 207 | + logger.log('Updated old rule: ' + oldRule + ' to new rule: ' + rule); |
211 | 208 | },
|
212 | 209 | updatedInsertedRule: function (sheet, oldRule, rule, logger) {
|
213 |
| - const temp = window.BlazorStyled.getOrCreateSheet("temp", "temp", window.BlazorStyled.initLogger(false)); |
214 |
| - temp.sheet.insertRule(oldRule); |
215 |
| - const oldCssText = temp.sheet.cssRules[0].cssText; |
216 |
| - document.head.removeChild(temp); |
| 210 | + const oldCssText = window.BlazorStyled.getRuleText(rule); |
217 | 211 | let index = -1;
|
218 | 212 | for (var i = 0; i < sheet.cssRules.length; i++) {
|
219 | 213 | if (sheet.cssRules[i].cssText === oldCssText) {
|
|
223 | 217 | if (index !== -1) {
|
224 | 218 | sheet.deleteRule(index);
|
225 | 219 | sheet.insertRule(rule, index);
|
226 |
| - logger.log("Updated old rule at " + index + ": " + oldRule + " to new rule: " + rule); |
| 220 | + logger.log('Updated old rule at ' + index + ': ' + oldRule + ' to new rule: ' + rule); |
227 | 221 | }
|
228 | 222 | },
|
| 223 | + getRuleText: function (rule) { |
| 224 | + const head = document.head; |
| 225 | + const styleEl = document.createElement('style'); |
| 226 | + window.BlazorStyled.debug.log(styleEl); |
| 227 | + window.BlazorStyled.debug.dir(StyleEl); |
| 228 | + head.appendChild(styleEl); |
| 229 | + styleEl.sheet.insertRule(rule); |
| 230 | + const text = temp.sheet.cssRules[0].cssText; |
| 231 | + head.removeChild(styleEl); |
| 232 | + return text; |
| 233 | + }, |
229 | 234 | themes: {},
|
| 235 | + debug: {}, |
| 236 | + fakeDebug: {}, |
230 | 237 | };
|
0 commit comments