83 lines
2.9 KiB
JavaScript
83 lines
2.9 KiB
JavaScript
/**
|
|
* @file
|
|
* A Backbone View that provides the app-level interactive menu.
|
|
*/
|
|
(function($, _, Backbone, Drupal) {
|
|
|
|
"use strict";
|
|
|
|
Drupal.edit = Drupal.edit || {};
|
|
Drupal.edit.views = Drupal.edit.views || {};
|
|
Drupal.edit.views.MenuView = Backbone.View.extend({
|
|
|
|
events: {
|
|
'click #toolbar-tab-edit': 'editClickHandler'
|
|
},
|
|
|
|
/**
|
|
* Implements Backbone Views' initialize() function.
|
|
*/
|
|
initialize: function() {
|
|
_.bindAll(this, 'stateChange');
|
|
this.model.on('change:isViewing', this.stateChange);
|
|
// @todo
|
|
// Re-implement hook_toolbar and the corresponding JavaScript behaviors
|
|
// once https://drupal.org/node/1847198 is resolved. The toolbar tray is
|
|
// necessary when the page request is processed because its render element
|
|
// has an #attached property with the Edit module library code assigned to
|
|
// it. Currently a toolbar tab is not passed as a renderable array, so
|
|
// #attached properties are not processed. The toolbar tray DOM element is
|
|
// unnecessary right now, so it is removed.
|
|
this.$el.find('#toolbar-tray-edit').remove();
|
|
// Respond to clicks on other toolbar tabs. This temporary pending
|
|
// improvements to the toolbar module.
|
|
$('#toolbar-administration').on('click.edit', '.bar a:not(#toolbar-tab-edit)', _.bind(function (event) {
|
|
this.model.set('isViewing', true);
|
|
}, this));
|
|
// We have to call stateChange() here because URL fragments are not passed
|
|
// to the server, thus the wrong anchor may be marked as active.
|
|
this.stateChange();
|
|
},
|
|
|
|
/**
|
|
* Listens to app state changes.
|
|
*/
|
|
stateChange: function() {
|
|
var isViewing = this.model.get('isViewing');
|
|
// Toggle the state of the Toolbar Edit tab based on the isViewing state.
|
|
this.$el.find('#toolbar-tab-edit')
|
|
.toggleClass('active', !isViewing)
|
|
.attr('aria-pressed', !isViewing);
|
|
// Manage the toolbar state until
|
|
// https://drupal.org/node/1847198 is resolved
|
|
if (!isViewing) {
|
|
// Remove the 'toolbar-tray-open' class from the body element.
|
|
this.$el.removeClass('toolbar-tray-open');
|
|
// Deactivate any other active tabs and trays.
|
|
this.$el
|
|
.find('.bar a', '#toolbar-administration')
|
|
.not('#toolbar-tab-edit')
|
|
.add('.tray', '#toolbar-administration')
|
|
.removeClass('active');
|
|
// Set the height of the toolbar.
|
|
if ('toolbar' in Drupal) {
|
|
Drupal.toolbar.setHeight();
|
|
}
|
|
}
|
|
},
|
|
/**
|
|
* Handles clicks on the edit tab of the toolbar.
|
|
*
|
|
* @param {Object} event
|
|
*/
|
|
editClickHandler: function (event) {
|
|
var isViewing = this.model.get('isViewing');
|
|
// Toggle the href of the Toolbar Edit tab based on the isViewing state. The
|
|
// href value should represent to state to be entered.
|
|
this.$el.find('#toolbar-tab-edit').attr('href', (isViewing) ? '#edit' : '#view');
|
|
this.model.set('isViewing', !isViewing);
|
|
}
|
|
});
|
|
|
|
})(jQuery, _, Backbone, Drupal);
|