diff --git a/CHANGELOG.md b/CHANGELOG.md index e513fbdf3..7fda2847a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,21 @@ +<<<<<<< HEAD ### v2.3.3 *2013-08-16* +======= +**seaweedchan**: + +![Board title editing in action](src/General/img/changelog/1.2.31.png) + +- Ported `Custom Board Titles` feature from Appchan X (with Zixaphir) + - This allows you to edit the board title and subtitle in real-time by ctrl+clicking them +- Ported ability to change to a new random banner image on click from Appchan X + +**Zixaphir**: +- Small linkifier fix + +### v1.2.30 +*2013-08-15* +>>>>>>> v3 **seaweedchan**: - Fix Color User IDs diff --git a/builds/appchan-x.user.js b/builds/appchan-x.user.js index 3f6f91821..ddd4699bc 100644 --- a/builds/appchan-x.user.js +++ b/builds/appchan-x.user.js @@ -11055,100 +11055,104 @@ }); }, ready: function() { - var banner, child, children, i, nodes, title; + var banner, child, children, i, title; banner = $(".boardBanner"); title = $.el("div", { id: "boardTitle" }); children = banner.children; - i = children.length; - nodes = []; - while (i--) { - child = children[i]; - if (child.tagName.toLowerCase() === "img") { + i = 0; + while (child = children[i++]) { + if (i === 1) { child.id = "Banner"; + child.title = "Click to change"; $.on(child, 'click', Banner.cb.toggle); continue; } if (Conf['Custom Board Titles']) { - Banner.custom(child); + Banner.custom(child).title = "Ctrl+click to edit board " + (i === 3 ? 'sub' : '') + "title"; } - nodes.push(child); } - $.add(title, nodes.reverse()); + $.add(title, [children[1], children[2]]); $.after(banner, title); }, - types: { - jpg: 227, - png: 270, - gif: 253 - }, cb: { toggle: function() { - var num, type; + var num, type, types; - type = ['jpg', 'png', 'gif'][Math.floor(3 * Math.random())]; - num = Math.floor(Banner.types[type] * Math.random()); + types = { + jpg: 227, + png: 270, + gif: 253 + }; + type = Object.keys(types)[Math.floor(3 * Math.random())]; + num = Math.floor(types[type] * Math.random()); return this.src = "//static.4chan.org/image/title/" + num + "." + type; }, click: function(e) { - if (e.shiftKey) { - return this.contentEditable = true; + if (e.ctrlKey) { + this.contentEditable = true; + return this.focus(); } }, keydown: function(e) { - return e.stopPropagation(); + e.stopPropagation(); + if (!e.shiftKey && e.keyCode === 13) { + return this.blur(); + } }, focus: function() { - var items, string; + var items, string, string2; + this.textContent = this.innerHTML; string = "" + g.BOARD + "." + this.className; + string2 = "" + string + ".orig"; items = { title: this.innerHTML }; - items["" + string] = ''; - items["" + string + ".orig"] = false; + items[string] = ''; + items[string2] = false; $.get(items, function(items) { - if (!(items["" + string + ".orig"] && items.title === items["" + string])) { - return $.set("" + string + ".orig", items.title); + if (!(items[string2] && items.title === items[string])) { + return $.set(string2, items.title); } }); - return this.textContent = this.innerHTML; }, blur: function() { - $.set("" + g.BOARD + "." + this.className, this.textContent); this.innerHTML = this.textContent; - return this.contentEditable = false; + this.contentEditable = false; + return $.set("" + g.BOARD + "." + this.className, this.textContent); } }, custom: function(child) { - var cachedTest; + var cachedTest, string; cachedTest = child.innerHTML; - $.get("" + g.BOARD + "." + child.className, cachedTest, function(item) { - var title; + string = "" + g.BOARD + "." + child.className; + $.on(child, 'click keydown focus blur', function(e) { + return Banner.cb[e.type].apply(this, [e]); + }); + $.get(string, cachedTest, function(item) { + var string2, title; - if (!(title = item["" + g.BOARD + "." + child.className])) { + if (!(title = item[string])) { return; } if (Conf['Persistent Custom Board Titles']) { return child.innerHTML = title; - } else { - return $.get("" + g.BOARD + "." + child.className + ".orig", cachedTest, function(itemb) { - if (cachedTest === itemb["" + g.BOARD + "." + child.className + ".orig"]) { - return child.innerHTML = title; - } else { - $.set("" + g.BOARD + "." + child.className, cachedTest); - return $.set("" + g.BOARD + "." + child.className + ".orig", cachedTest); - } - }); } + string2 = "" + string + ".orig"; + return $.get(string2, cachedTest, function(itemb) { + if (cachedTest === itemb[string2]) { + return child.innerHTML = title; + } else { + $.set(string, cachedTest); + return $.set(string2, cachedTest); + } + }); }); - $.on(child, 'click', Banner.cb.click); - $.on(child, 'keydown', Banner.cb.keydown); - $.on(child, 'focus', Banner.cb.focus); - return $.on(child, 'blur', Banner.cb.blur); + return child; } }; diff --git a/builds/crx/script.js b/builds/crx/script.js index d359048b7..52828e016 100644 --- a/builds/crx/script.js +++ b/builds/crx/script.js @@ -11047,100 +11047,104 @@ }); }, ready: function() { - var banner, child, children, i, nodes, title; + var banner, child, children, i, title; banner = $(".boardBanner"); title = $.el("div", { id: "boardTitle" }); children = banner.children; - i = children.length; - nodes = []; - while (i--) { - child = children[i]; - if (child.tagName.toLowerCase() === "img") { + i = 0; + while (child = children[i++]) { + if (i === 1) { child.id = "Banner"; + child.title = "Click to change"; $.on(child, 'click', Banner.cb.toggle); continue; } if (Conf['Custom Board Titles']) { - Banner.custom(child); + Banner.custom(child).title = "Ctrl+click to edit board " + (i === 3 ? 'sub' : '') + "title"; } - nodes.push(child); } - $.add(title, nodes.reverse()); + $.add(title, [children[1], children[2]]); $.after(banner, title); }, - types: { - jpg: 227, - png: 270, - gif: 253 - }, cb: { toggle: function() { - var num, type; + var num, type, types; - type = ['jpg', 'png', 'gif'][Math.floor(3 * Math.random())]; - num = Math.floor(Banner.types[type] * Math.random()); + types = { + jpg: 227, + png: 270, + gif: 253 + }; + type = Object.keys(types)[Math.floor(3 * Math.random())]; + num = Math.floor(types[type] * Math.random()); return this.src = "//static.4chan.org/image/title/" + num + "." + type; }, click: function(e) { - if (e.shiftKey) { - return this.contentEditable = true; + if (e.ctrlKey) { + this.contentEditable = true; + return this.focus(); } }, keydown: function(e) { - return e.stopPropagation(); + e.stopPropagation(); + if (!e.shiftKey && e.keyCode === 13) { + return this.blur(); + } }, focus: function() { - var items, string; + var items, string, string2; + this.textContent = this.innerHTML; string = "" + g.BOARD + "." + this.className; + string2 = "" + string + ".orig"; items = { title: this.innerHTML }; - items["" + string] = ''; - items["" + string + ".orig"] = false; + items[string] = ''; + items[string2] = false; $.get(items, function(items) { - if (!(items["" + string + ".orig"] && items.title === items["" + string])) { - return $.set("" + string + ".orig", items.title); + if (!(items[string2] && items.title === items[string])) { + return $.set(string2, items.title); } }); - return this.textContent = this.innerHTML; }, blur: function() { - $.set("" + g.BOARD + "." + this.className, this.textContent); this.innerHTML = this.textContent; - return this.contentEditable = false; + this.contentEditable = false; + return $.set("" + g.BOARD + "." + this.className, this.textContent); } }, custom: function(child) { - var cachedTest; + var cachedTest, string; cachedTest = child.innerHTML; - $.get("" + g.BOARD + "." + child.className, cachedTest, function(item) { - var title; + string = "" + g.BOARD + "." + child.className; + $.on(child, 'click keydown focus blur', function(e) { + return Banner.cb[e.type].apply(this, [e]); + }); + $.get(string, cachedTest, function(item) { + var string2, title; - if (!(title = item["" + g.BOARD + "." + child.className])) { + if (!(title = item[string])) { return; } if (Conf['Persistent Custom Board Titles']) { return child.innerHTML = title; - } else { - return $.get("" + g.BOARD + "." + child.className + ".orig", cachedTest, function(itemb) { - if (cachedTest === itemb["" + g.BOARD + "." + child.className + ".orig"]) { - return child.innerHTML = title; - } else { - $.set("" + g.BOARD + "." + child.className, cachedTest); - return $.set("" + g.BOARD + "." + child.className + ".orig", cachedTest); - } - }); } + string2 = "" + string + ".orig"; + return $.get(string2, cachedTest, function(itemb) { + if (cachedTest === itemb[string2]) { + return child.innerHTML = title; + } else { + $.set(string, cachedTest); + return $.set(string2, cachedTest); + } + }); }); - $.on(child, 'click', Banner.cb.click); - $.on(child, 'keydown', Banner.cb.keydown); - $.on(child, 'focus', Banner.cb.focus); - return $.on(child, 'blur', Banner.cb.blur); + return child; } }; diff --git a/src/General/css/style.css b/src/General/css/style.css new file mode 100755 index 000000000..06dc2c085 --- /dev/null +++ b/src/General/css/style.css @@ -0,0 +1,1070 @@ +/* General */ +.dialog { + box-shadow: 0 1px 2px rgba(0, 0, 0, .15); + border: 1px solid; + display: block; + padding: 0; +} +.captcha-img, +.field { + background-color: #FFF; + border: 1px solid #CCC; + -moz-box-sizing: border-box; + box-sizing: border-box; + color: #333; + font: 13px sans-serif; + outline: none; + transition: color .25s, border-color .25s; + transition: color .25s, border-color .25s; +} +.field::-moz-placeholder, +.field:hover::-moz-placeholder { + color: #AAA !important; + font-size: 13px !important; + opacity: 1.0 !important; +} +.captch-img:hover, +.field:hover { + border-color: #999; +} +.field:hover, .field:focus { + color: #000; +} +.field[disabled] { + background-color: #F2F2F2; + color: #888; +} +.move { + cursor: move; + overflow: hidden; +} +label, +.watch-thread-link { + cursor: pointer; +} +a[href="javascript:;"] { + text-decoration: none; +} +.warning { + color: red; +} +#boardNavDesktop { + display: none !important; +} +a { + outline: none !important; +} + +/* 4chan style fixes */ +.opContainer, .op { + display: block !important; + overflow: visible !important; +} +[hidden] { + display: none !important; +} + +/* fixed, z-index */ +#overlay, +#fourchanx-settings, +#qp, #ihover, +#navlinks, .fixed #header-bar, +:root.float #updater, +:root.float #thread-stats, +#qr { + position: fixed; +} +#fourchanx-settings { + z-index: 999; +} +#overlay { + z-index: 900; +} +#notifications { + z-index: 70; +} +#qp, #ihover { + z-index: 60; +} +#menu { + z-index: 50; +} +#navlinks, #updater, #thread-stats { + z-index: 40; +} +.fixed #header-bar.autohide { + z-index: 35; +} +#qr { + z-index: 30; +} +#thread-watcher { + z-index: 8; +} +:root.fixed-watcher #thread-watcher { + z-index: 20; +} +.fixed #header-bar { + z-index: 10; +} +/* Header */ +.fixed.top body { + padding-top: 2em; +} +.fixed.bottom body { + padding-bottom: 2em; +} +.fixed #header-bar { + right: 0; + left: 0; + padding: 3px 4px 4px; +} +.fixed.top #header-bar { + top: 0; +} +.fixed.bottom #header-bar { + bottom: 0; +} +#header-bar { + border-width: 0; + transition: all .1s .05s ease-in-out; +} +:root.centered-links #shortcuts { + width: 300px; + text-align: right; +} +:root.centered-links #header-bar { + text-align: center; +} +:root.centered-links #custom-board-list { + position: relative; + left: 150px; +} +.fixed.top #header-bar { + border-bottom-width: 1px; +} +.fixed.bottom #header-bar { + box-shadow: 0 -1px 2px rgba(0, 0, 0, .15); + border-top-width: 1px; +} +.fixed.bottom #header-bar .menu-button i { + border-top: none; + border-bottom: 6px solid; +} +#board-list { + text-align: center; +} +.fixed #header-bar.autohide:not(:hover) { + box-shadow: none; + transition: all .8s .6s cubic-bezier(.55, .055, .675, .19); +} +.fixed.top #header-bar.autohide:not(:hover) { + margin-bottom: -1em; + -webkit-transform: translateY(-100%); + transform: translateY(-100%); +} +.fixed.bottom #header-bar.autohide:not(:hover) { + -webkit-transform: translateY(100%); + transform: translateY(100%); +} +#scroll-marker { + left: 0; + right: 0; + height: 10px; + position: absolute; +} +:root:not(.autohide) #scroll-marker { + pointer-events: none; +} +#header-bar #scroll-marker { + display: none; +} +.fixed #header-bar #scroll-marker { + display: block; +} +.fixed.top #header-bar #scroll-marker { + top: 100%; +} +.fixed.bottom #header-bar #scroll-marker { + bottom: 100%; +} +#header-bar a:not(.entry):not(.close) { + text-decoration: none; + padding: 1px; +} +#header-bar input { + margin: 0; + vertical-align: bottom; +} +#shortcuts:empty { + display: none; +} +.brackets-wrap::before { + content: "\\00a0["; +} +.brackets-wrap::after { + content: "]\\00a0"; +} +.dead-thread, +.disabled, +.expand-all-shortcut { + opacity: .45; +} +#shortcuts { + float: right; +} +.shortcut { + margin-left: 3px; +} +#navbotright, +#navtopright { + display: none; +} +#toggleMsgBtn { + display: none !important; +} +.current { + font-weight: bold; +} +/* 4chan X link brackets */ +.brackets-wrap::after { + content: "]"; +} +.brackets-wrap::before { + content: "["; +} +/* Notifications */ +#notifications { + position: fixed; + top: 0; + height: 0; + text-align: center; + right: 0; + left: 0; + transition: all .8s .6s cubic-bezier(.55, .055, .675, .19); +} +.fixed.top #header-bar #notifications { + position: absolute; + top: 100%; +} +.notification { + color: #FFF; + font-weight: 700; + text-shadow: 0 1px 2px rgba(0, 0, 0, .5); + box-shadow: 0 1px 2px rgba(0, 0, 0, .15); + border-radius: 2px; + margin: 1px auto; + width: 500px; + max-width: 100%; + position: relative; + transition: all .25s ease-in-out; +} +.notification.error { + background-color: hsla(0, 100%, 38%, .9); +} +.notification.warning { + background-color: hsla(36, 100%, 38%, .9); +} +.notification.info { + background-color: hsla(200, 100%, 38%, .9); +} +.notification.success { + background-color: hsla(104, 100%, 38%, .9); +} +.notification a { + color: white; +} +.notification > .close { + padding: 6px; + top: 0; + right: 5px; + position: absolute; +} +.message { + -moz-box-sizing: border-box; + box-sizing: border-box; + padding: 6px 20px; + max-height: 200px; + width: 100%; + overflow: auto; +} + +/* Settings */ +:root.fourchan-x body { + -moz-box-sizing: border-box; + box-sizing: border-box; +} +#overlay { + background-color: rgba(0, 0, 0, .5); + top: 0; + left: 0; + height: 100%; + width: 100%; +} +#fourchanx-settings { + -moz-box-sizing: border-box; + box-sizing: border-box; + box-shadow: 0 0 15px rgba(0, 0, 0, .15); + height: 600px; + max-height: 100%; + width: 900px; + max-width: 100%; + margin: auto; + padding: 3px; + top: 50%; + left: 50%; + -moz-transform: translate(-50%, -50%); + -webkit-transform: translate(-50%, -50%); + transform: translate(-50%, -50%); +} +#fourchanx-settings > nav { + padding: 2px 2px 0; + height: 15px; +} +#fourchanx-settings > nav a { + text-decoration: underline; +} +#fourchanx-settings > nav a.close { + text-decoration: none; + padding: 2px; +} +.section-container { + overflow: auto; + position: absolute; + top: 2.1em; + right: 5px; + bottom: 5px; + left: 5px; + padding-right: 5px; +} +.sections-list { + padding: 0 3px; + float: left; +} +.credits { + float: right; +} +.tab-selected { + font-weight: 700; +} +.section-sauce ul, +.section-advanced ul { + list-style: none; + margin: 0; +} +.section-sauce ul { + padding: 8px; +} +.section-advanced ul { + padding: 0px; +} +.section-sauce li, +.section-advanced li { + padding-left: 4px; +} +.section-main label { + text-decoration: underline; +} +.section-filter ul { + padding: 0; +} +.section-filter li { + margin: 10px 40px; +} +.section-filter textarea { + height: 500px; +} +.section-sauce textarea { + height: 350px; +} +.section-advanced .field[name="boardnav"] { + width: 100%; +} +.section-advanced textarea { + height: 150px; +} +.section-advanced .archive-cell { + min-width: 160px; + text-align: center; +} +.section-advanced #archive-board-select { + position: absolute; +} +.section-advanced .note { + font-size: 0.8em; + font-style: italic; + margin-left: 10px; +} +.section-advanced .note code { + font-style: normal; + font-size: 11px; +} +.section-keybinds .field { + font-family: monospace; +} +#fourchanx-settings fieldset { + border: 1px solid; + border-radius: 3px; +} +#fourchanx-settings legend { + font-weight: 700; +} +#fourchanx-settings textarea { + font-family: monospace; + min-width: 100%; + max-width: 100%; +} +#fourchanx-settings code { + color: #000; + background-color: #FFF; + padding: 0 2px; +} +.unscroll { + overflow: hidden; +} + +/* Announcement Hiding */ +:root.hide-announcement #globalMessage { + display: none; +} +a.hide-announcement { + float: left; +} + +/* Unread */ +#unread-line { + margin: 0; + border-color: rgb(255,0,0); +} + +/* Thread Updater */ +#updater { + background: none; + border: none; + box-shadow: none; +} +#updater > .move { + padding: 5px 3px 0px; + margin-bottom: -3px; +} +#updater > div:last-child { + text-align: center; +} +#updater input[type=number] { + width: 4em; +} +:root.float #updater { + padding: 0px 3px; +} +.new { + color: limegreen; +} +#update-status.new { + margin-right: 5px; +} +#update-timer { + cursor: pointer; +} + +/* Thread Watcher */ +#thread-watcher { + position: absolute; +} +#thread-watcher { + padding-bottom: 3px; + padding-left: 3px; + overflow: hidden; + white-space: nowrap; + min-width: 136px; + max-height: 92%; + overflow-y: auto; +} +#thread-watcher .menu-button { + bottom: 1px; +} +:root.fixed-watcher #thread-watcher { + position: fixed; +} +:root:not(.fixed-watcher) #thread-watcher:not(:hover) { + max-height: 210px; + overflow-y: hidden; +} +#thread-watcher > .move { + padding-top: 3px; +} +#watched-threads > div { + max-width: 250px; + overflow: hidden; + padding-left: 3px; + padding-right: 3px; + text-overflow: ellipsis; +} +#thread-watcher a { + text-decoration: none; +} +#thread-watcher .move>.close { + position: absolute; + right: 0px; + top: 0px; + padding: 0px 4px; +} +.watch-thread-link { + padding-top: 18px; + width: 18px; + height: 0px; + display: inline-block; + background-repeat: no-repeat; + opacity: 0.2; + position: relative; + top: 1px; +} +.watch-thread-link.watched { + opacity: 1; +} + + +/* Thread Stats */ +#thread-stats { + background: none; + border: none; + box-shadow: none; +} +:root.float #post-count, :root.float #file-count { + pointer-events: none; +} +:root.float #thread-stats { + padding: 0px 3px; +} + +/* Quote */ +.deadlink { + text-decoration: none !important; +} +.backlink.deadlink:not(.forwardlink), +.quotelink.deadlink:not(.forwardlink) { + text-decoration: underline !important; +} +.inlined { + opacity: .5; +} +#qp input, .forwarded { + display: none; +} +.quotelink.forwardlink, +.backlink.forwardlink { + text-decoration: none; + border-bottom: 1px dashed; +} +.filtered { + text-decoration: underline line-through; +} +:root.hide-backlinks .backlink.filtered { + display: none; +} +.inline { + border: 1px solid; + display: table; + margin: 2px 0; +} +.inline .post { + border: 0 !important; + background-color: transparent !important; + display: table !important; + margin: 0 !important; + padding: 1px 2px !important; +} +#qp > .opContainer::after { + content: ''; + clear: both; + display: table; +} +#qp .post { + border: none; + margin: 0; + padding: 2px 2px 5px; +} +#qp img { + max-height: 80vh; + max-width: 50vw; +} +.qphl { + outline: 2px solid rgba(216, 94, 49, .7); +} +:root.highlight-own .yourPost > .reply, +:root.highlight-you .quotesYou > .reply { + border-left: 2px solid rgba(221,0,0,.5); +} +/* Quote Threading */ +.threadContainer { + margin-left: 20px; + border-left: 1px solid rgba(128,128,128,.3); +} +.threadOP { + clear: both; +} + +/* File */ +.fileText:hover .fntrunc, +.fileText:not(:hover) .fnfull, +.expanded-image > .post > .file > .fileThumb > img[data-md5], +:not(.expanded-image) > .post > .file > .fileThumb > .full-image { + display: none; +} +.expanding { + opacity: .5; +} +:root.fit-height .full-image { + max-height: 100vh; +} +:root.fit-width .full-image { + max-width: 100%; +} +:root.gecko.fit-width .full-image { + width: 100%; +} +#ihover { + -moz-box-sizing: border-box; + box-sizing: border-box; + max-height: 100%; + max-width: 75%; + padding-bottom: 16px; +} +.fappeTyme .thread > .noFile, +.fappeTyme .threadContainer > .noFile { + display: none; +} + +/* Index/Reply Navigation */ +#navlinks { + font-size: 16px; + top: 25px; + right: 10px; +} + +/* Filter */ +.opContainer.filter-highlight { + box-shadow: inset 5px 0 rgba(255, 0, 0, .5); +} +.filter-highlight > .reply { + box-shadow: -5px 0 rgba(255, 0, 0, .5); +} + +/* Spoiler text */ +:root.reveal-spoilers s { + color: white !important; +} + +/* Thread & Reply Hiding */ +.hide-thread-button, +.hide-reply-button { + float: left; + margin-right: 2px; +} +.stub ~ * { + display: none !important; +} +.stub input { + display: inline-block; +} + +/* QR */ +:root.hide-original-post-form #postForm, +:root.hide-original-post-form .postingMode, +:root.hide-original-post-form #togglePostForm, +#qr.autohide:not(.has-focus):not(:hover) > form, +.postingMode ~ #qr select, +#file-n-submit:not(.has-file) #qr-filerm { + display: none; +} +#qr select, +#dump-button, +.remove, +.captcha-img { + cursor: pointer; +} +#qr { + z-index: 20; + position: fixed; + padding: 1px; + border: 1px solid transparent; + min-width: 300px; + border-radius: 3px 3px 0 0; +} +#qrtab { + border-radius: 3px 3px 0 0; +} +#qrtab { + margin-bottom: 1px; +} +#qr .close { + float: right; + padding: 0 3px; +} +#qr .warning { + min-height: 1.6em; + vertical-align: middle; + padding: 0 1px; + border-width: 1px; + border-style: solid; +} +.qr-link-container { + text-align: center; +} +.persona { + width: 248px; + max-width: 100%; + min-width: 100%; +} +#dump-button { + width: 10%; + margin: 0; + margin-right: 4px; + font: 13px sans-serif; + padding: 1px 0px 2px; + opacity: 0.6; +} +.persona .field:not(#dump) { + width: 95px; + min-width: 33.3%; + max-width: 33.3%; +} +#qr textarea.field { + height: 14.8em; + min-height: 9em; +} +#qr.has-captcha textarea.field { + height: 9em; +} +input.field.tripped:not(:hover):not(:focus) { + color: transparent !important; + text-shadow: none !important; +} +#qr textarea { + resize: both; +} +.captcha-img { + margin: 0px; + text-align: center; + background-image: #fff; + font-size: 0px; + min-height: 59px; + min-width: 302px; +} +.captcha-input { + width: 100%; + margin: 1px 0 0; +} +.captcha-input.error:focus { + border-color: rgb(255,0,0) !important; +} +.field { + -moz-box-sizing: border-box; + margin: 0px; + padding: 2px 4px 3px; +} +#qr textarea { + min-width: 100%; +} +#qr [type='submit'] { + width: 25%; + vertical-align: top; +} +:root.webkit #qr [type='submit'] { + height: 24px; +} +/* Fake File Input */ +#qr-filename, +.has-file #qr-no-file { + display: none; +} +#qr-no-file, +.has-file #qr-filename { + display: inline-block; + padding: 0px 4px; + margin-bottom: 2px; + overflow: hidden; + text-overflow: ellipsis; + max-width: 88%; +} +#qr-no-file { + color: #AAA; +} +#qr-filename-container { + -moz-box-sizing: border-box; + display: inline-block; + position: relative; + width: 100px; + min-width: 74.6%; + max-width: 74.6%; + margin-right: 0.4%; + margin-top: 1px; + overflow: hidden; + padding: 2px 1px 0; + height: 22px; +} +#qr-filename-container:hover { + cursor: text; +} +#qr-extras-container { + position: absolute; + right: 0px; +} +#qr-filerm { + margin-right: 2px; + z-index: 2; +} +#file-n-submit { + height: 23px; +} +#qr input[type=file] { + visibility: hidden; + position: absolute; +} +/* Thread Select / Spoiler Label */ +#qr select { + float: right; +} +#qr.has-spoiler .has-file #qr-spoiler-label { + width: 6.7%; + min-width: 6.7%; + max-width: 6.7%; + display: inline-block; + text-align: center; + vertical-align: top; +} +#qr.has-spoiler #file-n-submit:not(.has-file) #qr-spoiler-label { + display: none; +} +#qr.has-spoiler .has-file #qr-filename-container { + max-width: 67.9%; + min-width: 67.9%; +} +#qr-spoiler-label input { + position: relative; + top: 3px; +} +/* Dumping UI */ +.dump #dump-list-container { + display: block; +} +#dump-list-container { + display: none; + position: relative; + overflow-y: hidden; + margin-top: 1px; +} +#dump-list { + overflow-x: auto; + overflow-y: hidden; + white-space: nowrap; + width: 248px; + max-width: 100%; + min-width: 100%; +} +#dump-list:hover { + overflow-x: auto; +} +.qr-preview { + -moz-box-sizing: border-box; + counter-increment: thumbnails; + cursor: move; + display: inline-block; + height: 90px; + width: 90px; + padding: 2px; + opacity: .5; + overflow: hidden; + position: relative; + text-shadow: 0 1px 1px #000; + -moz-transition: opacity .25s ease-in-out; + vertical-align: top; + background-size: cover; +} +.qr-preview:hover, +.qr-preview:focus { + opacity: .9; +} +.qr-preview::before { + content: counter(thumbnails); + color: #fff; + position: absolute; + top: 3px; + right: 3px; + text-shadow: 0 0 3px #000, 0 0 8px #000; +} +.qr-preview#selected { + opacity: 1; +} +.qr-preview.drag { + box-shadow: 0 0 10px rgba(0,0,0,.5); +} +.qr-preview.over { + border-color: #fff; +} +.qr-preview > span { + color: #fff; +} +.remove { + background: none; + color: #e00; + font-weight: 700; + padding: 3px; +} +a:only-of-type > .remove { + display: none; +} +.remove:hover::after { + content: " Remove"; +} +.qr-preview > label { + background: rgba(0,0,0,.5); + color: #fff; + right: 0; + bottom: 0; + left: 0; + position: absolute; + text-align: center; +} +.qr-preview > label > input { + margin: 0; +} +#add-post { + cursor: pointer; + font-size: 2em; + position: absolute; + top: 50%; + right: 10px; + -moz-transform: translateY(-50%); +} +.textarea { + position: relative; +} +:root.webkit .textarea { + margin-bottom: -2px; +} +#char-count { + color: #000; + background: hsla(0, 0%, 100%, .5); + font-size: 8pt; + position: absolute; + bottom: 1px; + right: 1px; + pointer-events: none; +} + +/* Menu */ +.menu-button { + display: inline-block; + position: relative; + cursor: pointer; +} +.menu-button i { + border-top: 6px solid; + border-right: 4px solid transparent; + border-left: 4px solid transparent; + display: inline-block; + margin: 2px; + vertical-align: middle; +} +#menu { + position: fixed; + outline: none; +} +.entry { + border-bottom: 1px solid rgba(0,0,0,.25); + cursor: pointer; + display: block; + outline: none; + padding: 3px 7px; + position: relative; + text-decoration: none; + white-space: nowrap; +} +.left>.entry.has-submenu { + padding-right: 17px !important; +} +.entry:last-child { + border-bottom: 0; +} +.has-submenu::after { + content: ""; + border-left: .5em solid; + border-top: .3em solid transparent; + border-bottom: .3em solid transparent; + display: inline-block; + margin: .3em; + position: absolute; + right: 3px; +} +.left .has-submenu::after { + border-left: 0; + border-right: .5em solid; +} +.submenu { + display: none; + position: absolute; + left: 100%; + top: -1px; +} +.focused .submenu { + display: block; +} +.imp-exp-result { + position: absolute; + text-align: center; + margin: auto; + right: 0px; + left: 0px; + width: 200px; +} +.export, .import { + cursor: pointer; + text-decoration: none !important; +} +/* Custom Board Titles */ +.boardTitle[contenteditable="true"], +.boardSubtitle[contenteditable="true"] { + cursor: text !important; +} + +/* Link Title Favicons */ +.linkify.YouTube { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/youtube.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} +.linkify.Vimeo { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/vimeo.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} +.linkify.SoundCloud { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/soundcloud.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} +.linkify.audio { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/audio.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} +.linkify.LiveLeak { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/liveleak.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} +.linkify.Vocaroo { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/vocaroo.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} +.linkify.pastebin { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/pastebin.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} +.linkify.gist { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/gist.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} +.linkify.image { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/image.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} +.linkify.InstallGentoo { + background: transparent url('data:image/png;base64,<%= grunt.file.read("src/General/img/links/installgentoo.png", {encoding: "base64"}) %>') center left no-repeat!important; + padding-left: 18px; +} diff --git a/src/General/img/changelog/1.2.31.png b/src/General/img/changelog/1.2.31.png new file mode 100644 index 000000000..57ae022b9 Binary files /dev/null and b/src/General/img/changelog/1.2.31.png differ diff --git a/src/Theming/Banner.coffee b/src/Theming/Banner.coffee index a524b4be8..5f4fb5cbf 100644 --- a/src/Theming/Banner.coffee +++ b/src/Theming/Banner.coffee @@ -7,76 +7,86 @@ Banner = banner = $ ".boardBanner" title = $.el "div", id: "boardTitle" - children = banner.children - i = children.length - nodes = [] - while i-- - child = children[i] - if child.tagName.toLowerCase() is "img" - child.id = "Banner" + {children} = banner + + i = 0 + while child = children[i++] + if i is 1 + child.id = "Banner" + child.title = "Click to change" + $.on child, 'click', Banner.cb.toggle + continue if Conf['Custom Board Titles'] - Banner.custom child + Banner.custom(child).title = "Ctrl+click to edit board #{if i is 3 + 'sub' + else + ''}title" - nodes.push child - - $.add title, nodes.reverse() + $.add title, [children[1], children[2]] $.after banner, title return - types: - jpg: 227 - png: 270 - gif: 253 - cb: toggle: -> - type = ['jpg', 'png', 'gif'][Math.floor 3 * Math.random()] - num = Math.floor Banner.types[type] * Math.random() + types = + jpg: 227 + png: 270 + gif: 253 + + type = Object.keys(types)[Math.floor 3 * Math.random()] + num = Math.floor types[type] * Math.random() @src = "//static.4chan.org/image/title/#{num}.#{type}" - + click: (e) -> - if e.shiftKey + if e.ctrlKey @contentEditable = true + @focus() keydown: (e) -> e.stopPropagation() + return @blur() if !e.shiftKey and e.keyCode is 13 focus: -> - string = "#{g.BOARD}.#{@className}" - items = - title: @innerHTML - items["#{string}"] = '' - items["#{string}.orig"] = false - - $.get items, (items) -> - unless items["#{string}.orig"] and items.title is items["#{string}"] - $.set "#{string}.orig", items.title @textContent = @innerHTML + string = "#{g.BOARD}.#{@className}" + string2 = "#{string}.orig" + + items = {title: @innerHTML} + items[string] = '' + items[string2] = false + + $.get items, (items) -> + unless items[string2] and items.title is items[string] + $.set string2, items.title + + return + blur: -> - $.set "#{g.BOARD}.#{@className}", @textContent @innerHTML = @textContent @contentEditable = false + $.set "#{g.BOARD}.#{@className}", @textContent custom: (child) -> cachedTest = child.innerHTML + string = "#{g.BOARD}.#{child.className}" - $.get "#{g.BOARD}.#{child.className}", cachedTest, (item) -> - return unless title = item["#{g.BOARD}.#{child.className}"] - if Conf['Persistent Custom Board Titles'] - child.innerHTML = title - else - $.get "#{g.BOARD}.#{child.className}.orig", cachedTest, (itemb) -> - if cachedTest is itemb["#{g.BOARD}.#{child.className}.orig"] - child.innerHTML = title - else - $.set "#{g.BOARD}.#{child.className}", cachedTest - $.set "#{g.BOARD}.#{child.className}.orig", cachedTest + $.on child, 'click keydown focus blur', (e) -> Banner.cb[e.type].apply @, [e] - $.on child, 'click', Banner.cb.click - $.on child, 'keydown', Banner.cb.keydown - $.on child, 'focus', Banner.cb.focus - $.on child, 'blur', Banner.cb.blur \ No newline at end of file + $.get string, cachedTest, (item) -> + return unless title = item[string] + return child.innerHTML = title if Conf['Persistent Custom Board Titles'] + + string2 = "#{string}.orig" + + $.get string2, cachedTest, (itemb) -> + if cachedTest is itemb[string2] + child.innerHTML = title + else + $.set string, cachedTest + $.set string2, cachedTest + + child \ No newline at end of file