diff --git a/assets/fpk2/0.JPG b/assets/fpk2/0.JPG new file mode 100644 index 0000000..3e1b3f7 Binary files /dev/null and b/assets/fpk2/0.JPG differ diff --git a/assets/fpk2/1.JPG b/assets/fpk2/1.JPG new file mode 100644 index 0000000..ecc39e3 Binary files /dev/null and b/assets/fpk2/1.JPG differ diff --git a/assets/fpk2/2.JPG b/assets/fpk2/2.JPG new file mode 100644 index 0000000..5ac3309 Binary files /dev/null and b/assets/fpk2/2.JPG differ diff --git a/assets/fpk2/3.JPG b/assets/fpk2/3.JPG new file mode 100644 index 0000000..945531c Binary files /dev/null and b/assets/fpk2/3.JPG differ diff --git a/assets/fpk2/4.JPG b/assets/fpk2/4.JPG new file mode 100644 index 0000000..6c21e5e Binary files /dev/null and b/assets/fpk2/4.JPG differ diff --git a/assets/fpk2/5.JPG b/assets/fpk2/5.JPG new file mode 100644 index 0000000..aa46d50 Binary files /dev/null and b/assets/fpk2/5.JPG differ diff --git a/assets/fpk2/6.JPG b/assets/fpk2/6.JPG new file mode 100644 index 0000000..4a946db Binary files /dev/null and b/assets/fpk2/6.JPG differ diff --git a/assets/fpk2/7.JPG b/assets/fpk2/7.JPG new file mode 100644 index 0000000..c918146 Binary files /dev/null and b/assets/fpk2/7.JPG differ diff --git a/css/.index.css.swo b/css/.index.css.swo new file mode 100644 index 0000000..d399644 Binary files /dev/null and b/css/.index.css.swo differ diff --git a/css/index.css b/css/index.css index 1f150cb..38c3927 100644 --- a/css/index.css +++ b/css/index.css @@ -24,6 +24,10 @@ body { width: 45%; } +#fpk.side { + width: 100%; +} + #left.side .frame { background-size:contain; background-position: center; @@ -36,6 +40,12 @@ body { background-repeat: no-repeat; } +#fpk.side .frame { + background-size:contain; + background-position: center; + background-repeat: no-repeat; +} + .frame { width: 100%; height: 100%; diff --git a/fpk2.html b/fpk2.html new file mode 100644 index 0000000..c024c77 --- /dev/null +++ b/fpk2.html @@ -0,0 +1,14 @@ + + + + + TITLE + + + + +
+
+
+ + diff --git a/js/index.js b/js/index.js index 326e52b..409d15b 100644 --- a/js/index.js +++ b/js/index.js @@ -1,19 +1,23 @@ MAX_IMG_NUMBER = 7 ASSET_PATH = "\"assets/frame1/" -ASSET_SUFFIX = ".JPG\"" +ASSET_SUFFIX = ".JPG" +SET_COOKIE = false var frames = [ { - DOMElement : "", + DOMElement : null, IMGCounter : 0, + ASSET_FOLDER : "assets/frame1/", }, { - DOMElement : "", + DOMElement : null, IMGCounter : 0, + ASSET_FOLDER : "assets/frame2/", }, { - DOMElement : "", + DOMElement : null, IMGCounter : 0, + ASSET_FOLDER : "assets/fpk2/", } ] @@ -22,53 +26,132 @@ FOOBAR = "" document.addEventListener('DOMContentLoaded', function() { frames[0].DOMElement = document.querySelector("#left.side .frame") frames[1].DOMElement = document.querySelector("#right.side .frame") - + frames[2].DOMElement = document.querySelector("#fpk.side .frame") + frames.forEach(function(val, i) { - if (frames[i].DOMElement != "") { + if (frames[i].DOMElement != null) { nextImage(frames[i]) } }); - + + old_cookies = document.cookie + setInterval(function() { + var new_cookies = document.cookie + if (old_cookies != new_cookies && !SET_COOKIE) { + var cookie = new_cookies + var deviderPos = cookie.indexOf("=") + var name = deviderPos > -1 ? cookie.substr(0, deviderPos) : cookie; + var value = cookie.substr(deviderPos + 1, cookie.length) + + if (name != "") { + console.log("processing remote keypress: " + value ) + processKeypress(value) + cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT"; + } + document.cookie = cookie + old_cookies = new_cookies + } else { + SET_COOKIE = false + } + }, 10) }, false); + + +function deleteAllCookies() { + var cookies = document.cookie.split(";"); + + for (var i = 0; i < cookies.length; i++) { + var cookie = cookies[i]; + var eqPos = cookie.indexOf("="); + var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie; + document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT"; + } +} + document.addEventListener("keypress", function(keyEvent) { - switch (keyEvent.key) { + processKeypress(keyEvent.key) +}, false); + +function processKeypress(keypress) { + switch (keypress) { case "q": targetFrame = frames[0] - prevImage(targetFrame) + if (targetFrame.DOMElement != null) { + prevImage(targetFrame) + SET_COOKIE = false + } else { + console.log("frame not available, setting cookie") + document.cookie = "key="+keypress + SET_COOKIE = true + } break; case "w": targetFrame = frames[0] - nextImage(targetFrame) + if (targetFrame.DOMElement != null) { + nextImage(targetFrame) + SET_COOKIE = false + } else { + console.log("frame not available, setting cookie") + document.cookie = "key="+keypress + SET_COOKIE = true + } break; case "a": targetFrame = frames[1] - prevImage(targetFrame) + if (targetFrame.DOMElement != null) { + prevImage(targetFrame) + SET_COOKIE = false + } else { + console.log("frame not available, setting cookie") + document.cookie = "key="+keypress + SET_COOKIE = true + } break; case "s": targetFrame = frames[1] - nextImage(targetFrame) + if (targetFrame.DOMElement != null) { + nextImage(targetFrame) + SET_COOKIE = false + } else { + console.log("frame not available, setting cookie") + document.cookie = "key="+keypress + SET_COOKIE = true + } break; case "y": targetFrame = frames[2] - prevImage(targetFrame) + if (targetFrame.DOMElement != null) { + prevImage(targetFrame) + SET_COOKIE = false + } else { + console.log("frame not available, setting cookie") + document.cookie = "key="+keypress + SET_COOKIE = true + } break; case "x": targetFrame = frames[2] - nextImage(targetFrame) + if (targetFrame.DOMElement != null) { + nextImage(targetFrame) + SET_COOKIE = false + } else { + console.log("frame not available, setting cookie") + document.cookie = "key="+keypress + SET_COOKIE = true + } break; } -}, false); +} function nextImage(targetFrame) { - console.log(targetFrame) if (targetFrame.IMGCounter >= MAX_IMG_NUMBER) { targetFrame.IMGCounter = 0 } else { targetFrame.IMGCounter++ } - setFrameImage(targetFrame.DOMElement, ASSET_PATH + targetFrame.IMGCounter + ASSET_SUFFIX) + setFrameImage(targetFrame.DOMElement, "\"" + targetFrame.ASSET_FOLDER + targetFrame.IMGCounter + ASSET_SUFFIX + "\"") } function prevImage(targetFrame) { @@ -78,9 +161,9 @@ function prevImage(targetFrame) { targetFrame.IMGCounter-- } - setFrameImage(targetFrame.DOMElement, ASSET_PATH + targetFrame.IMGCounter + ASSET_SUFFIX) + setFrameImage(targetFrame.DOMElement, "\"" + targetFrame.ASSET_FOLDER + targetFrame.IMGCounter + ASSET_SUFFIX + "\"") } function setFrameImage(frame, imgPath) { frame.style.backgroundImage = "url(" + imgPath + ")" -} \ No newline at end of file +} diff --git a/index.html b/masterframe.html similarity index 100% rename from index.html rename to masterframe.html