Right-click dissuasion

pkg/templates/templates.go

@@ -75,13 +75,9 @@ func (t *Template) Execute(w http.ResponseWriter, r *http.Request, vars map[stri
 	}
 
 	// Reload the template from disk?
-	if stat, err := os.Stat(t.filepath); err == nil {
-		if stat.ModTime().After(t.modified) {
-			log.Info("Template(%s).Execute: file updated on disk, reloading", t.filename)
-			err = t.Reload()
-			if err != nil {
-				log.Error("Reloading error: %s", err)
-			}
+	if t.IsModifiedLocally() {
+		if err := t.Reload(); err != nil {
+			log.Error("Reloading error: %s", err)
 		}
 	}
 
@@ -98,6 +94,23 @@ func (t *Template) Execute(w http.ResponseWriter, r *http.Request, vars map[stri
 	return nil
 }
 
+// IsModifiedLocally checks if any of the template partials of your Template have
+// had their files locally on disk modified, so to know to reload them.
+func (t *Template) IsModifiedLocally() bool {
+	// Check all the template files from base.html, to partials, to our filepath.
+	var files = templates(t.filepath)
+	for _, filename := range files {
+		if stat, err := os.Stat(filename); err == nil {
+			if stat.ModTime().After(t.modified) {
+				log.Info("Template(%s).Execute: file %s updated on disk, reloading", t.filename, filename)
+				return true
+			}
+		}
+	}
+
+	return false
+}
+
 // Reload the template from disk.
 func (t *Template) Reload() error {
 	stat, err := os.Stat(t.filepath)

web/static/js/bulma.js

@@ -12,12 +12,12 @@ document.addEventListener('DOMContentLoaded', () => {
   });
 
   // Hamburger menu script.
-  (function() {
+  (function () {
     // Get all "navbar-burger" elements
     const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
 
     // Add a click event on each of them
-    $navbarBurgers.forEach( el => {
+    $navbarBurgers.forEach(el => {
       el.addEventListener('click', () => {
 
         // Get the target from the "data-target" attribute
@@ -33,7 +33,7 @@ document.addEventListener('DOMContentLoaded', () => {
   })();
 
   // Allow the "More" drop-down to work on mobile (toggle is-active on click instead of requiring mouseover)
-  (function() {
+  (function () {
     const menu = document.querySelector("#navbar-more"),
       userMenu = document.querySelector("#navbar-user"),
       activeClass = "is-active";
@@ -69,9 +69,9 @@ document.addEventListener('DOMContentLoaded', () => {
 
     // Touching a link from the user menu lets it click thru.
     (document.querySelectorAll(".navbar-dropdown") || []).forEach(node => {
-        node.addEventListener("touchstart", (e) => {
-          e.stopPropagation();
-        });
+      node.addEventListener("touchstart", (e) => {
+        e.stopPropagation();
+      });
     });
 
     // Clicking the rest of the body will close an active navbar-dropdown.
@@ -85,7 +85,9 @@ document.addEventListener('DOMContentLoaded', () => {
   // Common event handlers for bulma modals.
   (document.querySelectorAll(".modal-background, .modal-close, .photo-modal") || []).forEach(node => {
     const target = node.closest(".modal");
-    if (target.classList.contains("vue-managed")) return;
+    if (target.classList.contains("vue-managed") || target.classList.contains("nonshy-important-modal")) {
+      return;
+    }
     node.addEventListener("click", () => {
       target.classList.remove("is-active");
     });
@@ -131,21 +133,21 @@ document.addEventListener('DOMContentLoaded', () => {
   // Reveal all blurred images on click.
   (document.querySelectorAll(".blurred-explicit") || []).forEach(node => {
     node.addEventListener("click", e => {
-        if (node.classList.contains("blurred-explicit")) {
-            node.classList.remove("blurred-explicit");
-            if (node.tagName !== "VIDEO") {
-                e.preventDefault();
-                e.stopPropagation();
-            }
+      if (node.classList.contains("blurred-explicit")) {
+        node.classList.remove("blurred-explicit");
+        if (node.tagName !== "VIDEO") {
+          e.preventDefault();
+          e.stopPropagation();
         }
+      }
     });
 
     // Video tag: autoplay is disabled when blurred, onClick doesn't fire,
     // set the handler for onPlay.
     node.addEventListener("play", e => {
-        if (node.classList.contains("blurred-explicit")) {
-            node.classList.remove("blurred-explicit");
-        }
+      if (node.classList.contains("blurred-explicit")) {
+        node.classList.remove("blurred-explicit");
+      }
     });
   });
 });

web/static/js/right-click.js

@@ -0,0 +1,17 @@
+// Right-click button handler, to dissuade downloading.
+document.addEventListener('DOMContentLoaded', () => {
+    const $modal = document.querySelector("#rightclick-modal"),
+        $button = $modal.querySelector("button"),
+        cls = 'is-active';
+
+    console.log("register right clicks");
+    console.log($modal, $button);
+
+    document.addEventListener('contextmenu', (e) => {
+        $modal.classList.add(cls);
+        e.preventDefault();
+    });
+    $button.addEventListener('click', () => {
+        $modal.classList.remove(cls);
+    });
+});

web/templates/base.html

@@ -368,6 +368,42 @@
     <!-- Likes modal -->
     {{template "like-modal"}}
 
+    <!-- Right-click modal -->
+    <div class="modal nonshy-important-modal" id="rightclick-modal">
+        <div class="modal-background"></div>
+        <div class="modal-content">
+            <div class="card">
+                <div class="card-header has-background-warning">
+                    <p class="card-header-title has-text-dark-dark">
+                        <i class="fa fa-info-circle mr-2"></i> Please respect peoples' privacy
+                    </p>
+                </div>
+                <div class="card-content content">
+                    <p>
+                        Please respect our members' privacy and refrain from downloading any pictures from {{PrettyTitle}}.
+                    </p>
+                    <p>
+                        It is <a href="/tos#downloading">against the rules</a> to download a copy of other peoples' photos
+                        from this site. I know that I can't stop you from doing so anyway if you're so determined, but
+                        please consider that many of us don't wish for our pictures to end up reposted somewhere
+                        else on the Internet or seen by people outside of the {{PrettyTitle}} community.
+                    </p>
+
+                    <p>
+                        Thank you for your understanding!
+                    </p>
+                </div>
+                <div class="card-footer has-text-centered">
+                    <div class="card-footer-item">
+                        <button type="button" class="button is-success">
+                            Acknowledge
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <script type="text/javascript" src="/static/js/right-click.js?build={{.BuildHash}}"></script>
 </body>
 </html>
 {{end}}