123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131 |
- /**
- * DO NOT EDIT THIS FILE.
- * See the following change record for more information,
- * https://www.drupal.org/node/2815083
- * @preserve
- **/
- (function ($, Backbone, Drupal, document) {
- var queryString = decodeURI(window.location.search);
- Drupal.behaviors.tour = {
- attach: function attach(context) {
- $('body').once('tour').each(function () {
- var model = new Drupal.tour.models.StateModel();
- new Drupal.tour.views.ToggleTourView({
- el: $(context).find('#toolbar-tab-tour'),
- model: model
- });
- model.on('change:isActive', function (model, isActive) {
- $(document).trigger(isActive ? 'drupalTourStarted' : 'drupalTourStopped');
- }).set('tour', $(context).find('ol#tour'));
- if (/tour=?/i.test(queryString)) {
- model.set('isActive', true);
- }
- });
- }
- };
- Drupal.tour = Drupal.tour || {
- models: {},
- views: {}
- };
- Drupal.tour.models.StateModel = Backbone.Model.extend({
- defaults: {
- tour: [],
- isActive: false,
- activeTour: []
- }
- });
- Drupal.tour.views.ToggleTourView = Backbone.View.extend({
- events: { click: 'onClick' },
- initialize: function initialize() {
- this.listenTo(this.model, 'change:tour change:isActive', this.render);
- this.listenTo(this.model, 'change:isActive', this.toggleTour);
- },
- render: function render() {
- this.$el.toggleClass('hidden', this._getTour().length === 0);
- var isActive = this.model.get('isActive');
- this.$el.find('button').toggleClass('is-active', isActive).prop('aria-pressed', isActive);
- return this;
- },
- toggleTour: function toggleTour() {
- if (this.model.get('isActive')) {
- var $tour = this._getTour();
- this._removeIrrelevantTourItems($tour, this._getDocument());
- var that = this;
- var close = Drupal.t('Close');
- if ($tour.find('li').length) {
- $tour.joyride({
- autoStart: true,
- postRideCallback: function postRideCallback() {
- that.model.set('isActive', false);
- },
- template: {
- link: '<a href="#close" class="joyride-close-tip" aria-label="' + close + '">×</a>',
- button: '<a href="#" class="button button--primary joyride-next-tip"></a>'
- }
- });
- this.model.set({ isActive: true, activeTour: $tour });
- }
- } else {
- this.model.get('activeTour').joyride('destroy');
- this.model.set({ isActive: false, activeTour: [] });
- }
- },
- onClick: function onClick(event) {
- this.model.set('isActive', !this.model.get('isActive'));
- event.preventDefault();
- event.stopPropagation();
- },
- _getTour: function _getTour() {
- return this.model.get('tour');
- },
- _getDocument: function _getDocument() {
- return $(document);
- },
- _removeIrrelevantTourItems: function _removeIrrelevantTourItems($tour, $document) {
- var removals = false;
- var tips = /tips=([^&]+)/.exec(queryString);
- $tour.find('li').each(function () {
- var $this = $(this);
- var itemId = $this.attr('data-id');
- var itemClass = $this.attr('data-class');
- if (tips && !$(this).hasClass(tips[1])) {
- removals = true;
- $this.remove();
- return;
- }
- if (!itemId && !itemClass || itemId && $document.find('#' + itemId).length || itemClass && $document.find('.' + itemClass).length) {
- return;
- }
- removals = true;
- $this.remove();
- });
- if (removals) {
- var total = $tour.find('li').length;
- if (!total) {
- this.model.set({ tour: [] });
- }
- $tour.find('li').each(function (index) {
- var progress = Drupal.t('!tour_item of !total', { '!tour_item': index + 1, '!total': total });
- $(this).find('.tour-progress').text(progress);
- }).eq(-1).attr('data-text', Drupal.t('End tour'));
- }
- }
- });
- })(jQuery, Backbone, Drupal, document);
|