From 443eeaa407f3b011ffb2965e01baf2abeab8b90a Mon Sep 17 00:00:00 2001 From: ansuz Date: Thu, 30 Nov 2017 19:17:59 +0100 Subject: [PATCH] fancy 404 page --- customize.dist/404.html | 16 ++++++ customize.dist/four-oh-four.js | 58 ++++++++++++++++++++ customize.dist/src/less2/404.less | 40 ++++++++++++++ customize.dist/src/less2/pages/page-404.less | 17 ++++++ 4 files changed, 131 insertions(+) create mode 100644 customize.dist/404.html create mode 100644 customize.dist/four-oh-four.js create mode 100644 customize.dist/src/less2/404.less create mode 100644 customize.dist/src/less2/pages/page-404.less diff --git a/customize.dist/404.html b/customize.dist/404.html new file mode 100644 index 000000000..9298a5377 --- /dev/null +++ b/customize.dist/404.html @@ -0,0 +1,16 @@ + + + + + CryptPad: Zero Knowledge, Collaborative Real Time Editing + + + + + + + diff --git a/customize.dist/four-oh-four.js b/customize.dist/four-oh-four.js new file mode 100644 index 000000000..2f7b6212a --- /dev/null +++ b/customize.dist/four-oh-four.js @@ -0,0 +1,58 @@ +define([ + '/common/hyperscript.js', + + 'less!/customize/src/less2/pages/page-404.less', +], function (h) { + var scramble = h('h2#cp-scramble', "We couldn't find the page you were looking for"); + var title = h('h1#title', "404"); + var content = h('div#cp-main', [ + title, + scramble + ]); + document.body.appendChild(content); + + var die = function (n) { return Math.floor(Math.random() * n); }; + var randomChar = function () { + return String.fromCharCode(die(94) + 34); + }; + var mutate = function (S, i, c) { + var A = S.split(""); + A[i] = c; + return A.join(""); + }; + + var take = function (A) { + var n = die(A.length); + var choice = A[n]; + A.splice(n, 1); + return choice; + }; + + var makeDecryptor = function (el, t, difficulty, cb) { + var Orig = el.innerText; + var options = []; + el.innerText = el.innerText.split("").map(function (c, i) { + Orig[i] = c; + options.push(i); + return randomChar(); + }).join(""); + + return function f () { + if (die(difficulty) === 0) { + var choice = take(options); + el.innerText = mutate(el.innerText, choice, Orig.charAt(choice)); + } else { // make a superficial change + el.innerText = mutate(el.innerText, + options[die(options.length)], + randomChar()); + } + setTimeout(options.length > 0? f: cb, t); + }; + }; + + makeDecryptor(title, 70, 17, function () { })(); + makeDecryptor(scramble, 10, 8, function () { + console.log('done'); + })(); +}); + diff --git a/customize.dist/src/less2/404.less b/customize.dist/src/less2/404.less new file mode 100644 index 000000000..ca1c3503e --- /dev/null +++ b/customize.dist/src/less2/404.less @@ -0,0 +1,40 @@ +@import (once) './include/font.less'; +.font_neuropolitical(); +.font_open-sans(); + +body.cp-page-index { @import "./pages/page-index.less"; } +body.cp-page-contact { @import "./pages/page-contact.less"; } +body.cp-page-login { @import "./pages/page-login.less"; } +body.cp-page-register { @import "./pages/page-register.less"; } +body.cp-page-what-is-cryptpad { @import "./pages/page-what-is-cryptpad.less"; } +body.cp-page-about { @import "./pages/page-about.less"; } +body.cp-page-privacy { @import "./pages/page-privacy.less"; } +body.cp-page-terms { @import "./pages/page-terms.less"; } + +// Set the HTML style for the apps which shouldn't have a body scrollbar +html.cp-app-noscroll { + @import "./include/app-noscroll.less"; + .app-noscroll_main(); +} +// Set the HTML style for printing slides +html.cp-app-print { + @import "./include/app-print.less"; + .app-print_main(); +} + +body.cp-readonly .cp-hidden-if-readonly { display:none !important; } + +body.cp-app-drive { @import "../../../drive/app-drive.less"; } +body.cp-app-pad { @import "../../../pad/app-pad.less"; } +body.cp-app-code { @import "../../../code/app-code.less"; } +body.cp-app-slide { @import "../../../slide/app-slide.less"; } +body.cp-app-file { @import "../../../file/app-file.less"; } +body.cp-app-filepicker { @import "../../../filepicker/app-filepicker.less"; } +body.cp-app-contacts { @import "../../../contacts/app-contacts.less"; } +body.cp-app-poll { @import "../../../poll/app-poll.less"; } +body.cp-app-whiteboard { @import "../../../whiteboard/app-whiteboard.less"; } +body.cp-app-todo { @import "../../../todo/app-todo.less"; } +body.cp-app-profile { @import "../../../profile/app-profile.less"; } +body.cp-app-settings { @import "../../../settings/app-settings.less"; } +body.cp-app-debug { @import "../../../debug/app-debug.less"; } + diff --git a/customize.dist/src/less2/pages/page-404.less b/customize.dist/src/less2/pages/page-404.less new file mode 100644 index 000000000..7bac6d4bd --- /dev/null +++ b/customize.dist/src/less2/pages/page-404.less @@ -0,0 +1,17 @@ +//@import (once) "../include/infopages.less"; +@import (once) "../include/colortheme.less"; + +html, body { + margin: 0; + padding: 0; + #cp-main { + height: 100vh; + width: 100%; + padding-top: 20%; + text-align: center; + #cp-scramble { + font-family: monospace !important; + } + } +} +