You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

347 lines
9.9 KiB

11 years ago
11 years ago
11 years ago
11 years ago
11 years ago
11 years ago
11 years ago
11 years ago
  1. /*
  2. * # Semantic - Checkbox
  3. * http://github.com/jlukic/semantic-ui/
  4. *
  5. *
  6. * Copyright 2013 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. */
  11. ;(function ( $, window, document, undefined ) {
  12. $.fn.checkbox = function(parameters) {
  13. var
  14. $allModules = $(this),
  15. moduleSelector = $allModules.selector || '',
  16. time = new Date().getTime(),
  17. performance = [],
  18. query = arguments[0],
  19. methodInvoked = (typeof query == 'string'),
  20. queryArguments = [].slice.call(arguments, 1),
  21. returnedValue
  22. ;
  23. $allModules
  24. .each(function() {
  25. var
  26. settings = $.extend(true, {}, $.fn.checkbox.settings, parameters),
  27. className = settings.className,
  28. namespace = settings.namespace,
  29. error = settings.error,
  30. eventNamespace = '.' + namespace,
  31. moduleNamespace = 'module-' + namespace,
  32. $module = $(this),
  33. $label = $(this).next(settings.selector.label).first(),
  34. $input = $(this).find(settings.selector.input),
  35. selector = $module.selector || '',
  36. instance = $module.data(moduleNamespace),
  37. element = this,
  38. module
  39. ;
  40. module = {
  41. initialize: function() {
  42. module.verbose('Initializing checkbox', settings);
  43. if(settings.context && selector !== '') {
  44. module.verbose('Adding delegated events');
  45. $(element, settings.context)
  46. .on(selector, 'click' + eventNamespace, module.toggle)
  47. .on(selector + ' + ' + settings.selector.label, 'click' + eventNamespace, module.toggle)
  48. ;
  49. }
  50. else {
  51. $module
  52. .on('click' + eventNamespace, module.toggle)
  53. .data(moduleNamespace, module)
  54. ;
  55. $label
  56. .on('click' + eventNamespace, module.toggle)
  57. ;
  58. }
  59. module.instantiate();
  60. },
  61. instantiate: function() {
  62. module.verbose('Storing instance of module', module);
  63. instance = module;
  64. $module
  65. .data(moduleNamespace, module)
  66. ;
  67. },
  68. destroy: function() {
  69. module.verbose('Destroying previous module');
  70. $module
  71. .off(eventNamespace)
  72. .removeData(moduleNamespace)
  73. ;
  74. },
  75. is: {
  76. radio: function() {
  77. return $module.hasClass(className.radio);
  78. },
  79. enabled: function() {
  80. return $input.prop('checked') !== undefined && $input.prop('checked');
  81. },
  82. disabled: function() {
  83. return !module.is.enabled();
  84. }
  85. },
  86. can: {
  87. disable: function() {
  88. return (typeof settings.required === 'boolean')
  89. ? settings.required
  90. : !module.is.radio()
  91. ;
  92. }
  93. },
  94. enable: function() {
  95. module.debug('Enabling checkbox', $input);
  96. $input
  97. .prop('checked', true)
  98. .trigger('change')
  99. ;
  100. $.proxy(settings.onChange, $input.get())();
  101. $.proxy(settings.onEnable, $input.get())();
  102. },
  103. disable: function() {
  104. module.debug('Disabling checkbox');
  105. $input
  106. .prop('checked', false)
  107. .trigger('change')
  108. ;
  109. $.proxy(settings.onChange, $input.get())();
  110. $.proxy(settings.onDisable, $input.get())();
  111. },
  112. toggle: function(event) {
  113. module.verbose('Determining new checkbox state');
  114. if( module.is.disabled() ) {
  115. module.enable();
  116. }
  117. else if( module.is.enabled() && module.can.disable() ) {
  118. module.disable();
  119. }
  120. },
  121. setting: function(name, value) {
  122. if( $.isPlainObject(name) ) {
  123. $.extend(true, settings, name);
  124. }
  125. else if(value !== undefined) {
  126. settings[name] = value;
  127. }
  128. else {
  129. return settings[name];
  130. }
  131. },
  132. internal: function(name, value) {
  133. if( $.isPlainObject(name) ) {
  134. $.extend(true, module, name);
  135. }
  136. else if(value !== undefined) {
  137. module[name] = value;
  138. }
  139. else {
  140. return module[name];
  141. }
  142. },
  143. debug: function() {
  144. if(settings.debug) {
  145. if(settings.performance) {
  146. module.performance.log(arguments);
  147. }
  148. else {
  149. module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
  150. module.debug.apply(console, arguments);
  151. }
  152. }
  153. },
  154. verbose: function() {
  155. if(settings.verbose && settings.debug) {
  156. if(settings.performance) {
  157. module.performance.log(arguments);
  158. }
  159. else {
  160. module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
  161. module.verbose.apply(console, arguments);
  162. }
  163. }
  164. },
  165. error: function() {
  166. module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
  167. module.error.apply(console, arguments);
  168. },
  169. performance: {
  170. log: function(message) {
  171. var
  172. currentTime,
  173. executionTime,
  174. previousTime
  175. ;
  176. if(settings.performance) {
  177. currentTime = new Date().getTime();
  178. previousTime = time || currentTime;
  179. executionTime = currentTime - previousTime;
  180. time = currentTime;
  181. performance.push({
  182. 'Element' : element,
  183. 'Name' : message[0],
  184. 'Arguments' : [].slice.call(message, 1) || '',
  185. 'Execution Time' : executionTime
  186. });
  187. }
  188. clearTimeout(module.performance.timer);
  189. module.performance.timer = setTimeout(module.performance.display, 100);
  190. },
  191. display: function() {
  192. var
  193. title = settings.name + ':',
  194. totalTime = 0
  195. ;
  196. time = false;
  197. clearTimeout(module.performance.timer);
  198. $.each(performance, function(index, data) {
  199. totalTime += data['Execution Time'];
  200. });
  201. title += ' ' + totalTime + 'ms';
  202. if(moduleSelector) {
  203. title += ' \'' + moduleSelector + '\'';
  204. }
  205. if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
  206. console.groupCollapsed(title);
  207. if(console.table) {
  208. console.table(performance);
  209. }
  210. else {
  211. $.each(performance, function(index, data) {
  212. console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
  213. });
  214. }
  215. console.groupEnd();
  216. }
  217. performance = [];
  218. }
  219. },
  220. invoke: function(query, passedArguments, context) {
  221. var
  222. object = instance,
  223. maxDepth,
  224. found,
  225. response
  226. ;
  227. passedArguments = passedArguments || queryArguments;
  228. context = element || context;
  229. if(typeof query == 'string' && object !== undefined) {
  230. query = query.split(/[\. ]/);
  231. maxDepth = query.length - 1;
  232. $.each(query, function(depth, value) {
  233. var camelCaseValue = (depth != maxDepth)
  234. ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
  235. : query
  236. ;
  237. if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) {
  238. object = object[camelCaseValue];
  239. }
  240. else if( object[camelCaseValue] !== undefined ) {
  241. found = object[camelCaseValue];
  242. return false;
  243. }
  244. else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) {
  245. object = object[value];
  246. }
  247. else if( object[value] !== undefined ) {
  248. found = object[value];
  249. return false;
  250. }
  251. else {
  252. return false;
  253. }
  254. });
  255. }
  256. if ( $.isFunction( found ) ) {
  257. response = found.apply(context, passedArguments);
  258. }
  259. else if(found !== undefined) {
  260. response = found;
  261. }
  262. if($.isArray(returnedValue)) {
  263. returnedValue.push(response);
  264. }
  265. else if(returnedValue !== undefined) {
  266. returnedValue = [returnedValue, response];
  267. }
  268. else if(response !== undefined) {
  269. returnedValue = response;
  270. }
  271. return found;
  272. }
  273. };
  274. if(methodInvoked) {
  275. if(instance === undefined) {
  276. module.initialize();
  277. }
  278. module.invoke(query);
  279. }
  280. else {
  281. if(instance !== undefined) {
  282. module.destroy();
  283. }
  284. module.initialize();
  285. }
  286. })
  287. ;
  288. return (returnedValue !== undefined)
  289. ? returnedValue
  290. : this
  291. ;
  292. };
  293. $.fn.checkbox.settings = {
  294. name : 'Checkbox',
  295. namespace : 'checkbox',
  296. verbose : true,
  297. debug : true,
  298. performance : true,
  299. // delegated event context
  300. context : false,
  301. required : 'auto',
  302. onChange : function(){},
  303. onEnable : function(){},
  304. onDisable : function(){},
  305. error : {
  306. method : 'The method you called is not defined.'
  307. },
  308. selector : {
  309. input : 'input[type=checkbox], input[type=radio]',
  310. label : 'label'
  311. },
  312. className : {
  313. radio : 'radio'
  314. }
  315. };
  316. })( jQuery, window , document );