diff --git a/app/assets/javascripts/my_modules/protocols.js b/app/assets/javascripts/my_modules/protocols.js index dac362b1e..540a3d189 100644 --- a/app/assets/javascripts/my_modules/protocols.js +++ b/app/assets/javascripts/my_modules/protocols.js @@ -100,10 +100,15 @@ function bindEditDueDateAjax() { function initTutorial() { var currentStep = Cookies.get('current_tutorial_step'); - if (showTutorial() && (currentStep > 8 && currentStep < 12)) { - var resultsTab = $("#results-nav-tab"); - var moduleProtocolsTutorial = $("[data-role='tutorial-data']").attr("data-module-protocols-step-text"); - var moduleProtocolsClickResultsTutorial = $("[data-role='tutorial-data']").attr("data-module-protocols-click-results-step-text"); + if (showTutorial() && (currentStep > 10 && currentStep < 15)) { + var resultsTab = $('#results-nav-tab'); + var saveRepositoryButton = $('#protocol-copy-to-repository').get(0); + var moduleProtocolsTutorial = $("[data-role='tutorial-data']") + .attr('data-module-protocols-step-text'); + var moduleProtocolsSaveTutorial = $("[data-role='tutorial-data']") + .attr('data-module-protocols-save-step-text'); + var moduleProtocolsClickResultsTutorial = $("[data-role='tutorial-data']") + .attr('data-module-protocols-click-results-step-text'); introJs() .setOptions({ @@ -111,6 +116,10 @@ function initTutorial() { { intro: moduleProtocolsTutorial }, + { + intro: moduleProtocolsSaveTutorial, + element: saveRepositoryButton + }, { intro: moduleProtocolsClickResultsTutorial, element: resultsTab[0], @@ -127,28 +136,28 @@ function initTutorial() { exitOnEsc: false, tooltipClass: 'custom' }) - .onafterchange(function(tarEl) { - Cookies.set('current_tutorial_step', this._currentStep + 10); - if (this._currentStep == 1) { + .onafterchange(function() { + Cookies.set('current_tutorial_step', this._currentStep + 12); + if (this._currentStep === 2) { setTimeout(function() { $('.next-page-link a.introjs-nextbutton') .removeClass('introjs-disabled') - .attr('href', resultsTab.find("a").attr('href')); + .attr('href', resultsTab.find('a').attr('href')); positionTutorialTooltip(); }, 500); } else { positionTutorialTooltip(); } }) - .goToStep(currentStep == 11 ? 2 : 1) + .goToStep(currentStep === 13 ? 2 : 1) .start(); window.onresize = positionTutorialTooltip; // Destroy first-time tutorial cookies when skip tutorial // or end tutorial is clicked - $(".introjs-skipbutton").each(function (){ - $(this).click(function (){ + $('.introjs-skipbutton').each(function() { + $(this).click(function() { Cookies.remove('tutorial_data'); Cookies.remove('current_tutorial_step'); }); diff --git a/app/assets/javascripts/my_modules/results.js.erb b/app/assets/javascripts/my_modules/results.js.erb index c024550f0..188148d37 100644 --- a/app/assets/javascripts/my_modules/results.js.erb +++ b/app/assets/javascripts/my_modules/results.js.erb @@ -85,7 +85,7 @@ function renderTable(table) { // Initialize first-time tutorial function initTutorial() { var currentStep = Cookies.get('current_tutorial_step'); - if (showTutorial() && (currentStep > 10 && currentStep < 14)) { + if (showTutorial() && (currentStep > 13 && currentStep < 17)) { var moduleResultsTutorial = $("#results").attr("data-module-protocols-step-text"); var moduleResultsClickSamplesTutorial = $("#results").attr("data-module-protocols-click-samples-step-text"); var samplesTab = $("#module-samples-nav-tab"); @@ -116,7 +116,7 @@ function initTutorial() { disableInteraction: true }) .onafterchange(function (tarEl){ - Cookies.set('current_tutorial_step', this._currentStep + 12); + Cookies.set('current_tutorial_step', this._currentStep + 15); if (this._currentStep == 1) { setTimeout(function() { $('.next-page-link a.introjs-nextbutton') @@ -130,7 +130,7 @@ function initTutorial() { positionTutorialTooltip(); } }) - .goToStep(currentStep == 13 ? 2 : 1) + .goToStep(currentStep == 16 ? 2 : 1) .start(); window.onresize = positionTutorialTooltip; diff --git a/app/assets/javascripts/projects/canvas.js.erb b/app/assets/javascripts/projects/canvas.js.erb index 6cc7d2238..9a22a6e18 100644 --- a/app/assets/javascripts/projects/canvas.js.erb +++ b/app/assets/javascripts/projects/canvas.js.erb @@ -3126,7 +3126,7 @@ function initializeTutorial(isEditMode) { canvas_tutorial_helper(); var currentStep = Cookies.get('current_tutorial_step'); // Add edit canvas tutorial step and show it - if (!isEditMode && currentStep > 2 && currentStep < 6) { + if (!isEditMode && currentStep > 4 && currentStep < 8) { var $introJs = introJs(); $introJs .setOptions({ @@ -3141,7 +3141,7 @@ function initializeTutorial(isEditMode) { tooltipClass: 'custom next-page-link' }) .onafterchange(function (tarEl) { - Cookies.set('current_tutorial_step', this._currentStep + 4); + Cookies.set('current_tutorial_step', this._currentStep + 6); if (this._currentStep == 1) { $introJs.setOption("disableInteraction", true); // Go to project canvas @@ -3160,13 +3160,13 @@ function initializeTutorial(isEditMode) { }); } }) - .goToStep(currentStep == "5" ? 2 : 1) + .goToStep(currentStep == "6" ? 2 : 1) .start(); window.onresize = function() { $(".introjs-tooltip").css("right", ($("#canvas-container").width() + 20) + "px"); }; - } else if (isEditMode && currentStep > 4 && currentStep < 7) { + } else if (isEditMode && currentStep > 6 && currentStep < 10) { canvas_tutorial_helper(); var editWorkflowTutorial = $("#canvas-container").attr("data-edit-workflow-step-text"); var editWorkflowClickSaveTutorial = $("#canvas-container").attr("data-edit-workflow-click-save-step-text"); @@ -3200,7 +3200,7 @@ function initializeTutorial(isEditMode) { }) .onafterchange(function (tarEl) { // Go to edit workflow mode - Cookies.set('current_tutorial_step', this._currentStep + 6); + Cookies.set('current_tutorial_step', this._currentStep + 8); if (this._currentStep == 0) { $(".introjs-tooltipReferenceLayer").addClass("max"); $(".introjs-tooltip").css("left", "0"); @@ -3228,11 +3228,10 @@ function initializeTutorial(isEditMode) { }); }); }, 600); - } else if (!isEditMode && currentStep > 5 || currentStep < 10) { + } else if (!isEditMode && currentStep > 8 && currentStep < 13) { canvas_tutorial_helper(); var sidebarTutorial = $("#canvas-container").attr("data-sidebar-step-text"); var sidebarClickModuleTutorial = $("#canvas-container").attr("data-sidebar-click-module-step-text"); - Cookies.set('current_tutorial_step', '8'); var qpcrModuleLeaf = $("li.leaf[data-module-id='" + tutorialData[0].qpcr_module + "']"); introJs() @@ -3260,7 +3259,7 @@ function initializeTutorial(isEditMode) { tooltipClass: 'custom next-page-link' }) .onafterchange(function(tarEl) { - Cookies.set('current_tutorial_step', this._currentStep + 8); + Cookies.set('current_tutorial_step', this._currentStep + 10); if (this._currentStep == 1) { setTimeout(function() { $('.next-page-link a.introjs-nextbutton') @@ -3271,7 +3270,7 @@ function initializeTutorial(isEditMode) { $(".introjs-tooltipReferenceLayer").css("top", $("#slide-panel .tree").height()/3 + "px"); } }) - .goToStep(currentStep == "9" ? 2 : 1) + .goToStep(currentStep == "10" ? 2 : 1) .start(); } diff --git a/app/assets/javascripts/projects/index.js.erb b/app/assets/javascripts/projects/index.js.erb index 3138f3266..345818510 100644 --- a/app/assets/javascripts/projects/index.js.erb +++ b/app/assets/javascripts/projects/index.js.erb @@ -398,10 +398,9 @@ } }; } - else if (goToStep > 18) { + else if (goToStep > 21) { var archiveProjectTutorial = $("#projects-toolbar").attr("data-archive-project-step-text"); var goodbye_message = $("#projects-toolbar").attr("data-goodbye-tutorial"); - Cookies.set('current_tutorial_step', '20'); var position = "right"; if (demoProject.offset().left > window.innerWidth / 2 || window.innerWidth < demoProject.width() + 100) { if (demoProject.offset().top > 500 && demoProject.offset().top > window.innerHeight / 2) { @@ -410,8 +409,8 @@ position = "bottom"; } } - - introJs() + var $introjs = introJs(); + $introjs .setOptions({ steps: [{ element: document.getElementById(demoProjectId), @@ -432,6 +431,9 @@ exitOnEsc: false, tooltipClass: 'custom next-page-link' }) + .onafterchange(function() { + Cookies.set('current_tutorial_step', this._currentStep + 24); + }) .oncomplete(function () { Cookies.remove('tutorial_data'); Cookies.remove('current_tutorial_step'); diff --git a/app/assets/javascripts/projects/show.js b/app/assets/javascripts/projects/show.js index 968caf871..ab6ed951f 100644 --- a/app/assets/javascripts/projects/show.js +++ b/app/assets/javascripts/projects/show.js @@ -84,7 +84,7 @@ disableInteraction: true }) .onafterchange(function (tarEl) { - Cookies.set('current_tutorial_step', this._currentStep + 2); + Cookies.set('current_tutorial_step', this._currentStep + 4); if (this._currentStep == 1) { setTimeout(function() { diff --git a/app/assets/javascripts/protocols/index.js b/app/assets/javascripts/protocols/index.js index d35c82e5e..649e2b723 100644 --- a/app/assets/javascripts/protocols/index.js +++ b/app/assets/javascripts/protocols/index.js @@ -698,6 +698,47 @@ function initImport() { }); } +/* Initilize first-time tutorial if needed */ +function initTutorial() { + var currentStep = Cookies.get('current_tutorial_step'); + var protocolButtons = $('.nav-tab .nav-settings').get(0); + if (currentStep && (currentStep > 20 && currentStep < 23)) { + introJs() + .setOptions({ + overlayOpacity: '0.1', + nextLabel: 'Next', + doneLabel: 'End tutorial', + skipLabel: 'End tutorial', + showBullets: false, + showStepNumbers: false, + exitOnOverlayClick: false, + exitOnEsc: false, + tooltipClass: 'custom' + }) + .onafterchange(function() { + Cookies.set('current_tutorial_step', this._currentStep + 22); + + if (this._currentStep === 1) { + Cookies.set('current_tutorial_step', this._currentStep + 22); + setTimeout(function() { + $('.introjs-tooltipbuttons a.introjs-nextbutton') + .removeClass('introjs-disabled') + .attr('href', '/'); + }, 500); + } + }).start(); + + // Destroy first-time tutorial cookies when skip tutorial + // or end tutorial is clicked + $('.introjs-skipbutton').each(function() { + $(this).click(function() { + Cookies.remove('tutorial_data'); + Cookies.remove('current_tutorial_step'); + }); + }); + } +} + // Initialize everything updateButtons(); initProtocolsTable(); @@ -707,3 +748,4 @@ initLinkedChildrenModal(); initCreateNewModal(); initModals(); initImport(); +initTutorial(); diff --git a/app/assets/javascripts/reports/index.js b/app/assets/javascripts/reports/index.js index 7090fd6e8..67c4ab375 100644 --- a/app/assets/javascripts/reports/index.js +++ b/app/assets/javascripts/reports/index.js @@ -141,11 +141,12 @@ /* Initilize first-time tutorial if needed */ function initTutorial() { var currentStep = Cookies.get('current_tutorial_step'); - if (showTutorial() && (currentStep > 14 && currentStep < 18)) { + if (showTutorial() && (currentStep > 17 && currentStep < 20)) { var reportsClickNewReportTutorial = $("#content").attr("data-reports-click-new-report-step-text"); introJs() .setOptions({ - steps: [{}, + steps: [ + {}, { element: document.getElementById("new-report-btn"), intro: reportsClickNewReportTutorial, @@ -163,7 +164,7 @@ tooltipClass: 'custom' }) .onafterchange(function (tarEl) { - Cookies.set('current_tutorial_step', this._currentStep + 16); + Cookies.set('current_tutorial_step', this._currentStep + 18); if (this._currentStep == 1) { setTimeout(function() { diff --git a/app/assets/javascripts/reports/new.js.erb b/app/assets/javascripts/reports/new.js.erb index feb28df16..01a2072da 100644 --- a/app/assets/javascripts/reports/new.js.erb +++ b/app/assets/javascripts/reports/new.js.erb @@ -1144,13 +1144,12 @@ function initializeTutorial() { disableInteraction: true }) .onafterchange(function (tarEl) { - Cookies.set('current_tutorial_step', this._currentStep + 18); - + Cookies.set('current_tutorial_step', this._currentStep + 20); if (this._currentStep == 1) { setTimeout(function() { $('.next-page-link a.introjs-nextbutton') .removeClass('introjs-disabled') - .attr('href', tarEl.href); + .attr('href', '/protocols'); $('.introjs-disableInteraction').remove(); }, 500); } else { @@ -1160,7 +1159,7 @@ function initializeTutorial() { .start(); window.onresize = function() { - if (Cookies.get('current_tutorial_step') == 18) { + if (Cookies.get('current_tutorial_step') == 20) { $(".introjs-tooltip").css("right", ($(".new-element.initial").width() + 60) + "px"); } }; @@ -1183,7 +1182,7 @@ function showTutorial() { else return false; var currentStep = Cookies.get('current_tutorial_step'); - if (currentStep < 16 || currentStep > 18) + if (currentStep < 18 && currentStep > 22) return false; var tutorialProjectId = tutorialData[0].project; var currentProjectId = $("#data-holder").attr("data-project-id"); diff --git a/app/assets/javascripts/samples/samples.js b/app/assets/javascripts/samples/samples.js index 09b6659a7..916457cfb 100644 --- a/app/assets/javascripts/samples/samples.js +++ b/app/assets/javascripts/samples/samples.js @@ -156,9 +156,7 @@ function sampleAlertMsgHide() { function initTutorial() { var currentStep = parseInt(Cookies.get('current_tutorial_step'), 10); - if (currentStep == 8) - currentStep++; - if (showTutorial() && (currentStep > 12 && currentStep < 16)) { + if (showTutorial() && (currentStep > 15 && currentStep < 19)) { var samplesTutorial =$("#samples-toolbar").attr("data-samples-step-text"); var breadcrumbsTutorial = $("#samples-toolbar").attr("data-breadcrumbs-step-text"); @@ -187,7 +185,7 @@ function initTutorial() { tooltipClass: "custom" }) .onafterchange(function (tarEl) { - Cookies.set('current_tutorial_step', this._currentStep + 14); + Cookies.set('current_tutorial_step', this._currentStep + 17); if (this._currentStep == 1) { setTimeout(function() { @@ -201,7 +199,7 @@ function initTutorial() { positionTutorialTooltip(); } }) - .goToStep(currentStep == 15 ? 2 : 1) + .goToStep(currentStep == 18 ? 2 : 1) .start(); // Destroy first-time tutorial cookies when skip tutorial diff --git a/app/views/experiments/canvas.html.erb b/app/views/experiments/canvas.html.erb index 76a2f7d40..8c7347da6 100644 --- a/app/views/experiments/canvas.html.erb +++ b/app/views/experiments/canvas.html.erb @@ -14,7 +14,7 @@ data: { action: 'edit', intro: t('tutorial.canvas_click_edit_workflow_html'), - step: '5', + step: '7', position: 'left' } do %> @@ -63,7 +63,7 @@