Skip to content

Commit 2e942c0

Browse files
committed
3.0.0-alpha-05
1 parent 1097367 commit 2e942c0

File tree

16 files changed

+449
-114
lines changed

16 files changed

+449
-114
lines changed

Diff for: src/BlazorStyled/BlazorStyled.csproj

+1-1
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<LangVersion>8.0</LangVersion>
77
<AddRazorSupportForMvc>true</AddRazorSupportForMvc>
88
<PackageId>BlazorStyled</PackageId>
9-
<Version>3.0.0-alpha-04</Version>
9+
<Version>3.0.0-alpha-05</Version>
1010
<Authors>Chanan Braunstein</Authors>
1111
<Title>BlazorStyled</Title>
1212
<Description>CSS in Blazor Components</Description>

Diff for: src/BlazorStyled/IStyled.cs

+14-9
Original file line numberDiff line numberDiff line change
@@ -5,22 +5,27 @@ namespace BlazorStyled
55
{
66
public interface IStyled
77
{
8-
Task ClearStyles();
8+
Task ClearStylesAsync();
9+
void ClearStyles();
910
Task<string> CssAsync(string css);
1011
Task<string> CssAsync(string className, string css);
1112
Task<string> CssAsync(List<string> classes, string css);
1213
string Css(string css);
1314
string Css(string className, string css);
1415
string Css(List<string> classes, string css);
15-
Task<string> Keyframes(string css);
16-
Task Fontface(string css);
17-
Task AddGoogleFonts(List<GoogleFont> googleFonts);
16+
Task<string> KeyframesAsync(string css);
17+
Task FontfaceAsync(string css);
18+
Task AddGoogleFontsAsync(List<GoogleFont> googleFonts);
19+
string Keyframes(string css);
20+
void Fontface(string css);
21+
void AddGoogleFonts(List<GoogleFont> googleFonts);
1822
IStyled WithId(string id);
1923
IStyled WithId(string id, int priority = 1000);
20-
Task SetThemeValue(string name, string value);
21-
Task<IDictionary<string, string>> GetThemeValues();
22-
Task SetGlobalStyle(string name, string classname);
23-
Task<IDictionary<string, string>> GetGlobalStyles();
24-
Task<string> GetGlobalStyle(string name);
24+
Task SetThemeValueAsync(string name, string value);
25+
void SetThemeValue(string name, string value);
26+
Task<IDictionary<string, string>> GetThemeValuesAsync();
27+
void SetGlobalStyle(string name, string classname);
28+
IDictionary<string, string> GetGlobalStyles();
29+
string GetGlobalStyle(string name);
2530
}
2631
}

Diff for: src/BlazorStyled/Internal/ScriptManager.cs

+277-15
Large diffs are not rendered by default.

Diff for: src/BlazorStyled/Internal/Scripts.js

