Goyslop/4chan-x
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Less caching, more functional.

Browse Source 
Change the raw value, get different returns. I think that makes
more sense. Performance differences are probably negligible anyhow.y
This commit is contained in:
Zixaphir 2014-01-02 04:09:55 -07:00
parent 366ffd6558
commit 0db9e580ba
5 changed files with 168 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

105
builds/appchan-x.user.js
View File

@ -12689,7 +12689,7 @@
}); });
ctx = el.getContext('2d'); ctx = el.getContext('2d');
ctx.font = "50px " + Conf['Font']; ctx.font = "50px " + Conf['Font'];
ctx.fillStyle = (new Style.color((Themes[Conf['theme']] || Themes['Yotsuba B'])['Text'])).hex; ctx.fillStyle = (new Style.color((Themes[Conf['theme']] || Themes['Yotsuba B'])['Text'])).hex();
ctx.textAlign = 'center'; ctx.textAlign = 'center';
ctx.textBaseline = 'middle'; ctx.textBaseline = 'middle';
ctx.fillText("Mascot 404", 124, 50); ctx.fillText("Mascot 404", 124, 50);
@ -13376,13 +13376,28 @@
function _Class(value) { function _Class(value) {
this.value = value; this.value = value;
this.raw = colorToHex(value); this.raw = colorToHex(value);
this.hex = "#" + this.raw;
this.private_rgb = calc_rgb(value);
this.isLight = isLight(this.private_rgb);
this.rgb = this.private_rgb.join(",");
this.hover = this.shiftRGB(16, true);
} }
_Class.prototype.hex = function() {
return "#" + this.raw;
};
_Class.prototype.private_rgb = function() {
return calc_rgb(this.raw);
};
_Class.prototype.isLight = function() {
return isLight(this.private_rgb());
};
_Class.prototype.rgb = function() {
return this.private_rgb().join("");
};
_Class.prototype.hover = function() {
return this.shiftRGB(16, true);
};
_Class.prototype.shiftRGB = function(shift, smart) { _Class.prototype.shiftRGB = function(shift, smart) {
var color, rgb; var color, rgb;
rgb = __slice.call(this.private_rgb); rgb = __slice.call(this.private_rgb);
@ -13479,7 +13494,7 @@
input.className = "colorfield"; input.className = "colorfield";
colorInput = $.el('input', { colorInput = $.el('input', {
className: 'color', className: 'color',
value: "#" + (new Style.color(input.value)).hex value: "#" + ((new Style.color(input.value)).hex())
}); });
JSColor.bind(colorInput); JSColor.bind(colorInput);
$.after(input, colorInput); $.after(input, colorInput);
@ -13534,7 +13549,7 @@
return alert("Syntax error on " + this.name + "."); return alert("Syntax error on " + this.name + ".");
} }
if (this.className === "colorfield") { if (this.className === "colorfield") {
this.nextSibling.value = (new Style.color(this.value)).hex; this.nextSibling.value = (new Style.color(this.value)).hex();
this.nextSibling.color.importColor(); this.nextSibling.color.importColor();
} }
editTheme[this.name] = this.value; editTheme[this.name] = this.value;
@ -13611,46 +13626,46 @@
'Background Attachment': "" + (bgRPA[3] || ''), 'Background Attachment': "" + (bgRPA[3] || ''),
'Background Position': "" + (bgRPA[1] || '') + " " + (bgRPA[2] || ''), 'Background Position': "" + (bgRPA[1] || '') + " " + (bgRPA[2] || ''),
'Background Repeat': "" + (bgRPA[0] || ''), 'Background Repeat': "" + (bgRPA[0] || ''),
'Background Color': "rgb(" + bgColor.rgb + ")", 'Background Color': "rgb(" + (bgColor.rgb()) + ")",
'Dialog Background': "rgba(" + mainColor.rgb + ",.98)", 'Dialog Background': "rgba(" + (mainColor.rgb()) + ",.98)",
'Dialog Border': "rgb(" + brderColor.rgb + ")", 'Dialog Border': "rgb(" + (brderColor.rgb()) + ")",
'Thread Wrapper Background': "rgba(0,0,0,0)", 'Thread Wrapper Background': "rgba(0,0,0,0)",
'Thread Wrapper Border': "rgba(0,0,0,0)", 'Thread Wrapper Border': "rgba(0,0,0,0)",
'Reply Background': "rgba(" + mainColor.rgb + "," + imported.replyOp + ")", 'Reply Background': "rgba(" + (mainColor.rgb()) + "," + imported.replyOp + ")",
'Reply Border': "rgb(" + brderColor.rgb + ")", 'Reply Border': "rgb(" + (brderColor.rgb()) + ")",
'Highlighted Reply Background': "rgba(" + (mainColor.shiftRGB(4, true)) + "," + imported.replyOp + ")", 'Highlighted Reply Background': "rgba(" + (mainColor.shiftRGB(4, true)) + "," + imported.replyOp + ")",
'Highlighted Reply Border': "rgb(" + linkColor.rgb + ")", 'Highlighted Reply Border': "rgb(" + (linkColor.rgb()) + ")",
'Backlinked Reply Outline': "rgb(" + linkColor.rgb + ")", 'Backlinked Reply Outline': "rgb(" + (linkColor.rgb()) + ")",
'Checkbox Background': "rgba(" + inputColor.rgb + "," + imported.replyOp + ")", 'Checkbox Background': "rgba(" + (inputColor.rgb()) + "," + imported.replyOp + ")",
'Checkbox Border': "rgb(" + inputbColor.rgb + ")", 'Checkbox Border': "rgb(" + (inputbColor.rgb()) + ")",
'Input Background': "rgba(" + inputColor.rgb + "," + imported.replyOp + ")", 'Input Background': "rgba(" + (inputColor.rgb()) + "," + imported.replyOp + ")",
'Input Border': "rgb(" + inputbColor.rgb + ")", 'Input Border': "rgb(" + (inputbColor.rgb()) + ")",
'Hovered Input Background': "rgba(" + inputColor.hover + "," + imported.replyOp + ")", 'Hovered Input Background': "rgba(" + (inputColor.hover()) + "," + imported.replyOp + ")",
'Hovered Input Border': "rgb(" + inputbColor.rgb + ")", 'Hovered Input Border': "rgb(" + (inputbColor.rgb()) + ")",
'Focused Input Background': "rgba(" + inputColor.hover + "," + imported.replyOp + ")", 'Focused Input Background': "rgba(" + (inputColor.hover()) + "," + imported.replyOp + ")",
'Focused Input Border': "rgb(" + inputbColor.rgb + ")", 'Focused Input Border': "rgb(" + (inputbColor.rgb()) + ")",
'Buttons Background': "rgba(" + inputColor.rgb + "," + imported.replyOp + ")", 'Buttons Background': "rgba(" + (inputColor.rgb()) + "," + imported.replyOp + ")",
'Buttons Border': "rgb(" + inputbColor.rgb + ")", 'Buttons Border': "rgb(" + (inputbColor.rgb()) + ")",
'Navigation Background': "rgba(" + bgColor.rgb + ",0.8)", 'Navigation Background': "rgba(" + (bgColor.rgb()) + ",0.8)",
'Navigation Border': "rgb(" + mainColor.rgb + ")", 'Navigation Border': "rgb(" + (mainColor.rgb()) + ")",
'Quotelinks': "rgb(" + linkColor.rgb + ")", 'Quotelinks': "rgb(" + (linkColor.rgb()) + ")",
'Links': "rgb(" + linkColor.rgb + ")", 'Links': "rgb(" + (linkColor.rgb()) + ")",
'Hovered Links': "rgb(" + linkHColor.rgb + ")", 'Hovered Links': "rgb(" + (linkHColor.rgb()) + ")",
'Navigation Links': "rgb(" + textColor.rgb + ")", 'Navigation Links': "rgb(" + (textColor.rgb()) + ")",
'Hovered Navigation Links': "rgb(" + linkHColor.rgb + ")", 'Hovered Navigation Links': "rgb(" + (linkHColor.rgb()) + ")",
'Subjects': "rgb(" + titleColor.rgb + ")", 'Subjects': "rgb(" + (titleColor.rgb()) + ")",
'Names': "rgb(" + nameColor.rgb + ")", 'Names': "rgb(" + (nameColor.rgb()) + ")",
'Sage': "rgb(" + sageColor.rgb + ")", 'Sage': "rgb(" + (sageColor.rgb()) + ")",
'Tripcodes': "rgb(" + tripColor.rgb + ")", 'Tripcodes': "rgb(" + (tripColor.rgb()) + ")",
'Emails': "rgb(" + linkColor.rgb + ")", 'Emails': "rgb(" + (linkColor.rgb()) + ")",
'Post Numbers': "rgb(" + linkColor.rgb + ")", 'Post Numbers': "rgb(" + (linkColor.rgb()) + ")",
'Text': "rgb(" + textColor.rgb + ")", 'Text': "rgb(" + (textColor.rgb()) + ")",
'Backlinks': "rgb(" + linkColor.rgb + ")", 'Backlinks': "rgb(" + (linkColor.rgb()) + ")",
'Greentext': "rgb(" + quoteColor.rgb + ")", 'Greentext': "rgb(" + (quoteColor.rgb()) + ")",
'Board Title': "rgb(" + textColor.rgb + ")", 'Board Title': "rgb(" + (textColor.rgb()) + ")",
'Timestamps': "rgb(" + timeColor.rgb + ")", 'Timestamps': "rgb(" + (timeColor.rgb()) + ")",
'Inputs': "rgb(" + textColor.rgb + ")", 'Inputs': "rgb(" + (textColor.rgb()) + ")",
'Warnings': "rgb(" + sageColor.rgb + ")", 'Warnings': "rgb(" + (sageColor.rgb()) + ")",
'Shadow Color': "rbga(0,0,0,0.1)", 'Shadow Color': "rbga(0,0,0,0.1)",
'Custom CSS': ".board {\npadding: 1px 2px;\n}\n.rice {\nbox-shadow:rgba(" + mainColor.shiftRGB(32) + (",.3) 0 1px;\n}\ninput[type=password]:hover,\ninput[type=text]:not([disabled]):hover,\ninput#fs_search:hover,\ninput.field:hover,\ntextarea:hover,\n#options input:not([type=checkbox]):hover {\n box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;\n}\ninput[type=password]:focus,\ninput[type=text]:focus,\ninput#fs_search:focus,\ninput.field:focus,\ntextarea:focus,\n#options input:focus {\n box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;\n}\nbutton,\ninput,\ntextarea,\n.rice {\n transition:background .2s,box-shadow .2s;\n}\n " + (imported.customCSS || '')) 'Custom CSS': ".board {\npadding: 1px 2px;\n}\n.rice {\nbox-shadow:rgba(" + mainColor.shiftRGB(32) + (",.3) 0 1px;\n}\ninput[type=password]:hover,\ninput[type=text]:not([disabled]):hover,\ninput#fs_search:hover,\ninput.field:hover,\ntextarea:hover,\n#options input:not([type=checkbox]):hover {\n box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;\n}\ninput[type=password]:focus,\ninput[type=text]:focus,\ninput#fs_search:focus,\ninput.field:focus,\ntextarea:focus,\n#options input:focus {\n box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;\n}\nbutton,\ninput,\ntextarea,\n.rice {\n transition:background .2s,box-shadow .2s;\n}\n " + (imported.customCSS || ''))
}; };

