Implement a theme and mascot switcher between SFW/NSFW boards

src/General/Index.coffee

@@ -142,13 +142,8 @@ Index =
       Index.buildIndex()
     pageNav: (e) ->
       return if e.shiftKey or e.altKey or e.ctrlKey or e.metaKey or e.button isnt 0
-      switch e.target.nodeName
+      return unless e.target.nodeName is 'A'
-        when 'BUTTON'
+      a = e.target
-          a = e.target.parentNode
-        when 'A'
-          a = e.target
-        else
-          return
       return if a.textContent is 'Catalog'
       e.preventDefault()
       Index.userPageNav +a.pathname.split('/')[2]

src/General/Navigate.coffee

@@ -139,29 +139,21 @@ Navigate =
 
       return if Favicon.SFW is sfw = !!board.ws_board # Board SFW status hasn't changed
 
-      findStyle = ([type, base]) ->
+      g.TYPE = if sfw then 'sfw' else 'nsfw'
-        style = d.cookie.match new RegExp "#{type}\_style\=([^;]+)"
+      if Conf["NSFW/SFW Mascots"]
-        return [(if style then style[1] else base), "#{type}_style"]
+        g.MASCOTSTRING = "Enabled Mascots #{g.TYPE}"
+        MascotTools.toggle()
 
-      style = findStyle if sfw
+      if Conf["NSFW/SFW Themes"]
-        ['ws',  'Yotsuba B New']
+        Conf["theme"] = Conf["theme_#{g.TYPE}"] or if sfw then 'Yotsuba B' else 'Yotsuba'
-      else
+        theme = Themes[Conf['theme']] or Themes[if sfw then 'Yotsuba B' else 'Yotsuba']
-        ['nws', 'Yotsuba New']
+        Style.setTheme theme
-
-      $.globalEval "var style_group = '#{style[1]}'"
-
-      mainStyleSheet = $ 'link[title=switch]',        d.head
-      newStyleSheet  = $ "link[title='#{style[0]}']", d.head
 
       Favicon.SFW = sfw
       Favicon.el.href = "//s.4cdn.org/image/favicon#{if sfw then '-ws' else ''}.ico"
       $.add d.head, Favicon.el # Changing the href alone doesn't update the icon on Firefox
       Favicon.init()
 
-      mainStyleSheet.href = newStyleSheet.href
-
-      Main.setClass()
-
     fullBoardList   = $ '#full-board-list', Header.boardList
     $.rmClass $('.current', fullBoardList), 'current'
     $.addClass $("a[href*='/#{boardID}/']", fullBoardList), 'current'

src/General/Settings.coffee

@@ -778,6 +778,7 @@ Settings =
     style:
       checked: ->
         $.cb.checked.call @
+        return if @name in ['NSFW/SFW Themes', 'NSFW/SFW Mascots']
         hyphenated = @name.toLowerCase().replace(/^4/, 'four').replace /\s+/g, '-'
         (if @checked then $.addClass else $.rmClass) doc, hyphenated
 
@@ -888,7 +889,7 @@ Settings =
           $.set "theme", @id
         Conf['theme'] = @id
         $.addClass @, 'selectedtheme'
-        Style.sheets.theme.textContent = Style.theme Themes[@id]
+        Style.setTheme Themes[@id]
 
       edit: (e) ->
         e.preventDefault()

src/General/css/layout.css

@@ -580,6 +580,7 @@ th {
 .pagination-sticky-bottom.rounded-edges .pagelist {
   border-radius: 3px 3px 0 0;
 }
+.thread .pagelist,
 .pagination-hide .pagelist {
   display: none;
 }

src/General/html/Features/Index-pagelist.html

@@ -1,12 +1,12 @@
 <div class="prev">
   <a>
-    <button disabled>Previous</button>
+    <
   </a>
 </div>
 <div class="pages"></div>
 <div class="next">
   <a>
-    <button disabled>Next</button>
+    >
   </a>
 </div>
 <div class="pages cataloglink">

src/Theming/JSColor.coffee

@@ -59,7 +59,7 @@ JSColor =
         valueElement.previousSibling.value = value
         editTheme[valueElement.previousSibling.name] = value
 
-        setTimeout -> Style.sheets.theme.textContent = Style.theme editTheme
+        setTimeout -> Style.setTheme editTheme
 
       if not (flags & leaveStyle) and styleElement
         styleElement.style.backgroundColor = '#' + @toString()

src/Theming/Mascots.coffee

@@ -32,24 +32,26 @@ MascotTools =
       'rmClass'
     ] doc, 'silhouettize-mascots'
 
