diff --git a/addons/website/static/src/js/website.tour.app.js b/addons/website/static/src/js/website.tour.app.js index 442a72c145c..40d968e78f3 100644 --- a/addons/website/static/src/js/website.tour.app.js +++ b/addons/website/static/src/js/website.tour.app.js @@ -12,7 +12,7 @@ website.AppTour = website.Tour.extend({ id: 'app-tutorial', - name: "Install a new application", + name: "Install an application", init: function (editor) { var self = this; self.steps = [ @@ -31,9 +31,7 @@ title: "Install an app", content: "Add new apps by customizing your website.", triggers: function () { - editor.on('rte:customize_menu_ready', editor, function () { - self.movetoStep('install-app'); - }); + editor.on('rte:customize_menu_ready', self, self.moveToNextStep); }, }, { diff --git a/addons/website/static/src/js/website.tour.banner.js b/addons/website/static/src/js/website.tour.banner.js index d0ca68c8a6e..5e4ffbf0629 100644 --- a/addons/website/static/src/js/website.tour.banner.js +++ b/addons/website/static/src/js/website.tour.banner.js @@ -32,9 +32,7 @@ title: "Edit this page", content: "Every page of your website can be modified through the Edit button.", triggers: function () { - editor.on('tour:editor_bar_loaded', editor, function () { - self.movetoStep('add-block'); - }); + editor.on('tour:editor_bar_loaded', self, self.moveToNextStep); }, }, { @@ -44,8 +42,8 @@ title: "Insert building blocks", content: "To add content in a page, you can insert building blocks.", triggers: function () { - $('button[data-action=snippet]').click(function () { - self.movetoStep('drag-banner'); + $('button[data-action=snippet]').one('click', function () { + self.moveToNextStep(); }); } }, @@ -56,7 +54,7 @@ title: "Drag & Drop a Banner", content: "Drag the Banner block and drop it in your page.", triggers: function () { - self.onSnippetDraggedMoveTo('edit-title'); + self.onSnippetDraggedAdvance('carousel'); }, }, { @@ -81,8 +79,8 @@ content: "You can customize characteristic of any blocks through the Customize menu. For instance, change the background of the banner.", template: self.popover({ next: "Continue" }), triggers: function () { - $('.dropdown-menu [name=carousel-background]').click(function () { - self.movetoStep('save-changes'); + $('.dropdown-menu [name=carousel-background]').one('click', function () { + self.moveToNextStep(); }); }, }, diff --git a/addons/website/static/src/js/website.tour.js b/addons/website/static/src/js/website.tour.js index e17e2d83227..b41ad091191 100644 --- a/addons/website/static/src/js/website.tour.js +++ b/addons/website/static/src/js/website.tour.js @@ -48,13 +48,21 @@ isCurrentStep: function (stepId) { return this.currentStepIndex() === this.indexOfStep(stepId); }, - movetoStep: function (stepId) { - $('.popover.tour').remove(); - var index = this.indexOfStep(stepId); - if (index > -1) { - this.tour.goto(index); + moveToStep: function (step) { + var index = _.isNumber(step) ? step : this.indexOfStep(step); + if (index >= this.steps.length) { + this.stop(); + } else if (index >= 0) { + var self = this; + setTimeout(function () { + $('.popover.tour').remove(); + self.tour.goto(index); + }, 0); } }, + moveToNextStep: function () { + this.moveToStep(this.currentStepIndex() + 1); + }, stop: function () { this.tour.end(); }, @@ -82,25 +90,24 @@ popover: function (options) { return openerp.qweb.render('website.tour_popover', options); }, - onSnippetDraggedMoveTo: function (stepId) { + onSnippetDraggedAdvance: function (snippetId, stepId) { var self = this; var $body = $(document.body); + var $snippetIcon = $('#website-top-navbar [data-snippet-id='+snippetId+'].ui-draggable'); function beginDrag () { $('.popover.tour').remove(); - function goToNextStep () { + function advance () { $('#snippets').toggle(); if (stepId) { - self.movetoStep(stepId); + self.moveToStep(stepId); } else { - self.stop(); + self.moveToNextStep() } - $body.off('mouseup', goToNextStep); } - $body.off('mousedown', beginDrag); - $body.on('mouseup', goToNextStep); + $body.one('mouseup', advance); } - $body.on('mousedown', beginDrag); - } + $snippetIcon.one('mousedown', beginDrag); + }, }); website.UrlParser = openerp.Class.extend({ diff --git a/addons/website/static/src/js/website.tour.page.js b/addons/website/static/src/js/website.tour.page.js index 267afe4bebd..dd918356a28 100644 --- a/addons/website/static/src/js/website.tour.page.js +++ b/addons/website/static/src/js/website.tour.page.js @@ -40,7 +40,7 @@ content: "Click here to create a new menu entry and manage options.", triggers: function () { $(document).one('shown.bs.modal', function () { - self.movetoStep('add-menu-entry'); + self.moveToNextStep(); }); }, }, @@ -52,7 +52,7 @@ content: "Click here to create a new menu entry.", triggers: function () { $(document).one('shown.bs.modal', function () { - self.movetoStep('enter-entry-name'); + self.moveToNextStep(); }); }, }, @@ -80,7 +80,7 @@ content: "Save your new page.", triggers: function () { $(document).one('hidden.bs.modal', function () { - self.movetoStep('save-menu'); + self.moveToNextStep(); }); }, }, diff --git a/addons/website_blog/static/src/js/website.tour.blog.js b/addons/website_blog/static/src/js/website.tour.blog.js index d43ac9dfd0c..86190da4e91 100644 --- a/addons/website_blog/static/src/js/website.tour.blog.js +++ b/addons/website_blog/static/src/js/website.tour.blog.js @@ -16,7 +16,7 @@ init: function (editor) { var self = this; self.steps = [ - { + { stepId: 'welcome-blog', orphan: true, backdrop: true, @@ -40,10 +40,10 @@ content: "Click here to create a blog post.", triggers: function () { $(document).one('shown.bs.modal', function () { - $('.modal button.btn-primary').click(function () { - self.movetoStep('post-page'); + $('.modal button.btn-primary').one('click', function () { + self.moveToStep('post-page'); }); - self.movetoStep('choose-category'); + self.moveToNextStep(); }); }, }, @@ -54,13 +54,14 @@ title: "Choose the post category", content: "Select the 'News' category and click 'Continue'.", triggers: function () { - $('.modal select').change(function () { + function newsSelected () { var $this = $(this); - var selected = $this.find("[value="+$this.val()+"]").text(); - if (selected.toLowerCase() === 'news') { - self.movetoStep('continue-category'); + if ($this.find('[value='+$this.val()+']').text().toLowerCase() === 'news') { + self.moveToNextStep(); + $('.modal select').off('change', newsSelected); } - }); + } + $('.modal select').on('change', newsSelected); }, }, { @@ -93,10 +94,10 @@ title: "Layout your blog post", content: "Insert blocks like text-image to layout the body of your blog post.", triggers: function () { - $('button[data-action=snippet]').click(function () { - self.movetoStep('drag-image-text'); + $('button[data-action=snippet]').one('click', function () { + self.moveToNextStep(); }); - } + }, }, { stepId: 'drag-image-text', @@ -105,7 +106,7 @@ title: "Drag & Drop a block", content: "Drag the 'Image Text' block and drop it in your page.", triggers: function () { - self.onSnippetDraggedMoveTo('add-text-block'); + self.onSnippetDraggedAdvance('image-text'); }, }, { @@ -115,8 +116,8 @@ title: "Add another block", content: "Let's add another blog to your post.", triggers: function () { - $('button[data-action=snippet]').click(function () { - self.movetoStep('drag-text-block'); + $('button[data-action=snippet]').on('click', function () { + self.moveToNextStep(); }); } }, @@ -127,7 +128,7 @@ title: "Drag & Drop a block", content: "Drag the 'Text Block' block and drop it below the image block.", triggers: function () { - self.onSnippetDraggedMoveTo('activate-text-block-title'); + self.onSnippetDraggedAdvance('text-block'); }, }, { @@ -137,8 +138,8 @@ title: "Activate on the title", content: "Click on the title to activate it.", triggers: function () { - $('#wrap [data-snippet-id=text-block] .text-center[data-snippet-id=colmd]').click(function () { - self.movetoStep('remove-text-block-title'); + $('#wrap [data-snippet-id=text-block] .text-center[data-snippet-id=colmd]').one('click', function () { + self.moveToNextStep(); }); }, }, diff --git a/addons/website_event/static/src/js/website.tour.event.js b/addons/website_event/static/src/js/website.tour.event.js index a724b024813..e9da4fb4f0f 100644 --- a/addons/website_event/static/src/js/website.tour.event.js +++ b/addons/website_event/static/src/js/website.tour.event.js @@ -40,10 +40,10 @@ content: "Click here to create an event.", triggers: function () { $(document).one('shown.bs.modal', function () { - $('.modal button.btn-primary').click(function () { - self.movetoStep('event-page'); + $('.modal button.btn-primary').one('click', function () { + self.moveToStep('event-page'); }); - self.movetoStep('choose-category'); + self.moveToNextStep(); }); }, }, @@ -66,7 +66,6 @@ stepId: 'add-block', element: 'button[data-action=snippet]', placement: 'bottom', - reflex: true, title: "Layout your event", content: "Insert blocks like text-image to layout the body of your event.", }, diff --git a/addons/website_sale/static/src/js/website.tour.shop.js b/addons/website_sale/static/src/js/website.tour.shop.js index 8f22205eb8c..c8ac02bba50 100644 --- a/addons/website_sale/static/src/js/website.tour.shop.js +++ b/addons/website_sale/static/src/js/website.tour.shop.js @@ -40,10 +40,10 @@ content: "Select 'New Product' to create it and manage its properties to boost your sales.", triggers: function () { $(document).one('shown.bs.modal', function () { - $('.modal button.btn-primary').click(function () { - self.movetoStep('product-page'); + $('.modal button.btn-primary').one('click', function () { + self.moveToStep('product-page'); }); - self.movetoStep('enter-name'); + self.moveToNextStep(); }); }, }, @@ -52,7 +52,7 @@ element: '.modal input[type=text]', placement: 'right', title: "Choose name", - content: "Enter a name for your new product.", + content: "Enter a name for your new product then click 'Continue'.", }, { @@ -75,9 +75,23 @@ stepId: 'add-block', element: 'button[data-action=snippet]', placement: 'bottom', - reflex: true, title: "Describe the product for your audience", content: "Insert blocks like text-image, or gallery to fully describe the product and make your visitors want to buy this product.", + triggers: function () { + $('button[data-action=snippet]').one('click', function () { + self.moveToNextStep(); + }); + }, + }, + { + stepId: 'drag-big-picture', + element: '#website-top-navbar [data-snippet-id=big-picture].ui-draggable', + placement: 'bottom', + title: "Drag & Drop a block", + content: "Drag the 'Big Picture' block and drop it in your page.", + triggers: function () { + self.onSnippetDraggedAdvance('big-picture'); + }, }, ]; return this._super();