client/posts: add transparency grid

Can be turned off in browsing settings.

client/build.js

@@ -192,8 +192,11 @@ function bundleConfig(config) {
 }
 
 function bundleBinaryAssets() {
-    copyFile('./img/favicon.png', './public/img/favicon.png');
-    copyFile('./img/404.png', './public/img/404.png');
+    glob('./img/*.png', {}, (er, files) => {
+        for (let file of files) {
+            copyFile(file, path.join('./public/img/', path.basename(file)));
+        }
+    });
 }
 
 const config = getConfig();

client/css/posts.styl

@@ -199,6 +199,9 @@ $safety-unsafe = #F3985F
                 background-color: alpha(@background-color, 0.15)
 
 .post-container
+    .post-content.transparency-grid img
+        background: url('/img/transparency_grid.png');
+
     text-align: center
     .post-content
         text-align: left

client/html/settings.tpl

@@ -15,6 +15,9 @@
                     <%= ctx.makeCheckbox({text: 'Enable keyboard shortcuts', id: 'keyboard-shortcuts', name: 'keyboard-shortcuts', checked: ctx.browsingSettings.keyboardShortcuts}) %>
                     <a class='append icon' href='/help/keyboard'><i class='fa fa-question-circle-o'></i></a>
                 </li>
+                <li>
+                    <%= ctx.makeCheckbox({text: 'Enable transparency grid', id: 'transparency-grid', name: 'transparency-grid', checked: ctx.browsingSettings.transparencyGrid}) %>
+                </li>
             </ul>
         </div>
         <div class='messages'></div>

client/js/controls/post_content_control.js

@@ -86,6 +86,9 @@ class PostContentControl {
         const postContentNode = this._template({
             post: this._post,
         });
+        if (settings.getSettings().transparencyGrid) {
+            postContentNode.classList.add('transparency-grid');
+        }
         this._containerNode.appendChild(postContentNode);
         optimizedResize.add(() => this._refreshSize());
         views.monitorNodeRemoval(

client/js/settings.js

@@ -20,6 +20,7 @@ function getSettings(settings) {
         upscaleSmallPosts: false,
         endlessScroll: false,
         keyboardShortcuts: true,
+        transparencyGrid: true,
     };
     let ret = {};
     let userSettings = localStorage.getItem('settings');

client/js/views/settings_view.js

@@ -24,6 +24,8 @@ class SettingsView {
                     form.querySelector('#endless-scroll').checked,
                 keyboardShortcuts:
                     form.querySelector('#keyboard-shortcuts').checked,
+                transparencyGrid:
+                    form.querySelector('#transparency-grid').checked,
             });
         });