From 95de8de58e56d5a67c852940c22e5eec57c689ff Mon Sep 17 00:00:00 2001 From: Nicky Case Date: Mon, 22 Oct 2018 16:40:55 -0400 Subject: [PATCH] interactive header and better loading --- ahhh.html | 125 ++++++++++++++++++++++++++++++ css/comic.css | 48 +++++++++--- full.html | 63 +++++++++------- js/comic.js | 72 +++++++++++++++--- pics/bg.png | Bin 14300 -> 0 bytes sims/splash/Mouse.js | 60 +++++++++++++++ sims/splash/card.png | Bin 0 -> 493 bytes sims/splash/index.html | 12 +++ sims/splash/splash.js | 167 +++++++++++++++++++++++++++++++++++++++++ 9 files changed, 495 insertions(+), 52 deletions(-) create mode 100644 ahhh.html delete mode 100644 pics/bg.png create mode 100644 sims/splash/Mouse.js create mode 100644 sims/splash/card.png create mode 100644 sims/splash/index.html create mode 100644 sims/splash/splash.js diff --git a/ahhh.html b/ahhh.html new file mode 100644 index 0000000..22dde55 --- /dev/null +++ b/ahhh.html @@ -0,0 +1,125 @@ + + + + + An Interactive Comic + + + + + + + + + + + + + + +
+ +
+
+ HOW TO REMEMBER ANYTHING FOREVER-ISH +
+
+ by nicky case · oct 2018 +
+
+
+ +


+


+


+


+ + +
+ +
+
+ THE SCIENCE of + SPACED REPETITION +
+ +
+
+ +


+


+


+


+


+ + + +
+ +
+
+ THE ART of + SPACED REPETITION +
+ +
+
+ +


+


+


+


+


+ + + +
+ +
+
+ GET STARTED TODAY! +
+ +
+
+ +


+


+