105
builds/crx/script.js
View File

@ -12694,7 +12694,7 @@
}); });
ctx = el.getContext('2d'); ctx = el.getContext('2d');
ctx.font = "50px " + Conf['Font']; ctx.font = "50px " + Conf['Font'];
ctx.fillStyle = (new Style.color((Themes[Conf['theme']] || Themes['Yotsuba B'])['Text'])).hex; ctx.fillStyle = (new Style.color((Themes[Conf['theme']] || Themes['Yotsuba B'])['Text'])).hex();
ctx.textAlign = 'center'; ctx.textAlign = 'center';
ctx.textBaseline = 'middle'; ctx.textBaseline = 'middle';
ctx.fillText("Mascot 404", 124, 50); ctx.fillText("Mascot 404", 124, 50);
@ -13387,13 +13387,28 @@
function _Class(value) { function _Class(value) {
this.value = value; this.value = value;
this.raw = colorToHex(value); this.raw = colorToHex(value);
this.hex = "#" + this.raw;
this.private_rgb = calc_rgb(value);
this.isLight = isLight(this.private_rgb);
this.rgb = this.private_rgb.join(",");
this.hover = this.shiftRGB(16, true);
} }
_Class.prototype.hex = function() {
return "#" + this.raw;
};
_Class.prototype.private_rgb = function() {
return calc_rgb(this.raw);
};
_Class.prototype.isLight = function() {
return isLight(this.private_rgb());
};
_Class.prototype.rgb = function() {
return this.private_rgb().join("");
};
_Class.prototype.hover = function() {
return this.shiftRGB(16, true);
};
_Class.prototype.shiftRGB = function(shift, smart) { _Class.prototype.shiftRGB = function(shift, smart) {
var color, rgb; var color, rgb;
rgb = __slice.call(this.private_rgb); rgb = __slice.call(this.private_rgb);
@ -13490,7 +13505,7 @@
input.className = "colorfield"; input.className = "colorfield";
colorInput = $.el('input', { colorInput = $.el('input', {
className: 'color', className: 'color',
value: "#" + (new Style.color(input.value)).hex value: "#" + ((new Style.color(input.value)).hex())
}); });
JSColor.bind(colorInput); JSColor.bind(colorInput);
$.after(input, colorInput); $.after(input, colorInput);
@ -13545,7 +13560,7 @@
return alert("Syntax error on " + this.name + "."); return alert("Syntax error on " + this.name + ".");
} }
if (this.className === "colorfield") { if (this.className === "colorfield") {
this.nextSibling.value = (new Style.color(this.value)).hex; this.nextSibling.value = (new Style.color(this.value)).hex();
this.nextSibling.color.importColor(); this.nextSibling.color.importColor();
} }
editTheme[this.name] = this.value; editTheme[this.name] = this.value;
@ -13622,46 +13637,46 @@
'Background Attachment': "" + (bgRPA[3] || ''), 'Background Attachment': "" + (bgRPA[3] || ''),
'Background Position': "" + (bgRPA[1] || '') + " " + (bgRPA[2] || ''), 'Background Position': "" + (bgRPA[1] || '') + " " + (bgRPA[2] || ''),
'Background Repeat': "" + (bgRPA[0] || ''), 'Background Repeat': "" + (bgRPA[0] || ''),
'Background Color': "rgb(" + bgColor.rgb + ")", 'Background Color': "rgb(" + (bgColor.rgb()) + ")",
'Dialog Background': "rgba(" + mainColor.rgb + ",.98)", 'Dialog Background': "rgba(" + (mainColor.rgb()) + ",.98)",
'Dialog Border': "rgb(" + brderColor.rgb + ")", 'Dialog Border': "rgb(" + (brderColor.rgb()) + ")",
'Thread Wrapper Background': "rgba(0,0,0,0)", 'Thread Wrapper Background': "rgba(0,0,0,0)",
'Thread Wrapper Border': "rgba(0,0,0,0)", 'Thread Wrapper Border': "rgba(0,0,0,0)",
'Reply Background': "rgba(" + mainColor.rgb + "," + imported.replyOp + ")", 'Reply Background': "rgba(" + (mainColor.rgb()) + "," + imported.replyOp + ")",
'Reply Border': "rgb(" + brderColor.rgb + ")", 'Reply Border': "rgb(" + (brderColor.rgb()) + ")",
'Highlighted Reply Background': "rgba(" + (mainColor.shiftRGB(4, true)) + "," + imported.replyOp + ")", 'Highlighted Reply Background': "rgba(" + (mainColor.shiftRGB(4, true)) + "," + imported.replyOp + ")",
'Highlighted Reply Border': "rgb(" + linkColor.rgb + ")", 'Highlighted Reply Border': "rgb(" + (linkColor.rgb()) + ")",
'Backlinked Reply Outline': "rgb(" + linkColor.rgb + ")", 'Backlinked Reply Outline': "rgb(" + (linkColor.rgb()) + ")",
'Checkbox Background': "rgba(" + inputColor.rgb + "," + imported.replyOp + ")", 'Checkbox Background': "rgba(" + (inputColor.rgb()) + "," + imported.replyOp + ")",
'Checkbox Border': "rgb(" + inputbColor.rgb + ")", 'Checkbox Border': "rgb(" + (inputbColor.rgb()) + ")",
'Input Background': "rgba(" + inputColor.rgb + "," + imported.replyOp + ")", 'Input Background': "rgba(" + (inputColor.rgb()) + "," + imported.replyOp + ")",
'Input Border': "rgb(" + inputbColor.rgb + ")", 'Input Border': "rgb(" + (inputbColor.rgb()) + ")",
'Hovered Input Background': "rgba(" + inputColor.hover + "," + imported.replyOp + ")", 'Hovered Input Background': "rgba(" + (inputColor.hover()) + "," + imported.replyOp + ")",
'Hovered Input Border': "rgb(" + inputbColor.rgb + ")", 'Hovered Input Border': "rgb(" + (inputbColor.rgb()) + ")",
'Focused Input Background': "rgba(" + inputColor.hover + "," + imported.replyOp + ")", 'Focused Input Background': "rgba(" + (inputColor.hover()) + "," + imported.replyOp + ")",
'Focused Input Border': "rgb(" + inputbColor.rgb + ")", 'Focused Input Border': "rgb(" + (inputbColor.rgb()) + ")",
'Buttons Background': "rgba(" + inputColor.rgb + "," + imported.replyOp + ")", 'Buttons Background': "rgba(" + (inputColor.rgb()) + "," + imported.replyOp + ")",
'Buttons Border': "rgb(" + inputbColor.rgb + ")", 'Buttons Border': "rgb(" + (inputbColor.rgb()) + ")",
'Navigation Background': "rgba(" + bgColor.rgb + ",0.8)", 'Navigation Background': "rgba(" + (bgColor.rgb()) + ",0.8)",
'Navigation Border': "rgb(" + mainColor.rgb + ")", 'Navigation Border': "rgb(" + (mainColor.rgb()) + ")",
'Quotelinks': "rgb(" + linkColor.rgb + ")", 'Quotelinks': "rgb(" + (linkColor.rgb()) + ")",
'Links': "rgb(" + linkColor.rgb + ")", 'Links': "rgb(" + (linkColor.rgb()) + ")",
'Hovered Links': "rgb(" + linkHColor.rgb + ")", 'Hovered Links': "rgb(" + (linkHColor.rgb()) + ")",
'Navigation Links': "rgb(" + textColor.rgb + ")", 'Navigation Links': "rgb(" + (textColor.rgb()) + ")",
'Hovered Navigation Links': "rgb(" + linkHColor.rgb + ")", 'Hovered Navigation Links': "rgb(" + (linkHColor.rgb()) + ")",
'Subjects': "rgb(" + titleColor.rgb + ")", 'Subjects': "rgb(" + (titleColor.rgb()) + ")",
'Names': "rgb(" + nameColor.rgb + ")", 'Names': "rgb(" + (nameColor.rgb()) + ")",
'Sage': "rgb(" + sageColor.rgb + ")", 'Sage': "rgb(" + (sageColor.rgb()) + ")",
'Tripcodes': "rgb(" + tripColor.rgb + ")", 'Tripcodes': "rgb(" + (tripColor.rgb()) + ")",
'Emails': "rgb(" + linkColor.rgb + ")", 'Emails': "rgb(" + (linkColor.rgb()) + ")",
'Post Numbers': "rgb(" + linkColor.rgb + ")", 'Post Numbers': "rgb(" + (linkColor.rgb()) + ")",
'Text': "rgb(" + textColor.rgb + ")", 'Text': "rgb(" + (textColor.rgb()) + ")",
'Backlinks': "rgb(" + linkColor.rgb + ")", 'Backlinks': "rgb(" + (linkColor.rgb()) + ")",
'Greentext': "rgb(" + quoteColor.rgb + ")", 'Greentext': "rgb(" + (quoteColor.rgb()) + ")",
'Board Title': "rgb(" + textColor.rgb + ")", 'Board Title': "rgb(" + (textColor.rgb()) + ")",
'Timestamps': "rgb(" + timeColor.rgb + ")", 'Timestamps': "rgb(" + (timeColor.rgb()) + ")",
'Inputs': "rgb(" + textColor.rgb + ")", 'Inputs': "rgb(" + (textColor.rgb()) + ")",
'Warnings': "rgb(" + sageColor.rgb + ")", 'Warnings': "rgb(" + (sageColor.rgb()) + ")",
'Shadow Color': "rbga(0,0,0,0.1)", 'Shadow Color': "rbga(0,0,0,0.1)",
'Custom CSS': ".board {\npadding: 1px 2px;\n}\n.rice {\nbox-shadow:rgba(" + mainColor.shiftRGB(32) + (",.3) 0 1px;\n}\ninput[type=password]:hover,\ninput[type=text]:not([disabled]):hover,\ninput#fs_search:hover,\ninput.field:hover,\ntextarea:hover,\n#options input:not([type=checkbox]):hover {\n box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;\n}\ninput[type=password]:focus,\ninput[type=text]:focus,\ninput#fs_search:focus,\ninput.field:focus,\ntextarea:focus,\n#options input:focus {\n box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;\n}\nbutton,\ninput,\ntextarea,\n.rice {\n transition:background .2s,box-shadow .2s;\n}\n " + (imported.customCSS || '')) 'Custom CSS': ".board {\npadding: 1px 2px;\n}\n.rice {\nbox-shadow:rgba(" + mainColor.shiftRGB(32) + (",.3) 0 1px;\n}\ninput[type=password]:hover,\ninput[type=text]:not([disabled]):hover,\ninput#fs_search:hover,\ninput.field:hover,\ntextarea:hover,\n#options input:not([type=checkbox]):hover {\n box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;\n}\ninput[type=password]:focus,\ninput[type=text]:focus,\ninput#fs_search:focus,\ninput.field:focus,\ntextarea:focus,\n#options input:focus {\n box-shadow:inset rgba(0,0,0,.2) 0 1px 2px;\n}\nbutton,\ninput,\ntextarea,\n.rice {\n transition:background .2s,box-shadow .2s;\n}\n " + (imported.customCSS || ''))
}; };

