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.

486 lines
14 KiB

  1. /*!
  2. * # Semantic UI 2.1.6 - Nag
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Copyright 2015 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. */
  11. ;(function ($, window, document, undefined) {
  12. "use strict";
  13. $.fn.nag = function(parameters) {
  14. var
  15. $allModules = $(this),
  16. moduleSelector = $allModules.selector || '',
  17. time = new Date().getTime(),
  18. performance = [],
  19. query = arguments[0],
  20. methodInvoked = (typeof query == 'string'),
  21. queryArguments = [].slice.call(arguments, 1),
  22. returnedValue
  23. ;
  24. $allModules
  25. .each(function() {
  26. var
  27. settings = ( $.isPlainObject(parameters) )
  28. ? $.extend(true, {}, $.fn.nag.settings, parameters)
  29. : $.extend({}, $.fn.nag.settings),
  30. className = settings.className,
  31. selector = settings.selector,
  32. error = settings.error,
  33. namespace = settings.namespace,
  34. eventNamespace = '.' + namespace,
  35. moduleNamespace = namespace + '-module',
  36. $module = $(this),
  37. $close = $module.find(selector.close),
  38. $context = (settings.context)
  39. ? $(settings.context)
  40. : $('body'),
  41. element = this,
  42. instance = $module.data(moduleNamespace),
  43. moduleOffset,
  44. moduleHeight,
  45. contextWidth,
  46. contextHeight,
  47. contextOffset,
  48. yOffset,
  49. yPosition,
  50. timer,
  51. module,
  52. requestAnimationFrame = window.requestAnimationFrame
  53. || window.mozRequestAnimationFrame
  54. || window.webkitRequestAnimationFrame
  55. || window.msRequestAnimationFrame
  56. || function(callback) { setTimeout(callback, 0); }
  57. ;
  58. module = {
  59. initialize: function() {
  60. module.verbose('Initializing element');
  61. $module
  62. .on('click' + eventNamespace, selector.close, module.dismiss)
  63. .data(moduleNamespace, module)
  64. ;
  65. if(settings.detachable && $module.parent()[0] !== $context[0]) {
  66. $module
  67. .detach()
  68. .prependTo($context)
  69. ;
  70. }
  71. if(settings.displayTime > 0) {
  72. setTimeout(module.hide, settings.displayTime);
  73. }
  74. module.show();
  75. },
  76. destroy: function() {
  77. module.verbose('Destroying instance');
  78. $module
  79. .removeData(moduleNamespace)
  80. .off(eventNamespace)
  81. ;
  82. },
  83. show: function() {
  84. if( module.should.show() && !$module.is(':visible') ) {
  85. module.debug('Showing nag', settings.animation.show);
  86. if(settings.animation.show == 'fade') {
  87. $module
  88. .fadeIn(settings.duration, settings.easing)
  89. ;
  90. }
  91. else {
  92. $module
  93. .slideDown(settings.duration, settings.easing)
  94. ;
  95. }
  96. }
  97. },
  98. hide: function() {
  99. module.debug('Showing nag', settings.animation.hide);
  100. if(settings.animation.show == 'fade') {
  101. $module
  102. .fadeIn(settings.duration, settings.easing)
  103. ;
  104. }
  105. else {
  106. $module
  107. .slideUp(settings.duration, settings.easing)
  108. ;
  109. }
  110. },
  111. onHide: function() {
  112. module.debug('Removing nag', settings.animation.hide);
  113. $module.remove();
  114. if (settings.onHide) {
  115. settings.onHide();
  116. }
  117. },
  118. dismiss: function(event) {
  119. if(settings.storageMethod) {
  120. module.storage.set(settings.key, settings.value);
  121. }
  122. module.hide();
  123. event.stopImmediatePropagation();
  124. event.preventDefault();
  125. },
  126. should: {
  127. show: function() {
  128. if(settings.persist) {
  129. module.debug('Persistent nag is set, can show nag');
  130. return true;
  131. }
  132. if( module.storage.get(settings.key) != settings.value.toString() ) {
  133. module.debug('Stored value is not set, can show nag', module.storage.get(settings.key));
  134. return true;
  135. }
  136. module.debug('Stored value is set, cannot show nag', module.storage.get(settings.key));
  137. return false;
  138. }
  139. },
  140. get: {
  141. storageOptions: function() {
  142. var
  143. options = {}
  144. ;
  145. if(settings.expires) {
  146. options.expires = settings.expires;
  147. }
  148. if(settings.domain) {
  149. options.domain = settings.domain;
  150. }
  151. if(settings.path) {
  152. options.path = settings.path;
  153. }
  154. return options;
  155. }
  156. },
  157. clear: function() {
  158. module.storage.remove(settings.key);
  159. },
  160. storage: {
  161. set: function(key, value) {
  162. var
  163. options = module.get.storageOptions()
  164. ;
  165. if(settings.storageMethod == 'localstorage' && window.localStorage !== undefined) {
  166. window.localStorage.setItem(key, value);
  167. module.debug('Value stored using local storage', key, value);
  168. }
  169. else if(settings.storageMethod == 'sessionstorage' && window.sessionStorage !== undefined) {
  170. window.sessionStorage.setItem(key, value);
  171. module.debug('Value stored using session storage', key, value);
  172. }
  173. else if($.cookie !== undefined) {
  174. $.cookie(key, value, options);
  175. module.debug('Value stored using cookie', key, value, options);
  176. }
  177. else {
  178. module.error(error.noCookieStorage);
  179. return;
  180. }
  181. },
  182. get: function(key, value) {
  183. var
  184. storedValue
  185. ;
  186. if(settings.storageMethod == 'localstorage' && window.localStorage !== undefined) {
  187. storedValue = window.localStorage.getItem(key);
  188. }
  189. else if(settings.storageMethod == 'sessionstorage' && window.sessionStorage !== undefined) {
  190. storedValue = window.sessionStorage.getItem(key);
  191. }
  192. // get by cookie
  193. else if($.cookie !== undefined) {
  194. storedValue = $.cookie(key);
  195. }
  196. else {
  197. module.error(error.noCookieStorage);
  198. }
  199. if(storedValue == 'undefined' || storedValue == 'null' || storedValue === undefined || storedValue === null) {
  200. storedValue = undefined;
  201. }
  202. return storedValue;
  203. },
  204. remove: function(key) {
  205. var
  206. options = module.get.storageOptions()
  207. ;
  208. if(settings.storageMethod == 'localstorage' && window.localStorage !== undefined) {
  209. window.localStorage.removeItem(key);
  210. }
  211. else if(settings.storageMethod == 'sessionstorage' && window.sessionStorage !== undefined) {
  212. window.sessionStorage.removeItem(key);
  213. }
  214. // store by cookie
  215. else if($.cookie !== undefined) {
  216. $.removeCookie(key, options);
  217. }
  218. else {
  219. module.error(error.noStorage);
  220. }
  221. }
  222. },
  223. setting: function(name, value) {
  224. module.debug('Changing setting', name, value);
  225. if( $.isPlainObject(name) ) {
  226. $.extend(true, settings, name);
  227. }
  228. else if(value !== undefined) {
  229. settings[name] = value;
  230. }
  231. else {
  232. return settings[name];
  233. }
  234. },
  235. internal: function(name, value) {
  236. if( $.isPlainObject(name) ) {
  237. $.extend(true, module, name);
  238. }
  239. else if(value !== undefined) {
  240. module[name] = value;
  241. }
  242. else {
  243. return module[name];
  244. }
  245. },
  246. debug: function() {
  247. if(settings.debug) {
  248. if(settings.performance) {
  249. module.performance.log(arguments);
  250. }
  251. else {
  252. module.debug = Function.prototype.bind.call(console.info, console, settings.name + ':');
  253. module.debug.apply(console, arguments);
  254. }
  255. }
  256. },
  257. verbose: function() {
  258. if(settings.verbose && settings.debug) {
  259. if(settings.performance) {
  260. module.performance.log(arguments);
  261. }
  262. else {
  263. module.verbose = Function.prototype.bind.call(console.info, console, settings.name + ':');
  264. module.verbose.apply(console, arguments);
  265. }
  266. }
  267. },
  268. error: function() {
  269. module.error = Function.prototype.bind.call(console.error, console, settings.name + ':');
  270. module.error.apply(console, arguments);
  271. },
  272. performance: {
  273. log: function(message) {
  274. var
  275. currentTime,
  276. executionTime,
  277. previousTime
  278. ;
  279. if(settings.performance) {
  280. currentTime = new Date().getTime();
  281. previousTime = time || currentTime;
  282. executionTime = currentTime - previousTime;
  283. time = currentTime;
  284. performance.push({
  285. 'Name' : message[0],
  286. 'Arguments' : [].slice.call(message, 1) || '',
  287. 'Element' : element,
  288. 'Execution Time' : executionTime
  289. });
  290. }
  291. clearTimeout(module.performance.timer);
  292. module.performance.timer = setTimeout(module.performance.display, 500);
  293. },
  294. display: function() {
  295. var
  296. title = settings.name + ':',
  297. totalTime = 0
  298. ;
  299. time = false;
  300. clearTimeout(module.performance.timer);
  301. $.each(performance, function(index, data) {
  302. totalTime += data['Execution Time'];
  303. });
  304. title += ' ' + totalTime + 'ms';
  305. if(moduleSelector) {
  306. title += ' \'' + moduleSelector + '\'';
  307. }
  308. if( (console.group !== undefined || console.table !== undefined) && performance.length > 0) {
  309. console.groupCollapsed(title);
  310. if(console.table) {
  311. console.table(performance);
  312. }
  313. else {
  314. $.each(performance, function(index, data) {
  315. console.log(data['Name'] + ': ' + data['Execution Time']+'ms');
  316. });
  317. }
  318. console.groupEnd();
  319. }
  320. performance = [];
  321. }
  322. },
  323. invoke: function(query, passedArguments, context) {
  324. var
  325. object = instance,
  326. maxDepth,
  327. found,
  328. response
  329. ;
  330. passedArguments = passedArguments || queryArguments;
  331. context = element || context;
  332. if(typeof query == 'string' && object !== undefined) {
  333. query = query.split(/[\. ]/);
  334. maxDepth = query.length - 1;
  335. $.each(query, function(depth, value) {
  336. var camelCaseValue = (depth != maxDepth)
  337. ? value + query[depth + 1].charAt(0).toUpperCase() + query[depth + 1].slice(1)
  338. : query
  339. ;
  340. if( $.isPlainObject( object[camelCaseValue] ) && (depth != maxDepth) ) {
  341. object = object[camelCaseValue];
  342. }
  343. else if( object[camelCaseValue] !== undefined ) {
  344. found = object[camelCaseValue];
  345. return false;
  346. }
  347. else if( $.isPlainObject( object[value] ) && (depth != maxDepth) ) {
  348. object = object[value];
  349. }
  350. else if( object[value] !== undefined ) {
  351. found = object[value];
  352. return false;
  353. }
  354. else {
  355. module.error(error.method, query);
  356. return false;
  357. }
  358. });
  359. }
  360. if ( $.isFunction( found ) ) {
  361. response = found.apply(context, passedArguments);
  362. }
  363. else if(found !== undefined) {
  364. response = found;
  365. }
  366. if($.isArray(returnedValue)) {
  367. returnedValue.push(response);
  368. }
  369. else if(returnedValue !== undefined) {
  370. returnedValue = [returnedValue, response];
  371. }
  372. else if(response !== undefined) {
  373. returnedValue = response;
  374. }
  375. return found;
  376. }
  377. };
  378. if(methodInvoked) {
  379. if(instance === undefined) {
  380. module.initialize();
  381. }
  382. module.invoke(query);
  383. }
  384. else {
  385. if(instance !== undefined) {
  386. instance.invoke('destroy');
  387. }
  388. module.initialize();
  389. }
  390. })
  391. ;
  392. return (returnedValue !== undefined)
  393. ? returnedValue
  394. : this
  395. ;
  396. };
  397. $.fn.nag.settings = {
  398. name : 'Nag',
  399. debug : false,
  400. verbose : false,
  401. performance : true,
  402. namespace : 'Nag',
  403. // allows cookie to be overriden
  404. persist : false,
  405. // set to zero to require manually dismissal, otherwise hides on its own
  406. displayTime : 0,
  407. animation : {
  408. show : 'slide',
  409. hide : 'slide'
  410. },
  411. context : false,
  412. detachable : false,
  413. expires : 30,
  414. domain : false,
  415. path : '/',
  416. // type of storage to use
  417. storageMethod : 'cookie',
  418. // value to store in dismissed localstorage/cookie
  419. key : 'nag',
  420. value : 'dismiss',
  421. error: {
  422. noCookieStorage : '$.cookie is not included. A storage solution is required.',
  423. noStorage : 'Neither $.cookie or store is defined. A storage solution is required for storing state',
  424. method : 'The method you called is not defined.'
  425. },
  426. className : {
  427. bottom : 'bottom',
  428. fixed : 'fixed'
  429. },
  430. selector : {
  431. close : '.close.icon'
  432. },
  433. speed : 500,
  434. easing : 'easeOutQuad',
  435. onHide: function() {}
  436. };
  437. })( jQuery, window, document );