mirror of
https://github.com/silverstripe/silverstripe-cms
synced 2024-10-22 08:05:56 +02:00
MINOR Moved form related javascript from CMSMain.js to new CMSMain.EditForm.js
git-svn-id: svn://svn.silverstripe.com/silverstripe/open/modules/cms/trunk@92729 467b73ca-7a2a-4603-9d3b-597d59a354a9
This commit is contained in:
Ingo Schommer
parent
01d06dd47e
commit
c50e2fce6b
@ -83,7 +83,7 @@ class CMSMain extends LeftAndMain implements CurrentPageIdentifier, PermissionPr
|
|||||||
|
|
||||||
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.js');
|
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.js');
|
||||||
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.Tree.js');
|
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.Tree.js');
|
||||||
|
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.EditForm.js');
|
||||||
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.BatchActions.js');
|
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.BatchActions.js');
|
||||||
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.Translatable.js');
|
Requirements::javascript(CMS_DIR . '/javascript/CMSMain.Translatable.js');
|
||||||
|
|
||||||
|
|||||||
212
javascript/CMSMain.EditForm.js
Normal file
212
javascript/CMSMain.EditForm.js
Normal file
@ -0,0 +1,212 @@
|
|||||||
|
(function($) {
|
||||||
|
/**
|
||||||
|
* @class CMS-specific form behaviour
|
||||||
|
* @name ss.EditForm
|
||||||
|
*/
|
||||||
|
$('.CMSMain #Form_EditForm').concrete('ss', function($){
|
||||||
|
return/** @lends ss.EditForm */{
|
||||||
|
onmatch: function() {
|
||||||
|
// Alert the user on change of page-type - this might have implications
|
||||||
|
// on the available form fields etc.
|
||||||
|
this.find(':input[name=ClassName]').bind('change',
|
||||||
|
function() {
|
||||||
|
alert('The page type will be updated after the page is saved');
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
this._super();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @class Input validation on the URLSegment field
|
||||||
|
* @name ss.EditForm.URLSegment
|
||||||
|
*/
|
||||||
|
$('#Form_EditForm input[name=URLSegment]').concrete('ss', function($){
|
||||||
|
return/** @lends ss.EditForm.URLSegment */{
|
||||||
|
|
||||||
|
FilterRegex: /[^A-Za-z0-9-]+/,
|
||||||
|
|
||||||
|
ValidationMessage: 'URLs can only be made up of letters, digits and hyphens.',
|
||||||
|
|
||||||
|
MaxLength: 50,
|
||||||
|
|
||||||
|
onmatch : function() {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
// intercept change event, do our own writing
|
||||||
|
this.bind('change', function(e) {
|
||||||
|
if(!self.validate()) {
|
||||||
|
jQuery.noticeAdd(self.ValidationMessage());
|
||||||
|
}
|
||||||
|
self.val(self.suggestValue(e.target.value));
|
||||||
|
return false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Return a value matching the criteria.
|
||||||
|
*
|
||||||
|
* @param {String} val
|
||||||
|
* @return val
|
||||||
|
*/
|
||||||
|
suggestValue: function(val) {
|
||||||
|
// TODO Do we want to enforce lowercasing in URLs?
|
||||||
|
return val.substr(0, this.MaxLength()).replace(this.FilterRegex(), '').toLowerCase();
|
||||||
|
},
|
||||||
|
|
||||||
|
validate: function() {
|
||||||
|
return (
|
||||||
|
this.val().length > this.MaxLength()
|
||||||
|
|| this.val().match(this.FilterRegex())
|
||||||
|
);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @class Input validation on the Title field
|
||||||
|
* @name ss.EditForm.Title
|
||||||
|
*/
|
||||||
|
$('#Form_EditForm input[name=Title]').concrete('ss', function($){
|
||||||
|
return/** @lends ss.EditForm.Title */{
|
||||||
|
|
||||||
|
onmatch : function() {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.bind('change', function(e) {
|
||||||
|
self.updateURLSegment(jQuery('#Form_EditForm input[name=URLSegment]'));
|
||||||
|
// TODO We should really user-confirm these changes
|
||||||
|
self.parents('form').find('input[name=MetaTitle], input[name=MenuTitle]').val(self.val());
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
updateURLSegment: function(field) {
|
||||||
|
if(!field || !field.length) return;
|
||||||
|
|
||||||
|
// TODO language/logic coupling
|
||||||
|
var isNew = this.val().indexOf("new") == 0;
|
||||||
|
var suggestion = field.concrete('ss').suggestValue(this.val());
|
||||||
|
var confirmMessage = ss.i18n.sprintf(
|
||||||
|
ss.i18n._t(
|
||||||
|
'UPDATEURL.CONFIRM',
|
||||||
|
'Would you like me to change the URL to:\n\n'
|
||||||
|
+ '%s/\n\nClick Ok to change the URL, '
|
||||||
|
+ 'click Cancel to leave it as:\n\n%s'
|
||||||
|
),
|
||||||
|
suggestion,
|
||||||
|
field.val()
|
||||||
|
);
|
||||||
|
|
||||||
|
// don't ask for replacement if record is considered 'new' as defined by its title
|
||||||
|
if(isNew || (suggestion != field.val() && confirm(confirmMessage))) {
|
||||||
|
field.val(suggestion);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @class ParentID field combination - mostly toggling between
|
||||||
|
* the two radiobuttons and setting the hidden "ParentID" field
|
||||||
|
* @name ss.EditForm.parentTypeSelector
|
||||||
|
*/
|
||||||
|
$('#Form_EditForm .parentTypeSelector').concrete('ss', function($){
|
||||||
|
return/** @lends ss.EditForm.parentTypeSelector */{
|
||||||
|
onmatch : function() {
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
this.find(':input[name=ParentType]').bind('click', function(e) {self._toggleSelection(e);});
|
||||||
|
|
||||||
|
this._toggleSelection();
|
||||||
|
},
|
||||||
|
|
||||||
|
_toggleSelection: function(e) {
|
||||||
|
var selected = this.find(':input[name=ParentType]:checked').val();
|
||||||
|
// reset parent id if 'root' radiobutton is selected
|
||||||
|
if(selected == 'root') this.find(':input[name=ParentID]').val(0);
|
||||||
|
// toggle tree dropdown based on selection
|
||||||
|
this.find('#ParentID').toggle(selected != 'root');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @class Toggle display of group dropdown in "access" tab,
|
||||||
|
* based on selection of radiobuttons.
|
||||||
|
* @name ss.Form_EditForm.Access
|
||||||
|
*/
|
||||||
|
$('#Form_EditForm #CanViewType, #Form_EditForm #CanEditType').concrete('ss', function($){
|
||||||
|
return/** @lends ss.Form_EditForm.Access */{
|
||||||
|
onmatch: function() {
|
||||||
|
// TODO Decouple
|
||||||
|
var dropdown;
|
||||||
|
if(this.attr('id') == 'CanViewType') dropdown = $('#ViewerGroups');
|
||||||
|
else if(this.attr('id') == 'CanEditType') dropdown = $('#EditorGroups');
|
||||||
|
|
||||||
|
this.find('.optionset :input').bind('change', function(e) {
|
||||||
|
dropdown.toggle(e.target.value == 'OnlyTheseUsers');
|
||||||
|
});
|
||||||
|
|
||||||
|
// initial state
|
||||||
|
var currentVal = this.find('input[name=' + this.attr('id') + ']:checked').val();
|
||||||
|
dropdown.toggle(currentVal == 'OnlyTheseUsers');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @class Email containing the link to the archived version of the page.
|
||||||
|
* Visible on readonly older versions of a specific page at the moment.
|
||||||
|
* @name ss.Form_EditForm_action_email
|
||||||
|
*/
|
||||||
|
$('#Form_EditForm .Actions #Form_EditForm_action_email').concrete('ss', function($){
|
||||||
|
return/** @lends ss.Form_EditForm_action_email */{
|
||||||
|
onclick: function(e) {
|
||||||
|
window.open(
|
||||||
|
'mailto:?subject='
|
||||||
|
+ $('input[name=ArchiveEmailSubject]', this[0].form).val()
|
||||||
|
+ '&body='
|
||||||
|
+ $(':input[name=ArchiveEmailMessage]', this[0].form).val(),
|
||||||
|
'archiveemail'
|
||||||
|
);
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @class Open a printable representation of the form in a new window.
|
||||||
|
* Used for readonly older versions of a specific page.
|
||||||
|
* @name ss.Form_EditForm_action_print
|
||||||
|
*/
|
||||||
|
$('#Form_EditForm .Actions #Form_EditForm_action_print').concrete('ss', function($){
|
||||||
|
return/** @lends ss.Form_EditForm_action_print */{
|
||||||
|
onclick: function(e) {
|
||||||
|
var printURL = $(this[0].form).attr('action').replace(/\?.*$/,'')
|
||||||
|
+ '/printable/'
|
||||||
|
+ $(':input[name=ID]',this[0].form).val();
|
||||||
|
if(printURL.substr(0,7) != 'http://') printURL = $('base').attr('href') + printURL;
|
||||||
|
|
||||||
|
window.open(printURL, 'printable');
|
||||||
|
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @class A "rollback" to a specific version needs user confirmation.
|
||||||
|
* @name ss.Form_EditForm_action_rollback
|
||||||
|
*/
|
||||||
|
$('#Form_EditForm .Actions #Form_EditForm_action_rollback').concrete('ss', function($){
|
||||||
|
return/** @lends ss.Form_EditForm_action_rollback */{
|
||||||
|
onclick: function(e) {
|
||||||
|
// @todo i18n
|
||||||
|
return confirm("Do you really want to copy the published content to the stage site?");
|
||||||
|
}
|
||||||
|
};
|
||||||
|
});
|
||||||
|
}(jQuery));
|
||||||
@ -1,222 +1,5 @@
|
|||||||
/**
|
|
||||||
* @type jquery.layout Global variable so layout state management
|
|
||||||
* can pick it up.
|
|
||||||
*/
|
|
||||||
var ss_MainLayout;
|
|
||||||
|
|
||||||
(function($) {
|
(function($) {
|
||||||
|
|
||||||
/**
|
|
||||||
* @class CMS-specific form behaviour
|
|
||||||
* @name ss.EditForm
|
|
||||||
*/
|
|
||||||
$('.CMSMain #Form_EditForm').concrete('ss', function($){
|
|
||||||
return/** @lends ss.EditForm */{
|
|
||||||
onmatch: function() {
|
|
||||||
// Alert the user on change of page-type - this might have implications
|
|
||||||
// on the available form fields etc.
|
|
||||||
this.find(':input[name=ClassName]').bind('change',
|
|
||||||
function() {
|
|
||||||
alert('The page type will be updated after the page is saved');
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
this._super();
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @class Input validation on the URLSegment field
|
|
||||||
* @name ss.EditForm.URLSegment
|
|
||||||
*/
|
|
||||||
$('#Form_EditForm input[name=URLSegment]').concrete('ss', function($){
|
|
||||||
return/** @lends ss.EditForm.URLSegment */{
|
|
||||||
|
|
||||||
FilterRegex: /[^A-Za-z0-9-]+/,
|
|
||||||
|
|
||||||
ValidationMessage: 'URLs can only be made up of letters, digits and hyphens.',
|
|
||||||
|
|
||||||
MaxLength: 50,
|
|
||||||
|
|
||||||
onmatch : function() {
|
|
||||||
var self = this;
|
|
||||||
|
|
||||||
// intercept change event, do our own writing
|
|
||||||
this.bind('change', function(e) {
|
|
||||||
if(!self.validate()) {
|
|
||||||
jQuery.noticeAdd(self.ValidationMessage());
|
|
||||||
}
|
|
||||||
self.val(self.suggestValue(e.target.value));
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Return a value matching the criteria.
|
|
||||||
*
|
|
||||||
* @param {String} val
|
|
||||||
* @return val
|
|
||||||
*/
|
|
||||||
suggestValue: function(val) {
|
|
||||||
// TODO Do we want to enforce lowercasing in URLs?
|
|
||||||
return val.substr(0, this.MaxLength()).replace(this.FilterRegex(), '').toLowerCase();
|
|
||||||
},
|
|
||||||
|
|
||||||
validate: function() {
|
|
||||||
return (
|
|
||||||
this.val().length > this.MaxLength()
|
|
||||||
|| this.val().match(this.FilterRegex())
|
|
||||||
);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @class Input validation on the Title field
|
|
||||||
* @name ss.EditForm.Title
|
|
||||||
*/
|
|
||||||
$('#Form_EditForm input[name=Title]').concrete('ss', function($){
|
|
||||||
return/** @lends ss.EditForm.Title */{
|
|
||||||
|
|
||||||
onmatch : function() {
|
|
||||||
var self = this;
|
|
||||||
|
|
||||||
this.bind('change', function(e) {
|
|
||||||
self.updateURLSegment(jQuery('#Form_EditForm input[name=URLSegment]'));
|
|
||||||
// TODO We should really user-confirm these changes
|
|
||||||
self.parents('form').find('input[name=MetaTitle], input[name=MenuTitle]').val(self.val());
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
updateURLSegment: function(field) {
|
|
||||||
if(!field || !field.length) return;
|
|
||||||
|
|
||||||
// TODO language/logic coupling
|
|
||||||
var isNew = this.val().indexOf("new") == 0;
|
|
||||||
var suggestion = field.concrete('ss').suggestValue(this.val());
|
|
||||||
var confirmMessage = ss.i18n.sprintf(
|
|
||||||
ss.i18n._t(
|
|
||||||
'UPDATEURL.CONFIRM',
|
|
||||||
'Would you like me to change the URL to:\n\n'
|
|
||||||
+ '%s/\n\nClick Ok to change the URL, '
|
|
||||||
+ 'click Cancel to leave it as:\n\n%s'
|
|
||||||
),
|
|
||||||
suggestion,
|
|
||||||
field.val()
|
|
||||||
);
|
|
||||||
|
|
||||||
// don't ask for replacement if record is considered 'new' as defined by its title
|
|
||||||
if(isNew || (suggestion != field.val() && confirm(confirmMessage))) {
|
|
||||||
field.val(suggestion);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @class ParentID field combination - mostly toggling between
|
|
||||||
* the two radiobuttons and setting the hidden "ParentID" field
|
|
||||||
* @name ss.EditForm.parentTypeSelector
|
|
||||||
*/
|
|
||||||
$('#Form_EditForm .parentTypeSelector').concrete('ss', function($){
|
|
||||||
return/** @lends ss.EditForm.parentTypeSelector */{
|
|
||||||
onmatch : function() {
|
|
||||||
var self = this;
|
|
||||||
|
|
||||||
this.find(':input[name=ParentType]').bind('click', function(e) {self._toggleSelection(e);});
|
|
||||||
|
|
||||||
this._toggleSelection();
|
|
||||||
},
|
|
||||||
|
|
||||||
_toggleSelection: function(e) {
|
|
||||||
var selected = this.find(':input[name=ParentType]:checked').val();
|
|
||||||
// reset parent id if 'root' radiobutton is selected
|
|
||||||
if(selected == 'root') this.find(':input[name=ParentID]').val(0);
|
|
||||||
// toggle tree dropdown based on selection
|
|
||||||
this.find('#ParentID').toggle(selected != 'root');
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @class Toggle display of group dropdown in "access" tab,
|
|
||||||
* based on selection of radiobuttons.
|
|
||||||
* @name ss.Form_EditForm.Access
|
|
||||||
*/
|
|
||||||
$('#Form_EditForm #CanViewType, #Form_EditForm #CanEditType').concrete('ss', function($){
|
|
||||||
return/** @lends ss.Form_EditForm.Access */{
|
|
||||||
onmatch: function() {
|
|
||||||
// TODO Decouple
|
|
||||||
var dropdown;
|
|
||||||
if(this.attr('id') == 'CanViewType') dropdown = $('#ViewerGroups');
|
|
||||||
else if(this.attr('id') == 'CanEditType') dropdown = $('#EditorGroups');
|
|
||||||
|
|
||||||
this.find('.optionset :input').bind('change', function(e) {
|
|
||||||
dropdown.toggle(e.target.value == 'OnlyTheseUsers');
|
|
||||||
});
|
|
||||||
|
|
||||||
// initial state
|
|
||||||
var currentVal = this.find('input[name=' + this.attr('id') + ']:checked').val();
|
|
||||||
dropdown.toggle(currentVal == 'OnlyTheseUsers');
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @class Email containing the link to the archived version of the page.
|
|
||||||
* Visible on readonly older versions of a specific page at the moment.
|
|
||||||
* @name ss.Form_EditForm_action_email
|
|
||||||
*/
|
|
||||||
$('#Form_EditForm .Actions #Form_EditForm_action_email').concrete('ss', function($){
|
|
||||||
return/** @lends ss.Form_EditForm_action_email */{
|
|
||||||
onclick: function(e) {
|
|
||||||
window.open(
|
|
||||||
'mailto:?subject='
|
|
||||||
+ $('input[name=ArchiveEmailSubject]', this[0].form).val()
|
|
||||||
+ '&body='
|
|
||||||
+ $(':input[name=ArchiveEmailMessage]', this[0].form).val(),
|
|
||||||
'archiveemail'
|
|
||||||
);
|
|
||||||
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @class Open a printable representation of the form in a new window.
|
|
||||||
* Used for readonly older versions of a specific page.
|
|
||||||
* @name ss.Form_EditForm_action_print
|
|
||||||
*/
|
|
||||||
$('#Form_EditForm .Actions #Form_EditForm_action_print').concrete('ss', function($){
|
|
||||||
return/** @lends ss.Form_EditForm_action_print */{
|
|
||||||
onclick: function(e) {
|
|
||||||
var printURL = $(this[0].form).attr('action').replace(/\?.*$/,'')
|
|
||||||
+ '/printable/'
|
|
||||||
+ $(':input[name=ID]',this[0].form).val();
|
|
||||||
if(printURL.substr(0,7) != 'http://') printURL = $('base').attr('href') + printURL;
|
|
||||||
|
|
||||||
window.open(printURL, 'printable');
|
|
||||||
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
|
||||||
* @class A "rollback" to a specific version needs user confirmation.
|
|
||||||
* @name ss.Form_EditForm_action_rollback
|
|
||||||
*/
|
|
||||||
$('#Form_EditForm .Actions #Form_EditForm_action_rollback').concrete('ss', function($){
|
|
||||||
return/** @lends ss.Form_EditForm_action_rollback */{
|
|
||||||
onclick: function(e) {
|
|
||||||
// @todo i18n
|
|
||||||
return confirm("Do you really want to copy the published content to the stage site?");
|
|
||||||
}
|
|
||||||
};
|
|
||||||
});
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @class All forms in the right content panel should have closeable jQuery UI style titles.
|
* @class All forms in the right content panel should have closeable jQuery UI style titles.
|
||||||
* @name ss.contentPanel.form
|
* @name ss.contentPanel.form
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user