2
src/Theming/Mascots.coffee
View File

@ -50,7 +50,7 @@ MascotTools =
height: 100 height: 100
ctx = el.getContext('2d') ctx = el.getContext('2d')
ctx.font = "50px #{Conf['Font']}" ctx.font = "50px #{Conf['Font']}"
ctx.fillStyle = (new Style.color (Themes[Conf['theme']] or Themes['Yotsuba B'])['Text']).hex ctx.fillStyle = (new Style.color (Themes[Conf['theme']] or Themes['Yotsuba B'])['Text']).hex()
ctx.textAlign = 'center' ctx.textAlign = 'center'
ctx.textBaseline = 'middle' ctx.textBaseline = 'middle'
ctx.fillText "Mascot 404", 124, 50 ctx.fillText "Mascot 404", 124, 50

13
src/Theming/Style.coffee
View File

@ -149,7 +149,7 @@ Style =
"""<%= grunt.file.read('src/General/css/dynamic.css').replace(/\s+/g, ' ').trim() %>""" """<%= grunt.file.read('src/General/css/dynamic.css').replace(/\s+/g, ' ').trim() %>"""
theme: (theme) -> theme: (theme) ->
bgColor = new Style.color(backgroundC = theme["Background Color"]) bgColor = new Style.color backgroundC = theme["Background Color"]
replybg = new Style.color theme["Reply Background"] replybg = new Style.color theme["Reply Background"]
replyRGB = "rgb(#{replybg.shiftRGB parseInt(Conf['Silhouette Contrast'], 10), true})" replyRGB = "rgb(#{replybg.shiftRGB parseInt(Conf['Silhouette Contrast'], 10), true})"
@ -256,11 +256,12 @@ Style =
constructor: (@value) -> constructor: (@value) ->
@raw = colorToHex value @raw = colorToHex value
@hex = "#" + @raw
@private_rgb = calc_rgb value hex: -> "#" + @raw
@isLight = isLight @private_rgb private_rgb: -> calc_rgb @raw
@rgb = @private_rgb.join "," isLight: -> isLight @private_rgb()
@hover = @shiftRGB 16, true rgb: -> @private_rgb().join ""
hover: -> @shiftRGB 16, true
shiftRGB: (shift, smart) -> shiftRGB: (shift, smart) ->
rgb = [@private_rgb...] rgb = [@private_rgb...]

