Sindbad~EG File Manager

H5PEditor.InteractiveVideo.GuidedTours = (function () {

  // Shorthand for translate function:
  var t = H5PEditor.InteractiveVideo.t;

  var currentTourId;

  /**
   * @class H5PEditor.InteractiveVideo.GuidedTours
   */
  function GuidedTours() {}

  /**
   * Defines the different tours in IV
   * @return {Array}
   */
  GuidedTours.setup = function () {

    if (GuidedTours.tours === undefined) {
      GuidedTours.tours = [
        // Upload video tab
        {
          steps: [
            {
              text: t('tourStepUploadIntroText'),
              attachTo: {element: '.h5peditor-tabs', on: 'bottom'},
              noArrow: true
            },
            {
              title: t('tourStepUploadFileTitle'),
              text: t('tourStepUploadFileText'),
              attachTo: {element: '.field.video .h5p-add-file', on: 'right'},
              highlightElement: true
            },
            {
              title: t('tourStepUploadAddInteractionsTitle'),
              text: t('tourStepUploadAddInteractionsText'),
              attachTo: {element: '.h5peditor-tab-assets', on: 'bottom'},
              highlightElement: true
            }
          ],
          options: {
            id: 'h5p-editor-interactive-video-initial-v1'
          }
        },
        // Interactions tab
        {
          steps: [
            {
              title: t('tourStepCanvasToolbarTitle'),
              text: t('tourStepCanvasToolbarText'),
              attachTo: {element: '.h5peditor-dragnbar', on: 'bottom'},
              highlightElement: true
            },
            {
              title: t('tourStepCanvasEditingTitle'),
              text: t('tourStepCanvasEditingText'),
              attachTo: {element: '.h5p-video-wrapper', on: 'center'},
              noArrow: true,
              scrollTo: true
            },
            {
              title: t('tourStepCanvasBookmarksTitle'),
              text: t('tourStepCanvasBookmarksText'),
              attachTo: {element: '.h5p-control.h5p-bookmarks', on: 'right'},
              highlightElement: true,
              scrollTo: true
            },
            {
              title: t('tourStepCanvasPreviewTitle'),
              text: t('tourStepCanvasPreviewText'),
              attachTo: {element: '.h5p-control.h5p-play', on: 'right'},
              highlightElement: true,
              scrollTo: true
            },
            {
              title: t('tourStepCanvasSaveTitle'),
              text: t('tourStepCanvasSaveText'),
              attachTo: {element: '.h5p-video-wrapper', on: 'center'},
              noArrow: true,
              scrollTo: true
            }
          ],
          options: {
            id: 'h5p-editor-interactive-video-interactions-v1'
          }
        },
        // Summary tab
        {
          steps: [
            {
              text: t('tourStepSummaryText'),
              attachTo: {element: '.h5peditor-tabs', on: 'bottom'},
              noArrow: true
            }
          ],
          options: {
            id: 'h5p-editor-interactive-video-summary-v1'
          }
        }
      ];
    }

    return GuidedTours.tours;
  };

  /**
   * Starts a guided tour
   *
   * @method GuidedTours.start
   * @static
   * @param  {number} tourId The index of the guide (as defined in the tours array)
   * @param  {boolean} force Force displaying the guide (even if it has been displayed before)
   */
  GuidedTours.start = function (tourId, force, t) {
    force = force || false;

    var tours = GuidedTours.setup();

    if ((tourId < 0 || (tourId+1) > tours.length) ||
        (tourId === currentTourId && tours[currentTourId].instance.isOpen())) {
      return;
    }

    // Hide guide if another guide is allready present - only one guide at a time
    if (currentTourId !== undefined) {
      tours[currentTourId].instance.hide();
    }

    var tour = tours[tourId];

    // Add labels:
    tour.options.labels = {
      exit: t('tourButtonExit'),
      done: t('tourButtonDone'),
      back: t('tourButtonBack'),
      next: t('tourButtonNext')
    };

    if (tour !== undefined) {
      if (tour.instance === undefined) {
        tour.instance = new H5P.GuidedTour(tour.steps, tour.options);
      }
      tour.instance.start(force, function () {
        currentTourId = tourId;
      });
    }
  };

  /**
   * Checks if any guided tour is open
   *
   * @method GuidedTours.isOpen
   * @static
   */
  GuidedTours.isOpen = function () {
    if (GuidedTours.tours) {
      for (var i = 0; i < GuidedTours.tours.length; i++) {
        if (GuidedTours.tours[i].instance && GuidedTours.tours[i].instance.isOpen()) {
          return true;
        }
      }
    }
    return false;
  };

  /**
   * Removes all guided tours
   *
   * @method GuidedTours.remove
   * @static
   */
  GuidedTours.remove = function () {
    if (!GuidedTours.tours) {
      return;
    }

    for (var i = 0; i < GuidedTours.tours.length; i++) {
      var tour = GuidedTours.tours[i].instance;
      tour && tour.destroy();
    }
  };

  return GuidedTours;
})();