diff --git a/builds/appchan-x.user.js b/builds/appchan-x.user.js index 7a8082e27..16f09a18c 100644 --- a/builds/appchan-x.user.js +++ b/builds/appchan-x.user.js @@ -110,7 +110,7 @@ 'use strict'; (function() { - var $, $$, Anonymize, ArchiveLink, AutoGIF, Banner, Board, Build, CatalogLinks, Clone, Conf, Config, CustomCSS, DataBoard, DeleteLink, Dice, DownloadLink, Emoji, ExpandComment, ExpandThread, FappeTyme, Favicon, FileInfo, Filter, Fourchan, Gallery, Get, GlobalMessage, Header, IDColor, ImageExpand, ImageHover, ImageLoader, Index, InfiniScroll, JSColor, Keybinds, Linkify, Main, MascotTools, Mascots, Menu, Nav, Notice, PSAHiding, Polyfill, Post, PostHiding, QR, QuoteBacklink, QuoteCT, QuoteInline, QuoteOP, QuotePreview, QuoteStrikeThrough, QuoteThreading, QuoteYou, Quotify, Recursive, Redirect, RelativeDates, RemoveSpoilers, Report, ReportLink, RevealSpoilers, Rice, Sauce, Settings, Style, ThemeTools, Themes, Thread, ThreadExcerpt, ThreadHiding, ThreadStats, ThreadUpdater, ThreadWatcher, Time, UI, Unread, c, d, doc, editMascot, editTheme, g, userNavigation, + var $, $$, Anonymize, ArchiveLink, AutoGIF, Banner, Board, Build, CatalogLinks, Clone, Color, Conf, Config, CustomCSS, DataBoard, DeleteLink, Dice, DownloadLink, Emoji, ExpandComment, ExpandThread, FappeTyme, Favicon, FileInfo, Filter, Fourchan, Gallery, Get, GlobalMessage, Header, IDColor, ImageExpand, ImageHover, ImageLoader, Index, InfiniScroll, JSColor, Keybinds, Linkify, Main, MascotTools, Mascots, Menu, Nav, Notice, PSAHiding, Polyfill, Post, PostHiding, QR, QuoteBacklink, QuoteCT, QuoteInline, QuoteOP, QuotePreview, QuoteStrikeThrough, QuoteThreading, QuoteYou, Quotify, Recursive, Redirect, RelativeDates, RemoveSpoilers, Report, ReportLink, RevealSpoilers, Rice, Sauce, Settings, Style, ThemeTools, Themes, Thread, ThreadExcerpt, ThreadHiding, ThreadStats, ThreadUpdater, ThreadWatcher, Time, UI, Unread, c, d, doc, editMascot, editTheme, g, userNavigation, __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; }, __slice = [].slice, __hasProp = {}.hasOwnProperty, @@ -12689,7 +12689,7 @@ }); ctx = el.getContext('2d'); ctx.font = "50px " + Conf['Font']; - ctx.fillStyle = (new Style.color((Themes[Conf['theme']] || Themes['Yotsuba B'])['Text'])).hex(); + ctx.fillStyle = (new Color((Themes[Conf['theme']] || Themes['Yotsuba B'])['Text'])).hex(); ctx.textAlign = 'center'; ctx.textBaseline = 'middle'; ctx.fillText("Mascot 404", 124, 50); @@ -13227,7 +13227,7 @@ rgb = ['r', 'g', 'b']; for (_i = 0, _len = arguments.length; _i < _len; _i++) { arg = arguments[_i]; - hex = (new Style.color(arg)).raw; + hex = (new Color(arg)).raw; color = {}; i = 0; while (val = rgb[i]) { @@ -13265,8 +13265,8 @@ }, theme: function(theme) { var background, backgroundC, bgColor, i, replyRGB, replybg, svg, svgs, _i, _len; - bgColor = new Style.color(backgroundC = theme["Background Color"]); - replybg = new Style.color(theme["Reply Background"]); + bgColor = new Color(backgroundC = theme["Background Color"]); + replybg = new Color(theme["Reply Background"]); replyRGB = "rgb(" + (replybg.shiftRGB(parseInt(Conf['Silhouette Contrast'], 10), true)) + ")"; Style.lightTheme = bgColor.isLight(); svgs = [['captcha-filter', "values='" + (Style.filter(Style.matrix(theme["Text"], theme["Input Background"]))) + " 0 0 0 1 0'"], ['mascot-filter', "values='" + (Style.silhouette(Style.matrix(replyRGB))) + " 0 0 0 1 0'"], ['grayscale', 'id="color" type="saturate" values="0"'], ['icons-filter', "values='-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0'"]]; @@ -13274,7 +13274,7 @@ svg = svgs[i]; Style.svgs[svg[0].replace(/\-/, "")] = Style.generateFilter(svg[0], svg[1]); } - return (".hide_thread_button span > span, .hide_reply_button span > span { background-color: " + theme["Links"] + "; } #mascot_hide label { border-bottom: 1px solid " + theme["Reply Border"] + "; } #content .thumb { box-shadow: 0 0 5px " + theme["Reply Border"] + "; } .export-button, .mascotname, #mascot-options { background: " + theme["Dialog Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .highlight-you .opContainer.quotesYou, .highlight-own .opContainer.yourPost, .opContainer.filter-highlight { box-shadow: inset 5px 0 " + theme["Backlinked Reply Outline"] + "; } .highlight-you .quotesYou > .reply, .highlight-own .yourPost > .reply, .filter-highlight > .reply { box-shadow: -5px 0 " + theme["Backlinked Reply Outline"] + "; } hr { border-bottom: 1px solid " + theme["Reply Border"] + "; } hr#unread-line { border-bottom: 1px solid " + theme["Reply Background"] + "; visibility: visible; } .threadContainer { border-color: " + theme["Reply Border"] + " !important; } html { background: " + (backgroundC || '') + "; background-image: " + (theme["Background Image"] || '') + "; background-repeat: " + (theme["Background Repeat"] || '') + "; background-attachment: " + (theme["Background Attachment"] || '') + "; background-position: " + (theme["Background Position"] || '') + "; } .panel, .section-container, #exlinks-options-content, #themecontent { background: " + backgroundC + "; border: 1px solid " + theme["Reply Border"] + "; } .sections-list > a.tab-selected { background: " + backgroundC + "; border-color: " + theme["Reply Border"] + "; } .captcha-img img { filter: url('data:image/svg+xml," + (Style.svgs.captchafilter.replace(/(\'|\")/g, '%22')) + "#captcha-filter'); } .silhouettize-mascots #mascot img, .silhouette img { filter: url('data:image/svg+xml," + (Style.svgs.mascotfilter.replace(/(\'|\")/g, '%22')) + "#mascot-filter'); } .grayscale-mascots #mascot { filter: url('data:image/svg+xml," + (Style.svgs.grayscale.replace(/(\'|\")/g, '%22')) + "#grayscale'); } #boardTitle { text-shadow: 1px 1px " + backgroundC + ", -1px -1px " + backgroundC + ", 1px -1px " + backgroundC + ", -1px 1px " + backgroundC + "; } .sidebar-glow #boardTitle { text-shadow: 1px 1px 1px " + backgroundC + ", -1px -1px 1px " + backgroundC + ", 1px -1px 1px " + backgroundC + ", -1px 1px 1px " + backgroundC + ", 0 2px 4px rgba(0,0,0,.6), 0 0 10px rgba(0,0,0,.6); } #exlinks-options, #appchanx-settings, #qrtab, input[type=\"submit\"], input[value=\"Report\"], span[style=\"left: 5px; position: absolute;\"] a { background: " + theme["Buttons Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .enabled .mascotcontainer { background: " + theme["Buttons Background"] + "; border-color: " + theme["Buttons Border"] + "; } #dump, #qr-filename-container, #appchanx-settings input, .captcha-img, .dump #dump, .qr-preview, .selectrice, button, input, textarea { background: " + theme["Input Background"] + "; border: 1px solid " + theme["Input Border"] + "; } .has-file #qr-extras-container { background: " + theme["Input Background"] + "; } #dump:hover, #qr-filename-container:hover, .selectrice:hover, #selectrice li:hover, #selectrice li:nth-of-type(2n+1):hover, input:hover, textarea:hover { background: " + theme["Hovered Input Background"] + "; border-color: " + theme["Hovered Input Border"] + "; } .has-file #qr-filename-container:hover #qr-extras-container { background: " + theme["Hovered Input Background"] + "; } #dump:active, #dump:focus, #selectrice li:focus, .selectrice:focus, #qr-filename-container:active, #qr-filename-container:focus, input:focus, textarea:focus, textarea.field:focus { background: " + theme["Focused Input Background"] + "; border-color: " + theme["Focused Input Border"] + "; color: " + theme["Inputs"] + "; } .has-file #qr-filename-container:active #qr-extras-container, .has-file #qr-filename-container:focus #qr-extras-container { background: " + theme["Focused Input Background"] + "; } #ft, #mouseover, #post-preview, #qp .post, #threads > .thread, #xupdater, .box-outer, .reply.post { border-width: 1px; border-style: solid; border-color: " + theme["Reply Border"] + "; background: " + theme["Reply Background"] + "; } .exblock.reply, .reply.post.highlight, .reply.post:target { background: " + theme["Highlighted Reply Background"] + "; border: 1px solid " + theme["Highlighted Reply Border"] + "; } #header-bar, .pagelist { background: " + theme["Navigation Background"] + "; border-color: " + theme["Navigation Border"] + "; } #doc, #threads, .board > .thread { background: " + theme["Thread Wrapper Background"] + "; border: 1px solid " + theme["Thread Wrapper Border"] + "; } #boardNavDesktopFoot, #mascot_hide, #menu, #selectrice, #themeConf, #thread-watcher, #thread-watcher:hover, .announcements-slideout #globalMessage, .dialog, .post-form-style-float #qr, .post-form-decorations #qr, .submenu { background: " + theme["Dialog Background"] + "; border: 1px solid " + theme["Dialog Border"] + "; } #qp.dialog { border: none; } .watch-thread-link { background-image: url(\"data:image/svg+xml,\"); } .deleteform::before, .deleteform, #qr .warning { background: " + theme["Input Background"] + "; border-color: " + theme["Input Border"] + "; } .disabledwarning, .warning { color: " + theme["Warnings"] + "; } #charCount { color: " + (Style.lightTheme ? "rgba(0,0,0,0.7)" : "rgba(255,255,255,0.7)") + "; } .postNum a { color: " + theme["Post Numbers"] + "; } .subject { color: " + theme["Subjects"] + " !important; } .dateTime, .post-ago { color: " + theme["Timestamps"] + " !important; } #fs_status a, #header-bar .shortcut > span, #updater #update-status:not(.new)::after, #showQR, .abbr, .boxbar, .boxcontent, .deleteform::before, .pages strong, .pln, .reply, .reply.highlight, .summary, body, button, span[style=\"left: 5px; position: absolute;\"] a, input, textarea { color: " + theme["Text"] + "; } #exlinks-options-content > table, #appchanx-settings fieldset, #selectrice { border-bottom: 1px solid " + theme["Reply Border"] + "; box-shadow: inset " + theme["Shadow Color"] + " 0 0 5px; } .quote + .spoiler:hover, .quote { color: " + theme["Greentext"] + "; } .forwardlink { border-bottom: 1px dashed " + theme["Backlinks"] + "; } .container::before { color: " + theme["Timestamps"] + "; } .quote-shadows #menu, .quote-shadows #post-preview, .quote-shadows #qp .opContainer, .quote-shadows #qp .replyContainer, .quote-shadows .submenu { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } .rice { background: " + theme["Checkbox Background"] + "; border: 1px solid " + theme["Checkbox Border"] + "; } .selectrice::before { border-left: 1px solid " + theme["Input Border"] + "; } .selectrice::after { border-top: .45em solid " + theme["Inputs"] + "; } .bd { background: " + theme["Buttons Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .pages a, #header-bar a { color: " + theme["Navigation Links"] + "; } input[type=checkbox]:checked + .rice::after { border-color: " + theme["Inputs"] + "; } #addReply, #dump, .button, .entry, .replylink, a { color: " + theme["Links"] + "; } .backlink { color: " + theme["Backlinks"] + "; } .qiQuote, .quotelink { color: " + theme["Quotelinks"] + "; } #addReply:hover, #dump:hover, .entry:hover, .replylink:hover, .qiQuote:hover, .quotelink:hover, a .name:hover, a .postertrip:hover, a:hover { color: " + theme["Hovered Links"] + "; } #header-bar a:hover, #boardTitle a:hover { color: " + theme["Hovered Navigation Links"] + "; } #boardTitle { color: " + theme["Board Title"] + "; } .name, .post-author { color: " + theme["Names"] + " !important; } .post-tripcode, .postertrip, .trip { color: " + theme["Tripcodes"] + " !important; } a .postertrip, a .name { color: " + theme["Emails"] + "; } .post.reply.qphl, .post.op.qphl { border-color: " + theme["Backlinked Reply Outline"] + "; background: " + theme["Highlighted Reply Background"] + "; } .quote-shadows .inline .post { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } .placeholder, #qr input::placeholder, #qr textarea::placeholder { color: " + (Style.lightTheme ? "rgba(0,0,0,0.3)" : "rgba(255,255,255,0.2)") + " !important; } #qr input:placeholder, #qr textarea:placeholder, .placeholder { color: " + (Style.lightTheme ? "rgba(0,0,0,0.3)" : "rgba(255,255,255,0.2)") + " !important; } #appchanx-settings fieldset, .boxcontent dd, .selectrice ul { border-color: " + (Style.lightTheme ? "rgba(0,0,0,0.1)" : "rgba(255,255,255,0.1)") + "; } #appchanx-settings li, #selectrice li:not(:first-of-type) { border-top: 1px solid " + (Style.lightTheme ? "rgba(0,0,0,0.05)" : "rgba(255,255,255,0.025)") + "; } .a-icon, #shortcuts .fa { " + (!Style.lightTheme ? "filter: url('data:image/svg+xml," + (Style.svgs.iconsfilter.replace(/(\'|\")/g, '%22')) + "#icons-filter');" : "") + " } .alternate-post-colors #threads > .thread:nth-of-type(2n+1), .alternate-post-colors .replyContainer:nth-of-type(2n+1) .post { background-image: linear-gradient(" + (replybg ? "rgba(" + (replybg.shiftRGB(-4, false)) + ",0.8), rgba(" + (replybg.shiftRGB(-4, false)) + ",0.8)" : Style.lightTheme ? "rgba(0,0,0,0.05), rgba(0,0,0,0.05)" : "rgba(255,255,255,0.02), rgba(255,255,255,0.02)") + "); } .color-reply-headings .boxbar, .color-reply-headings .postInfo { background: " + (replybg ? "rgba(" + (replybg.shiftRGB(-12, false)) + ",0.8)" : "rgba(0,0,0,0.1)") + "; border-bottom: 1px solid " + theme["Reply Border"] + " } .color-file-info .file { background: " + (replybg ? "rgba(" + (replybg.shiftRGB(-8, false)) + ",0.8)" : "rgba(0,0,0,0.1)") + "; border-bottom: 1px solid " + theme["Reply Border"] + " border-top: 1px solid " + theme["Reply Border"] + " } .color-reply.headings.color-file-info { border-top: none; } .op-background .op.post { background: " + theme["Reply Background"] + "; border: 1px solid " + theme["Reply Border"] + "; } .op-background .op.post:target .op-background .op.post.highlight { background: " + theme["Highlighted Reply Background"] + "; border: 1px solid " + theme["Highlighted Reply Border"] + "; } .fourchan-banner-at-sidebar-top.icon-orientation-vertical body::after { background: " + backgroundC + "; } .fourchan-banner-at-sidebar-top.icon-orientation-vertical.fourchan-ss-sidebar body::after, .fourchan-banner-at-sidebar-top.fourchan-ss-sidebar body::before { background: rgba(" + ((background = new Style.color(theme["Reply Background"])) ? background.shiftRGB(-18) : void 0) + ", 0.8); } .fourchan-ss-sidebar.sidebar-location-right body::before { border-left: 2px solid " + backgroundC + "; box-shadow: inset 1px 0 0 " + theme["Reply Border"] + ", -1px 0 0 " + theme["Reply Border"] + "; } .fourchan-ss-sidebar.sidebar-location-left body::before { border-right: 2px solid " + backgroundC + "; box-shadow: 1px 0 0 " + theme["Reply Border"] + ", inset -1px 0 0 " + theme["Reply Border"] + "; } .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"sage\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"Sage\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"SAGE\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"sage\"]:last-of-type::after, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"Sage\"]:last-of-type::after, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"SAGE\"]:last-of-type::after { content: \" (sage) \"; color: " + theme["Sage"] + "; } .quote-shadows #qr { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } " + (theme["Custom CSS"].replace(/\s+/g, ' ').trim())) + ("" + (Style.lightTheme ? " .prettyprint { background-color: #e7e7e7; border: 1px solid #dcdcdc; } .com { color: #dd0000; } .str, .atv { color: #7fa61b; } .pun { color: #61663a; } .tag { color: #117743; } .kwd { color: #5a6F9e; } .typ, .atn { color: #9474bd; } .lit { color: #368c72; } " : " .prettyprint { background-color: rgba(0,0,0,.1); border: 1px solid rgba(0,0,0,0.5); } .tag { color: #96562c; } .pun { color: #5b6f2a; } .com { color: #a34443; } .str, .atv { color: #8ba446; } .kwd { color: #987d3e; } .typ, .atn { color: #897399; } .lit { color: #558773; } ")); + return (".hide_thread_button span > span, .hide_reply_button span > span { background-color: " + theme["Links"] + "; } #mascot_hide label { border-bottom: 1px solid " + theme["Reply Border"] + "; } #content .thumb { box-shadow: 0 0 5px " + theme["Reply Border"] + "; } .export-button, .mascotname, #mascot-options { background: " + theme["Dialog Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .highlight-you .opContainer.quotesYou, .highlight-own .opContainer.yourPost, .opContainer.filter-highlight { box-shadow: inset 5px 0 " + theme["Backlinked Reply Outline"] + "; } .highlight-you .quotesYou > .reply, .highlight-own .yourPost > .reply, .filter-highlight > .reply { box-shadow: -5px 0 " + theme["Backlinked Reply Outline"] + "; } hr { border-bottom: 1px solid " + theme["Reply Border"] + "; } hr#unread-line { border-bottom: 1px solid " + theme["Reply Background"] + "; visibility: visible; } .threadContainer { border-color: " + theme["Reply Border"] + " !important; } html { background: " + (backgroundC || '') + "; background-image: " + (theme["Background Image"] || '') + "; background-repeat: " + (theme["Background Repeat"] || '') + "; background-attachment: " + (theme["Background Attachment"] || '') + "; background-position: " + (theme["Background Position"] || '') + "; } .panel, .section-container, #exlinks-options-content, #themecontent { background: " + backgroundC + "; border: 1px solid " + theme["Reply Border"] + "; } .sections-list > a.tab-selected { background: " + backgroundC + "; border-color: " + theme["Reply Border"] + "; } .captcha-img img { filter: url('data:image/svg+xml," + (Style.svgs.captchafilter.replace(/(\'|\")/g, '%22')) + "#captcha-filter'); } .silhouettize-mascots #mascot img, .silhouette img { filter: url('data:image/svg+xml," + (Style.svgs.mascotfilter.replace(/(\'|\")/g, '%22')) + "#mascot-filter'); } .grayscale-mascots #mascot { filter: url('data:image/svg+xml," + (Style.svgs.grayscale.replace(/(\'|\")/g, '%22')) + "#grayscale'); } #boardTitle { text-shadow: 1px 1px " + backgroundC + ", -1px -1px " + backgroundC + ", 1px -1px " + backgroundC + ", -1px 1px " + backgroundC + "; } .sidebar-glow #boardTitle { text-shadow: 1px 1px 1px " + backgroundC + ", -1px -1px 1px " + backgroundC + ", 1px -1px 1px " + backgroundC + ", -1px 1px 1px " + backgroundC + ", 0 2px 4px rgba(0,0,0,.6), 0 0 10px rgba(0,0,0,.6); } #exlinks-options, #appchanx-settings, #qrtab, input[type=\"submit\"], input[value=\"Report\"], span[style=\"left: 5px; position: absolute;\"] a { background: " + theme["Buttons Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .enabled .mascotcontainer { background: " + theme["Buttons Background"] + "; border-color: " + theme["Buttons Border"] + "; } #dump, #qr-filename-container, #appchanx-settings input, .captcha-img, .dump #dump, .qr-preview, .selectrice, button, input, textarea { background: " + theme["Input Background"] + "; border: 1px solid " + theme["Input Border"] + "; } .has-file #qr-extras-container { background: " + theme["Input Background"] + "; } #dump:hover, #qr-filename-container:hover, .selectrice:hover, #selectrice li:hover, #selectrice li:nth-of-type(2n+1):hover, input:hover, textarea:hover { background: " + theme["Hovered Input Background"] + "; border-color: " + theme["Hovered Input Border"] + "; } .has-file #qr-filename-container:hover #qr-extras-container { background: " + theme["Hovered Input Background"] + "; } #dump:active, #dump:focus, #selectrice li:focus, .selectrice:focus, #qr-filename-container:active, #qr-filename-container:focus, input:focus, textarea:focus, textarea.field:focus { background: " + theme["Focused Input Background"] + "; border-color: " + theme["Focused Input Border"] + "; color: " + theme["Inputs"] + "; } .has-file #qr-filename-container:active #qr-extras-container, .has-file #qr-filename-container:focus #qr-extras-container { background: " + theme["Focused Input Background"] + "; } #ft, #mouseover, #post-preview, #qp .post, #threads > .thread, #xupdater, .box-outer, .reply.post { border-width: 1px; border-style: solid; border-color: " + theme["Reply Border"] + "; background: " + theme["Reply Background"] + "; } .exblock.reply, .reply.post.highlight, .reply.post:target { background: " + theme["Highlighted Reply Background"] + "; border: 1px solid " + theme["Highlighted Reply Border"] + "; } #header-bar, .pagelist { background: " + theme["Navigation Background"] + "; border-color: " + theme["Navigation Border"] + "; } #doc, #threads, .board > .thread { background: " + theme["Thread Wrapper Background"] + "; border: 1px solid " + theme["Thread Wrapper Border"] + "; } #boardNavDesktopFoot, #mascot_hide, #menu, #selectrice, #themeConf, #thread-watcher, #thread-watcher:hover, .announcements-slideout #globalMessage, .dialog, .post-form-style-float #qr, .post-form-decorations #qr, .submenu { background: " + theme["Dialog Background"] + "; border: 1px solid " + theme["Dialog Border"] + "; } #qp.dialog { border: none; } .watch-thread-link { background-image: url(\"data:image/svg+xml,\"); } .deleteform::before, .deleteform, #qr .warning { background: " + theme["Input Background"] + "; border-color: " + theme["Input Border"] + "; } .disabledwarning, .warning { color: " + theme["Warnings"] + "; } #charCount { color: " + (Style.lightTheme ? "rgba(0,0,0,0.7)" : "rgba(255,255,255,0.7)") + "; } .postNum a { color: " + theme["Post Numbers"] + "; } .subject { color: " + theme["Subjects"] + " !important; } .dateTime, .post-ago { color: " + theme["Timestamps"] + " !important; } #fs_status a, #header-bar .shortcut > span, #updater #update-status:not(.new)::after, #showQR, .abbr, .boxbar, .boxcontent, .deleteform::before, .pages strong, .pln, .reply, .reply.highlight, .summary, body, button, span[style=\"left: 5px; position: absolute;\"] a, input, textarea { color: " + theme["Text"] + "; } #exlinks-options-content > table, #appchanx-settings fieldset, #selectrice { border-bottom: 1px solid " + theme["Reply Border"] + "; box-shadow: inset " + theme["Shadow Color"] + " 0 0 5px; } .quote + .spoiler:hover, .quote { color: " + theme["Greentext"] + "; } .forwardlink { border-bottom: 1px dashed " + theme["Backlinks"] + "; } .container::before { color: " + theme["Timestamps"] + "; } .quote-shadows #menu, .quote-shadows #post-preview, .quote-shadows #qp .opContainer, .quote-shadows #qp .replyContainer, .quote-shadows .submenu { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } .rice { background: " + theme["Checkbox Background"] + "; border: 1px solid " + theme["Checkbox Border"] + "; } .selectrice::before { border-left: 1px solid " + theme["Input Border"] + "; } .selectrice::after { border-top: .45em solid " + theme["Inputs"] + "; } .bd { background: " + theme["Buttons Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .pages a, #header-bar a { color: " + theme["Navigation Links"] + "; } input[type=checkbox]:checked + .rice::after { border-color: " + theme["Inputs"] + "; } #addReply, #dump, .button, .entry, .replylink, a { color: " + theme["Links"] + "; } .backlink { color: " + theme["Backlinks"] + "; } .qiQuote, .quotelink { color: " + theme["Quotelinks"] + "; } #addReply:hover, #dump:hover, .entry:hover, .replylink:hover, .qiQuote:hover, .quotelink:hover, a .name:hover, a .postertrip:hover, a:hover { color: " + theme["Hovered Links"] + "; } #header-bar a:hover, #boardTitle a:hover { color: " + theme["Hovered Navigation Links"] + "; } #boardTitle { color: " + theme["Board Title"] + "; } .name, .post-author { color: " + theme["Names"] + " !important; } .post-tripcode, .postertrip, .trip { color: " + theme["Tripcodes"] + " !important; } a .postertrip, a .name { color: " + theme["Emails"] + "; } .post.reply.qphl, .post.op.qphl { border-color: " + theme["Backlinked Reply Outline"] + "; background: " + theme["Highlighted Reply Background"] + "; } .quote-shadows .inline .post { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } .placeholder, #qr input::placeholder, #qr textarea::placeholder { color: " + (Style.lightTheme ? "rgba(0,0,0,0.3)" : "rgba(255,255,255,0.2)") + " !important; } #qr input:placeholder, #qr textarea:placeholder, .placeholder { color: " + (Style.lightTheme ? "rgba(0,0,0,0.3)" : "rgba(255,255,255,0.2)") + " !important; } #appchanx-settings fieldset, .boxcontent dd, .selectrice ul { border-color: " + (Style.lightTheme ? "rgba(0,0,0,0.1)" : "rgba(255,255,255,0.1)") + "; } #appchanx-settings li, #selectrice li:not(:first-of-type) { border-top: 1px solid " + (Style.lightTheme ? "rgba(0,0,0,0.05)" : "rgba(255,255,255,0.025)") + "; } .a-icon, #shortcuts .fa { " + (!Style.lightTheme ? "filter: url('data:image/svg+xml," + (Style.svgs.iconsfilter.replace(/(\'|\")/g, '%22')) + "#icons-filter');" : "") + " } .alternate-post-colors #threads > .thread:nth-of-type(2n+1), .alternate-post-colors .replyContainer:nth-of-type(2n+1) .post { background-image: linear-gradient(" + (replybg ? "rgba(" + (replybg.shiftRGB(-4, false)) + ",0.8), rgba(" + (replybg.shiftRGB(-4, false)) + ",0.8)" : Style.lightTheme ? "rgba(0,0,0,0.05), rgba(0,0,0,0.05)" : "rgba(255,255,255,0.02), rgba(255,255,255,0.02)") + "); } .color-reply-headings .boxbar, .color-reply-headings .postInfo { background: " + (replybg ? "rgba(" + (replybg.shiftRGB(-12, false)) + ",0.8)" : "rgba(0,0,0,0.1)") + "; border-bottom: 1px solid " + theme["Reply Border"] + " } .color-file-info .file { background: " + (replybg ? "rgba(" + (replybg.shiftRGB(-8, false)) + ",0.8)" : "rgba(0,0,0,0.1)") + "; border-bottom: 1px solid " + theme["Reply Border"] + " border-top: 1px solid " + theme["Reply Border"] + " } .color-reply.headings.color-file-info { border-top: none; } .op-background .op.post { background: " + theme["Reply Background"] + "; border: 1px solid " + theme["Reply Border"] + "; } .op-background .op.post:target .op-background .op.post.highlight { background: " + theme["Highlighted Reply Background"] + "; border: 1px solid " + theme["Highlighted Reply Border"] + "; } .fourchan-banner-at-sidebar-top.icon-orientation-vertical body::after { background: " + backgroundC + "; } .fourchan-banner-at-sidebar-top.icon-orientation-vertical.fourchan-ss-sidebar body::after, .fourchan-banner-at-sidebar-top.fourchan-ss-sidebar body::before { background: rgba(" + ((background = new Color(theme["Reply Background"])) ? background.shiftRGB(-18) : void 0) + ", 0.8); } .fourchan-ss-sidebar.sidebar-location-right body::before { border-left: 2px solid " + backgroundC + "; box-shadow: inset 1px 0 0 " + theme["Reply Border"] + ", -1px 0 0 " + theme["Reply Border"] + "; } .fourchan-ss-sidebar.sidebar-location-left body::before { border-right: 2px solid " + backgroundC + "; box-shadow: 1px 0 0 " + theme["Reply Border"] + ", inset -1px 0 0 " + theme["Reply Border"] + "; } .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"sage\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"Sage\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"SAGE\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"sage\"]:last-of-type::after, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"Sage\"]:last-of-type::after, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"SAGE\"]:last-of-type::after { content: \" (sage) \"; color: " + theme["Sage"] + "; } .quote-shadows #qr { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } " + (theme["Custom CSS"].replace(/\s+/g, ' ').trim())) + ("" + (Style.lightTheme ? " .prettyprint { background-color: #e7e7e7; border: 1px solid #dcdcdc; } .com { color: #dd0000; } .str, .atv { color: #7fa61b; } .pun { color: #61663a; } .tag { color: #117743; } .kwd { color: #5a6F9e; } .typ, .atn { color: #9474bd; } .lit { color: #368c72; } " : " .prettyprint { background-color: rgba(0,0,0,.1); border: 1px solid rgba(0,0,0,0.5); } .tag { color: #96562c; } .pun { color: #5b6f2a; } .com { color: #a34443; } .str, .atv { color: #8ba446; } .kwd { color: #987d3e; } .typ, .atn { color: #897399; } .lit { color: #558773; } ")); }, iconPositions: function() { var el, exec, slideNav; @@ -13317,106 +13317,11 @@ navHeight = Header.bar.offsetHeight; pageHeight = (_ref = $('.pagelist', d.body)) != null ? _ref.offsetHeight : void 0; return Style.sheets.padding.textContent = ("body { padding-bottom: 15px; padding-top: 15px; } .fourchan-ss-navigation.fixed.top-header:not(.autohide) body::before { top: " + navHeight + "px; } .fourchan-ss-navigation.fixed.bottom-header:not(.autohide) body::before { bottom: " + navHeight + "px; } .top-header:not(.autohide) body { padding-top: " + (navHeight + 1) + "px; } .bottom-header:not(.autohide) body { padding-bottom: " + (navHeight + 1) + "px; } ") + (pageHeight ? ".fourchan-ss-navigation.index.pagination-sticky-top body::before, .fourchan-ss-navigation.index.pagination-top body::before { top: " + pageHeight + "px; } .fourchan-ss-navigation.index.pagination-sticky-bottom body::before, .fourchan-ss-navigation.index.pagination-bottom body::before { bottom: " + pageHeight + "px; } .index.pagination-sticky-top body, .index.pagination-top body { padding-top: " + (pageHeight + 1) + "px; } .index.pagination-sticky-bottom body, .index.pagination-bottom body { padding-bottom: " + (pageHeight + 1) + "px; }" : ''); - }, - color: (function() { - var calcRGB, colorToHex, minmax; - - minmax = function(base) { - if (base < 0) { - return 0; - } else if (base > 255) { - return 255; - } else { - return base; - } - }; - - calcRGB = function(value) { - var hex; - hex = parseInt(value, 16); - return [(hex >> 16) & 0xFF, (hex >> 8) & 0xFF, hex & 0xFF]; - }; - - colorToHex = function(color) { - var b, digits, hex, r; - if (color.substr(0, 1) === '#') { - if (color.length !== 4) { - return color.slice(1); - } else { - r = color.substr(1, 1); - g = color.substr(2, 1); - b = color.substr(3, 1); - return [r, r, g, g, b, b].join(""); - } - } - if (/[0-9a-f]{3}/i.test(color)) { - if (/[0-9a-f]{6}/i.test(color)) { - return color; - } - r = color.substr(0, 1); - g = color.substr(1, 1); - b = color.substr(2, 1); - return [r, r, g, g, b, b].join(""); - } - if (digits = color.match(/(.*?)rgba?\((\d+), ?(\d+), ?(\d+)(.*?)\)/)) { - hex = ((parseInt(digits[2], 10) << 16) | (parseInt(digits[3], 10) << 8) | (parseInt(digits[4], 10))).toString(16); - while (hex.length < 6) { - hex = "0" + hex; - } - return hex; - } else { - return "000000"; - } - }; - - function _Class(value) { - this.raw = colorToHex(value); - } - - _Class.prototype.hex = function() { - return "#" + this.raw; - }; - - _Class.prototype.privateRGB = function() { - return calc_rgb(this.raw); - }; - - _Class.prototype.rgb = function() { - return this.privateRGB().join(""); - }; - - _Class.prototype.hover = function() { - return this.shiftRGB(16, true); - }; - - _Class.prototype.isLight = function() { - return (this.privateRGB[0] * 0.299 + this.privateRGB[1] * 0.587 + this.privateRGB[2] * 0.114) > 125; - }; - - _Class.prototype.shiftRGB = function(shift, smart) { - var color; - if (smart) { - shift = (this.isLight ? -1 : 1) * Math.abs(shift); - } - return ((function() { - var _i, _len, _ref, _results; - _ref = this.privateRGB; - _results = []; - for (_i = 0, _len = _ref.length; _i < _len; _i++) { - color = _ref[_i]; - _results.push(minmax(color + shift)); - } - return _results; - }).call(this)).join(","); - }; - - return _Class; - - })() + } }; /* - Style.color adapted from 4chan Style Script + Color adapted from 4chan Style Script */ @@ -13491,7 +13396,7 @@ input.className = "colorfield"; colorInput = $.el('input', { className: 'color', - value: "#" + ((new Style.color(input.value)).hex()) + value: "#" + ((new Color(input.value)).hex()) }); JSColor.bind(colorInput); $.after(input, colorInput); @@ -13546,7 +13451,7 @@ return alert("Syntax error on " + this.name + "."); } if (this.className === "colorfield") { - this.nextSibling.value = (new Style.color(this.value)).hex(); + this.nextSibling.value = (new Color(this.value)).hex(); this.nextSibling.color.importColor(); } editTheme[this.name] = this.value; @@ -13712,6 +13617,108 @@ } }; + Color = (function() { + var calcRGB, colorToHex, minmax, shortToLong; + + minmax = function(base) { + if (base < 0) { + return 0; + } else if (base > 255) { + return 255; + } else { + return base; + } + }; + + calcRGB = function(value) { + var hex; + hex = parseInt(value, 16); + return [(hex >> 16) & 0xFF, (hex >> 8) & 0xFF, hex & 0xFF]; + }; + + shortToLong = function(hex) { + var i, longHex; + longHex = []; + i = 0; + while (i < 3) { + longHex.push(hex.substr(i, 1)); + i = Math.floor(longHex.length / 2); + } + return longHex.join(""); + }; + + colorToHex = function(color) { + var digits, hex; + if (color.substr(0, 1) === '#') { + if (color.length !== 4) { + return color.slice(1); + } else { + return shortToLong(color.substr(1, 3)); + } + } + if (/[0-9a-f]{3}/i.test(color)) { + if (color.length === 6) { + return color; + } else { + return shortToLong(color); + } + } + if (digits = color.match(/(.*?)rgba?\((\d+), ?(\d+), ?(\d+)(.*?)\)/)) { + hex = ((parseInt(digits[2], 10) << 16) | (parseInt(digits[3], 10) << 8) | (parseInt(digits[4], 10))).toString(16); + while (hex.length < 6) { + hex = "0" + hex; + } + return hex; + } else { + return "000000"; + } + }; + + function Color(value) { + this.raw = colorToHex(value); + } + + Color.prototype.hex = function() { + return "#" + this.raw; + }; + + Color.prototype.privateRGB = function() { + return calc_rgb(this.raw); + }; + + Color.prototype.rgb = function() { + return this.privateRGB().join(""); + }; + + Color.prototype.hover = function() { + return this.shiftRGB(16, true); + }; + + Color.prototype.isLight = function() { + return (this.privateRGB[0] * 0.299 + this.privateRGB[1] * 0.587 + this.privateRGB[2] * 0.114) > 125; + }; + + Color.prototype.shiftRGB = function(shift, smart) { + var color; + if (smart) { + shift = (this.isLight ? -1 : 1) * Math.abs(shift); + } + return ((function() { + var _i, _len, _ref, _results; + _ref = this.privateRGB; + _results = []; + for (_i = 0, _len = _ref.length; _i < _len; _i++) { + color = _ref[_i]; + _results.push(minmax(color + shift)); + } + return _results; + }).call(this)).join(","); + }; + + return Color; + + })(); + PSAHiding = { init: function() { if (!Conf['Announcement Hiding']) { diff --git a/builds/crx/script.js b/builds/crx/script.js index 6478691ab..198a18237 100644 --- a/builds/crx/script.js +++ b/builds/crx/script.js @@ -88,7 +88,7 @@ 'use strict'; (function() { - var $, $$, Anonymize, ArchiveLink, AutoGIF, Banner, Board, Build, CatalogLinks, Clone, Conf, Config, CustomCSS, DataBoard, DeleteLink, Dice, DownloadLink, Emoji, ExpandComment, ExpandThread, FappeTyme, Favicon, FileInfo, Filter, Fourchan, Gallery, Get, GlobalMessage, Header, IDColor, ImageExpand, ImageHover, ImageLoader, Index, InfiniScroll, JSColor, Keybinds, Linkify, Main, MascotTools, Mascots, Menu, Nav, Notice, PSAHiding, Polyfill, Post, PostHiding, QR, QuoteBacklink, QuoteCT, QuoteInline, QuoteOP, QuotePreview, QuoteStrikeThrough, QuoteThreading, QuoteYou, Quotify, Recursive, Redirect, RelativeDates, RemoveSpoilers, Report, ReportLink, RevealSpoilers, Rice, Sauce, Settings, Style, ThemeTools, Themes, Thread, ThreadExcerpt, ThreadHiding, ThreadStats, ThreadUpdater, ThreadWatcher, Time, UI, Unread, c, d, doc, editMascot, editTheme, g, userNavigation, + var $, $$, Anonymize, ArchiveLink, AutoGIF, Banner, Board, Build, CatalogLinks, Clone, Color, Conf, Config, CustomCSS, DataBoard, DeleteLink, Dice, DownloadLink, Emoji, ExpandComment, ExpandThread, FappeTyme, Favicon, FileInfo, Filter, Fourchan, Gallery, Get, GlobalMessage, Header, IDColor, ImageExpand, ImageHover, ImageLoader, Index, InfiniScroll, JSColor, Keybinds, Linkify, Main, MascotTools, Mascots, Menu, Nav, Notice, PSAHiding, Polyfill, Post, PostHiding, QR, QuoteBacklink, QuoteCT, QuoteInline, QuoteOP, QuotePreview, QuoteStrikeThrough, QuoteThreading, QuoteYou, Quotify, Recursive, Redirect, RelativeDates, RemoveSpoilers, Report, ReportLink, RevealSpoilers, Rice, Sauce, Settings, Style, ThemeTools, Themes, Thread, ThreadExcerpt, ThreadHiding, ThreadStats, ThreadUpdater, ThreadWatcher, Time, UI, Unread, c, d, doc, editMascot, editTheme, g, userNavigation, __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; }, __slice = [].slice, __hasProp = {}.hasOwnProperty, @@ -12694,7 +12694,7 @@ }); ctx = el.getContext('2d'); ctx.font = "50px " + Conf['Font']; - ctx.fillStyle = (new Style.color((Themes[Conf['theme']] || Themes['Yotsuba B'])['Text'])).hex(); + ctx.fillStyle = (new Color((Themes[Conf['theme']] || Themes['Yotsuba B'])['Text'])).hex(); ctx.textAlign = 'center'; ctx.textBaseline = 'middle'; ctx.fillText("Mascot 404", 124, 50); @@ -13237,7 +13237,7 @@ rgb = ['r', 'g', 'b']; for (_i = 0, _len = arguments.length; _i < _len; _i++) { arg = arguments[_i]; - hex = (new Style.color(arg)).raw; + hex = (new Color(arg)).raw; color = {}; i = 0; while (val = rgb[i]) { @@ -13275,8 +13275,8 @@ }, theme: function(theme) { var background, backgroundC, bgColor, i, replyRGB, replybg, svg, svgs, _i, _len; - bgColor = new Style.color(backgroundC = theme["Background Color"]); - replybg = new Style.color(theme["Reply Background"]); + bgColor = new Color(backgroundC = theme["Background Color"]); + replybg = new Color(theme["Reply Background"]); replyRGB = "rgb(" + (replybg.shiftRGB(parseInt(Conf['Silhouette Contrast'], 10), true)) + ")"; Style.lightTheme = bgColor.isLight(); svgs = [['captcha-filter', "values='" + (Style.filter(Style.matrix(theme["Text"], theme["Input Background"]))) + " 0 0 0 1 0'"], ['mascot-filter', "values='" + (Style.silhouette(Style.matrix(replyRGB))) + " 0 0 0 1 0'"], ['grayscale', 'id="color" type="saturate" values="0"'], ['icons-filter', "values='-1 0 0 0 1 0 -1 0 0 1 0 0 -1 0 1 0 0 0 1 0'"]]; @@ -13285,7 +13285,7 @@ svgs[i] = Style.generateFilter(svg[0], svg[1]); } Style.svgs.el.innerHTML = svgs.join(''); - return (".hide_thread_button span > span, .hide_reply_button span > span { background-color: " + theme["Links"] + "; } #mascot_hide label { border-bottom: 1px solid " + theme["Reply Border"] + "; } #content .thumb { box-shadow: 0 0 5px " + theme["Reply Border"] + "; } .export-button, .mascotname, #mascot-options { background: " + theme["Dialog Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .highlight-you .opContainer.quotesYou, .highlight-own .opContainer.yourPost, .opContainer.filter-highlight { box-shadow: inset 5px 0 " + theme["Backlinked Reply Outline"] + "; } .highlight-you .quotesYou > .reply, .highlight-own .yourPost > .reply, .filter-highlight > .reply { box-shadow: -5px 0 " + theme["Backlinked Reply Outline"] + "; } hr { border-bottom: 1px solid " + theme["Reply Border"] + "; } hr#unread-line { border-bottom: 1px solid " + theme["Reply Background"] + "; visibility: visible; } .threadContainer { border-color: " + theme["Reply Border"] + " !important; } html { background: " + (backgroundC || '') + "; background-image: " + (theme["Background Image"] || '') + "; background-repeat: " + (theme["Background Repeat"] || '') + "; background-attachment: " + (theme["Background Attachment"] || '') + "; background-position: " + (theme["Background Position"] || '') + "; } .panel, .section-container, #exlinks-options-content, #themecontent { background: " + backgroundC + "; border: 1px solid " + theme["Reply Border"] + "; } .sections-list > a.tab-selected { background: " + backgroundC + "; border-color: " + theme["Reply Border"] + "; } .captcha-img img { -webkit-filter: url('#captcha-filter'); } .silhouettize-mascots #mascot img, .silhouette img { -webkit-filter: url('#mascot-filter'); } .grayscale-mascots #mascot { -webkit-filter: url('#grayscale'); } #boardTitle { text-shadow: 1px 1px " + backgroundC + ", -1px -1px " + backgroundC + ", 1px -1px " + backgroundC + ", -1px 1px " + backgroundC + "; } .sidebar-glow #boardTitle { text-shadow: 1px 1px 1px " + backgroundC + ", -1px -1px 1px " + backgroundC + ", 1px -1px 1px " + backgroundC + ", -1px 1px 1px " + backgroundC + ", 0 2px 4px rgba(0,0,0,.6), 0 0 10px rgba(0,0,0,.6); } #exlinks-options, #appchanx-settings, #qrtab, input[type=\"submit\"], input[value=\"Report\"], span[style=\"left: 5px; position: absolute;\"] a { background: " + theme["Buttons Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .enabled .mascotcontainer { background: " + theme["Buttons Background"] + "; border-color: " + theme["Buttons Border"] + "; } #dump, #qr-filename-container, #appchanx-settings input, .captcha-img, .dump #dump, .qr-preview, .selectrice, button, input, textarea { background: " + theme["Input Background"] + "; border: 1px solid " + theme["Input Border"] + "; } .has-file #qr-extras-container { background: " + theme["Input Background"] + "; } #dump:hover, #qr-filename-container:hover, .selectrice:hover, #selectrice li:hover, #selectrice li:nth-of-type(2n+1):hover, input:hover, textarea:hover { background: " + theme["Hovered Input Background"] + "; border-color: " + theme["Hovered Input Border"] + "; } .has-file #qr-filename-container:hover #qr-extras-container { background: " + theme["Hovered Input Background"] + "; } #dump:active, #dump:focus, #selectrice li:focus, .selectrice:focus, #qr-filename-container:active, #qr-filename-container:focus, input:focus, textarea:focus, textarea.field:focus { background: " + theme["Focused Input Background"] + "; border-color: " + theme["Focused Input Border"] + "; color: " + theme["Inputs"] + "; } .has-file #qr-filename-container:active #qr-extras-container, .has-file #qr-filename-container:focus #qr-extras-container { background: " + theme["Focused Input Background"] + "; } #ft, #mouseover, #post-preview, #qp .post, #threads > .thread, #xupdater, .box-outer, .reply.post { border-width: 1px; border-style: solid; border-color: " + theme["Reply Border"] + "; background: " + theme["Reply Background"] + "; } .exblock.reply, .reply.post.highlight, .reply.post:target { background: " + theme["Highlighted Reply Background"] + "; border: 1px solid " + theme["Highlighted Reply Border"] + "; } #header-bar, .pagelist { background: " + theme["Navigation Background"] + "; border-color: " + theme["Navigation Border"] + "; } #doc, #threads, .board > .thread { background: " + theme["Thread Wrapper Background"] + "; border: 1px solid " + theme["Thread Wrapper Border"] + "; } #boardNavDesktopFoot, #mascot_hide, #menu, #selectrice, #themeConf, #thread-watcher, #thread-watcher:hover, .announcements-slideout #globalMessage, .dialog, .post-form-style-float #qr, .post-form-decorations #qr, .submenu { background: " + theme["Dialog Background"] + "; border: 1px solid " + theme["Dialog Border"] + "; } #qp.dialog { border: none; } .watch-thread-link { background-image: url(\"data:image/svg+xml,\"); } .deleteform::before, .deleteform, #qr .warning { background: " + theme["Input Background"] + "; border-color: " + theme["Input Border"] + "; } .disabledwarning, .warning { color: " + theme["Warnings"] + "; } #charCount { color: " + (Style.lightTheme ? "rgba(0,0,0,0.7)" : "rgba(255,255,255,0.7)") + "; } .postNum a { color: " + theme["Post Numbers"] + "; } .subject { color: " + theme["Subjects"] + " !important; } .dateTime, .post-ago { color: " + theme["Timestamps"] + " !important; } #fs_status a, #header-bar .shortcut > span, #updater #update-status:not(.new)::after, #showQR, .abbr, .boxbar, .boxcontent, .deleteform::before, .pages strong, .pln, .reply, .reply.highlight, .summary, body, button, span[style=\"left: 5px; position: absolute;\"] a, input, textarea { color: " + theme["Text"] + "; } #exlinks-options-content > table, #appchanx-settings fieldset, #selectrice { border-bottom: 1px solid " + theme["Reply Border"] + "; box-shadow: inset " + theme["Shadow Color"] + " 0 0 5px; } .quote + .spoiler:hover, .quote { color: " + theme["Greentext"] + "; } .forwardlink { border-bottom: 1px dashed " + theme["Backlinks"] + "; } .container::before { color: " + theme["Timestamps"] + "; } .quote-shadows #menu, .quote-shadows #post-preview, .quote-shadows #qp .opContainer, .quote-shadows #qp .replyContainer, .quote-shadows .submenu { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } .rice { background: " + theme["Checkbox Background"] + "; border: 1px solid " + theme["Checkbox Border"] + "; } .selectrice::before { border-left: 1px solid " + theme["Input Border"] + "; } .selectrice::after { border-top: .45em solid " + theme["Inputs"] + "; } .bd { background: " + theme["Buttons Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .pages a, #header-bar a { color: " + theme["Navigation Links"] + "; } input[type=checkbox]:checked + .rice::after { border-color: " + theme["Inputs"] + "; } #addReply, #dump, .button, .entry, .replylink, a { color: " + theme["Links"] + "; } .backlink { color: " + theme["Backlinks"] + "; } .qiQuote, .quotelink { color: " + theme["Quotelinks"] + "; } #addReply:hover, #dump:hover, .entry:hover, .replylink:hover, .qiQuote:hover, .quotelink:hover, a .name:hover, a .postertrip:hover, a:hover { color: " + theme["Hovered Links"] + "; } #header-bar a:hover, #boardTitle a:hover { color: " + theme["Hovered Navigation Links"] + "; } #boardTitle { color: " + theme["Board Title"] + "; } .name, .post-author { color: " + theme["Names"] + " !important; } .post-tripcode, .postertrip, .trip { color: " + theme["Tripcodes"] + " !important; } a .postertrip, a .name { color: " + theme["Emails"] + "; } .post.reply.qphl, .post.op.qphl { border-color: " + theme["Backlinked Reply Outline"] + "; background: " + theme["Highlighted Reply Background"] + "; } .quote-shadows .inline .post { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } .placeholder, #qr input::placeholder, #qr textarea::placeholder { color: " + (Style.lightTheme ? "rgba(0,0,0,0.3)" : "rgba(255,255,255,0.2)") + " !important; } #qr input:placeholder, #qr textarea:placeholder, .placeholder { color: " + (Style.lightTheme ? "rgba(0,0,0,0.3)" : "rgba(255,255,255,0.2)") + " !important; } #appchanx-settings fieldset, .boxcontent dd, .selectrice ul { border-color: " + (Style.lightTheme ? "rgba(0,0,0,0.1)" : "rgba(255,255,255,0.1)") + "; } #appchanx-settings li, #selectrice li:not(:first-of-type) { border-top: 1px solid " + (Style.lightTheme ? "rgba(0,0,0,0.05)" : "rgba(255,255,255,0.025)") + "; } .a-icon, #shortcuts .fa { " + (!Style.lightTheme ? "-webkit-filter: url('#icons-filter');" : "") + " } .alternate-post-colors #threads > .thread:nth-of-type(2n+1), .alternate-post-colors .replyContainer:nth-of-type(2n+1) .post { background-image: linear-gradient(" + (replybg ? "rgba(" + (replybg.shiftRGB(-4, false)) + ",0.8), rgba(" + (replybg.shiftRGB(-4, false)) + ",0.8)" : Style.lightTheme ? "rgba(0,0,0,0.05), rgba(0,0,0,0.05)" : "rgba(255,255,255,0.02), rgba(255,255,255,0.02)") + "); } .color-reply-headings .boxbar, .color-reply-headings .postInfo { background: " + (replybg ? "rgba(" + (replybg.shiftRGB(-12, false)) + ",0.8)" : "rgba(0,0,0,0.1)") + "; border-bottom: 1px solid " + theme["Reply Border"] + " } .color-file-info .file { background: " + (replybg ? "rgba(" + (replybg.shiftRGB(-8, false)) + ",0.8)" : "rgba(0,0,0,0.1)") + "; border-bottom: 1px solid " + theme["Reply Border"] + " border-top: 1px solid " + theme["Reply Border"] + " } .color-reply.headings.color-file-info { border-top: none; } .op-background .op.post { background: " + theme["Reply Background"] + "; border: 1px solid " + theme["Reply Border"] + "; } .op-background .op.post:target .op-background .op.post.highlight { background: " + theme["Highlighted Reply Background"] + "; border: 1px solid " + theme["Highlighted Reply Border"] + "; } .fourchan-banner-at-sidebar-top.icon-orientation-vertical body::after { background: " + backgroundC + "; } .fourchan-banner-at-sidebar-top.icon-orientation-vertical.fourchan-ss-sidebar body::after, .fourchan-banner-at-sidebar-top.fourchan-ss-sidebar body::before { background: rgba(" + ((background = new Style.color(theme["Reply Background"])) ? background.shiftRGB(-18) : void 0) + ", 0.8); } .fourchan-ss-sidebar.sidebar-location-right body::before { border-left: 2px solid " + backgroundC + "; box-shadow: inset 1px 0 0 " + theme["Reply Border"] + ", -1px 0 0 " + theme["Reply Border"] + "; } .fourchan-ss-sidebar.sidebar-location-left body::before { border-right: 2px solid " + backgroundC + "; box-shadow: 1px 0 0 " + theme["Reply Border"] + ", inset -1px 0 0 " + theme["Reply Border"] + "; } .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"sage\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"Sage\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"SAGE\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"sage\"]:last-of-type::after, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"Sage\"]:last-of-type::after, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"SAGE\"]:last-of-type::after { content: \" (sage) \"; color: " + theme["Sage"] + "; } .quote-shadows #qr { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } " + (theme["Custom CSS"].replace(/\s+/g, ' ').trim())) + ("" + (Style.lightTheme ? " .prettyprint { background-color: #e7e7e7; border: 1px solid #dcdcdc; } .com { color: #dd0000; } .str, .atv { color: #7fa61b; } .pun { color: #61663a; } .tag { color: #117743; } .kwd { color: #5a6F9e; } .typ, .atn { color: #9474bd; } .lit { color: #368c72; } " : " .prettyprint { background-color: rgba(0,0,0,.1); border: 1px solid rgba(0,0,0,0.5); } .tag { color: #96562c; } .pun { color: #5b6f2a; } .com { color: #a34443; } .str, .atv { color: #8ba446; } .kwd { color: #987d3e; } .typ, .atn { color: #897399; } .lit { color: #558773; } ")); + return (".hide_thread_button span > span, .hide_reply_button span > span { background-color: " + theme["Links"] + "; } #mascot_hide label { border-bottom: 1px solid " + theme["Reply Border"] + "; } #content .thumb { box-shadow: 0 0 5px " + theme["Reply Border"] + "; } .export-button, .mascotname, #mascot-options { background: " + theme["Dialog Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .highlight-you .opContainer.quotesYou, .highlight-own .opContainer.yourPost, .opContainer.filter-highlight { box-shadow: inset 5px 0 " + theme["Backlinked Reply Outline"] + "; } .highlight-you .quotesYou > .reply, .highlight-own .yourPost > .reply, .filter-highlight > .reply { box-shadow: -5px 0 " + theme["Backlinked Reply Outline"] + "; } hr { border-bottom: 1px solid " + theme["Reply Border"] + "; } hr#unread-line { border-bottom: 1px solid " + theme["Reply Background"] + "; visibility: visible; } .threadContainer { border-color: " + theme["Reply Border"] + " !important; } html { background: " + (backgroundC || '') + "; background-image: " + (theme["Background Image"] || '') + "; background-repeat: " + (theme["Background Repeat"] || '') + "; background-attachment: " + (theme["Background Attachment"] || '') + "; background-position: " + (theme["Background Position"] || '') + "; } .panel, .section-container, #exlinks-options-content, #themecontent { background: " + backgroundC + "; border: 1px solid " + theme["Reply Border"] + "; } .sections-list > a.tab-selected { background: " + backgroundC + "; border-color: " + theme["Reply Border"] + "; } .captcha-img img { -webkit-filter: url('#captcha-filter'); } .silhouettize-mascots #mascot img, .silhouette img { -webkit-filter: url('#mascot-filter'); } .grayscale-mascots #mascot { -webkit-filter: url('#grayscale'); } #boardTitle { text-shadow: 1px 1px " + backgroundC + ", -1px -1px " + backgroundC + ", 1px -1px " + backgroundC + ", -1px 1px " + backgroundC + "; } .sidebar-glow #boardTitle { text-shadow: 1px 1px 1px " + backgroundC + ", -1px -1px 1px " + backgroundC + ", 1px -1px 1px " + backgroundC + ", -1px 1px 1px " + backgroundC + ", 0 2px 4px rgba(0,0,0,.6), 0 0 10px rgba(0,0,0,.6); } #exlinks-options, #appchanx-settings, #qrtab, input[type=\"submit\"], input[value=\"Report\"], span[style=\"left: 5px; position: absolute;\"] a { background: " + theme["Buttons Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .enabled .mascotcontainer { background: " + theme["Buttons Background"] + "; border-color: " + theme["Buttons Border"] + "; } #dump, #qr-filename-container, #appchanx-settings input, .captcha-img, .dump #dump, .qr-preview, .selectrice, button, input, textarea { background: " + theme["Input Background"] + "; border: 1px solid " + theme["Input Border"] + "; } .has-file #qr-extras-container { background: " + theme["Input Background"] + "; } #dump:hover, #qr-filename-container:hover, .selectrice:hover, #selectrice li:hover, #selectrice li:nth-of-type(2n+1):hover, input:hover, textarea:hover { background: " + theme["Hovered Input Background"] + "; border-color: " + theme["Hovered Input Border"] + "; } .has-file #qr-filename-container:hover #qr-extras-container { background: " + theme["Hovered Input Background"] + "; } #dump:active, #dump:focus, #selectrice li:focus, .selectrice:focus, #qr-filename-container:active, #qr-filename-container:focus, input:focus, textarea:focus, textarea.field:focus { background: " + theme["Focused Input Background"] + "; border-color: " + theme["Focused Input Border"] + "; color: " + theme["Inputs"] + "; } .has-file #qr-filename-container:active #qr-extras-container, .has-file #qr-filename-container:focus #qr-extras-container { background: " + theme["Focused Input Background"] + "; } #ft, #mouseover, #post-preview, #qp .post, #threads > .thread, #xupdater, .box-outer, .reply.post { border-width: 1px; border-style: solid; border-color: " + theme["Reply Border"] + "; background: " + theme["Reply Background"] + "; } .exblock.reply, .reply.post.highlight, .reply.post:target { background: " + theme["Highlighted Reply Background"] + "; border: 1px solid " + theme["Highlighted Reply Border"] + "; } #header-bar, .pagelist { background: " + theme["Navigation Background"] + "; border-color: " + theme["Navigation Border"] + "; } #doc, #threads, .board > .thread { background: " + theme["Thread Wrapper Background"] + "; border: 1px solid " + theme["Thread Wrapper Border"] + "; } #boardNavDesktopFoot, #mascot_hide, #menu, #selectrice, #themeConf, #thread-watcher, #thread-watcher:hover, .announcements-slideout #globalMessage, .dialog, .post-form-style-float #qr, .post-form-decorations #qr, .submenu { background: " + theme["Dialog Background"] + "; border: 1px solid " + theme["Dialog Border"] + "; } #qp.dialog { border: none; } .watch-thread-link { background-image: url(\"data:image/svg+xml,\"); } .deleteform::before, .deleteform, #qr .warning { background: " + theme["Input Background"] + "; border-color: " + theme["Input Border"] + "; } .disabledwarning, .warning { color: " + theme["Warnings"] + "; } #charCount { color: " + (Style.lightTheme ? "rgba(0,0,0,0.7)" : "rgba(255,255,255,0.7)") + "; } .postNum a { color: " + theme["Post Numbers"] + "; } .subject { color: " + theme["Subjects"] + " !important; } .dateTime, .post-ago { color: " + theme["Timestamps"] + " !important; } #fs_status a, #header-bar .shortcut > span, #updater #update-status:not(.new)::after, #showQR, .abbr, .boxbar, .boxcontent, .deleteform::before, .pages strong, .pln, .reply, .reply.highlight, .summary, body, button, span[style=\"left: 5px; position: absolute;\"] a, input, textarea { color: " + theme["Text"] + "; } #exlinks-options-content > table, #appchanx-settings fieldset, #selectrice { border-bottom: 1px solid " + theme["Reply Border"] + "; box-shadow: inset " + theme["Shadow Color"] + " 0 0 5px; } .quote + .spoiler:hover, .quote { color: " + theme["Greentext"] + "; } .forwardlink { border-bottom: 1px dashed " + theme["Backlinks"] + "; } .container::before { color: " + theme["Timestamps"] + "; } .quote-shadows #menu, .quote-shadows #post-preview, .quote-shadows #qp .opContainer, .quote-shadows #qp .replyContainer, .quote-shadows .submenu { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } .rice { background: " + theme["Checkbox Background"] + "; border: 1px solid " + theme["Checkbox Border"] + "; } .selectrice::before { border-left: 1px solid " + theme["Input Border"] + "; } .selectrice::after { border-top: .45em solid " + theme["Inputs"] + "; } .bd { background: " + theme["Buttons Background"] + "; border: 1px solid " + theme["Buttons Border"] + "; } .pages a, #header-bar a { color: " + theme["Navigation Links"] + "; } input[type=checkbox]:checked + .rice::after { border-color: " + theme["Inputs"] + "; } #addReply, #dump, .button, .entry, .replylink, a { color: " + theme["Links"] + "; } .backlink { color: " + theme["Backlinks"] + "; } .qiQuote, .quotelink { color: " + theme["Quotelinks"] + "; } #addReply:hover, #dump:hover, .entry:hover, .replylink:hover, .qiQuote:hover, .quotelink:hover, a .name:hover, a .postertrip:hover, a:hover { color: " + theme["Hovered Links"] + "; } #header-bar a:hover, #boardTitle a:hover { color: " + theme["Hovered Navigation Links"] + "; } #boardTitle { color: " + theme["Board Title"] + "; } .name, .post-author { color: " + theme["Names"] + " !important; } .post-tripcode, .postertrip, .trip { color: " + theme["Tripcodes"] + " !important; } a .postertrip, a .name { color: " + theme["Emails"] + "; } .post.reply.qphl, .post.op.qphl { border-color: " + theme["Backlinked Reply Outline"] + "; background: " + theme["Highlighted Reply Background"] + "; } .quote-shadows .inline .post { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } .placeholder, #qr input::placeholder, #qr textarea::placeholder { color: " + (Style.lightTheme ? "rgba(0,0,0,0.3)" : "rgba(255,255,255,0.2)") + " !important; } #qr input:placeholder, #qr textarea:placeholder, .placeholder { color: " + (Style.lightTheme ? "rgba(0,0,0,0.3)" : "rgba(255,255,255,0.2)") + " !important; } #appchanx-settings fieldset, .boxcontent dd, .selectrice ul { border-color: " + (Style.lightTheme ? "rgba(0,0,0,0.1)" : "rgba(255,255,255,0.1)") + "; } #appchanx-settings li, #selectrice li:not(:first-of-type) { border-top: 1px solid " + (Style.lightTheme ? "rgba(0,0,0,0.05)" : "rgba(255,255,255,0.025)") + "; } .a-icon, #shortcuts .fa { " + (!Style.lightTheme ? "-webkit-filter: url('#icons-filter');" : "") + " } .alternate-post-colors #threads > .thread:nth-of-type(2n+1), .alternate-post-colors .replyContainer:nth-of-type(2n+1) .post { background-image: linear-gradient(" + (replybg ? "rgba(" + (replybg.shiftRGB(-4, false)) + ",0.8), rgba(" + (replybg.shiftRGB(-4, false)) + ",0.8)" : Style.lightTheme ? "rgba(0,0,0,0.05), rgba(0,0,0,0.05)" : "rgba(255,255,255,0.02), rgba(255,255,255,0.02)") + "); } .color-reply-headings .boxbar, .color-reply-headings .postInfo { background: " + (replybg ? "rgba(" + (replybg.shiftRGB(-12, false)) + ",0.8)" : "rgba(0,0,0,0.1)") + "; border-bottom: 1px solid " + theme["Reply Border"] + " } .color-file-info .file { background: " + (replybg ? "rgba(" + (replybg.shiftRGB(-8, false)) + ",0.8)" : "rgba(0,0,0,0.1)") + "; border-bottom: 1px solid " + theme["Reply Border"] + " border-top: 1px solid " + theme["Reply Border"] + " } .color-reply.headings.color-file-info { border-top: none; } .op-background .op.post { background: " + theme["Reply Background"] + "; border: 1px solid " + theme["Reply Border"] + "; } .op-background .op.post:target .op-background .op.post.highlight { background: " + theme["Highlighted Reply Background"] + "; border: 1px solid " + theme["Highlighted Reply Border"] + "; } .fourchan-banner-at-sidebar-top.icon-orientation-vertical body::after { background: " + backgroundC + "; } .fourchan-banner-at-sidebar-top.icon-orientation-vertical.fourchan-ss-sidebar body::after, .fourchan-banner-at-sidebar-top.fourchan-ss-sidebar body::before { background: rgba(" + ((background = new Color(theme["Reply Background"])) ? background.shiftRGB(-18) : void 0) + ", 0.8); } .fourchan-ss-sidebar.sidebar-location-right body::before { border-left: 2px solid " + backgroundC + "; box-shadow: inset 1px 0 0 " + theme["Reply Border"] + ", -1px 0 0 " + theme["Reply Border"] + "; } .fourchan-ss-sidebar.sidebar-location-left body::before { border-right: 2px solid " + backgroundC + "; box-shadow: 1px 0 0 " + theme["Reply Border"] + ", inset -1px 0 0 " + theme["Reply Border"] + "; } .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"sage\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"Sage\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-before a.useremail[href*=\"SAGE\"]:last-of-type::before, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"sage\"]:last-of-type::after, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"Sage\"]:last-of-type::after, .sage-highlighting-text.sage-highlight-position-after a.useremail[href*=\"SAGE\"]:last-of-type::after { content: \" (sage) \"; color: " + theme["Sage"] + "; } .quote-shadows #qr { box-shadow: 5px 5px 5px " + theme['Shadow Color'] + "; } " + (theme["Custom CSS"].replace(/\s+/g, ' ').trim())) + ("" + (Style.lightTheme ? " .prettyprint { background-color: #e7e7e7; border: 1px solid #dcdcdc; } .com { color: #dd0000; } .str, .atv { color: #7fa61b; } .pun { color: #61663a; } .tag { color: #117743; } .kwd { color: #5a6F9e; } .typ, .atn { color: #9474bd; } .lit { color: #368c72; } " : " .prettyprint { background-color: rgba(0,0,0,.1); border: 1px solid rgba(0,0,0,0.5); } .tag { color: #96562c; } .pun { color: #5b6f2a; } .com { color: #a34443; } .str, .atv { color: #8ba446; } .kwd { color: #987d3e; } .typ, .atn { color: #897399; } .lit { color: #558773; } ")); }, iconPositions: function() { var el, exec, slideNav; @@ -13328,106 +13328,11 @@ navHeight = Header.bar.offsetHeight; pageHeight = (_ref = $('.pagelist', d.body)) != null ? _ref.offsetHeight : void 0; return Style.sheets.padding.textContent = ("body { padding-bottom: 15px; padding-top: 15px; } .fourchan-ss-navigation.fixed.top-header:not(.autohide) body::before { top: " + navHeight + "px; } .fourchan-ss-navigation.fixed.bottom-header:not(.autohide) body::before { bottom: " + navHeight + "px; } .top-header:not(.autohide) body { padding-top: " + (navHeight + 1) + "px; } .bottom-header:not(.autohide) body { padding-bottom: " + (navHeight + 1) + "px; } ") + (pageHeight ? ".fourchan-ss-navigation.index.pagination-sticky-top body::before, .fourchan-ss-navigation.index.pagination-top body::before { top: " + pageHeight + "px; } .fourchan-ss-navigation.index.pagination-sticky-bottom body::before, .fourchan-ss-navigation.index.pagination-bottom body::before { bottom: " + pageHeight + "px; } .index.pagination-sticky-top body, .index.pagination-top body { padding-top: " + (pageHeight + 1) + "px; } .index.pagination-sticky-bottom body, .index.pagination-bottom body { padding-bottom: " + (pageHeight + 1) + "px; }" : ''); - }, - color: (function() { - var calcRGB, colorToHex, minmax; - - minmax = function(base) { - if (base < 0) { - return 0; - } else if (base > 255) { - return 255; - } else { - return base; - } - }; - - calcRGB = function(value) { - var hex; - hex = parseInt(value, 16); - return [(hex >> 16) & 0xFF, (hex >> 8) & 0xFF, hex & 0xFF]; - }; - - colorToHex = function(color) { - var b, digits, hex, r; - if (color.substr(0, 1) === '#') { - if (color.length !== 4) { - return color.slice(1); - } else { - r = color.substr(1, 1); - g = color.substr(2, 1); - b = color.substr(3, 1); - return [r, r, g, g, b, b].join(""); - } - } - if (/[0-9a-f]{3}/i.test(color)) { - if (/[0-9a-f]{6}/i.test(color)) { - return color; - } - r = color.substr(0, 1); - g = color.substr(1, 1); - b = color.substr(2, 1); - return [r, r, g, g, b, b].join(""); - } - if (digits = color.match(/(.*?)rgba?\((\d+), ?(\d+), ?(\d+)(.*?)\)/)) { - hex = ((parseInt(digits[2], 10) << 16) | (parseInt(digits[3], 10) << 8) | (parseInt(digits[4], 10))).toString(16); - while (hex.length < 6) { - hex = "0" + hex; - } - return hex; - } else { - return "000000"; - } - }; - - function _Class(value) { - this.raw = colorToHex(value); - } - - _Class.prototype.hex = function() { - return "#" + this.raw; - }; - - _Class.prototype.privateRGB = function() { - return calc_rgb(this.raw); - }; - - _Class.prototype.rgb = function() { - return this.privateRGB().join(""); - }; - - _Class.prototype.hover = function() { - return this.shiftRGB(16, true); - }; - - _Class.prototype.isLight = function() { - return (this.privateRGB[0] * 0.299 + this.privateRGB[1] * 0.587 + this.privateRGB[2] * 0.114) > 125; - }; - - _Class.prototype.shiftRGB = function(shift, smart) { - var color; - if (smart) { - shift = (this.isLight ? -1 : 1) * Math.abs(shift); - } - return ((function() { - var _i, _len, _ref, _results; - _ref = this.privateRGB; - _results = []; - for (_i = 0, _len = _ref.length; _i < _len; _i++) { - color = _ref[_i]; - _results.push(minmax(color + shift)); - } - return _results; - }).call(this)).join(","); - }; - - return _Class; - - })() + } }; /* - Style.color adapted from 4chan Style Script + Color adapted from 4chan Style Script */ @@ -13502,7 +13407,7 @@ input.className = "colorfield"; colorInput = $.el('input', { className: 'color', - value: "#" + ((new Style.color(input.value)).hex()) + value: "#" + ((new Color(input.value)).hex()) }); JSColor.bind(colorInput); $.after(input, colorInput); @@ -13557,7 +13462,7 @@ return alert("Syntax error on " + this.name + "."); } if (this.className === "colorfield") { - this.nextSibling.value = (new Style.color(this.value)).hex(); + this.nextSibling.value = (new Color(this.value)).hex(); this.nextSibling.color.importColor(); } editTheme[this.name] = this.value; @@ -13723,6 +13628,108 @@ } }; + Color = (function() { + var calcRGB, colorToHex, minmax, shortToLong; + + minmax = function(base) { + if (base < 0) { + return 0; + } else if (base > 255) { + return 255; + } else { + return base; + } + }; + + calcRGB = function(value) { + var hex; + hex = parseInt(value, 16); + return [(hex >> 16) & 0xFF, (hex >> 8) & 0xFF, hex & 0xFF]; + }; + + shortToLong = function(hex) { + var i, longHex; + longHex = []; + i = 0; + while (i < 3) { + longHex.push(hex.substr(i, 1)); + i = Math.floor(longHex.length / 2); + } + return longHex.join(""); + }; + + colorToHex = function(color) { + var digits, hex; + if (color.substr(0, 1) === '#') { + if (color.length !== 4) { + return color.slice(1); + } else { + return shortToLong(color.substr(1, 3)); + } + } + if (/[0-9a-f]{3}/i.test(color)) { + if (color.length === 6) { + return color; + } else { + return shortToLong(color); + } + } + if (digits = color.match(/(.*?)rgba?\((\d+), ?(\d+), ?(\d+)(.*?)\)/)) { + hex = ((parseInt(digits[2], 10) << 16) | (parseInt(digits[3], 10) << 8) | (parseInt(digits[4], 10))).toString(16); + while (hex.length < 6) { + hex = "0" + hex; + } + return hex; + } else { + return "000000"; + } + }; + + function Color(value) { + this.raw = colorToHex(value); + } + + Color.prototype.hex = function() { + return "#" + this.raw; + }; + + Color.prototype.privateRGB = function() { + return calc_rgb(this.raw); + }; + + Color.prototype.rgb = function() { + return this.privateRGB().join(""); + }; + + Color.prototype.hover = function() { + return this.shiftRGB(16, true); + }; + + Color.prototype.isLight = function() { + return (this.privateRGB[0] * 0.299 + this.privateRGB[1] * 0.587 + this.privateRGB[2] * 0.114) > 125; + }; + + Color.prototype.shiftRGB = function(shift, smart) { + var color; + if (smart) { + shift = (this.isLight ? -1 : 1) * Math.abs(shift); + } + return ((function() { + var _i, _len, _ref, _results; + _ref = this.privateRGB; + _results = []; + for (_i = 0, _len = _ref.length; _i < _len; _i++) { + color = _ref[_i]; + _results.push(minmax(color + shift)); + } + return _results; + }).call(this)).join(","); + }; + + return Color; + + })(); + PSAHiding = { init: function() { if (!Conf['Announcement Hiding']) { diff --git a/src/General/css/theme.css b/src/General/css/theme.css index 526854c73..5c5b853c3 100644 --- a/src/General/css/theme.css +++ b/src/General/css/theme.css @@ -383,7 +383,7 @@ a .name { } .fourchan-banner-at-sidebar-top.icon-orientation-vertical.fourchan-ss-sidebar body::after, .fourchan-banner-at-sidebar-top.fourchan-ss-sidebar body::before { - background: rgba(#{if background = new Style.color theme["Reply Background"] then background.shiftRGB -18}, 0.8); + background: rgba(#{if background = new Color theme["Reply Background"] then background.shiftRGB -18}, 0.8); } .fourchan-ss-sidebar.sidebar-location-right body::before { border-left: 2px solid #{backgroundC}; diff --git a/src/Theming/Mascots.coffee b/src/Theming/Mascots.coffee index d839774f4..fc54d0bb4 100644 --- a/src/Theming/Mascots.coffee +++ b/src/Theming/Mascots.coffee @@ -50,7 +50,7 @@ MascotTools = height: 100 ctx = el.getContext('2d') ctx.font = "50px #{Conf['Font']}" - ctx.fillStyle = (new Style.color (Themes[Conf['theme']] or Themes['Yotsuba B'])['Text']).hex() + ctx.fillStyle = (new Color (Themes[Conf['theme']] or Themes['Yotsuba B'])['Text']).hex() ctx.textAlign = 'center' ctx.textBaseline = 'middle' ctx.fillText "Mascot 404", 124, 50 diff --git a/src/Theming/Style.coffee b/src/Theming/Style.coffee index 1e69a4a6e..a63fcf325 100644 --- a/src/Theming/Style.coffee +++ b/src/Theming/Style.coffee @@ -110,7 +110,7 @@ Style = colors = [] rgb = ['r', 'g', 'b'] for arg in arguments - hex = (new Style.color arg).raw + hex = (new Color arg).raw color = {} i = 0 while val = rgb[i] @@ -149,8 +149,8 @@ Style = """<%= grunt.file.read('src/General/css/dynamic.css').replace(/\s+/g, ' ').trim() %>""" theme: (theme) -> - bgColor = new Style.color backgroundC = theme["Background Color"] - replybg = new Style.color theme["Reply Background"] + bgColor = new Color backgroundC = theme["Background Color"] + replybg = new Color theme["Reply Background"] replyRGB = "rgb(#{replybg.shiftRGB parseInt(Conf['Silhouette Contrast'], 10), true})" Style.lightTheme = bgColor.isLight() @@ -205,61 +205,4 @@ Style = Style.sheets.padding.textContent = """<%= grunt.file.read('src/General/css/padding.nav.css').replace(/\s+/g, ' ').trim() %> """ + if pageHeight """<%= grunt.file.read('src/General/css/padding.pages.css').replace(/\s+/g, ' ').trim() %>""" - else '' - - color: class - minmax = (base) -> if base < 0 then 0 else if base > 255 then 255 else base - - calcRGB = (value) -> - hex = parseInt value, 16 - return [ # 0xRRGGBB to [R, G, B] - (hex >> 16) & 0xFF - (hex >> 8) & 0xFF - hex & 0xFF - ] - - colorToHex = (color) -> - if color.substr(0, 1) is '#' - if color.length isnt 4 - return color[1..] - else - r = color.substr(1, 1) - g = color.substr(2, 1) - b = color.substr(3, 1) - return [r,r,g,g,b,b].join "" - - if /[0-9a-f]{3}/i.test color - return color if /[0-9a-f]{6}/i.test color - - r = color.substr(0, 1) - g = color.substr(1, 1) - b = color.substr(2, 1) - return [r,r,g,g,b,b].join "" - - if digits = color.match /(.*?)rgba?\((\d+), ?(\d+), ?(\d+)(.*?)\)/ - # [R, G, B] to 0xRRGGBB - hex = ( - (parseInt(digits[2], 10) << 16) | - (parseInt(digits[3], 10) << 8) | - (parseInt(digits[4], 10)) - ).toString 16 - - while hex.length < 6 - hex = "0#{hex}" - return hex - - else - "000000" - - constructor: (value) -> - @raw = colorToHex value - - hex: -> "#" + @raw - privateRGB: -> calc_rgb @raw - rgb: -> @privateRGB().join "" - hover: -> @shiftRGB 16, true - isLight: -> (@privateRGB[0] * 0.299 + @privateRGB[1] * 0.587 + @privateRGB[2] * 0.114) > 125 - - shiftRGB: (shift, smart) -> - shift = (if @isLight then -1 else 1) * Math.abs shift if smart - return (minmax color + shift for color in @privateRGB).join "," \ No newline at end of file + else '' \ No newline at end of file diff --git a/src/Theming/Themes.coffee b/src/Theming/Themes.coffee index 32063f7ae..6ff5ba166 100644 --- a/src/Theming/Themes.coffee +++ b/src/Theming/Themes.coffee @@ -1,5 +1,5 @@ ### - Style.color adapted from 4chan Style Script + Color adapted from 4chan Style Script ### ThemeTools = @@ -140,7 +140,7 @@ ThemeTools = colorInput = $.el 'input', className: 'color' - value: "##{(new Style.color input.value).hex()}" + value: "##{(new Color input.value).hex()}" JSColor.bind colorInput @@ -190,7 +190,7 @@ ThemeTools = return alert "Syntax error on #{@name}." if @className is "colorfield" - @nextSibling.value = (new Style.color @value).hex() + @nextSibling.value = (new Color @value).hex() @nextSibling.color.importColor() editTheme[@name] = @value diff --git a/src/Theming/color.coffee b/src/Theming/color.coffee new file mode 100644 index 000000000..61a9f016e --- /dev/null +++ b/src/Theming/color.coffee @@ -0,0 +1,56 @@ +class Color + minmax = (base) -> if base < 0 then 0 else if base > 255 then 255 else base + + calcRGB = (value) -> + hex = parseInt value, 16 + return [ # 0xRRGGBB to [R, G, B] + (hex >> 16) & 0xFF + (hex >> 8) & 0xFF + hex & 0xFF + ] + + shortToLong = (hex) -> + longHex = [] + i = 0 + while i < 3 + longHex.push hex.substr i, 1 + i = Math.floor longHex.length / 2 + return longHex.join "" + + colorToHex = (color) -> + if color.substr(0, 1) is '#' + if color.length isnt 4 + return color[1..] + else + return shortToLong color.substr(1, 3) + + if /[0-9a-f]{3}/i.test color + return if color.length is 6 then color else shortToLong color + + if digits = color.match /(.*?)rgba?\((\d+), ?(\d+), ?(\d+)(.*?)\)/ + # [R, G, B] to 0xRRGGBB + hex = ( + (parseInt(digits[2], 10) << 16) | + (parseInt(digits[3], 10) << 8) | + (parseInt(digits[4], 10)) + ).toString 16 + + while hex.length < 6 + hex = "0#{hex}" + return hex + + else + "000000" + + constructor: (value) -> + @raw = colorToHex value + + hex: -> "#" + @raw + privateRGB: -> calc_rgb @raw + rgb: -> @privateRGB().join "" + hover: -> @shiftRGB 16, true + isLight: -> (@privateRGB[0] * 0.299 + @privateRGB[1] * 0.587 + @privateRGB[2] * 0.114) > 125 + + shiftRGB: (shift, smart) -> + shift = (if @isLight then -1 else 1) * Math.abs shift if smart + return (minmax color + shift for color in @privateRGB).join "," \ No newline at end of file