diff options
Diffstat (limited to 'public/assets')
| -rw-r--r-- | public/assets/css/css.css | 4 | ||||
| -rw-r--r-- | public/assets/js/index.js | 25 | ||||
| -rw-r--r-- | public/assets/js/lib/index.js | 18 | ||||
| -rw-r--r-- | public/assets/js/nav.js | 65 |
4 files changed, 71 insertions, 41 deletions
diff --git a/public/assets/css/css.css b/public/assets/css/css.css index 06a20e6..50b5023 100644 --- a/public/assets/css/css.css +++ b/public/assets/css/css.css @@ -76,7 +76,7 @@ a:visited { font-style:italic; text-transform:uppercase; } -#windowinwindow { +#pip { position:absolute; z-index:8; top:80px; @@ -85,7 +85,7 @@ a:visited { box-shadow: 5px 5px 4px #888; border:2px inset black; } -#windowinwindow:hover { +#pip:hover { border:2px solid blue; cursor:pointer; } diff --git a/public/assets/js/index.js b/public/assets/js/index.js index 2e5ac92..fefb7fc 100644 --- a/public/assets/js/index.js +++ b/public/assets/js/index.js @@ -1,13 +1,13 @@ var app = (function(){ var app = {} + var id = -1 + app.init = function(){ - app.router = new SiteRouter () - app.view = null + app.view = new NavView () $(window).on("focus", app.focus) $(window).on("blur", app.blur) - $(window).on("keydown", app.keydown) } app.focused = true @@ -20,24 +20,7 @@ var app = (function(){ app.blur = function(){ app.focused = false } - - app.keydown = function(e){ - switch (e.keyCode) { - case 37: // left - // prev - break - case 39: // right - // next - break - case 38: // up - // home - break - case 40: // down - // random - break - } - } - + document.addEventListener('DOMContentLoaded', app.init) return app diff --git a/public/assets/js/lib/index.js b/public/assets/js/lib/index.js deleted file mode 100644 index af381c1..0000000 --- a/public/assets/js/lib/index.js +++ /dev/null @@ -1,18 +0,0 @@ -var SiteRouter = Router.extend({ - - el: "body", - - routes: { - "/": 'login', - "/index": 'index', - }, - - initialize: function(){ - this.route() - }, - - index: function(){ - app.view = new IndexView () - }, - -})
\ No newline at end of file diff --git a/public/assets/js/nav.js b/public/assets/js/nav.js new file mode 100644 index 0000000..401c6ff --- /dev/null +++ b/public/assets/js/nav.js @@ -0,0 +1,65 @@ +var NavView = View.extend({ + + el: "body", + events: { + "click #prev": "prev", + "click #next": "next", + "click #refresh": "refresh", + "click #random": "random", + }, + + initialize: function(){ + this.id = -1 + this.$pip = this.$("#pip img") + this.$image = this.$("#luckyimage") + + $(window).on("keydown", app.keydown) + this.latest() + }, + + keydown: function(e){ + switch (e.keyCode) { + case 37: // left + this.prev() + break + case 39: // right + this.next() + break + case 38: // up + this.latest() + break + case 40: // down + this.random() + break + } + }, + + latest: function(){ + this.onLatest = true + $.get("/get/latest", this.display.bind(this)) + }, + + prev: function(){ + if (this.id - 1 < 1) { return } + this.onLatest = false + $.get("/get/" + (this.id-1), this.display.bind(this)) + }, + + next: function(){ + if (this.onLatest || this.id < 1) { return } + this.onLatest = false + $.get("/get/" + (this.id+1), this.display.bind(this)) + }, + + random: function(){ + this.onLatest = false + $.get("/get/random", this.display.bind(this)) + }, + + display: function(data){ + this.id = data.id + this.$pip.attr("src", data.url) + this.$image.css("background-image", "url(" + data.url + ")") + }, + +}) |