silverstripe-dms/javascript/DMSDocumentAddExistingField.js
Ryan O'Hara 735ae8e48e ENHANCEMENT: style tree drop down field, and search by id.
Add javascript to allow only one or the other to be active (this needs to be fixed)
2012-08-17 16:48:09 +12:00

135 lines
4.4 KiB
JavaScript

(function($) {
"use strict";
$.entwine('ss', function($) {
$('.document-add-existing').entwine({
adddocument: function(document_id) {
var page_id = $(this).closest('form').find(':input[name=ID]').val();
jQuery.ajax(
'admin/pages/adddocument/linkdocument?ID=' + page_id + '&documentID=' + document_id,
{
dataType: 'json',
success: function(data, textstatus) {
var fn = window.tmpl.cache['ss-uploadfield-addtemplate'];
var fnout = fn({
files: [data],
formatFileSize: function (bytes) {
if (typeof bytes !== 'number') return '';
if (bytes >= 1000000000) return (bytes / 1000000000).toFixed(2) + ' GB';
if (bytes >= 1000000) return (bytes / 1000000).toFixed(2) + ' MB';
return (bytes / 1000).toFixed(2) + ' KB';
}
});
$('.ss-add-files').append(fnout);
}
}
);
}
});
$('.document-add-existing .document-autocomplete').entwine({
onmatch: function() {
var self = this;
this.autocomplete({
source: 'admin/pages/adddocument/documentautocomplete',
select: function(event, ui) {
if(ui.item) {
var document_id = ui.item.value;
$(this).closest('.document-add-existing').adddocument(document_id);
}
}
});
}
});
// Add label to tree drop down button
$('.document-add-existing .treedropdownfield-toggle-panel-link').entwine({
onmatch: function() {
this.prepend('<span>Browse by page</span>');
}
});
// TODO - If the treedropdown field is open then disable the search field
// else, make this search field enabled
$('.document-add-existing .TreeDropdownField').entwine({
onmatch: function(event) {
// Not really sure what var self = this does, but thought it looked cool :)
var self = this;
console.log('Ive found you');
// If dropdownfield-panel is visible
if ($(this).find('.treedropdownfield-panel').is(':visible')) {
// Add border for testing
$(this).css('border', '2px solid blue');
// Then disable search field
self.closest('.document-add-existing').find('.document-autocomplete').prop('disabled', true);
console.log('Disabling');
}
else{
// Add border colour for testing purposes only
self.css('border', '2px solid red');
// Enable search field
$(this).closest('.document-add-existing').find('.document-autocomplete').prop('disabled', false);
console.log('Ok you can work');
}
}
});
//These are some test but I don't think they work or accomplish the function that I want
// When clicking on the tree dropdown button
// Disable the search input
/* $('.treedropdownfield-toggle-panel-link').entwine({
onclick: function() {
//$(this).closest('.document-add-existing').find('.document-autocomplete').addClass('disable');
$(this).closest('.document-add-existing').find('.document-autocomplete').prop('disabled', true);
}
});*/
/* $('.treedropdownfield-toggle-panel-link').entwine({
onclick: function() {
var self = this;
if ($(this).hasClass('treedropdownfield-open-tree')) {
$(this).css('border', '2px solid blue');
self.closest('.document-add-existing').find('.document-autocomplete').prop('disabled', true);
console.log('Disabling');
}
else{
self.css('border', '2px solid red');
$(this).closest('.document-add-existing').find('.document-autocomplete').prop('disabled', false);
console.log('Ok you can work');
}
}
});*/
// TODO - This will become redundant if the above function works
// When clicking on the search input this removes the disabled state
$('.document-add-existing .document-autocomplete').entwine({
onclick: function() {
this.removeClass('disable');
}
});
//TODO - When documents load in the document list. Toggle the visibilty of this. By default it should be hidden
$('.document-add-existing input[name=PageSelector]').entwine({
onchange: function(event) {
$(this).closest('.document-add-existing').find('.document-list').load('admin/pages/adddocument/documentlist?pageID=' + $(this).val());
$(this).closest('.document-add-existing').find('.document-list').toggle();
}
});
$('.document-add-existing a.add-document').entwine({
onclick: function(event) {
var document_id = $(this).data('document-id');
$(this).closest('.document-add-existing').adddocument(document_id);
return false;
}
})
});
}(jQuery));