Requires

Provides

Input.js

Make it easy to use regular native input for the widget

License:
Public domain (http://unlicense.org).
  1. 21
  2. 22
  3. 23
  4. 24
  5. 25
  6. 26
  7. 27
  8. 28
  9. 29
  10. 30
  11. 31
  12. 32
  13. 33
  14. 34
  15. 35
  16. 36
  17. 37
  18. 38
  19. 39
  20. 40
  21. 41
  22. 42
  23. 43
  24. 44
  25. 45
  26. 46
LSD.Trait.Input = new Class({ options: { input: {}, events: { input: { element: { mousedown: function(e) { e.stopPropagation() } }, self: { attach: function() { this.getInput().addEvents({ blur: this.onBlur.bind(this), focus: this.onFocus.bind(this) }).addEvents(this.events.input); }, build: function() { this.getInput().inject(this.element); }, focus: function() { this.document.activeElement = this; if (LSD.Mixin.Focus) LSD.Mixin.Focus.Propagation.focus(this); }, blur: function() { if (this.document.activeElement == this) delete this.document.activeElement;

if (LSD.Mixin.Focus) LSD.Mixin.Focus.Propagation.blur.delay(10, this, this);

  1. 48
  2. 49
  3. 50
  4. 51
  5. 52
  6. 53
  7. 54
  8. 55
  9. 56
  10. 57
  11. 58
  12. 59
  13. 60
  14. 61
  15. 62
  16. 63
  17. 64
  18. 65
  19. 66
  20. 67
  21. 68
  22. 69
  23. 70
  24. 71
  25. 72
  26. 73
  27. 74
  28. 75
  29. 76
  30. 77
  31. 78
  32. 79
  33. 80
  34. 81
  35. 82
  36. 83
  37. 84
  38. 85
  39. 86
}, resize: 'setInputSize' } } } }, onFocus: function() { this.document.activeElement = this; this.focus(); }, getInput: Macro.getter('input', function() { return new Element('input', $extend({'type': 'text'}, this.options.input)); }), setInputSize: function(size) { var height = size.height - this.input.getStyle('padding-top').toInt() - this.input.getStyle('padding-bottom').toInt(); if (this.input.style.height != height + 'px') this.input.setStyle('height', height); if (this.input.style.lineHeight != height + 'px') this.input.setStyle('line-height', height); var width = this.size.width - this.input.getStyle('padding-left').toInt() - this.input.getStyle('padding-right').toInt(); if (this.style.current.glyph) { var glyph = this.layers.glyph.measure().width + (this.style.current.glyphRight || 0) + (this.style.current.glyphLeft || 0); width -= glyph; this.input.setStyle('margin-left', glyph); } if (this.canceller) width -= this.canceller.getLayoutWidth(); if (this.glyph) width -= this.glyph.getLayoutWidth(); this.input.setStyle('width', width); }, getObservedElement: function() { return this.getInput(); }, empty: function() { this.input.set('value', '') } });