3 * https://github.com/ExactTarget/fuelux
5 * Copyright (c) 2012 ExactTarget
6 * Licensed under the MIT license.
9 define(['require','jquery'],function(require) {
11 var $ = require('jquery');
14 // SEARCH CONSTRUCTOR AND PROTOTYPE
16 var Search = function (element, options) {
17 this.$element = $(element);
18 this.options = $.extend({}, $.fn.search.defaults, options);
20 this.$button = this.$element.find('button')
21 .on('click', $.proxy(this.buttonclicked, this));
23 this.$input = this.$element.find('input')
24 .on('keydown', $.proxy(this.keypress, this))
25 .on('keyup', $.proxy(this.keypressed, this));
27 this.$icon = this.$element.find('i');
28 this.activeSearch = '';
35 search: function (searchText) {
36 this.$icon.attr('class', 'icon-remove');
37 this.activeSearch = searchText;
38 this.$element.trigger('searched', searchText);
42 this.$icon.attr('class', 'icon-search');
43 this.activeSearch = '';
45 this.$element.trigger('cleared');
49 var val = this.$input.val();
50 var inputEmptyOrUnchanged = val === '' || val === this.activeSearch;
52 if (this.activeSearch && inputEmptyOrUnchanged) {
59 buttonclicked: function (e) {
61 if ($(e.currentTarget).is('.disabled, :disabled')) return;
65 keypress: function (e) {
71 keypressed: function (e) {
72 var val, inputPresentAndUnchanged;
78 val = this.$input.val();
79 inputPresentAndUnchanged = val && (val === this.activeSearch);
80 this.$icon.attr('class', inputPresentAndUnchanged ? 'icon-remove' : 'icon-search');
84 disable: function () {
85 this.$input.attr('disabled', 'disabled');
86 this.$button.addClass('disabled');
90 this.$input.removeAttr('disabled');
91 this.$button.removeClass('disabled');
97 // SEARCH PLUGIN DEFINITION
99 $.fn.search = function (option) {
100 return this.each(function () {
102 var data = $this.data('search');
103 var options = typeof option === 'object' && option;
105 if (!data) $this.data('search', (data = new Search(this, options)));
106 if (typeof option === 'string') data[option]();
110 $.fn.search.defaults = {};
112 $.fn.search.Constructor = Search;
118 $('body').on('mousedown.search.data-api', '.search', function () {
120 if ($this.data('search')) return;
121 $this.search($this.data());