summaryrefslogtreecommitdiff
path: root/public/assets/js
diff options
context:
space:
mode:
Diffstat (limited to 'public/assets/js')
-rw-r--r--public/assets/js/app.js13
-rw-r--r--public/assets/js/lib/HeaderView.js2
-rw-r--r--public/assets/js/lib/NavView.js20
-rw-r--r--public/assets/js/lib/ProjectView.js24
-rw-r--r--public/assets/js/lib/SiteRouter.js31
-rw-r--r--public/assets/js/vendor/Router.js82
6 files changed, 158 insertions, 14 deletions
diff --git a/public/assets/js/app.js b/public/assets/js/app.js
index b3503de..6c20281 100644
--- a/public/assets/js/app.js
+++ b/public/assets/js/app.js
@@ -1,5 +1,7 @@
var app = (function() {
var app = {}
+
+ app.navigation_delay = 200
app.iscroll_options = {
mouseWheel: true,
@@ -59,8 +61,9 @@ var app = (function() {
$("body").removeClass("loading")
}, 20)
- app.view = app.projects[0]
- app.view.show()
+ app.router = new SiteRouter ()
+
+ app.router.launch()
console.log("launched")
}
@@ -69,9 +72,13 @@ var app = (function() {
$(".cell, .next, .previous").css({ 'display': 'none' })
$('body').addClass('resizing')
debounce(function() {
+ $(".item").addClass("hidden")
+ setTimeout(function(){
$(".cell, .next, .previous").css({ 'height': ($(".top").height() + 'px'), 'display': 'inline-block' })
+ app.view.$el.removeClass("hidden")
$('.top').flickity('resize')
$('body').removeClass('resizing')
+ }, 20)
}, 400)
}
@@ -80,6 +87,7 @@ var app = (function() {
})()
$(".cell, .next").css({ 'height': ($(".top").height() + 'px') })
+$(".item").addClass("hidden")
$('.top').flickity(app.flickity_options).on( 'cellSelect', function(e) {
var gallery = $(e.target).data('flickity')
@@ -88,5 +96,4 @@ $('.top').flickity(app.flickity_options).on( 'cellSelect', function(e) {
$(".previous, .next").css({ 'height': ($(".top").height() + 'px') })
-
app.init()
diff --git a/public/assets/js/lib/HeaderView.js b/public/assets/js/lib/HeaderView.js
index b568ecb..bc64d85 100644
--- a/public/assets/js/lib/HeaderView.js
+++ b/public/assets/js/lib/HeaderView.js
@@ -25,7 +25,7 @@ var HeaderView = View.extend({
},
toggleNav: function(){
- $('body').toggleClass('navopen');
+ $('body').toggleClass('navopen')
},
})
diff --git a/public/assets/js/lib/NavView.js b/public/assets/js/lib/NavView.js
index 0ed1d4f..ae60bdf 100644
--- a/public/assets/js/lib/NavView.js
+++ b/public/assets/js/lib/NavView.js
@@ -11,29 +11,41 @@ var NavView = View.extend({
click: function(e){
var id = $(e.target).data("id")
+ this.pick(id)
+ },
+
+ pick: function(id){
var view = app.lookup[ id ]
- this.swap( view )
+ this.swap( view, "down" )
},
previous: function(){
var index = Math.max( app.view.page_number - 1, 0 )
var view = app.projects[ index ]
- this.swap( view )
+ this.swap( view, "up" )
},
next: function(){
var index = Math.min( app.view.page_number + 1, app.projects.length - 1 )
var view = app.projects[ index ]
- this.swap( view )
+ this.swap( view, "down" )
},
- swap: function(view) {
+ swap: function(view, direction) {
+ if (view && ! app.view) {
+ app.view = view
+ app.view.show()
+ return
+ }
if (! view || app.view == view || app.view.showing) {
return
}
console.log(view.page_number, view.project_id)
+ direction = direction || "down"
+ addClassForPeriod( document.body, direction, app.navigation_delay )
+
app.view.hide()
view.show()
app.view = view
diff --git a/public/assets/js/lib/ProjectView.js b/public/assets/js/lib/ProjectView.js
index 02d7d4e..3bef408 100644
--- a/public/assets/js/lib/ProjectView.js
+++ b/public/assets/js/lib/ProjectView.js
@@ -1,13 +1,13 @@
var ProjectView = View.extend({
events: {
- "click": "next",
+ "click": "nextOrCloseNav",
"click .page-up": "previous",
"click .page-down": "next",
},
initialize: function(opt){
- this.gallery = new GalleryView ()
+ // this.gallery = new GalleryView ()
this.project_id = this.$el.data("id")
this.page_number = opt.page_number
console.log("INIT", this.project_id)
@@ -21,15 +21,22 @@ var ProjectView = View.extend({
app.header.updateSlideCount( 1 )
$('body').removeClass('navopen')
this.$el.removeClass("hidden")
+
+ if (this.project_id == "cover") {
+ app.router.pushState("/")
+ }
+ else {
+ app.router.pushState("/project/" + this.project_id)
+ }
this.showing = true
- addClassForPeriod( this.el, "showing", 200, function(){
+ addClassForPeriod( this.el, "showing", app.navigation_delay, function(){
this.showing = false
}.bind(this) )
},
hide: function(){
- addClassForPeriod( this.el, "hiding", 200, function(){
+ addClassForPeriod( this.el, "hiding", app.navigation_delay, function(){
this.$el.addClass("hidden")
}.bind(this) )
},
@@ -39,9 +46,14 @@ var ProjectView = View.extend({
app.nav.previous()
},
- next: function(e){
+ nextOrCloseNav: function(e){
e.stopPropagation()
- app.nav.next()
+ if ($('body').hasClass('navopen')) {
+ $('body').removeClass('navopen')
+ }
+ else {
+ app.nav.next()
+ }
},
})
diff --git a/public/assets/js/lib/SiteRouter.js b/public/assets/js/lib/SiteRouter.js
new file mode 100644
index 0000000..7f1cec6
--- /dev/null
+++ b/public/assets/js/lib/SiteRouter.js
@@ -0,0 +1,31 @@
+var SiteRouter = Router.extend({
+
+ el: 'body',
+ routeByHash: false,
+
+ routes: {
+ '/': 'home',
+ '/page/:id': 'project',
+ '/project/:id': 'project',
+ },
+
+ initial_route: null,
+ launch: function(){
+ if (this.initial_route) {
+ this.parseRoute( this.initial_route )
+ }
+ else {
+ this.route()
+ }
+ this.initial_route = null
+ },
+
+ home: function(){
+ app.nav.pick("cover")
+ },
+
+ project: function(id){
+ app.nav.pick(id)
+ },
+
+}) \ No newline at end of file
diff --git a/public/assets/js/vendor/Router.js b/public/assets/js/vendor/Router.js
new file mode 100644
index 0000000..3b0d939
--- /dev/null
+++ b/public/assets/js/vendor/Router.js
@@ -0,0 +1,82 @@
+var Router = View.extend({
+
+ routeByHash: false,
+
+ go: function(url){
+ this.parseRoute(url)
+ },
+
+ pushState: function(url){
+ if (this.routeByHash) {
+ window.location.hash = url
+ }
+ else if (window.history) {
+ window.history.pushState(null, null, url)
+ }
+ },
+
+ route: function(){
+ var path = this.routeByHash ? window.location.hash.substr(0) : window.location.pathname
+ path = path || "/"
+ this.originalPath = path
+ this.parseRoute(path)
+ },
+
+ parseRoute: function(pathname){
+
+ pathname = pathname.replace(/^#/, "")
+
+ if (pathname[0] !== "/") { pathname = "/" + pathname }
+
+ var routes = this.routes,
+ path = pathname.split("/");
+
+ for (var i = 0; i < path.length; i++) {
+ if (! path[i].length) {
+ path[i] = null
+ }
+ }
+
+ if (pathname in routes) {
+ this[this.routes[pathname]]()
+ return
+ }
+
+ if (path[path.length-1] == null) {
+ path.pop()
+ }
+
+ for (var route in routes) {
+ var routePath = route.split("/")
+ if (routePath[1] == path[1]) {
+ if (routePath[2] && routePath[2].indexOf(":") !== -1 && path[2] && (path[3] === routePath[3]) ) {
+ this[this.routes[route]](path[2])
+ return
+ }
+ else if (routePath[2] == path[2]) {
+ if (routePath[3] && path[3]) {
+ if (routePath[3].indexOf(":") !== -1) {
+ this[this.routes[route]](path[3])
+ return
+ }
+ else if (routePath[3] == path[3]) {
+ this[this.routes[route]]()
+ return
+ }
+ }
+ else if (! routePath[3] && ! path[3]) {
+ this[this.routes[route]]()
+ return
+ }
+ }
+ else if (! routePath[2] && (! path[2].length || ! path[2])) {
+ this[this.routes[route]]()
+ return
+ }
+ }
+ }
+ // Redirect to root on 404
+ window.location = '/'
+ }
+
+})
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-13 06:41:27 +0000