diff --git a/client/galaxy/scripts/mvc/tours.js b/client/galaxy/scripts/mvc/tours.js index e5e17f3a919..d02684bba99 100644 --- a/client/galaxy/scripts/mvc/tours.js +++ b/client/galaxy/scripts/mvc/tours.js @@ -3,11 +3,10 @@ * rendering a tour menu. */ -define(['libs/bootstrap-tour'],function(BootstrapTour) { +define(["libs/bootstrap-tour"], function(BootstrapTour) { + var gxy_root = typeof Galaxy === "undefined" ? "/" : Galaxy.root; - var gxy_root = typeof Galaxy === "undefined" ? '/' : Galaxy.root; - - var tourpage_template = `

Galaxy Tours

+ var tourpage_template = `

Galaxy Tours

This page presents a list of interactive tours available on this Galaxy server. Select any tour to get started (and remember, you can click 'End Tour' at any time).

`; - var tour_opts = { storage: window.sessionStorage, - onEnd: function(){ - sessionStorage.removeItem('activeGalaxyTour'); - }, - delay: 150, // Attempts to make it look natural - orphan:true - }; + var tour_opts = { + storage: window.sessionStorage, + onEnd: function() { + sessionStorage.removeItem("activeGalaxyTour"); + }, + delay: 150, // Attempts to make it look natural + orphan: true + }; - var hooked_tour_from_data = function(data){ - _.each(data.steps, function(step) { - if (step.preclick){ - step.onShow= function(){ - _.each(step.preclick, function(preclick){ - // TODO: click delay between clicks - $(preclick).click(); - }); - }; - } - if (step.postclick){ - step.onHide = function(){ - _.each(step.postclick, function(postclick){ - // TODO: click delay between clicks - $(postclick).click(); - }); - }; - } - if (step.textinsert){ - // Have to manually trigger a change here, for some - // elements which have additional logic, like the - // upload input box - step.onShown= function(){ - $(step.element).val(step.textinsert).trigger("change"); - }; - } - }); - return data; - }; - - var TourItem = Backbone.Model.extend({ - urlRoot: gxy_root + 'api/tours', + var hooked_tour_from_data = function(data) { + _.each(data.steps, function(step) { + if (step.preclick) { + step.onShow = function() { + _.each(step.preclick, function(preclick) { + // TODO: click delay between clicks + $(preclick).click(); + }); + }; + } + if (step.postclick) { + step.onHide = function() { + _.each(step.postclick, function(postclick) { + // TODO: click delay between clicks + $(postclick).click(); + }); + }; + } + if (step.textinsert) { + // Have to manually trigger a change here, for some + // elements which have additional logic, like the + // upload input box + step.onShown = function() { + $(step.element).val(step.textinsert).trigger("change"); + }; + } }); + return data; + }; - var Tours = Backbone.Collection.extend({ - url: gxy_root + 'api/tours', - model: TourItem, + var TourItem = Backbone.Model.extend({ + urlRoot: gxy_root + "api/tours" + }); + + var Tours = Backbone.Collection.extend({ + url: gxy_root + "api/tours", + model: TourItem + }); + + var giveTour = function(tour_id) { + var url = gxy_root + "api/tours/" + tour_id; + $.getJSON(url, function(data) { + // Set hooks for additional click and data entry actions. + var tourdata = hooked_tour_from_data(data); + sessionStorage.setItem("activeGalaxyTour", JSON.stringify(data)); + // Store tour steps in sessionStorage to easily persist w/o hackery. + var tour = new Tour( + _.extend( + { + steps: tourdata.steps + }, + tour_opts + ) + ); + // Always clean restart, since this is a new, explicit giveTour execution. + tour.init(); + tour.goTo(0); + tour.restart(); }); - - - var giveTour = function(tour_id){ - var url = gxy_root + 'api/tours/' + tour_id; - $.getJSON( url, function( data ) { - // Set hooks for additional click and data entry actions. - var tourdata = hooked_tour_from_data(data); - sessionStorage.setItem('activeGalaxyTour', JSON.stringify(data)); - // Store tour steps in sessionStorage to easily persist w/o hackery. - var tour = new Tour(_.extend({ - steps: tourdata.steps, - }, tour_opts)); - // Always clean restart, since this is a new, explicit giveTour execution. - tour.init(); - tour.goTo(0); - tour.restart(); - }); - }; - var ToursView = Backbone.View.extend({ - // initialize - initialize: function() { - var self = this; - this.setElement('
'); - this.model = new Tours(); - this.model.fetch({ - success: function(){ - self.render(); - }, - error: function(){ - // Do something. - console.error("Failed to fetch tours."); - } - }); + }; + var ToursView = Backbone.View.extend({ + // initialize + initialize: function() { + var self = this; + this.setElement("
"); + this.model = new Tours(); + this.model.fetch({ + success: function() { + self.render(); }, - - render: function(){ - var tpl = _.template(tourpage_template); - this.$el.html(tpl({tours: this.model.models})).on("click", ".tourItem", function(e){ - e.preventDefault(); - giveTour($(this).data("tour.id")); - }); + error: function() { + // Do something. + console.error("Failed to fetch tours."); } - }); + }); + }, - return {ToursView: ToursView, - hooked_tour_from_data: hooked_tour_from_data, - tour_opts: tour_opts, - giveTour: giveTour}; + render: function() { + var tpl = _.template(tourpage_template); + this.$el + .html(tpl({ tours: this.model.models })) + .on("click", ".tourItem", function(e) { + e.preventDefault(); + giveTour($(this).data("tour.id")); + }); + } + }); + + return { + ToursView: ToursView, + hooked_tour_from_data: hooked_tour_from_data, + tour_opts: tour_opts, + giveTour: giveTour + }; });