undefined

API Docs for: 5.4.0
Show:

File: src/js/RAMP/Modules/advancedToolbar.js

  1. /*global define, $, TimelineLite, require, tmpl, console, RAMP */
  2.  
  3. /**
  4. * Tools module. Contains tools accessible through Advanced Toolbar.
  5. *
  6. * Contains the advanced tools as a popup.
  7. *
  8. * @module Tools
  9. * @main Tools
  10. */
  11.  
  12. /**
  13. * AdvancedToolbar class.
  14. *
  15. * ####Imports RAMP Modules:
  16. * {{#crossLink "EventManager"}}{{/crossLink}}
  17. * {{#crossLink "Map"}}{{/crossLink}}
  18. * {{#crossLink "GlobalStorage"}}{{/crossLink}}
  19. * {{#crossLink "Util"}}{{/crossLink}}
  20. * {{#crossLink "Dictionary"}}{{/crossLink}}
  21. * {{#crossLink "TmplHelper"}}{{/crossLink}}
  22. * {{#crossLink "PopupManager"}}{{/crossLink}}
  23. *
  24. * ####Uses RAMP Templates:
  25. * {{#crossLink "templates/advanced_toolbar_template.json"}}{{/crossLink}}
  26. *
  27. * @class AdvancedToolbar
  28. * @static
  29. * @uses dojo/_base/lang
  30. * @uses dojo/topic
  31. * @uses dojo/Deferred
  32. */
  33.  
  34. define([
  35. // Dojo
  36. 'dojo/_base/lang', 'dojo/topic', 'dojo/Deferred',
  37. // Ramp
  38. 'ramp/eventManager', 'ramp/map', 'ramp/globalStorage',
  39. // Util
  40. 'utils/util', 'utils/dictionary', 'utils/popupManager',
  41. 'utils/tmplHelper',
  42. // Text
  43. 'dojo/text!./templates/advanced_toolbar_template.json'
  44. ],
  45. function (
  46. // Dojo
  47. dojoLang, topic, Deferred,
  48. // Ramp
  49. EventManager, RampMap, globalStorage,
  50. // Util
  51. UtilMisc, UtilDict, PopupManager, TmplHelper,
  52. // Text
  53. advanced_toolbar_template_json
  54. ) {
  55. 'use strict';
  56.  
  57. var map,
  58.  
  59. tools = [
  60. // name,
  61. // selector,
  62. // enabled,
  63. // module
  64. ],
  65.  
  66. ui = (function () {
  67.  
  68. var advancedToggle,
  69. advancedSectionContainer,
  70. advancedToolbarList,
  71.  
  72. cssButtonPressedClass = 'button-pressed',
  73.  
  74. transitionDuration = 0.4,
  75. subPanelMarginDelta = 32,
  76.  
  77. viewport = $('.viewport'),
  78. panelToggle = viewport.find('#panel-toggle'),
  79.  
  80. advancedToolbarTimeline = new TimelineLite({ paused: true }),
  81. subpanelTimeLine = new TimelineLite();
  82.  
  83. /**
  84. * Runs the open/close animation of the toolbar additionally managing the animation of adjusting the height of the details panel to accommodate the expanded toolbar.
  85. *
  86. * @method toggleToolbar
  87. * @param {Deferred} d a deferred to be resolved upon completion of the animation
  88. * @param {Boolean} doOpen if true - the toolbar show open; if false - the toolbar should close
  89. * @private
  90. */
  91. function toggleToolbar(d, doOpen) {
  92. var subPanelContainer = viewport.find('.sub-panel-container');
  93.  
  94. // clear and recreate tween to capture newly created subpanels
  95. subpanelTimeLine
  96. .clear()
  97. .fromTo(subPanelContainer, transitionDuration,
  98. { 'margin-top': 0, paused: true },
  99. { 'margin-top': subPanelMarginDelta, ease: 'easeOutCirc' }, 0)
  100. .seek(advancedToolbarTimeline.time());
  101.  
  102. if (!doOpen) {
  103. advancedToolbarTimeline.eventCallback('onReverseComplete', function () {
  104. d.resolve();
  105. viewport.removeClass('advanced-toolbar-mode');
  106. });
  107. advancedToolbarTimeline.reverse();
  108. } else {
  109. viewport.addClass('advanced-toolbar-mode');
  110. advancedToolbarTimeline.eventCallback('onComplete', function () {
  111. d.resolve();
  112. });
  113. advancedToolbarTimeline.play();
  114. }
  115. }
  116.  
  117. return {
  118. /**
  119. * Initiates additional UI components of the widget, setting listeners and other stuff.
  120. *
  121. * @method ui.init
  122. * @private
  123. */
  124. init: function () {
  125. advancedToggle = viewport.find('#advanced-toggle');
  126. advancedSectionContainer = viewport.find('#advanced-toolbar');
  127.  
  128. // create html code for advancedToolbar
  129. tmpl.cache = {};
  130. tmpl.templates = JSON.parse(TmplHelper.stringifyTemplate(advanced_toolbar_template_json));
  131. advancedSectionContainer.append(tmpl('at_main'));
  132. advancedToolbarList = advancedSectionContainer.find('#advanced-toolbar-list');
  133.  
  134. // create a timeline to animate toggling of the advanced toolbar
  135. advancedToolbarTimeline
  136. .set(advancedSectionContainer, { display: 'block' })
  137. .fromTo(advancedToolbarList, transitionDuration, { top: -subPanelMarginDelta }, { top: 0, ease: 'easeOutCirc' }, 0)
  138. .to(panelToggle, transitionDuration, { top: '+=' + subPanelMarginDelta, ease: 'easeOutCirc' }, 0)
  139.  
  140. .add(subpanelTimeLine, 0);
  141.  
  142. // register the popup for the advanced toolbar
  143. PopupManager.registerPopup(advancedToggle, 'click',
  144. function (d) {
  145. topic.publish(EventManager.GUI.TOOLBAR_SECTION_OPEN, { id: 'advanced-toolbar' });
  146.  
  147. // close this panel if any other panel is opened
  148. var that = this;
  149. UtilMisc.subscribeOnce(EventManager.GUI.TOOLBAR_SECTION_OPEN,
  150. function (evt) {
  151. if (evt.id !== 'advanced-toolbar' && that.isOpen()) {
  152. that.close();
  153. }
  154. });
  155.  
  156. toggleToolbar(d, true);
  157. },
  158. {
  159. activeClass: cssButtonPressedClass,
  160. setClassBefore: true,
  161. target: advancedSectionContainer,
  162. closeHandler: function (d) {
  163. topic.publish(EventManager.GUI.TOOLBAR_SECTION_CLOSE, { id: 'advanced-toolbar' });
  164.  
  165. deactivateAll(); // deactivate all the tools
  166. toggleToolbar(d, false);
  167. }
  168. }
  169. );
  170.  
  171. map = RampMap.getMap();
  172. },
  173.  
  174. addTool: function (tool) {
  175. advancedToolbarList.append(tool.module.node);
  176. }
  177. };
  178. }());
  179.  
  180. /**
  181. * Deactivates all the tools. Used when closing the Advanced toolbar or when another tool is being activated.
  182. *
  183. * @method deactivateAll
  184. * @param {Tool} except A tool module that should not be deactivated.
  185. * @private
  186. */
  187. function deactivateAll(except) {
  188. // deactivate all the tools except "except" tool
  189. tools.forEach(function (tool) {
  190. if ((!except || except.name !== tool.name) && tool.module) {
  191. tool.module.deactivate();
  192. }
  193. });
  194. }
  195.  
  196. return {
  197. init: function () {
  198. var toolsRequire;
  199.  
  200. ui.init();
  201.  
  202. tools = RAMP.config.advancedToolbar.tools;
  203. toolsRequire = tools
  204. .filter(function (tool) { return tool.enabled; })
  205. .map(function (tool) {
  206. return 'tools/' + tool.name;
  207. });
  208.  
  209. // load all the tools in one go
  210. console.log('toolbar : loading tools', toolsRequire);
  211. require(toolsRequire, function () {
  212. var deferredList = [],
  213. deferred,
  214. args = Array.prototype.slice.call(arguments);
  215.  
  216. args.forEach(function () {
  217. deferredList.push(new Deferred());
  218. });
  219.  
  220. UtilMisc.afterAll(deferredList, function () {
  221. // insert tool buttons into the toolbar
  222. tools.forEach(ui.addTool);
  223. });
  224.  
  225. args.forEach(function (arg, index) {
  226. deferred = new Deferred();
  227.  
  228. deferred.then(function (module) {
  229. tools[index].module = module;
  230. deferredList[index].resolve();
  231. });
  232.  
  233. arg
  234. .init(tools[index].selector, deferred)
  235. .on(arg.event.ACTIVATE, function () {
  236. console.log(arg.name, ': is activated');
  237. deactivateAll(arg);
  238. });
  239. });
  240.  
  241. console.log(args);
  242. });
  243. }
  244. };
  245. });