80
src/Theming/Themes.coffee
View File

@ -140,7 +140,7 @@ ThemeTools =
colorInput = $.el 'input', colorInput = $.el 'input',
className: 'color' className: 'color'
value: "##{(new Style.color input.value).hex}" value: "##{(new Style.color input.value).hex()}"
JSColor.bind colorInput JSColor.bind colorInput
@ -190,7 +190,7 @@ ThemeTools =
return alert "Syntax error on #{@name}." return alert "Syntax error on #{@name}."
if @className is "colorfield" if @className is "colorfield"
@nextSibling.value = (new Style.color @value).hex @nextSibling.value = (new Style.color @value).hex()
@nextSibling.color.importColor() @nextSibling.color.importColor()
editTheme[@name] = @value editTheme[@name] = @value
@ -246,7 +246,7 @@ ThemeTools =
else else
['no-repeat', 'bottom', 'left', 'fixed'] ['no-repeat', 'bottom', 'left', 'fixed']
color = Style.color {color} = Style
bgColor = new color imported.bgColor bgColor = new color imported.bgColor
mainColor = new color imported.mainColor mainColor = new color imported.mainColor
@ -272,46 +272,46 @@ ThemeTools =
'Background Attachment': "#{bgRPA[3] or ''}" 'Background Attachment': "#{bgRPA[3] or ''}"
'Background Position': "#{bgRPA[1] or ''} #{bgRPA[2] or ''}" 'Background Position': "#{bgRPA[1] or ''} #{bgRPA[2] or ''}"
'Background Repeat': "#{bgRPA[0] or ''}" 'Background Repeat': "#{bgRPA[0] or ''}"
'Background Color': "rgb(#{bgColor.rgb})" 'Background Color': "rgb(#{bgColor.rgb()})"
'Dialog Background': "rgba(#{mainColor.rgb},.98)" 'Dialog Background': "rgba(#{mainColor.rgb()},.98)"
'Dialog Border': "rgb(#{brderColor.rgb})" 'Dialog Border': "rgb(#{brderColor.rgb()})"
'Thread Wrapper Background': "rgba(0,0,0,0)" 'Thread Wrapper Background': "rgba(0,0,0,0)"
'Thread Wrapper Border': "rgba(0,0,0,0)" 'Thread Wrapper Border': "rgba(0,0,0,0)"
'Reply Background': "rgba(#{mainColor.rgb},#{imported.replyOp})" 'Reply Background': "rgba(#{mainColor.rgb()},#{imported.replyOp})"
'Reply Border': "rgb(#{brderColor.rgb})" 'Reply Border': "rgb(#{brderColor.rgb()})"
'Highlighted Reply Background': "rgba(#{mainColor.shiftRGB(4, true)},#{imported.replyOp})" 'Highlighted Reply Background': "rgba(#{mainColor.shiftRGB(4, true)},#{imported.replyOp})"
'Highlighted Reply Border': "rgb(#{linkColor.rgb})" 'Highlighted Reply Border': "rgb(#{linkColor.rgb()})"
'Backlinked Reply Outline': "rgb(#{linkColor.rgb})" 'Backlinked Reply Outline': "rgb(#{linkColor.rgb()})"
'Checkbox Background': "rgba(#{inputColor.rgb},#{imported.replyOp})" 'Checkbox Background': "rgba(#{inputColor.rgb()},#{imported.replyOp})"
'Checkbox Border': "rgb(#{inputbColor.rgb})" 'Checkbox Border': "rgb(#{inputbColor.rgb()})"
'Input Background': "rgba(#{inputColor.rgb},#{imported.replyOp})" 'Input Background': "rgba(#{inputColor.rgb()},#{imported.replyOp})"
'Input Border': "rgb(#{inputbColor.rgb})" 'Input Border': "rgb(#{inputbColor.rgb()})"
'Hovered Input Background': "rgba(#{inputColor.hover},#{imported.replyOp})" 'Hovered Input Background': "rgba(#{inputColor.hover()},#{imported.replyOp})"
'Hovered Input Border': "rgb(#{inputbColor.rgb})" 'Hovered Input Border': "rgb(#{inputbColor.rgb()})"
'Focused Input Background': "rgba(#{inputColor.hover},#{imported.replyOp})" 'Focused Input Background': "rgba(#{inputColor.hover()},#{imported.replyOp})"
'Focused Input Border': "rgb(#{inputbColor.rgb})" 'Focused Input Border': "rgb(#{inputbColor.rgb()})"
'Buttons Background': "rgba(#{inputColor.rgb},#{imported.replyOp})" 'Buttons Background': "rgba(#{inputColor.rgb()},#{imported.replyOp})"
'Buttons Border': "rgb(#{inputbColor.rgb})" 'Buttons Border': "rgb(#{inputbColor.rgb()})"
'Navigation Background': "rgba(#{bgColor.rgb},0.8)" 'Navigation Background': "rgba(#{bgColor.rgb()},0.8)"
'Navigation Border': "rgb(#{mainColor.rgb})" 'Navigation Border': "rgb(#{mainColor.rgb()})"
'Quotelinks': "rgb(#{linkColor.rgb})" 'Quotelinks': "rgb(#{linkColor.rgb()})"
'Links': "rgb(#{linkColor.rgb})" 'Links': "rgb(#{linkColor.rgb()})"
'Hovered Links': "rgb(#{linkHColor.rgb})" 'Hovered Links': "rgb(#{linkHColor.rgb()})"
'Navigation Links': "rgb(#{textColor.rgb})" 'Navigation Links': "rgb(#{textColor.rgb()})"
'Hovered Navigation Links': "rgb(#{linkHColor.rgb})" 'Hovered Navigation Links': "rgb(#{linkHColor.rgb()})"
'Subjects': "rgb(#{titleColor.rgb})" 'Subjects': "rgb(#{titleColor.rgb()})"
'Names': "rgb(#{nameColor.rgb})" 'Names': "rgb(#{nameColor.rgb()})"
'Sage': "rgb(#{sageColor.rgb})" 'Sage': "rgb(#{sageColor.rgb()})"
'Tripcodes': "rgb(#{tripColor.rgb})" 'Tripcodes': "rgb(#{tripColor.rgb()})"
'Emails': "rgb(#{linkColor.rgb})" 'Emails': "rgb(#{linkColor.rgb()})"
'Post Numbers': "rgb(#{linkColor.rgb})" 'Post Numbers': "rgb(#{linkColor.rgb()})"
'Text': "rgb(#{textColor.rgb})" 'Text': "rgb(#{textColor.rgb()})"
'Backlinks': "rgb(#{linkColor.rgb})" 'Backlinks': "rgb(#{linkColor.rgb()})"
'Greentext': "rgb(#{quoteColor.rgb})" 'Greentext': "rgb(#{quoteColor.rgb()})"
'Board Title': "rgb(#{textColor.rgb})" 'Board Title': "rgb(#{textColor.rgb()})"
'Timestamps': "rgb(#{timeColor.rgb})" 'Timestamps': "rgb(#{timeColor.rgb()})"
'Inputs': "rgb(#{textColor.rgb})" 'Inputs': "rgb(#{textColor.rgb()})"
'Warnings': "rgb(#{sageColor.rgb})" 'Warnings': "rgb(#{sageColor.rgb()})"
'Shadow Color': "rbga(0,0,0,0.1)" 'Shadow Color': "rbga(0,0,0,0.1)"
'Custom CSS': """<%= grunt.file.read('src/General/css/theme.import.css') %> #{imported.customCSS or ''}""" 'Custom CSS': """<%= grunt.file.read('src/General/css/theme.import.css') %> #{imported.customCSS or ''}"""