diff options
Diffstat (limited to 'StoneIsland/www/js/lib/nav/IntroModal.js')
| -rw-r--r-- | StoneIsland/www/js/lib/nav/IntroModal.js | 145 |
1 files changed, 145 insertions, 0 deletions
diff --git a/StoneIsland/www/js/lib/nav/IntroModal.js b/StoneIsland/www/js/lib/nav/IntroModal.js new file mode 100644 index 00000000..242405a0 --- /dev/null +++ b/StoneIsland/www/js/lib/nav/IntroModal.js @@ -0,0 +1,145 @@ +var IntroModal = View.extend({ + + el: "#intro_modal", + + events: { + "click .intro_proceed": "proceed", + "click .intro_tagline": "navigateToTagline", + "click a": "navigate", + }, + + alreadyShown: false, + curtainBackgroundColor: false, + + initialize: function(){ + this.$introTitle = this.$(".intro_title") + this.$introTaglineTop = this.$(".tagline_top") + this.$introTaglineBottom = this.$(".tagline_bottom") + this.$introContent = this.$(".intro_content") + this.$introProceed = this.$(".intro_proceed") + }, + + check: function(){ + if (this.alreadyShown) { + this.hide() + return false + } + var lastMessage = localStorage.getItem('app.intro_modal_last_message') + switch (app.store.showModal) { + case 'never': + this.hide() + return false + case 'once': + if (lastMessage === app.store.modalContent) { + this.hide() + return false + } + this.show() + return true + case 'always': + this.show() + return true + } + }, + + build: function(){ + var modalTitle = app.store.modalTitle.trim() + var modalTagline = app.store.modalTagline.trim() + var modalTaglineHref = app.store.modalTaglineLink.trim() + var modalContent = app.store.modalContent.trim() + var modalButton = app.store.modalButton.trim().toUpperCase() || "PROCEED" + if (app.store.modalBackgroundColor === 'black') { + this.curtainBackgroundColor = 'white' + } else { + this.curtainBackgroundColor = 'black' + } + this.$el.addClass(app.store.modalBackgroundColor) + if (modalTagline.length === 0) { + app.store.modalTaglinePosition = 'hidden' + } + switch (app.store.modalTaglinePosition) { + case 'hidden': + this.$introTaglineBottom.hide() + this.$introTaglineTop.hide() + break + case 'top': + this.$introTaglineBottom.hide() + this.$introTaglineTop.show() + this.$introTaglineTop.addClass(app.store.modalTaglineColor) + this.$introTaglineTop.text(app.store.modalTagline) + break + case 'bottom': + this.$introTaglineTop.hide() + this.$introTaglineBottom.show() + this.$introTaglineBottom.addClass(app.store.modalTaglineColor) + this.$introTaglineBottom.text(app.store.modalTagline) + break + } + if (modalTitle.length === 0) { + this.$introTitle.hide() + } else { + this.$introTitle.show() + this.$introTitle.text(modalTitle) + } + if (modalContent.length === 0) { + this.$introContent.hide() + } else { + this.$introContent.show() + this.$introContent.text(modalContent) + } + this.$introProceed.html(sanitize(modalButton)) + }, + + show: function(){ + this.alreadyShown = true + this.build() + this.$el.show() + setTimeout(function(){ + this.$el.addClass('visible') + }.bind(this), 20) + app.curtain.show('opaque') + setTimeout(function(){ + app.curtain.show('opaque') + }, 300) + }, + + hide: function(){ + this.alreadyShown = true + localStorage.setItem('app.intro_modal_last_message', app.store.modalContent) + app.curtain.hide() + this.$el.removeClass('visible') + setTimeout(function(){ + this.$el.hide() + app.curtain.$el.removeClass('opaque') + if (this.curtainBackgroundColor) { + app.curtain.$el.removeClass(this.curtainBackgroundColor) + } + }.bind(this), 300) + }, + + navigateToTagline: function(){ + var modalTaglineHref = app.store.modalTaglineLink.trim() + if (modalTaglineHref.length) { + this.hide() + console.log(modalTaglineHref) + if (modalTaglineHref.indexOf('http') === 0) { + window.open(modalTaglineHref, '_system') + } else { + app.router.go(modalTaglineHref) + } + } + }, + + navigate: function(e){ + var href = $(e.currentTarget).attr('href').replace('#', '') + console.log(href) + this.hide() + app.router.go(href) + }, + + proceed: function(){ + console.log('proceed') + this.hide() + }, + +})
\ No newline at end of file |