-    el = $.el 'img'
+    el  = $.el 'img' # new mascot
-    $.on el, 'error', MascotTools.error
+    img = @el.firstElementChild # old mascot, if any
 
-    el.src = mascot.image
+    unless mascot.image is ''
-
+      $.on el, 'error', MascotTools.error
-    $.off img = @el.firstElementChild, 'error', MascotTools.error
+      el.src = mascot.image
 
+    $.off img, 'error', MascotTools.error
     $.replace img, el
 
     Style.sheets.mascots.textContent = """<%= grunt.file.read('src/General/css/mascot.css') %>"""
 
   error: ->
+    return unless @src
     @src = MascotTools.imageError if MascotTools.imageError
     el = $.el 'canvas',
       width:  248
       height: 100
     ctx = el.getContext('2d')
-    ctx.font         = "50px #{Conf['Font']}"
+    ctx.font         = "40px #{Conf['Font']}"
     ctx.fillStyle    = (new Color (Themes[Conf['theme']] or Themes['Yotsuba B'])['Text']).hex()
     ctx.textAlign    = 'center'
     ctx.textBaseline = 'middle'
@@ -60,7 +62,7 @@ MascotTools =
   toggle: ->
     string  = g.MASCOTSTRING
     enabled = Conf[string]
-    return unless len = enabled.length
+    return MascotTools.change {image: ''} unless len = enabled.length
 
     Conf['mascot'] = name = enabled[i = Math.floor(Math.random() * len)]
 

src/Theming/Style.coffee

@@ -47,26 +47,11 @@ Style =
 
     for title, cat of Config.style
       for name, setting of cat
-        continue if !Conf[name] or setting[2] is 'text'
+        continue if !Conf[name] or setting[2] is 'text' or name in ['NSFW/SFW Themes', 'NSFW/SFW Mascots']
         hyphenated = "#{name}#{if setting[2] then " #{Conf[name]}" else ""}".toLowerCase().replace(/^4/, 'four').replace /\s+/g, '-'
         $.addClass doc, hyphenated
 
-    if g.VIEW is 'index'
+    return
-      pages = (name, text) ->
-        el = $ ".pagelist > .#{name}"
-        elA = $.el 'a',
-          textContent: text
-
-        if (action = el.firstElementChild).nodeName is 'FORM'
-          elA.href = 'javascript:;'
-          $.on elA, 'click', ->
-            action.firstElementChild.click()
-
-        $.add el, elA
-
-      $.asap (-> $ '.mPagelist'), ->
-        pages 'prev', '<'
-        pages 'next', '>'
 
   readyInit: ->
     Style.padding()
@@ -147,6 +132,8 @@ Style =
         right:  0
 
     """<%= grunt.file.read('src/General/css/dynamic.css').replace(/\s+/g, ' ').trim() %>"""
+  
+  setTheme: (theme) -> Style.sheets.theme.textContent  = Style.theme theme
 
   theme: (theme) ->
     bgColor  = new Color backgroundC = theme["Background Color"]

src/Theming/Themes.coffee

@@ -194,7 +194,7 @@ ThemeTools =
       @nextSibling.color.importColor()
 
     editTheme[@name] = @value
-    Style.sheets.theme.textContent = Style.theme editTheme
+    Style.setTheme editTheme
 
   uploadImage: (evt, el) ->
     file = evt.target.files[0]
@@ -347,6 +347,6 @@ ThemeTools =
 
   close: ->
     Conf['editMode'] = false
-    Style.sheets.theme.textContent = Style.theme Themes[Conf['theme']]
+    Style.setTheme Themes[Conf['theme']]
     $.rm $.id 'themeConf'
     Settings.open 'Themes'