1
0
mirror of https://github.com/owncloudarchive/contacts.git synced 2024-12-11 22:24:32 +01:00
OwncloudContactsOfficial/js/jquery.ocaddnew.js

162 lines
4.6 KiB
JavaScript
Raw Normal View History

(function($) {
$.widget('oc.addnew', {
options: {
width: 'auto',
height: 'auto',
closeOnEscape: true,
2013-05-07 19:18:46 +02:00
autoOpen: false,
autoClose: true,
addText: 'Add'
},
_create: function() {
//console.log('ocaddnew._create', this);
var self = this;
this.originalCss = {
display: this.element[0].style.display,
width: this.element[0].style.width,
height: this.element[0].style.height,
};
this.originalTitle = this.element.attr('title') || this.element.attr('original-title');
//console.log('ocaddnew, originalTitle', this.originalTitle);
this.options.title = this.options.title || this.originalTitle;
//console.log('ocaddnew, title', this.options.title);
this.element.hide();
2013-05-07 19:18:46 +02:00
this.$ul = $('<ul class="oc-addnew" />').insertBefore(this.element).css('display', 'inline-block');
$('<a class="oc-addnew-init"></a>').text(this.options.title).appendTo(this.$ul).wrap('<li />');
this.element.addClass('oc-addnew-name').removeAttr('original-title').appendTo(this.$ul).wrap('<li />');
//console.log('li', $li.parent());
//$li.appendTo(this.$ul);
$('<button />').addClass('primary').text(this.options.addText).insertAfter(this.element).hide();
this.element.on('input', function() {
// Enable button when input is non-empty
$(this).next('button').prop('disabled', $(this).val().trim().length === 0);
});
this.$ul.on('click keydown',function(event) {
if(self._wrongKey(event)) {
return;
}
if($(event.target).is('.oc-addnew-init')) {
if(self.$ul.is('.open')) {
self.close();
} else {
self.open();
}
return false;
} else if($(event.target).is('button.primary')) {
var result = self.element.val().trim();
if(result.length > 0) {
self._trigger('ok', null, result);
self.element.val('');
}
return false;
}
});
$(document).on('click keydown keyup', function(event) {
2013-05-07 19:18:46 +02:00
if(self._isOpen && self.options.autoClose
&& event.target !== self.$ul.get(0)
&& self.$ul.find($(event.target)).length === 0) {
//console.log('outside', $(event.target), self.$ul.find(event.target));
self.close();
2013-05-21 23:40:37 +02:00
self._trigger('cancel');
return;
}
// Escape
if(event.keyCode && event.keyCode === 27 && self.options.closeOnEscape) {
self.close();
2013-05-21 23:40:37 +02:00
self._trigger('cancel');
return false;
}
2013-05-21 23:40:37 +02:00
});
this.element.on('keydown keyup', function(event) {
// Enter
if(event.keyCode && event.keyCode === 13) {
2013-05-21 23:40:37 +02:00
event.stopPropagation();
event.stopImmediatePropagation();
if(event.type === 'keyup') {
event.preventDefault();
return false;
}
if(event.target === self.element.get(0)) {
self.element.next('button').trigger('click');
}
return false;
}
});
2013-05-07 19:18:46 +02:00
//console.log('ocaddnew._create done', this);
this._setOptions(this.options);
2013-05-07 19:18:46 +02:00
this._isOpen = false;
},
_init: function() {
//console.log('ocaddnew._init');
2013-05-07 19:18:46 +02:00
if(this.options.autoOpen) {
this.open();
}
},
_setOption: function(key, value) {
//console.log('ocaddnew._setOption', key, value);
var self = this;
switch(key) {
case 'width':
this.$ul.css('width', value);
break;
case 'height':
this.$ul.css('height', value);
break;
}
//this._super(key, value);
$.Widget.prototype._setOption.apply(this, arguments );
},
_setOptions: function(options) {
//console.log('_setOptions', options);
//this._super(options);
$.Widget.prototype._setOptions.apply(this, arguments);
},
_wrongKey: function(event) {
return ((event.type === 'keydown' || event.type === 'keypress')
&& (event.keyCode !== 32 && event.keyCode !== 13));
},
widget: function() {
return this.$ul;
},
close: function() {
2013-05-07 19:18:46 +02:00
if(!this._isOpen) {
return;
}
//console.log('ocaddnew.close()');
this.$ul.removeClass('open');
this.$ul.find('li:not(:first-child)').hide();
this.$ul.find('li:first-child').show();
2013-05-07 19:18:46 +02:00
this._isOpen = false;
this._trigger('close');
},
open: function() {
2013-05-07 19:18:46 +02:00
if(this._isOpen) {
return;
}
//console.log('ocaddnew.open()', this.element.parent('li'), this.$ul);
this.$ul.addClass('open');
this.$ul.find('li:first-child').hide();
this.element.show().next('button').show().parent('li').show();
2013-05-02 21:59:06 +02:00
this.element.focus();
if(this.options.addTo) {
}
2013-05-07 19:18:46 +02:00
this._isOpen = true;
this._trigger('open');
},
destroy: function() {
2013-05-07 19:18:46 +02:00
//console.log('destroy');
if(this.originalTitle) {
this.element.attr('title', this.originalTitle);
}
this.element.removeClass('oc-addnew-name')
.css(this.originalCss).detach().insertBefore(this.$ul);
this.$ul.remove();
}
});
}(jQuery));