Initial commit

lib/assets/javascripts/new-dashboard/components/Onboarding/wizard/createWizard.js

@@ -0,0 +1,83 @@
+import Step from 'new-dashboard/components/Onboarding/components/Step.vue';
+import Header from 'new-dashboard/components/Onboarding/components/Header.vue';
+import Footer from 'new-dashboard/components/Onboarding/components/Footer.vue';
+import Modal from 'new-dashboard/components/Modal.vue';
+
+import mixin from '../tutorials/mixin';
+import template from './template.html';
+import './style.scss';
+
+const defaultComponentConfiguration = {
+  template,
+  components: {
+    Step,
+    Header,
+    Footer,
+    Modal
+  },
+  mixins: [mixin]
+};
+
+/**
+* Onboarding Wizard Creation
+*
+* Function to create a new wizard from a defined steps
+*
+* @param {string} name - Name for the generated wizard.
+* @param {array} steps - Wizard's steps definition.
+*
+* Each step within the array needs to follow this format:
+* { stepName: <String>, component: <ComponentObject> }
+*
+*   stepName: Name that the step takes in the wizard
+*   component: Vue component object definition for the Step
+*/
+
+export function createWizard (name = '', steps = {}, showFooter = true) {
+  const stepsLength = Object.keys(steps).length;
+
+  if (!steps || !stepsLength) {
+    throw new Error('Steps components are needed to generate a Wizard');
+  }
+
+  const wizardConfiguration = generateWizardConfiguration(name, steps, showFooter);
+
+  return {
+    ...defaultComponentConfiguration,
+    ...wizardConfiguration
+  };
+}
+
+function generateWizardConfiguration (name, steps, showFooter) {
+  // Generate Wizard configuration
+  const { components, stepNames } = parseSteps(steps);
+
+  const wizardComponents = {
+    ...defaultComponentConfiguration.components,
+    ...components
+  };
+
+  return {
+    name,
+    components: wizardComponents,
+    data () {
+      return {
+        wizardName: name,
+        stepNames,
+        showFooter
+      };
+    }
+  };
+}
+
+function parseSteps (steps) {
+  const components = {};
+  const stepNames = [];
+
+  Object.values(steps).forEach(component => {
+    components[component.name] = component;
+    stepNames.push(component.stepName);
+  });
+
+  return { components, stepNames };
+}