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.

345 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
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. ;
  99. $.proxy(settings.onChange, $input.get())();
  100. $.proxy(settings.onEnable, $input.get())();
  101. },
  102. disable: function() {
  103. module.debug('Disabling checkbox');
  104. $input
  105. .prop('checked', false)
  106. ;
  107. $.proxy(settings.onChange, $input.get())();
  108. $.proxy(settings.onDisable, $input.get())();
  109. },
  110. toggle: function(event) {
  111. module.verbose('Determining new checkbox state');
  112. if( module.is.disabled() ) {
  113. module.enable();
  114. }
  115. else if( module.is.enabled() && module.can.disable() ) {
  116. module.disable();
  117. }
  118. },
  119. setting: function(name, value) {
  120. if( $.isPlainObject(name) ) {
  121. $.extend(true, settings, name);
  122. }
  123. else if(value !== undefined) {
  124. settings[name] = value;
  125. }
  126. else {
  127. return settings[name];
  128. }
  129. },
  130. internal: function(name, value) {
  131. if( $.isPlainObject(name) ) {
  132. $.extend(true, module, name);
  133. }
  134. else if(value !== undefined) {
  135. module[name] = value;
  136. }
  137. else {
  138. return module[name];
  139. }
  140. },
  141. debug: function() {
  142. if(settings.debug) {
  143. if(settings.performance) {
  144. module.performance.log(arguments);
  145. }
  146. else {
  147. module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
  148. module.debug.apply(console, arguments);
  149. }
  150. }
  151. },
  152. verbose: function() {
  153. if(settings.verbose && settings.debug) {
  154. if(settings.performance) {
  155. module.performance.log(arguments);
  156. }
  157. else {
  158. module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
  159. module.verbose.apply(console, arguments);
  160. }
  161. }
  162. },
  163. error: function() {
  164. module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
  165. module.error.apply(console, arguments);
  166. },
  167. performance: {
  168. log: function(message) {
  169. var
  170. currentTime,
  171. executionTime,
  172. previousTime
  173. ;
  174. if(settings.performance) {
  175. currentTime = new Date().getTime();
  176. previousTime = time || currentTime;
  177. executionTime = currentTime - previousTime;
  178. time = currentTime;
  179. performance.push({
  180. 'Element' : element,
  181. 'Name' : message[0],
  182. 'Arguments' : [].slice.call(message, 1) || '',
  183. 'Execution Time' : executionTime
  184. });
  185. }
  186. clearTimeout(module.performance.timer);
  187. module.performance.timer = setTimeout(module.performance.display, 100);
  188. },
  189. display: function() {
  190. var
  191. title = settings.name + ':',
  192. totalTime = 0
  193. ;
  194. time = false;
  195. clearTimeout(module.performance.timer);
  196. $.each(performance, function(index, data) {
  197. totalTime += data['Execution Time'];
  198. });
  199. title += ' ' + totalTime + 'ms';
  200. if(moduleSelector) {
  201. title += ' \'' + moduleSelector + '\'';
  202. }
  203. if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
  204. console.groupCollapsed(title);
  205. if(console.table) {
  206. console.table(performance);
  207. }
  208. else {
  209. $.each(performance, function(index, data) {
  210. console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
  211. });
  212. }
  213. console.groupEnd();
  214. }
  215. performance = [];
  216. }
  217. },
  218. invoke: function(query, passedArguments, context) {
  219. var
  220. maxDepth,
  221. found,
  222. response
  223. ;
  224. passedArguments = passedArguments || queryArguments;
  225. context = element || context;
  226. if(typeof query == 'string' && instance !== undefined) {
  227. query = query.split(/[\. ]/);
  228. maxDepth = query.length - 1;
  229. $.each(query, function(depth, value) {
  230. var camelCaseValue = (depth != maxDepth)
  231. ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
  232. : query
  233. ;
  234. if( $.isPlainObject( instance[camelCaseValue] ) && (depth != maxDepth) ) {
  235. instance = instance[camelCaseValue];
  236. }
  237. else if( instance[camelCaseValue] !== undefined ) {
  238. found = instance[camelCaseValue];
  239. return false;
  240. }
  241. else if( $.isPlainObject( instance[value] ) && (depth != maxDepth) ) {
  242. instance = instance[value];
  243. }
  244. else if( instance[value] !== undefined ) {
  245. found = instance[value];
  246. return false;
  247. }
  248. else {
  249. module.error(error.method, query);
  250. return false;
  251. }
  252. });
  253. }
  254. if ( $.isFunction( found ) ) {
  255. response = found.apply(context, passedArguments);
  256. }
  257. else if(found !== undefined) {
  258. response = found;
  259. }
  260. if($.isArray(returnedValue)) {
  261. returnedValue.push(response);
  262. }
  263. else if(returnedValue !== undefined) {
  264. returnedValue = [returnedValue, response];
  265. }
  266. else if(response !== undefined) {
  267. returnedValue = response;
  268. }
  269. return found;
  270. }
  271. };
  272. if(methodInvoked) {
  273. if(instance === undefined) {
  274. module.initialize();
  275. }
  276. module.invoke(query);
  277. }
  278. else {
  279. if(instance !== undefined) {
  280. module.destroy();
  281. }
  282. module.initialize();
  283. }
  284. })
  285. ;
  286. return (returnedValue !== undefined)
  287. ? returnedValue
  288. : this
  289. ;
  290. };
  291. $.fn.checkbox.settings = {
  292. name : 'Checkbox',
  293. namespace : 'checkbox',
  294. verbose : true,
  295. debug : true,
  296. performance : true,
  297. // delegated event context
  298. context : false,
  299. required : 'auto',
  300. onChange : function(){},
  301. onEnable : function(){},
  302. onDisable : function(){},
  303. error : {
  304. method : 'The method you called is not defined.'
  305. },
  306. selector : {
  307. input : 'input[type=checkbox], input[type=radio]',
  308. label : 'label'
  309. },
  310. className : {
  311. radio : 'radio'
  312. }
  313. };
  314. })( jQuery, window , document );