+52-45
Original file line numberDiff line numberDiff line change
@@ -14,15 +14,15 @@
1414
window.BlazorStyled.writeRule(sheet, updatedRule, logger);
1515
} else {
1616
try {
17-
if (updatedRule.indexOf(":-moz") !== -1 && "MozBoxSizing" in document.body.style) {
17+
if (updatedRule.indexOf(':-moz') !== -1 && 'MozBoxSizing' in document.body.style) {
1818
window.BlazorStyled.insertRule(sheet.sheet, updatedRule, logger);
19-
} else if (updatedRule.indexOf(":-moz") === -1) {
19+
} else if (updatedRule.indexOf(':-moz') === -1) {
2020
window.BlazorStyled.insertRule(sheet.sheet, updatedRule, logger);
2121
} else {
22-
logger.warn("Mozilla rule not inserted: ", updatedRule);
22+
logger.warn('Mozilla rule not inserted: ', updatedRule);
2323
}
2424
} catch (err) {
25-
logger.error("Failed to insert: ", updatedRule);
25+
logger.error('Failed to insert: ', updatedRule);
2626
logger.error(err);
2727
}
2828
}
@@ -38,7 +38,7 @@
3838
try {
3939
window.BlazorStyled.updatedInsertedRule(sheet.sheet, oldRule, updatedRule, logger);
4040
} catch (err) {
41-
logger.error("Failed to update: ", rule);
41+
logger.error('Failed to update: ', rule);
4242
logger.error(err);
4343
}
4444
}
@@ -48,7 +48,7 @@
4848
const sheet = document.getElementById(stylesheetId);
4949
if (sheet) {
5050
document.head.removeChild(sheet);
51-
logger.log("Cleared stylesheet: ", stylesheetName);
51+
logger.log('Cleared stylesheet: ', stylesheetName);
5252
}
5353
},
5454
setThemeValue: function (stylesheetId, stylesheetName, priority, name, value, development, debug) {
@@ -61,10 +61,10 @@
6161
const rule = theme.rules[i];
6262
if (rule.indexOf(name) !== -1) {
6363
if (oldValue) {
64-
const selector = rule.substring(0, rule.indexOf("{"));
64+
const selector = rule.substring(0, rule.indexOf('{'));
6565
const oldRule = window.BlazorStyled.parseTheme(
6666
stylesheetId,
67-
rule.replace("[" + name + "]", oldValue),
67+
rule.replace('[' + name + ']', oldValue),
6868
logger
6969
);
7070
if (oldRule) {
@@ -85,72 +85,69 @@
8585
}
8686
}
8787
} catch (err) {
88-
logger.error("Failed to update: ", rule);
88+
logger.error('Failed to update: ', rule);
8989
logger.error(err);
9090
}
9191
},
9292
getThemeValues: function (stylesheetId) {
9393
const theme = window.BlazorStyled.getOrCreateTheme(stylesheetId);
9494
return theme.values;
9595
},
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-
},
10496
parseTheme: function (stylesheetId, rule, logger) {
105-
if (rule.indexOf("[") === -1) {
97+
if (rule.indexOf('[') === -1) {
10698
return rule;
10799
}
108100
const theme = window.BlazorStyled.getOrCreateTheme(stylesheetId);
109101
if (!theme.rules.find((r) => r === rule)) {
110102
theme.rules.push(rule);
111103
}
112-
const themeValueName = rule.substring(rule.indexOf("[") + 1, rule.indexOf("]"));
104+
const themeValueName = rule.substring(rule.indexOf('[') + 1, rule.indexOf(']'));
113105
const themeValue = theme.values[themeValueName];
114106
if (themeValue === undefined) {
115107
return undefined;
116108
}
117-
const updated = rule.replace("[" + themeValueName + "]", themeValue);
109+
const updated = rule.replace('[' + themeValueName + ']', themeValue);
118110
return window.BlazorStyled.parseTheme(stylesheetId, updated, logger);
119111
},
120112
getOrCreateTheme: function (stylesheetId) {
121113
if (window.BlazorStyled.themes[stylesheetId] === undefined) {
122114
window.BlazorStyled.themes[stylesheetId] = {
123115
values: {},
124116
rules: [],
125-
globalStyles: {},
126117
};
127118
}
128119
return window.BlazorStyled.themes[stylesheetId];
129120
},
130121
initLogger: function (debug) {
131-
this.debug = {};
132122
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+
}
136128
}
129+
window.BlazorStyled.debug.init = true;
137130
}
131+
return window.BlazorStyled.debug;
138132
} 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+
}
142138
}
139+
window.BlazorStyled.fakeDebug.init = true;
143140
}
141+
return window.BlazorStyled.fakeDebug;
144142
}
145-
return this.debug;
146143
},
147144
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';
150147
const sheet = document.getElementById(stylesheetId);
151148
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');
154151
id.value = stylesheetId;
155152
styleEl.setAttributeNode(id);
156153
const dataName = document.createAttribute(DATA_NAME);
@@ -183,37 +180,34 @@
183180
} else {
184181
head.appendChild(styleEl);
185182
}
186-
logger.log("Inserted stylesheet: ", styleEl);
183+
logger.log('Inserted stylesheet: ', styleEl);
187184
return styleEl;
188185
},
189186
writeRule: function (sheet, rule, logger) {
190187
if (!sheet.innerText) {
191188
sheet.innerText = rule;
192-
logger.log("Written: ", rule);
189+
logger.log('Written: ', rule);
193190
} else {
194191
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);
197194
}
198195
}
199196
},
200197
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;
202199
sheet.insertRule(rule, index);
203-
logger.log("Inserted at " + index + ": ", rule);
200+
logger.log('Inserted at ' + index + ': ', rule);
204201
},
205202
updateWrittenRule: function (sheet, oldRule, rule, logger) {
206203
if (!sheet.innerText) {
207204
sheet.innerText = rule;
208205
}
209206
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);
211208
},
212209
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);
217211
let index = -1;
218212
for (var i = 0; i < sheet.cssRules.length; i++) {
219213
if (sheet.cssRules[i].cssText === oldCssText) {
@@ -223,8 +217,21 @@
223217
if (index !== -1) {
224218
sheet.deleteRule(index);
225219
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);
227221
}
228222
},
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+
},
229234
themes: {},
235+
debug: {},
236+
fakeDebug: {},
230237
};

Diff for: src/BlazorStyled/Internal/StyledImpl.cs

+65-12
Original file line numberDiff line numberDiff line change
@@ -111,7 +111,7 @@ public string Css(List<string> classes, string css)
111111
return sb.ToString().Trim();
112112
}
113113

114-
public async Task<string> Keyframes(string css)
114+
public async Task<string> KeyframesAsync(string css)
115115
{
116116
try
117117
{
@@ -130,7 +130,26 @@ public async Task<string> Keyframes(string css)
130130
}
131131
}
132132

