first commit
This commit is contained in:
CHIEFSOFT\ameye
@@ -0,0 +1,269 @@
|
||||
/**
|
||||
* @file js/controllers/grid/navigationMenus/form/NavigationMenuFormHandler.js
|
||||
*
|
||||
* Copyright (c) 2014-2021 Simon Fraser University
|
||||
* Copyright (c) 2000-2021 John Willinsky
|
||||
* Distributed under the GNU GPL v3. For full terms see the file docs/COPYING.
|
||||
*
|
||||
* @class NavigationMenuFormHandler
|
||||
* @ingroup js_controllers_grid_navigationMenus_form
|
||||
*
|
||||
* @brief NavigationMenuItems form handler.
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
/**
|
||||
* Define the namespace
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus =
|
||||
$.pkp.controllers.grid.navigationMenus ||
|
||||
{ form: {} };
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* @constructor
|
||||
*
|
||||
* @extends $.pkp.controllers.form.AjaxFormHandler
|
||||
*
|
||||
* @param {jQueryObject} $formElement The form element
|
||||
* @param {Object} options Modal options.
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler =
|
||||
function($formElement, options) {
|
||||
|
||||
this.okButton_ = options.okButton;
|
||||
this.warningModalTitle_ = options.warningModalTitle;
|
||||
this.submenuWarning_ = options.submenuWarning;
|
||||
this.itemTypeConditionalWarnings_ = options.itemTypeConditionalWarnings;
|
||||
|
||||
$formElement.on('click', '.btnConditionalDisplay',
|
||||
this.callbackWrapper(this.showConditionalDisplayWarning));
|
||||
$formElement.on('click', '.btnSubmenuWarning',
|
||||
this.callbackWrapper(this.showSubmenuWarning));
|
||||
|
||||
this.parent($formElement, options);
|
||||
this.initSorting();
|
||||
};
|
||||
|
||||
|
||||
$.pkp.classes.Helper.inherits(
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler,
|
||||
$.pkp.controllers.form.AjaxFormHandler);
|
||||
|
||||
|
||||
//
|
||||
// Private properties
|
||||
//
|
||||
|
||||
|
||||
/**
|
||||
* The label for the ok button on the modals displaying submenuWarning and
|
||||
* conditionalWarnings.
|
||||
* @private
|
||||
* @type {?string}
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler
|
||||
.prototype.okButton_ = null;
|
||||
|
||||
|
||||
/**
|
||||
* The title of the modals displaying submenuWarning and conditionalWarnings.
|
||||
* @private
|
||||
* @type {?string}
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler
|
||||
.prototype.warningModalTitle_ = null;
|
||||
|
||||
|
||||
/**
|
||||
* The warning message to display about submenus
|
||||
* @private
|
||||
* @type {string|undefined}
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler
|
||||
.prototype.submenuWarning_ = undefined;
|
||||
|
||||
|
||||
/**
|
||||
* Warnings about the conditions of display for each item type.
|
||||
* @private
|
||||
* @type {?string}
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler
|
||||
.prototype.itemTypeConditionalWarnings_ = null;
|
||||
|
||||
|
||||
/**
|
||||
* Initialize the .sortable() lists, limit nesting to one level deep and
|
||||
* ensure lists are formatted properly the CSS styles
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler.
|
||||
prototype.initSorting = function() {
|
||||
var self = this;
|
||||
|
||||
// Remove any submenu warning buttons
|
||||
$('.btnSubmenuWarning', this.getHtmlElement()).remove();
|
||||
|
||||
// Limit nesting to one level deep and ensure nested lists are formatted
|
||||
// properly for appropriate styles
|
||||
$('#pkpNavAssigned > li').each(
|
||||
function() {
|
||||
var $childList = $(this).children('ul'),
|
||||
$children = $childList.children(),
|
||||
$grandchildren = $children.find('li');
|
||||
|
||||
if (!$childList.length) {
|
||||
$(this).append('<ul></ul>');
|
||||
return;
|
||||
}
|
||||
|
||||
if (!$children.length) {
|
||||
// Ensure it's just an empty ul (with no spaces) so the CSS
|
||||
// :empty psuedo class can be used
|
||||
$childList.replaceWith('<ul></ul>');
|
||||
} else {
|
||||
// Prevent nesting two levels deep by moving any items
|
||||
// nested at that level up one level.
|
||||
if ($grandchildren.length) {
|
||||
$grandchildren.each(function() {
|
||||
$(this).appendTo($childList);
|
||||
});
|
||||
}
|
||||
|
||||
// Add a submenu warning button
|
||||
if (!$(this).find(
|
||||
'> .item > .item_buttons .btnSubmenuWarning').length) {
|
||||
$(this).find('> .item > .item_buttons').prepend(
|
||||
$('<button></button>')
|
||||
.addClass('btnSubmenuWarning')
|
||||
.append(
|
||||
$('<span></span>')
|
||||
.addClass('fa fa-exclamation-triangle')
|
||||
)
|
||||
.append(
|
||||
$('<span></span>')
|
||||
.addClass('-screenReader')
|
||||
.text(self.submenuWarning_)
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
// Reset any nesting that's been carried over from the assigned list
|
||||
$('#pkpNavUnassigned > li').each(
|
||||
function() {
|
||||
var $childList = $(this).children('ul');
|
||||
if ($childList.length) {
|
||||
$childList.find('li').each(function() {
|
||||
$(this).appendTo($('#pkpNavUnassigned'));
|
||||
});
|
||||
}
|
||||
$childList.remove();
|
||||
}
|
||||
);
|
||||
|
||||
// Initialize the sortable controls
|
||||
$('#pkpNavManagement ul').sortable({
|
||||
placeholder: 'pkp_nav_item_placeholder',
|
||||
delay: 250,
|
||||
connectWith: '#pkpNavManagement ul',
|
||||
update: this.callbackWrapper(this.updateSorting),
|
||||
start: function() {
|
||||
$('#pkpNavAssigned').addClass('pkp_is_sorting');
|
||||
},
|
||||
stop: function() {
|
||||
$('#pkpNavAssigned').removeClass('pkp_is_sorting');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Re-initialize the .sortable() components and generate the form fields
|
||||
* whenever the list is re-sorted.
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler.
|
||||
prototype.updateSorting = function() {
|
||||
var $navManagement = $('#pkpNavManagement'),
|
||||
seq = 0,
|
||||
parent = null,
|
||||
currentName = '';
|
||||
|
||||
// Re-intialize the sortable component after adjusting sort order
|
||||
this.initSorting();
|
||||
|
||||
// Remove existing hidden fields
|
||||
$('input', $navManagement).remove();
|
||||
|
||||
// Generate new hidden form fields
|
||||
$('#pkpNavAssigned > li').each(function() {
|
||||
currentName = 'menuTree[' + $(this).data('id') + ']';
|
||||
$navManagement.append('<input type="hidden" name="' +
|
||||
currentName + '[seq]" value="' +
|
||||
seq + '">');
|
||||
seq++;
|
||||
|
||||
var parentId = $(this).data('id');
|
||||
$(this).find('li').each(function() {
|
||||
currentName = 'menuTree[' + $(this).data('id') + ']';
|
||||
$navManagement.append('<input type="hidden" name="' +
|
||||
currentName + '[seq]" value="' +
|
||||
seq + '">');
|
||||
$navManagement.append('<input type="hidden" name="' +
|
||||
currentName + '[parentId]" value="' +
|
||||
parentId + '">');
|
||||
seq++;
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Show the conditional display warning message
|
||||
* @param {jQueryObject} htmlElement The html element
|
||||
* @return {boolean}
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler.
|
||||
prototype.showConditionalDisplayWarning = function(htmlElement) {
|
||||
var itemType = $(htmlElement).closest('li').data('type'),
|
||||
opts = {
|
||||
title: this.warningModalTitle_,
|
||||
okButton: this.okButton_,
|
||||
cancelButton: false,
|
||||
dialogText: this.itemTypeConditionalWarnings_[itemType]
|
||||
};
|
||||
|
||||
if (this.itemTypeConditionalWarnings_[itemType] !== null) {
|
||||
$('<div id="' + $.pkp.classes.Helper.uuid() + '" ' +
|
||||
'class="pkp_modal pkpModalWrapper" tabindex="-1"></div>')
|
||||
.pkpHandler('$.pkp.controllers.modal.ConfirmationModalHandler', opts);
|
||||
}
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Show the submenu link warning message
|
||||
* @return {boolean}
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuFormHandler.
|
||||
prototype.showSubmenuWarning = function() {
|
||||
|
||||
var opts = {
|
||||
title: this.warningModalTitle_,
|
||||
okButton: this.okButton_,
|
||||
cancelButton: false,
|
||||
dialogText: this.submenuWarning_
|
||||
};
|
||||
|
||||
$('<div id="' + $.pkp.classes.Helper.uuid() + '" ' +
|
||||
'class="pkp_modal pkpModalWrapper" tabindex="-1"></div>')
|
||||
.pkpHandler('$.pkp.controllers.modal.ConfirmationModalHandler', opts);
|
||||
|
||||
return false;
|
||||
};
|
||||
}(jQuery));
|
||||
@@ -0,0 +1,125 @@
|
||||
/**
|
||||
* @file js/controllers/grid/navigationMenus/form/NavigationMenuItemsFormHandler.js
|
||||
*
|
||||
* Copyright (c) 2014-2021 Simon Fraser University
|
||||
* Copyright (c) 2000-2021 John Willinsky
|
||||
* Distributed under the GNU GPL v3. For full terms see the file docs/COPYING.
|
||||
*
|
||||
* @class NavigationMenuItemsFormHandler
|
||||
* @ingroup js_controllers_grid_navigationMenus_form
|
||||
*
|
||||
* @brief NavigationMenuItems form handler.
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
|
||||
/**
|
||||
* @constructor
|
||||
*
|
||||
* @extends $.pkp.controllers.form.AjaxFormHandler
|
||||
*
|
||||
* @param {jQueryObject} $formElement A wrapped HTML element that
|
||||
* represents the form interface element.
|
||||
* @param {Object} options javascript form options.
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuItemsFormHandler =
|
||||
function($formElement, options) {
|
||||
|
||||
this.parent($formElement, options);
|
||||
|
||||
this.previewUrl_ = options.previewUrl;
|
||||
this.itemTypeDescriptions_ = options.itemTypeDescriptions;
|
||||
this.itemTypeConditionalWarnings_ = options.itemTypeConditionalWarnings;
|
||||
|
||||
$('#previewButton', $formElement).click(this.callbackWrapper(
|
||||
this.showPreview_));
|
||||
|
||||
$('#menuItemType', $formElement).change(this.callbackWrapper(this.setType));
|
||||
$('#menuItemType', $formElement).trigger('change');
|
||||
};
|
||||
|
||||
|
||||
$.pkp.classes.Helper.inherits(
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuItemsFormHandler,
|
||||
$.pkp.controllers.form.AjaxFormHandler);
|
||||
|
||||
|
||||
//
|
||||
// Private properties
|
||||
//
|
||||
|
||||
|
||||
/**
|
||||
* The preview url.
|
||||
* @private
|
||||
* @type {?string}
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.
|
||||
NavigationMenuItemsFormHandler.prototype.previewUrl_ = null;
|
||||
|
||||
|
||||
/**
|
||||
* Descriptions for each item type.
|
||||
* @private
|
||||
* @type {?Object}
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.
|
||||
NavigationMenuItemsFormHandler.prototype.itemTypeDescriptions_ = null;
|
||||
|
||||
|
||||
/**
|
||||
* Warnings about the conditions of display for each item type.
|
||||
* @private
|
||||
* @type {?Object}
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.
|
||||
NavigationMenuItemsFormHandler.prototype
|
||||
.itemTypeConditionalWarnings_ = null;
|
||||
|
||||
|
||||
/**
|
||||
* Callback triggered on clicking the "preview"
|
||||
* button to open a preview window.
|
||||
*
|
||||
* @param {HTMLElement} submitButton The submit button.
|
||||
* @param {Event} event The event that triggered the
|
||||
* submit button.
|
||||
* @return {boolean} true.
|
||||
* @private
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuItemsFormHandler.
|
||||
prototype.showPreview_ = function(submitButton, event) {
|
||||
|
||||
var $formElement = this.getHtmlElement();
|
||||
$.post(this.previewUrl_,
|
||||
$formElement.serialize(),
|
||||
function(data) {
|
||||
var win = window.open('about:blank');
|
||||
win.document.open();
|
||||
win.document.write(data);
|
||||
win.document.close();
|
||||
}
|
||||
);
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Callback triggered when the type is set
|
||||
*/
|
||||
$.pkp.controllers.grid.navigationMenus.form.NavigationMenuItemsFormHandler.
|
||||
prototype.setType = function() {
|
||||
var itemType = $('#menuItemType', this.getHtmlElement()).val(),
|
||||
$descriptionEl = $('#menuItemTypeSection [for="menuItemType"]');
|
||||
|
||||
$('.NMI_TYPE_CUSTOM_EDIT', this.getHtmlElement()).hide();
|
||||
$('#' + itemType).fadeIn();
|
||||
|
||||
if (typeof this.itemTypeDescriptions_[itemType] !== 'undefined') {
|
||||
$descriptionEl.text(this.itemTypeDescriptions_[itemType]);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
}(jQuery));
|
||||
Reference in New Issue
Block a user