+ + + +
+ + + + + Intro + +· + + The Science + +· + + The Art + +· + + Get Started! + +· + + Credits + + + +
+ + + + + + + + diff --git a/css/comic.css b/css/comic.css index b18f7dd..c630dff 100644 --- a/css/comic.css +++ b/css/comic.css @@ -10,6 +10,7 @@ html, body{ width:100%; height:100%; + scroll-behavior: smooth; } body{ background: #eeeeee; @@ -34,38 +35,61 @@ a{ /**********/ .divider{ - background: #000; - background-image: url(../pics/bg.png); - background-size: 150px; - + position: relative; width: 100%; - /*height: 200px;*/ color: #fff; text-align: center; - padding: 50px 0; } -.divider > div{ +.divider_small_height{ + height: 220px; +} +.divider_big_height{ + height: 300px; +} +@media (max-width:1000px) { + .divider_small_height{ + height: 290px; + } + .divider_big_height{ + height: 370px; + } +} +.divider > #divider_container{ + width: 100%; + position: absolute; + margin-top: 50px; + pointer-events: none; +} +.divider > #divider_container > div{ width: calc(100% - 100px); - min-width: 600px; + min-width: 550px; max-width: 960px; margin: 0 auto; } -.divider > #chapter_name{ +.divider > #divider_container > #chapter_name{ font-size: 100px; line-height: 0.75em; text-align: left; margin-bottom: 10px; } -.divider > #chapter_links{ +.divider > #divider_container > #chapter_links{ text-align: right; + pointer-events: all; } -.divider .small_of{ +.divider > #divider_container > .small_of{ font-size:0.75em; line-height:0; } -.divider > #chapter_subtitle{ +.divider > #divider_container > #chapter_subtitle{ text-align: right; font-size: 30px; } +.divider > iframe{ + width:100%; + height:100%; + position: absolute; + border: none; + top:0; left:0; +} /*********/ diff --git a/full.html b/full.html index 291e124..74e3d46 100644 --- a/full.html +++ b/full.html @@ -4,6 +4,7 @@ An Interactive Comic + @@ -16,12 +17,15 @@ -
-
- [todo: come up with a title] -
-
- by nicky case · oct 2018 +
+ +
+
+ [todo: some friggin' title] +
+
+ by nicky case · oct 2018 +
@@ -225,16 +229,15 @@ Like so: -
-
- THE SCIENCE - - of - -
- SPACED REPETITION +
+ +
+
+ THE SCIENCE of + SPACED REPETITION +
+
-
@@ -555,16 +558,15 @@ It’s actually so simple, you can even create your own automatic scheduler... -
-
- THE ART - - of - -
- SPACED REPETITION +
+ +
+
+ THE ART of + SPACED REPETITION +
+
-
@@ -1051,11 +1053,14 @@ It’s actually so simple, you can even create your own automatic scheduler... -
-
- GET STARTED TODAY! +
+ +
+
+ GET STARTED TODAY! +
+
-
@@ -1475,7 +1480,7 @@ Before sleeping, coz otherwise you'd just stress-binge on twitter - + diff --git a/js/comic.js b/js/comic.js index 56b3441..246a008 100644 --- a/js/comic.js +++ b/js/comic.js @@ -48,8 +48,11 @@ window.onload = function(){ // Create & append iframe var iframe = document.createElement("iframe"); - iframe.src = sim.getAttribute("src"); + //iframe.src = sim.getAttribute("src"); + var src = sim.getAttribute("src"); + iframe.setAttribute("will_source", src); iframe.scrolling = "no"; + iframe.className = "simulation"; sim.appendChild(iframe); }); @@ -82,6 +85,12 @@ window.onload = function(){ }); + // On scroll + window.onscroll(); + + // Load sounds + loadSounds(); + }; window.getLabel = function(name){ @@ -231,11 +240,18 @@ function makeWallpaper(){ var linx = $("#label_chapter_links"); if(linx){ - $all(".divider > #chapter_links").forEach(function(linkContainer){ + $all("#chapter_links").forEach(function(linkContainer){ linkContainer.innerHTML = linx.innerHTML; }); } +// HACK: Duplicate header text for absolute positioning coz CSS sucks +/*$all(".divider").forEach(function(divider){ + + var html = divider.querySelector("div").innerHTML; + divider.querySelector("#divider_container").innerHTML = html; + +});*/ ////////////////////// // SOUNDS //////////// @@ -261,17 +277,19 @@ var SOUNDS_TO_LOAD = [ ["win_final",1], ]; var SOUNDS = {}; -SOUNDS_TO_LOAD.forEach(function(config){ - - var name = config[0]; - var vol = config[1]; +function loadSounds(){ + SOUNDS_TO_LOAD.forEach(function(config){ + + var name = config[0]; + var vol = config[1]; + + SOUNDS[name] = new Howl({ + src: ["audio/"+name+".mp3"], + volume: vol + }); - SOUNDS[name] = new Howl({ - src: ["audio/"+name+".mp3"], - volume: vol }); - -}); +} window.playSound = function(name){ SOUNDS[name].play(); }; @@ -284,3 +302,35 @@ subscribe("PREflip_spaced_rep",function(){ subscribe("PREflip_the_end",function(){ SOUNDS.applause.play(); }); + +///////////////////////////// +// IFRAME SCROLL //////////// +///////////////////////////// + +var splashes = $all("iframe.splash"); + +window.onscroll = function(){ + + // Playables - PAUSE & UNPAUSE + var scrollY = window.pageYOffset; + var innerHeight = window.innerHeight; + for(var i=0;i0); + } + + // Also, iframe scrollables + var BUFFER = innerHeight/2; + var simulations = $all("iframe.simulation"); + simulations.forEach(function(sim){ + if(!sim.src){ + var bounds = sim.getBoundingClientRect(); + if(bounds.y-BUFFER){ + sim.src = sim.getAttribute("will_source"); + console.log("Loading "+sim.src+"..."); + } + } + }); + +}; diff --git a/pics/bg.png b/pics/bg.png deleted file mode 100644 index a3490841f41b56904b6f0a4f7598f7fcc22e0401..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 14300 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 Sis6Qt70gX+j4KRrSN|7T>-$sy diff --git a/sims/splash/Mouse.js b/sims/splash/Mouse.js new file mode 100644 index 0000000..b2f04db --- /dev/null +++ b/sims/splash/Mouse.js @@ -0,0 +1,60 @@ +(function(exports){ + + // Singleton + var Mouse = { + x: undefined, + y: undefined, + pressed: false, + update: function(){ + + if(Mouse.x!==undefined && Mouse.y!==undefined){ + + if(Mouse.lastX===undefined) Mouse.lastX=Mouse.x; + if(Mouse.lastY===undefined) Mouse.lastY=Mouse.y; + + Mouse.velX = Mouse.x-Mouse.lastX; + Mouse.velY = Mouse.y-Mouse.lastY; + + Mouse.lastX=Mouse.x; + Mouse.lastY=Mouse.y; + + } + + } + }; + exports.Mouse = Mouse; + + // Event Handling + var onMouseMove,onTouchMove; + + document.body.addEventListener("mousedown",function(event){ + Mouse.pressed = true; + onMouseMove(event); + },false); + + document.body.addEventListener("mouseup",function(event){ + Mouse.pressed = false; + },false); + + document.body.addEventListener("mousemove",onMouseMove = function(event){ + Mouse.x = event.pageX; + Mouse.y = event.pageY - window.pageYOffset; + },false); + + document.body.addEventListener("touchstart",function(event){ + Mouse.pressed = true; + onTouchMove(event); + },false); + + document.body.addEventListener("touchend",function(event){ + Mouse.pressed = false; + },false); + + document.body.addEventListener("touchmove",onTouchMove = function(event){ + Mouse.x = event.changedTouches[0].clientX; + Mouse.y = event.changedTouches[0].clientY - window.pageYOffset; + event.preventDefault(); + },false); + + +})(window); \ No newline at end of file diff --git a/sims/splash/card.png b/sims/splash/card.png new file mode 100644 index 0000000000000000000000000000000000000000..0e4a20eed7746e26a23e40b4f7fb087da3c78ef1 GIT binary patch literal 493 zcmeAS@N?(olHy`uVBq!ia0vp^6+rC4!3HF4zXG=yp4VR?5nEMwfI`gK5?UBl}xRdn~p19+$-+6xg+9@z8uTBGufWom(Ssv zJKOchn%d3WJ~7(6Pq^N?o4-8N-D$eo%t}SmMpa*xxmRbi+s^QiZ#*u_?r5)PTpTcK z?U{F9P4sTrJwJ4LMaSLOIT3aL`2HC)%~sxEIgrForOe1`jxT9}DtoWZW7>Oj%Cm%r zp>I7ebU*(l_a~&3=S!lb;A^uF%}adGW?tA?z4E8HtYH3ICY>|47vC%I_Z0l7@^alR zj~Az6s%M+_*`Gb5?P)%#Ox{`u6{1-oD!M + + + Splash + + + + + + + + \ No newline at end of file diff --git a/sims/splash/splash.js b/sims/splash/splash.js new file mode 100644 index 0000000..6e8e6d2 --- /dev/null +++ b/sims/splash/splash.js @@ -0,0 +1,167 @@ +var canvas = document.createElement("canvas"); +var ctx = canvas.getContext('2d'); + +canvas.width = window.innerWidth*2; +canvas.height = window.innerHeight*2; +canvas.style.width = window.innerWidth+"px"; +canvas.style.height = window.innerHeight+"px"; + +document.body.appendChild(canvas); + +var cardImage = new Image(); +cardImage.src = "card.png"; + +///////////////////////////////////////// + +// Make a whole bunch of cards. Randomly place 'em +var cards = []; +var PADDING = 50; +var RADIUS = 60; +var R2 = RADIUS*RADIUS; +var N = (window.innerWidth*window.innerHeight)/4000; +for(var i=0; iwindow.innerHeight+PADDING){ + + var x,y; + for(var j=0; j<100; j++){ + x = (Math.random()*(window.innerWidth+PADDING*2))-PADDING; + y = -PADDING; + if(!_tooClose(x,y)){ + break; + } + } + + self.x = x; + self.y = y; + + } + //if(Mouse.x/2