Removed not needed proxies.

This commit is contained in:
Martin Edenhofer 2014-12-06 09:20:17 +01:00
parent 6fe045924d
commit 0fcfca12e9
2 changed files with 123 additions and 100 deletions

View file

@ -38,7 +38,7 @@
66: true, // b 66: true, // b
73: true, // i 73: true, // i
85: true, // u 85: true, // u
} },
}; };
function Plugin( element, options ) { function Plugin( element, options ) {
@ -61,95 +61,117 @@
} }
Plugin.prototype.init = function () { Plugin.prototype.init = function () {
var _this = this
// set focus class // set focus class
this.$element.on('focus', $.proxy(function (e) { this.$element.on('focus', function (e) {
this.$element.closest('.form-control').addClass('focus') _this.$element.closest('.form-control').addClass('focus')
}, this)).on('blur', $.proxy(function (e) { }).on('blur', function (e) {
this.$element.closest('.form-control').removeClass('focus') _this.$element.closest('.form-control').removeClass('focus')
}, this)) })
// process placeholder // process placeholder
if ( this.options.placeholder ) { if ( this.options.placeholder ) {
this.updatePlaceholder( 'add' ) this.updatePlaceholder( 'add' )
this.$element.on('focus', $.proxy(function (e) { this.$element.on('focus', function (e) {
this.updatePlaceholder( 'remove' ) _this.updatePlaceholder( 'remove' )
}, this)).on('blur', $.proxy(function (e) { }).on('blur', function (e) {
this.updatePlaceholder( 'add' ) _this.updatePlaceholder( 'add' )
}, this)) })
} }
// maxlength check // maxlength check
//this.options.maxlength = 10 //this.options.maxlength = 10
if ( this.options.maxlength ) { if ( this.options.maxlength ) {
this.$element.on('keydown', $.proxy(function (e) { this.$element.on('keydown', function (e) {
console.log('maxlength', e.keyCode, this.allowKey(e)) console.log('maxlength', e.keyCode, _this.allowKey(e))
// check control key // check control key
if ( this.allowKey(e) ) { if ( _this.allowKey(e) ) {
this.maxLengthOk() _this.maxLengthOk()
} }
// check type ahead key // check type ahead key
else { else {
if ( !this.maxLengthOk( true ) ) { if ( !_this.maxLengthOk( true ) ) {
e.preventDefault() e.preventDefault()
} }
} }
}, this)).on('keyup', $.proxy(function (e) { }).on('keyup', function (e) {
// check control key // check control key
if ( this.allowKey(e) ) { if ( _this.allowKey(e) ) {
this.maxLengthOk() _this.maxLengthOk()
} }
// check type ahead key // check type ahead key
else { else {
if ( !this.maxLengthOk( true ) ) { if ( !_this.maxLengthOk( true ) ) {
e.preventDefault() e.preventDefault()
} }
} }
}, this)).on('focus', $.proxy(function (e) { }).on('focus', function (e) {
this.maxLengthOk() _this.maxLengthOk()
}, this)).on('blur', $.proxy(function (e) { }).on('blur', function (e) {
this.maxLengthOk() _this.maxLengthOk()
}, this)) })
} }
// handle enter // handle enter
this.$element.on('keydown', $.proxy(function (e) { this.$element.on('keydown', function (e) {
console.log('keydown', e.keyCode) console.log('keydown', e.keyCode)
if (this.preventInput) { if ( _this.preventInput ) {
console.log('preventInput', this.preventInput) console.log('preventInput', _this.preventInput)
return return
} }
// trap the return key being pressed // strap the return key being pressed
if (e.keyCode === 13) { if (e.keyCode === 13) {
// disbale multi line // disbale multi line
if ( !this.options.multiline ) { if ( !_this.options.multiline ) {
e.preventDefault() e.preventDefault()
return return
} }
// limit check // limit check
if ( !this.maxLengthOk( true ) ) { if ( !_this.maxLengthOk( true ) ) {
e.preventDefault() e.preventDefault()
return return
} }
newLine = "<br></br>"
//newLine = "<br></br>"
newLine = "\n<br>"
if (document.selection) { if (document.selection) {
var range = document.selection.createRange() var range = document.selection.createRange()
newLine = "<br/>" // ie is not supporting \n :( newLine = "<br/>" // ie is not supporting \n :(
range.pasteHTML(newLine) range.pasteHTML(newLine)
} }
else { else {
// workaround for chrome - insert <br> directly after <br> is ignored -
// insert <br>, if it hasn't change add it twice again
var oldValue = _this.$element.html().trim()
document.execCommand('insertHTML', false, newLine) document.execCommand('insertHTML', false, newLine)
var newValue = _this.$element.html().trim()
console.log('ON', oldValue, '--', newValue)
//if ( oldValue == newValue || oldValue == newValue.substr( 0, newValue.length - newLine.length ) ) {
//if ( oldValue == newValue.substr( 0, newValue.length - newLine.length ) ) {
if ( oldValue == newValue ) {
var oldValue = _this.$element.html().trim()
document.execCommand('insertHTML', false, newLine)
console.log('Autoinsert 1th-br')
var newValue = _this.$element.html().trim()
if ( oldValue == newValue ) {
console.log('Autoinsert 2th-br')
document.execCommand('insertHTML', false, ' ' + newLine) // + newLine)
}
}
} }
// prevent the default behaviour of return key pressed // prevent the default behaviour of return key pressed
e.preventDefault()
return false return false
} }
}, this)) })
// just paste text // just paste text
if ( this.options.mode === 'textonly' ) { if ( this.options.mode === 'textonly' ) {
this.$element.on('paste', $.proxy(function (e) { this.$element.on('paste', function (e) {
e.preventDefault() e.preventDefault()
var text var text
if (window.clipboardData) { // IE if (window.clipboardData) { // IE
@ -162,17 +184,17 @@
if (text) { if (text) {
// replace new lines // replace new lines
if ( !this.options.multiline ) { if ( !_this.options.multiline ) {
text = text.replace(/\n/g, '') text = text.replace(/\n/g, '')
text = text.replace(/\r/g, '') text = text.replace(/\r/g, '')
text = text.replace(/\t/g, '') text = text.replace(/\t/g, '')
} }
// limit length, limit paste string // limit length, limit paste string
if ( this.options.maxlength ) { if ( _this.options.maxlength ) {
var pasteLength = text.length var pasteLength = text.length
var currentLength = this.$element.text().length var currentLength = _this.$element.text().length
var overSize = ( currentLength + pasteLength ) - this.options.maxlength var overSize = ( currentLength + pasteLength ) - _this.options.maxlength
if ( overSize > 0 ) { if ( overSize > 0 ) {
text = text.substr( 0, pasteLength - overSize ) text = text.substr( 0, pasteLength - overSize )
overlimit = true overlimit = true
@ -187,25 +209,24 @@
else { else {
document.execCommand('inserttext', false, text) document.execCommand('inserttext', false, text)
} }
this.maxLengthOk( overlimit ) _this.maxLengthOk( overlimit )
} }
})
}, this))
} }
// disable rich text b/u/i // disable rich text b/u/i
if ( this.options.mode === 'textonly' ) { if ( this.options.mode === 'textonly' ) {
this.$element.on('keydown', $.proxy(function (e) { this.$element.on('keydown', function (e) {
if ( this.richTextKey(e) ) { if ( _this.richTextKey(e) ) {
e.preventDefault() e.preventDefault()
} }
}, this)) })
} }
}; };
// add/remove placeholder // add/remove placeholder
Plugin.prototype.updatePlaceholder = function(type) { Plugin.prototype.updatePlaceholder = function(type) {
if (!this.options.placeholder) { if ( !this.options.placeholder ) {
return return
} }
var holder = this.$element var holder = this.$element
@ -234,7 +255,7 @@
// disable/enable input // disable/enable input
Plugin.prototype.input = function(type) { Plugin.prototype.input = function(type) {
if (type === 'off') { if ( type === 'off' ) {
this.preventInput = true this.preventInput = true
} }
else { else {
@ -303,7 +324,7 @@
// get value // get value
Plugin.prototype.value = function() { Plugin.prototype.value = function() {
this.updatePlaceholder( 'remove' ) //this.updatePlaceholder( 'remove' )
// get text // get text
if ( this.options.mode === 'textonly' ) { if ( this.options.mode === 'textonly' ) {

View file

@ -35,22 +35,23 @@
Plugin.prototype.init = function () { Plugin.prototype.init = function () {
this.baseTemplate() this.baseTemplate()
var _this = this
this.$element.on('keydown', $.proxy(function (e) { this.$element.on('keydown', function (e) {
// esc // esc
if ( e.keyCode === 27 ) { if ( e.keyCode === 27 ) {
this.close() _this.close()
} }
// navigate through widget // navigate through item
if ( this.isActive() ) { if ( _this.isActive() ) {
// enter // enter
if ( e.keyCode === 13 ) { if ( e.keyCode === 13 ) {
e.preventDefault() e.preventDefault()
var id = this.$widget.find('.dropdown-menu li.active a').data('id') var id = _this.$widget.find('.dropdown-menu li.active a').data('id')
this.take(id) _this.take(id)
} }
// arrow keys // arrow keys
@ -60,59 +61,58 @@
// up // up
if ( e.keyCode === 38 ) { if ( e.keyCode === 38 ) {
if ( !this.$widget.find('.dropdown-menu li.active')[0] ) { if ( !_this.$widget.find('.dropdown-menu li.active')[0] ) {
var top = this.$widget.find('.dropdown-menu li').last().addClass('active').position().top var top = _this.$widget.find('.dropdown-menu li').last().addClass('active').position().top
this.$widget.find('.dropdown-menu').scrollTop( top ); _this.$widget.find('.dropdown-menu').scrollTop( top );
} }
else { else {
var prev = this.$widget.find('.dropdown-menu li.active').removeClass('active').prev() var prev = _this.$widget.find('.dropdown-menu li.active').removeClass('active').prev()
var top = 300 var top = 300
if ( prev[0] ) { if ( prev[0] ) {
top = prev.addClass('active').position().top top = prev.addClass('active').position().top
} }
this.$widget.find('.dropdown-menu').scrollTop( top ); _this.$widget.find('.dropdown-menu').scrollTop( top );
} }
} }
// down // down
if ( e.keyCode === 40 ) { if ( e.keyCode === 40 ) {
if ( !this.$widget.find('.dropdown-menu li.active')[0] ) { if ( !_this.$widget.find('.dropdown-menu li.active')[0] ) {
var top = this.$widget.find('.dropdown-menu li').first().addClass('active').position().top var top = _this.$widget.find('.dropdown-menu li').first().addClass('active').position().top
this.$widget.find('.dropdown-menu').scrollTop( top ); _this.$widget.find('.dropdown-menu').scrollTop( top );
} }
else { else {
var next = this.$widget.find('.dropdown-menu li.active').removeClass('active').next() var next = _this.$widget.find('.dropdown-menu li.active').removeClass('active').next()
var top = 300 var top = 300
if ( next[0] ) { if ( next[0] ) {
top = next.addClass('active').position().top top = next.addClass('active').position().top
} }
this.$widget.find('.dropdown-menu').scrollTop( top ); _this.$widget.find('.dropdown-menu').scrollTop( top );
} }
} }
} }
}, this )) })
// reduce buffer, in case close it // reduce buffer, in case close it
this.$element.on('keydown', $.proxy(function (e) { this.$element.on('keydown', function (e) {
// backspace // backspace
if ( e.keyCode === 8 && this.buffer ) { if ( e.keyCode === 8 && _this.buffer ) {
if ( this.buffer === '::' ) { if ( _this.buffer === '::' ) {
this.close() _this.close()
} }
var length = this.buffer.length var length = _this.buffer.length
this.buffer = this.buffer.substr( 0, length-1 ) _this.buffer = _this.buffer.substr( 0, length-1 )
console.log('BS backspace', this.buffer) console.log('BS backspace', _this.buffer)
this.result( this.buffer.substr( 2, length-1 ) ) _this.result( _this.buffer.substr( 2, length-1 ) )
} }
}, this )) })
// build buffer // build buffer
this.$element.on('keypress', $.proxy(function (e) { this.$element.on('keypress', function (e) {
console.log('BUFF', this.buffer, e.keyCode, String.fromCharCode(e.which) ) console.log('BUFF', _this.buffer, e.keyCode, String.fromCharCode(e.which) )
// shift // shift
if ( e.keyCode === 16 ) { if ( e.keyCode === 16 ) {
@ -131,38 +131,38 @@
// enter : // enter :
if ( String.fromCharCode(e.which) === ':' ) { if ( String.fromCharCode(e.which) === ':' ) {
this.buffer = this.buffer + ':' _this.buffer = _this.buffer + ':'
} }
if ( this.buffer && this.buffer.substr(0,2) === '::' ) { if ( _this.buffer && _this.buffer.substr(0,2) === '::' ) {
var sign = String.fromCharCode(e.which) var sign = String.fromCharCode(e.which)
if ( sign && sign !== ':' && e.which != 8 ) { // 8 == backspace if ( sign && sign !== ':' && e.which != 8 ) { // 8 == backspace
this.buffer = this.buffer + sign _this.buffer = _this.buffer + sign
//console.log('BUFF ADD', sign, this.buffer, sign.length, e.which) //console.log('BUFF ADD', sign, this.buffer, sign.length, e.which)
} }
console.log('BUFF HINT', this.buffer, this.buffer.length, e.which, String.fromCharCode(e.which)) console.log('BUFF HINT', _this.buffer, _this.buffer.length, e.which, String.fromCharCode(e.which))
b = $.proxy(function() { b = $.proxy(function() {
this.result( this.buffer.substr(2,this.buffer.length) ) this.result( this.buffer.substr(2,this.buffer.length) )
}, this) }, _this)
setTimeout(b, 400); setTimeout(b, 400);
if (!this.isActive()) { if (!_this.isActive()) {
this.open() _this.open()
} }
} }
}, this)).on('focus', $.proxy(function (e) { }).on('focus', function (e) {
this.close() _this.close()
}, this)).on('blur', $.proxy(function (e) { }).on('blur', function (e) {
// delay, to get click on text module before widget is closed // delay, to get click on text module before widget is closed
a = $.proxy(function() { a = $.proxy(function() {
this.close() this.close()
}, this) }, _this)
setTimeout(a, 600); setTimeout(a, 600);
}, this)) })
}; };
@ -174,9 +174,11 @@
// update widget position // update widget position
Plugin.prototype.updatePosition = function() { Plugin.prototype.updatePosition = function() {
console.log('uP')
this.$widget.find('.dropdown-menu').scrollTop( 300 ); this.$widget.find('.dropdown-menu').scrollTop( 300 );
if ( !this.$element.is(':visible') ) return //if ( !this.$element.is(':visible') ) return
var position = this.$element.caret('position'); var position = this.$element.caret('position');
console.log('PP', position)
if (!position) return if (!position) return
var widgetHeight = this.$widget.find('ul').height() + 85 var widgetHeight = this.$widget.find('ul').height() + 85
this.$widget.css('top', position.top - widgetHeight) this.$widget.css('top', position.top - widgetHeight)
@ -262,7 +264,7 @@
// render result // render result
Plugin.prototype.result = function(term) { Plugin.prototype.result = function(term) {
var _this = this
var result = _.filter( this.collection, function(item) { var result = _.filter( this.collection, function(item) {
var reg = new RegExp( term, 'i' ) var reg = new RegExp( term, 'i' )
if ( item.name && item.name.match( reg ) ) { if ( item.name && item.name.match( reg ) ) {
@ -290,11 +292,11 @@
} }
this.$widget.find('ul li').on( this.$widget.find('ul li').on(
'click', 'click',
$.proxy(function(e) { function(e) {
e.preventDefault() e.preventDefault()
var id = $(e.target).data('id') var id = $(e.target).data('id')
this.take(id) _this.take(id)
}, this) }
) )
this.updatePosition() this.updatePosition()
} }