NIHVIVO-2232 Refactor markup and javascript for menu item edit form.
This commit is contained in:
parent
2919efead0
commit
e71628ae6b
2 changed files with 33 additions and 47 deletions
|
@ -16,14 +16,14 @@ var menuManagementEdit = {
|
||||||
this.selectClassGroupDropdown = $('#selectClassGroup');
|
this.selectClassGroupDropdown = $('#selectClassGroup');
|
||||||
this.classesForClassGroup = $('#classesInSelectedGroup');
|
this.classesForClassGroup = $('#classesInSelectedGroup');
|
||||||
this.selectedGroupForPage = $('#selectedContentTypeValue');
|
this.selectedGroupForPage = $('#selectedContentTypeValue');
|
||||||
this.selectClassesMessage = $('#selectClassesMessage');
|
// this.selectClassesMessage = $('#selectClassesMessage');
|
||||||
this.allClassesSelectedCheckbox = $('#allSelected');
|
this.allClassesSelectedCheckbox = $('#allSelected');
|
||||||
|
|
||||||
},
|
},
|
||||||
bindEventListeners: function() {
|
bindEventListeners: function() {
|
||||||
// Listeners for vClass switching
|
// Listeners for vClass switching
|
||||||
this.changeContentType.click(function() {
|
this.changeContentType.click(function() {
|
||||||
menuManagementEdit.showClassGroups();
|
menuManagementEdit.showClasses();
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
this.selectClassGroupDropdown.change(function() {
|
this.selectClassGroupDropdown.change(function() {
|
||||||
|
@ -42,22 +42,10 @@ var menuManagementEdit = {
|
||||||
menuManagementEdit.customTemplate.removeClass('hidden');
|
menuManagementEdit.customTemplate.removeClass('hidden');
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
showClassGroups: function() {
|
showClasses: function() {
|
||||||
if(!this.existingContentType.hasClass("hidden")) {
|
this.classesForClassGroup.addClass("hidden");
|
||||||
this.existingContentType.addClass("hidden");
|
|
||||||
this.selectClassesMessage.addClass("hidden");
|
|
||||||
this.classesForClassGroup.addClass("hidden");
|
|
||||||
}
|
|
||||||
this.selectContentType.removeClass("hidden");
|
|
||||||
|
|
||||||
},
|
},
|
||||||
hideClassGroups: function() {
|
hideClasses: function() {
|
||||||
if(!this.selectContentType.hasClass("hidden")) {
|
|
||||||
|
|
||||||
this.selectContentType.addClass("hidden");
|
|
||||||
}
|
|
||||||
this.existingContentType.removeClass("hidden");
|
|
||||||
this.selectClassesMessage.removeClass("hidden");
|
|
||||||
this.classesForClassGroup.removeClass("hidden");
|
this.classesForClassGroup.removeClass("hidden");
|
||||||
},
|
},
|
||||||
toggleClassSelection: function() {
|
toggleClassSelection: function() {
|
||||||
|
@ -99,28 +87,25 @@ var menuManagementEdit = {
|
||||||
} else {
|
} else {
|
||||||
//update existing content type with correct class group name and hide class group select again
|
//update existing content type with correct class group name and hide class group select again
|
||||||
var _this = menuManagementEdit;
|
var _this = menuManagementEdit;
|
||||||
menuManagementEdit.hideClassGroups();
|
menuManagementEdit.hideClasses();
|
||||||
|
|
||||||
menuManagementEdit.selectedGroupForPage.html(results.classGroupName);
|
menuManagementEdit.selectedGroupForPage.html(results.classGroupName);
|
||||||
//retrieve classes for class group and display with all selected
|
//retrieve classes for class group and display with all selected
|
||||||
menuManagementEdit.classesForClassGroup.empty();
|
var selectedClassesList = menuManagementEdit.classesForClassGroup.children('ul#selectedClasses');
|
||||||
var appendHtml = '<ul id="selectedClasses" name="selectedClasses">';
|
|
||||||
appendHtml += '<ul id="selectedClasses" name="selectedClasses">';
|
selectedClassesList.empty();
|
||||||
appendHtml += '<li class="ui-state-default">' +
|
selectedClassesList.append('<li class="ui-state-default"> <input type="checkbox" name="allSelected" id="allSelected" value="all" checked="checked" /> <label class="inline" for="All"> All</label> </li>');
|
||||||
'<input type="checkbox" name="allSelected" id="allSelected" value="all" checked="checked" />' +
|
|
||||||
'<label class="inline" for="All"> All</label>' +
|
|
||||||
'</li>';
|
|
||||||
$.each(results.classes, function(i, item) {
|
$.each(results.classes, function(i, item) {
|
||||||
var thisClass = results.classes[i];
|
var thisClass = results.classes[i];
|
||||||
var thisClassName = thisClass.name;
|
var thisClassName = thisClass.name;
|
||||||
//When first selecting new content type, all classes should be selected
|
//When first selecting new content type, all classes should be selected
|
||||||
appendHtml += ' <li class="ui-state-default">' +
|
appendHtml = ' <li class="ui-state-default">' +
|
||||||
'<input type="checkbox" checked="checked" name="classInClassGroup" value="' + thisClass.URI + '" />' +
|
'<input type="checkbox" checked="checked" name="classInClassGroup" value="' + thisClass.URI + '" />' +
|
||||||
'<label class="inline" for="' + thisClassName + '"> ' + thisClassName + '</label>' +
|
'<label class="inline" for="' + thisClassName + '"> ' + thisClassName + '</label>' +
|
||||||
'</li>';
|
'</li>';
|
||||||
|
selectedClassesList.append(appendHtml);
|
||||||
});
|
});
|
||||||
appendHtml += "</ul>";
|
|
||||||
menuManagementEdit.classesForClassGroup.append(appendHtml);
|
|
||||||
menuManagementEdit.toggleClassSelection();
|
menuManagementEdit.toggleClassSelection();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -57,27 +57,28 @@
|
||||||
</select>
|
</select>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<#-- Select classes in a class group -->
|
|
||||||
<p id="selectClassesMessage" name="selectClassesMessage" ${existingClassGroupStyle}>Select content to display</p>
|
|
||||||
<section id="classesInSelectedGroup" name="classesInSelectedGroup" ${existingClassGroupStyle}>
|
<section id="classesInSelectedGroup" name="classesInSelectedGroup" ${existingClassGroupStyle}>
|
||||||
|
<#-- Select classes in a class group -->
|
||||||
|
<p id="selectClassesMessage" name="selectClassesMessage">Select content to display</p>
|
||||||
|
|
||||||
|
<section id="internal-class" role="region">
|
||||||
|
<#if internalClass?has_content>
|
||||||
|
<#assign enableInternalClass = '' />
|
||||||
|
<#assign disableClass = 'class="inline"' />
|
||||||
|
<#else>
|
||||||
|
<#assign enableInternalClass = '<p class="note">To enable this option, you must first select an <a href="${urls.base}/processInstitutionalInternalClass">institutional internal class</a> for your instance</p>' />
|
||||||
|
<#assign disableClass = 'class="disable inline" disabled="disabled"' />
|
||||||
|
</#if>
|
||||||
|
|
||||||
|
<input type="checkbox" ${disableClass} name="display-internalClass" value="${internalClassUri}" id="display-internalClass" <#if pageInternalOnly?has_content>checked</#if> role="input" />
|
||||||
|
<label ${disableClass} class="inline" for="display-internalClass">Only display <em>${associatedPage}</em> within my institution</label>
|
||||||
|
|
||||||
|
${enableInternalClass}
|
||||||
|
</section>
|
||||||
|
|
||||||
<ul id="selectedClasses" name="selectedClasses" role="menu">
|
<ul id="selectedClasses" name="selectedClasses" role="menu">
|
||||||
|
|
||||||
<section id="internal-class" role="region">
|
|
||||||
<#if internalClass?has_content>
|
|
||||||
<#assign enableInternalClass = '' />
|
|
||||||
<#assign disableClass = 'class="inline"' />
|
|
||||||
<#else>
|
|
||||||
<#assign enableInternalClass = '<p class="note">To enable this option, you must first select an <a href="${urls.base}/processInstitutionalInternalClass">institutional internal class</a> for your instance</p>' />
|
|
||||||
<#assign disableClass = 'class="disable inline" disabled="disabled"' />
|
|
||||||
</#if>
|
|
||||||
|
|
||||||
<input type="checkbox" ${disableClass} name="display-internalClass" value="${internalClassUri}" id="display-internalClass" <#if pageInternalOnly?has_content>checked</#if> role="input" />
|
|
||||||
<label ${disableClass} class="inline" for="display-internalClass">Only display <em>${associatedPage}</em> within my institution</label>
|
|
||||||
|
|
||||||
${enableInternalClass}
|
|
||||||
</section>
|
|
||||||
|
|
||||||
|
|
||||||
<#--Adding a default class for "ALL" in case all classes selected-->
|
<#--Adding a default class for "ALL" in case all classes selected-->
|
||||||
<li class="ui-state-default" role="menuitem">
|
<li class="ui-state-default" role="menuitem">
|
||||||
<input type="checkbox" name="allSelected" id="allSelected" value="all" <#if isClassGroupPage = true || includeAllClasses = true>checked</#if> />
|
<input type="checkbox" name="allSelected" id="allSelected" value="all" <#if isClassGroupPage = true || includeAllClasses = true>checked</#if> />
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue