From 49f17be9df821e2005c010b9ecd0c3d3f8fbe7ee Mon Sep 17 00:00:00 2001 From: Mads Rasmussen Date: Wed, 18 Oct 2017 08:46:13 +0200 Subject: [PATCH] fixes: U4-10540 Make it possible to run custom logic for a tour step --- .../application/umbtour.directive.js | 64 +++++++------------ .../umbtour/umbtourstep.directive.js | 19 ++++++ .../umbtour/umbtourstepcontent.directive.js | 22 +++++++ .../umbtour/umbtourstepcounter.directive.js | 22 +++++++ .../umbtour/umbtourstepfooter.directive.js | 19 ++++++ .../umbtour/umbtourstepheader.directive.js | 21 ++++++ .../src/common/services/tour.service.js | 25 +++++--- .../nodename/nodename.controller.js | 24 +++++++ .../nodename/nodename.html | 26 ++++++++ .../doctypename/doctypename.controller.js | 24 +++++++ .../doctypename/doctypename.html | 26 ++++++++ .../propertyname/propertyname.controller.js | 24 +++++++ .../propertyname/propertyname.html | 26 ++++++++ .../uploadimages/uploadimages.controller.js | 41 ++++++++++++ .../uploadimages/uploadimages.html | 26 ++++++++ .../templatetree/templatetree.controller.js | 21 ++++++ .../templatetree/templatetree.html | 24 +++++++ .../components/application/umb-tour.html | 51 ++++++++++----- .../umbtour/umb-tour-step-content.html | 4 ++ .../umbtour/umb-tour-step-counter.html | 1 + .../umbtour/umb-tour-step-footer.html | 1 + .../umbtour/umb-tour-step-header.html | 1 + .../application/umbtour/umb-tour-step.html | 1 + 23 files changed, 446 insertions(+), 67 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstep.directive.js create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepcontent.directive.js create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepcounter.directive.js create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepfooter.directive.js create mode 100644 src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepheader.directive.js create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatecontent/nodename/nodename.controller.js create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatecontent/nodename/nodename.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/doctypename/doctypename.controller.js create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/doctypename/doctypename.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/propertyname/propertyname.controller.js create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/propertyname/propertyname.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintromediasection/uploadimages/uploadimages.controller.js create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintromediasection/uploadimages/uploadimages.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrorenderintemplate/templatetree/templatetree.controller.js create mode 100644 src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrorenderintemplate/templatetree/templatetree.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-content.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-counter.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-footer.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-header.html create mode 100644 src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step.html diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js index f960f644f2..12696f9441 100644 --- a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour.directive.js @@ -126,13 +126,13 @@ function _position() { - var element = $(scope.currentStep.element); - var offset = element.offset(); - var width = element.outerWidth(true); - var height = element.outerHeight(true); - $timeout(function () { + var element = $(scope.currentStep.element); + var offset = element.offset(); + var width = element.outerWidth(true); + var height = element.outerHeight(true); + var popoverWidth = popover.outerWidth(true); var popoverHeight = popover.outerHeight(true); var popoverOffset = popover.offset(); @@ -140,65 +140,49 @@ var documentHeight = $(document).height(); var position; var css = {}; + + // messure available space on each side of the target element + var space = { + "top": offset.top, + "right": documentWidth - (offset.left + width), + "bottom": documentHeight - (offset.top + height), + "left": offset.left + }; console.log("SPACE", space); console.log("document width", documentWidth); console.log("document height", documentHeight); - - - // If no specific position is set - find the position with most available space - if(scope.currentStep.placement) { - - position = scope.currentStep.placement; - - } else { - - var space = { - "top": offset.top, - "right": documentWidth - (offset.left + width), - "bottom": documentHeight - (offset.top + height), - "left": offset.left - }; - - position = findMax(space); - } + // get the posistion with most available space + position = findMax(space); if(position === "top") { - if (offset.left < documentWidth/2) { - css = {top: offset.top - popoverHeight, left: offset.left}; - + css = {top: offset.top - popoverHeight, left: offset.left}; } else { css = {top: offset.top - popoverHeight, left: offset.left - popoverWidth + width}; } } if(position === "right") { - if (offset.top < documentHeight/2) { - css = {top: offset.top, left: offset.left + width}; - + css = {top: offset.top, left: offset.left + width}; } else { css = {top: offset.top + height - popoverHeight, left: offset.left + width}; } } if(position === "bottom") { - if (offset.left < documentWidth/2) { - css = {top: offset.top + height, left: offset.left}; - + css = {top: offset.top + height, left: offset.left}; } else { css = {top: offset.top + height, left: offset.left - popoverWidth + width}; } } if(position === "left") { - if (offset.top < documentHeight/2) { css = {top: offset.top, left: offset.left - popoverWidth}; - } else { css = {top: offset.top + height - popoverHeight, left: offset.left - popoverWidth}; } @@ -228,8 +212,8 @@ function bindEvent() { var eventName = scope.currentStep.event + ".step-" + scope.currentStepIndex; - if(scope.currentStep.clickElement) { - $(scope.currentStep.clickElement).on(eventName, handleEvent); + if(scope.currentStep.eventElement) { + $(scope.currentStep.eventElement).on(eventName, handleEvent); console.log("bind", eventName); } else { $(scope.currentStep.element).on(eventName, handleEvent); @@ -239,17 +223,17 @@ function unbindEvent() { var eventName = scope.currentStep.event + ".step-" + scope.currentStepIndex; - if(scope.currentStep.clickElement) { - $(scope.currentStep.clickElement).off(eventName); + if(scope.currentStep.eventElement) { + $(scope.currentStep.eventElement).off(eventName); console.log("unbind", eventName); } else { $(scope.currentStep.element).off(eventName); - console.log("unbind", eventName); + console.log("unbind", eventName); } } function handleEvent() { - alert("event happened"); + //alert("event happened"); unbindEvent(); nextStep(); } diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstep.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstep.directive.js new file mode 100644 index 0000000000..039d8bb838 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstep.directive.js @@ -0,0 +1,19 @@ +(function() { + 'use strict'; + + function TourStepDirective() { + + var directive = { + restrict: 'E', + replace: true, + transclude: true, + templateUrl: 'views/components/application/umbtour/umb-tour-step.html' + }; + + return directive; + + } + + angular.module('umbraco.directives').directive('umbTourStep', TourStepDirective); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepcontent.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepcontent.directive.js new file mode 100644 index 0000000000..52ed358b61 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepcontent.directive.js @@ -0,0 +1,22 @@ +(function() { + 'use strict'; + + function TourStepContentDirective() { + + var directive = { + restrict: 'E', + replace: true, + transclude: true, + templateUrl: 'views/components/application/umbtour/umb-tour-step-content.html', + scope: { + content: "=" + } + }; + + return directive; + + } + + angular.module('umbraco.directives').directive('umbTourStepContent', TourStepContentDirective); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepcounter.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepcounter.directive.js new file mode 100644 index 0000000000..7e04ef5d00 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepcounter.directive.js @@ -0,0 +1,22 @@ +(function() { + 'use strict'; + + function TourStepCounterDirective() { + + var directive = { + restrict: 'E', + replace: true, + templateUrl: 'views/components/application/umbtour/umb-tour-step-counter.html', + scope: { + currentStep: "=", + totalSteps: "=" + } + }; + + return directive; + + } + + angular.module('umbraco.directives').directive('umbTourStepCounter', TourStepCounterDirective); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepfooter.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepfooter.directive.js new file mode 100644 index 0000000000..fedb527972 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepfooter.directive.js @@ -0,0 +1,19 @@ +(function() { + 'use strict'; + + function TourStepFooterDirective() { + + var directive = { + restrict: 'E', + replace: true, + transclude: true, + templateUrl: 'views/components/application/umbtour/umb-tour-step-footer.html' + }; + + return directive; + + } + + angular.module('umbraco.directives').directive('umbTourStepFooter', TourStepFooterDirective); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepheader.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepheader.directive.js new file mode 100644 index 0000000000..60c052e2e3 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/application/umbtour/umbtourstepheader.directive.js @@ -0,0 +1,21 @@ +(function() { + 'use strict'; + + function TourStepHeaderDirective() { + + var directive = { + restrict: 'E', + replace: true, + templateUrl: 'views/components/application/umbtour/umb-tour-step-header.html', + scope: { + title: "=" + } + }; + + return directive; + + } + + angular.module('umbraco.directives').directive('umbTourStepHeader', TourStepHeaderDirective); + +})(); diff --git a/src/Umbraco.Web.UI.Client/src/common/services/tour.service.js b/src/Umbraco.Web.UI.Client/src/common/services/tour.service.js index 25f1306df0..de6ef7f93d 100644 --- a/src/Umbraco.Web.UI.Client/src/common/services/tour.service.js +++ b/src/Umbraco.Web.UI.Client/src/common/services/tour.service.js @@ -22,7 +22,7 @@ title: "Create document type", content: "

Hover the document types tree and click the three small dots to open the context menu

", event: "click", - clickElement: "#tree [data-element='tree-item-documentTypes'] [data-element='tree-item-options']" + eventElement: "#tree [data-element='tree-item-documentTypes'] [data-element='tree-item-options']" }, { element: "#dialog [data-element='action-documentType']", @@ -33,7 +33,8 @@ { element: "[data-element='editor-name-field']", title: "Enter a name", - content: "

Our document type needs a name. Enter Home in the field and click Next

" + content: "

Our document type needs a name. Enter Home in the field and click Next

", + view: "doctypename" }, { element: "[data-element='editor-description']", @@ -60,7 +61,8 @@ { element: "[data-element~='overlay-property-settings'] [data-element='property-name']", title: "Enter a name", - content: "Enter Welcome Text as name for the property" + content: "Enter Welcome Text as name for the property", + view: "propertyname" }, { element: "[data-element~='overlay-property-settings'] [data-element='property-description']", @@ -119,7 +121,7 @@ title: "Open context menu", content: "

Open the context menu by hovering the root of the content section.

Now click the three small dots to the right

", event: "click", - clickElement: "[data-element='tree-root'] [data-element='tree-item-options']" + eventElement: "[data-element='tree-root'] [data-element='tree-item-options']" }, { element: "[data-element='action-create-home']", @@ -130,7 +132,8 @@ { element: "[data-element='editor-content'] [data-element='editor-name-field']", title: "Give your new page a name", - content: "

Our new page needs a name. Enter Home in the field and click Next

" + content: "

Our new page needs a name. Enter Home in the field and click Next

", + view: "nodename" }, { element: "[data-element='editor-content'] [data-element='property-welcomeText']", @@ -161,7 +164,8 @@ title: "Expand the Templates node", content: "

To see all our templates click the small triangle to the left of the templates node

", event: "click", - clickElement: "#tree [data-element='tree-item-templates'] [data-element='tree-item-expand']" + eventElement: "#tree [data-element='tree-item-templates'] [data-element='tree-item-expand']", + view: "templatetree" }, { element: "#tree [data-element='tree-item-templates'] [data-element='tree-item-Home']", @@ -204,7 +208,7 @@ title: "Open page", content: "

Click the Link to view your page.

Tip: Click the preview button in the bottom right corner to preview changes without publishing them

", event: "click", - clickElement: "[data-element='editor-content'] [data-element='property-_umb_urls'] a[target='_blank']" + eventElement: "[data-element='editor-content'] [data-element='property-_umb_urls'] a[target='_blank']" } ] }, @@ -224,7 +228,7 @@ title: "Create a new folder", content: "

Hover the media root and click the three small dots on the right side of the item

", event: "click", - clickElement: "#tree [data-element='tree-root'] [data-element='tree-item-options']" + eventElement: "#tree [data-element='tree-root'] [data-element='tree-item-options']" }, { element: "#dialog [data-element='action-Folder']", @@ -246,14 +250,15 @@ { element: "[data-element='editor-media'] [data-element='dropzone']", title: "Upload images", - content: "

In the upload area you can upload your media items.

Click the Upload button and select some images on your computer and upload them.

" + content: "

In the upload area you can upload your media items.

Click the Upload button and select some images on your computer and upload them.

", + view: "uploadimages" }, { element: "[data-element='editor-media'] [data-element='media-grid-item-0']", title: "View media item details", content: "Hover the media item and Click the purple bar to view details about the media item", event: "click", - clickElement: "[data-element='editor-media'] [data-element='media-grid-item-0'] [data-element='media-grid-item-edit']" + eventElement: "[data-element='editor-media'] [data-element='media-grid-item-0'] [data-element='media-grid-item-edit']" }, { element: "[data-element='editor-media'] [data-element='property-umbracoFile']", diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatecontent/nodename/nodename.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatecontent/nodename/nodename.controller.js new file mode 100644 index 0000000000..919b8dc1a0 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatecontent/nodename/nodename.controller.js @@ -0,0 +1,24 @@ +(function () { + "use strict"; + + function NodeNameController($scope) { + + var vm = this; + var element = angular.element($scope.model.currentStep.element); + + vm.error = false; + + vm.initNextStep = initNextStep; + + function initNextStep() { + if(element.val() === 'Home') { + $scope.model.nextStep(); + } else { + vm.error = true; + } + } + + } + + angular.module("umbraco").controller("Umbraco.Tours.umbIntroCreateDocType.NodeNameController", NodeNameController); +})(); diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatecontent/nodename/nodename.html b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatecontent/nodename/nodename.html new file mode 100644 index 0000000000..60505dc35a --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatecontent/nodename/nodename.html @@ -0,0 +1,26 @@ + + + + + + +
Please enter Home in the field
+ + + + + + + +
+ + +
+ + + + \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/doctypename/doctypename.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/doctypename/doctypename.controller.js new file mode 100644 index 0000000000..f859d01272 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/doctypename/doctypename.controller.js @@ -0,0 +1,24 @@ +(function () { + "use strict"; + + function DocTypeNameController($scope) { + + var vm = this; + var element = angular.element($scope.currentStep.element); + + vm.error = false; + + vm.initNextStep = initNextStep; + + function initNextStep() { + if(element.val() === 'Home') { + $scope.nextStep(); + } else { + vm.error = true; + } + } + + } + + angular.module("umbraco").controller("Umbraco.Tours.UmbIntroCreateDocType.DocTypeNameController", DocTypeNameController); +})(); diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/doctypename/doctypename.html b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/doctypename/doctypename.html new file mode 100644 index 0000000000..9172b06e41 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/doctypename/doctypename.html @@ -0,0 +1,26 @@ + + + + + + +
Please enter Home in the field
+ + + + + + + +
+ + +
+ + + + \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/propertyname/propertyname.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/propertyname/propertyname.controller.js new file mode 100644 index 0000000000..c2ff16dd86 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/propertyname/propertyname.controller.js @@ -0,0 +1,24 @@ +(function () { + "use strict"; + + function PropertyNameController($scope) { + + var vm = this; + var element = angular.element($scope.currentStep.element); + + vm.error = false; + + vm.initNextStep = initNextStep; + + function initNextStep() { + if(element.val() === 'Welcome Text') { + $scope.nextStep(); + } else { + vm.error = true; + } + } + + } + + angular.module("umbraco").controller("Umbraco.Tours.UmbIntroCreateDocType.PropertyNameController", PropertyNameController); +})(); diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/propertyname/propertyname.html b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/propertyname/propertyname.html new file mode 100644 index 0000000000..27e74e7a8c --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrocreatedoctype/propertyname/propertyname.html @@ -0,0 +1,26 @@ + + + + + + +
Please enter Welcome Text in the field
+ + + + + + + +
+ + +
+ + + + \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintromediasection/uploadimages/uploadimages.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintromediasection/uploadimages/uploadimages.controller.js new file mode 100644 index 0000000000..2c0faa2ca4 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintromediasection/uploadimages/uploadimages.controller.js @@ -0,0 +1,41 @@ +(function () { + "use strict"; + + function UploadImagesController($scope, editorState, mediaResource) { + + var vm = this; + var element = angular.element($scope.currentStep.element); + + vm.error = false; + + vm.initNextStep = initNextStep; + + function initNextStep() { + + vm.error = false; + vm.buttonState = "busy"; + + var currentNode = editorState.getCurrent(); + + // make sure we have uploaded at least one image + mediaResource.getChildren(currentNode.id) + .then(function (data) { + + var children = data; + + if(children.items && children.items.length > 0) { + $scope.nextStep(); + } else { + vm.error = true; + } + + vm.buttonState = "init"; + + }); + + } + + } + + angular.module("umbraco").controller("Umbraco.Tours.UmbIntroMediaSection.UploadImagesController", UploadImagesController); +})(); diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintromediasection/uploadimages/uploadimages.html b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintromediasection/uploadimages/uploadimages.html new file mode 100644 index 0000000000..75cdcb322b --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintromediasection/uploadimages/uploadimages.html @@ -0,0 +1,26 @@ + + + + + + +
Please upload an image
+ + + + + + + +
+ + +
+ + + + \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrorenderintemplate/templatetree/templatetree.controller.js b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrorenderintemplate/templatetree/templatetree.controller.js new file mode 100644 index 0000000000..a8a08b7c67 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrorenderintemplate/templatetree/templatetree.controller.js @@ -0,0 +1,21 @@ +(function () { + "use strict"; + + function TemplatesTreeController($scope) { + + var vm = this; + var eventElement = angular.element($scope.currentStep.eventElement); + + function onInit() { + // check if tree is already open - if it is - go to next step + if(eventElement.hasClass("icon-navigation-down")) { + $scope.nextStep(); + } + } + + onInit(); + + } + + angular.module("umbraco").controller("Umbraco.Tours.UmbIntroRenderInTemplate.TemplatesTreeController", TemplatesTreeController); +})(); diff --git a/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrorenderintemplate/templatetree/templatetree.html b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrorenderintemplate/templatetree/templatetree.html new file mode 100644 index 0000000000..569a58d1ed --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/common/tours/umbintrorenderintemplate/templatetree/templatetree.html @@ -0,0 +1,24 @@ + + + + + + + + + + + + + +
+ +
+ + + + \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/application/umb-tour.html b/src/Umbraco.Web.UI.Client/src/views/components/application/umb-tour.html index 791fb75d6b..397421418a 100644 --- a/src/Umbraco.Web.UI.Client/src/views/components/application/umb-tour.html +++ b/src/Umbraco.Web.UI.Client/src/views/components/application/umb-tour.html @@ -10,27 +10,44 @@ -
-
{{ currentStep.title }}
-
-
-
Step {{ currentStepIndex + 1 }} of {{ tour.steps.length }}
-
- - +
+ + + + + + + + + + + + + +
+ + +
+ + + + + +
+
WOOOHOOO!
+
Your completed the tour. That is amazing!
+
+
+
-
-
WOOOHOOO!
-
Your completed the tour. That is amazing!
-
- -
-
- -
+
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-content.html b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-content.html new file mode 100644 index 0000000000..ffbfb47a5b --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-content.html @@ -0,0 +1,4 @@ +
+
+
+
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-counter.html b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-counter.html new file mode 100644 index 0000000000..0c618419b9 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-counter.html @@ -0,0 +1 @@ +
Step {{ currentStep }} of {{ totalSteps }}
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-footer.html b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-footer.html new file mode 100644 index 0000000000..2b03260698 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-footer.html @@ -0,0 +1 @@ +
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-header.html b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-header.html new file mode 100644 index 0000000000..3adb526b8e --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step-header.html @@ -0,0 +1 @@ +
{{title}}
\ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step.html b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step.html new file mode 100644 index 0000000000..2b03260698 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/views/components/application/umbtour/umb-tour-step.html @@ -0,0 +1 @@ +
\ No newline at end of file