133-
public async Task Fontface(string css)
133+
public string Keyframes(string css)
134+
{
135+
try
136+
{
137+
css = "@keyframes &{" + css.RemoveComments().RemoveDuplicateSpaces() + "}";
138+
IList<ParsedClass> parsedClasses = css.GetClasses();
139+
Task.Run(() => _scriptManager.UpdatedParsedClasses(_id.GetStableHashCodeString(), _id, _priority, parsedClasses));
140+
return parsedClasses.First().Hash;
141+
}
142+
catch (StyledException e)
143+
{
144+
throw e;
145+
}
146+
catch (Exception e)
147+
{
148+
throw StyledException.GetException(css, e);
149+
}
150+
}
151+
152+
public async Task FontfaceAsync(string css)
134153
{
135154
try
136155
{
@@ -146,19 +165,48 @@ public async Task Fontface(string css)
146165
}
147166
}
148167

149-
public async Task ClearStyles()
168+
public void Fontface(string css)
169+
{
170+
try
171+
{
172+
Css(css);
173+
}
174+
catch (StyledException e)
175+
{
176+
throw e;
177+
}
178+
catch (Exception e)
179+
{
180+
throw StyledException.GetException(css, e);
181+
}
182+
}
183+
184+
public async Task ClearStylesAsync()
150185
{
151186
await _scriptManager.ClearStyles(_id.GetStableHashCodeString(), _id);
152187
}
153188

154-
public async Task AddGoogleFonts(List<GoogleFont> googleFonts)
189+
public void ClearStyles()
190+
{
191+
Task.Run(() => _scriptManager.ClearStyles(_id.GetStableHashCodeString(), _id));
192+
}
193+
194+
public async Task AddGoogleFontsAsync(List<GoogleFont> googleFonts)
155195
{
156196
string fontString = string.Join("|", googleFonts.Select(googleFont => googleFont.Name.Replace(' ', '+') + ':' + string.Join(",", googleFont.Styles)));
157197
string uri = $"//fonts.googleapis.com/css?family={fontString}&display=swap";
158198
IList<ParsedClass> parsedClasses = new List<ParsedClass> { new ParsedClass(uri) };
159199
await _scriptManager.UpdatedParsedClasses(_id.GetStableHashCodeString(), _id, _priority, parsedClasses);
160200
}
161201

202+
public void AddGoogleFonts(List<GoogleFont> googleFonts)
203+
{
204+
string fontString = string.Join("|", googleFonts.Select(googleFont => googleFont.Name.Replace(' ', '+') + ':' + string.Join(",", googleFont.Styles)));
205+
string uri = $"//fonts.googleapis.com/css?family={fontString}&display=swap";
206+
IList<ParsedClass> parsedClasses = new List<ParsedClass> { new ParsedClass(uri) };
207+
Task.Run(() => _scriptManager.UpdatedParsedClasses(_id.GetStableHashCodeString(), _id, _priority, parsedClasses));
208+
}
209+
162210
public IStyled WithId(string id)
163211
{
164212
return WithId(id, 1000);
@@ -174,29 +222,34 @@ public IStyled WithId(string id, int priority)
174222
return new StyledImpl(_scriptManager, id.Replace(" ", "-"), priority);
175223
}
176224

177-
public async Task SetThemeValue(string name, string value)
225+
public async Task SetThemeValueAsync(string name, string value)
178226
{
179227
await _scriptManager.SetThemeValue(_id.GetStableHashCodeString(), _id, _priority, name, value);
180228
}
181229

182-
public async Task<IDictionary<string, string>> GetThemeValues()
230+
public void SetThemeValue(string name, string value)
231+
{
232+
Task.Run(() => _scriptManager.SetThemeValue(_id.GetStableHashCodeString(), _id, _priority, name, value));
233+
}
234+
235+
public async Task<IDictionary<string, string>> GetThemeValuesAsync()
183236
{
184237
return await _scriptManager.GetThemeValues(_id.GetStableHashCodeString());
185238
}
186239

187-
public async Task SetGlobalStyle(string name, string classname)
240+
public string GetGlobalStyle(string name)
188241
{
189-
await _scriptManager.SetGlobalStyle(_id.GetStableHashCodeString(), name, classname);
242+
return _scriptManager.GetGlobalStyle(_id.GetStableHashCodeString(), name);
190243
}
191244

192-
public async Task<IDictionary<string, string>> GetGlobalStyles()
245+
public void SetGlobalStyle(string name, string classname)
193246
{
194-
return await _scriptManager.GetGlobalStyles(_id.GetStableHashCodeString());
247+
_scriptManager.SetGlobalStyle(_id.GetStableHashCodeString(), name, classname);
195248
}
196249

197-
public async Task<string> GetGlobalStyle(string name)
250+
public IDictionary<string, string> GetGlobalStyles()
198251
{
199-
return await _scriptManager.GetGlobalStyle(_id.GetStableHashCodeString(), name);
252+
return _scriptManager.GetGlobalStyles(_id.GetStableHashCodeString());
200253
}
201254
}
202255
}

0 commit comments

Comments
 (0)