templates.js 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348
  1. /**
  2. *
  3. * @author: Malishev Dmitry <dima.malishev@gmail.com>
  4. */
  5. App.Templates.html = {
  6. WEB: {
  7. hint: [''],
  8. notification: [
  9. '<li class="~!:UNSEEN~!"><span class="unselectable mark-seen" id="notification-~!:ID~!">&nbsp;</span>\
  10. <span class="title"><span class="unselectable icon ~!:TYPE~!">&nbsp;</span>~!:TOPIC~!</span>\
  11. ~!:NOTICE~!\
  12. <span class="time">~!:TIME~! ~!:DATE~!</span>\
  13. </li>'
  14. ],
  15. notification_empty: [
  16. '<li class="empty">\
  17. '+App.Constants.NOTIFICATIONS_EMPTY+'\
  18. </li>'
  19. ]
  20. },
  21. // file manager
  22. //
  23. FM: {
  24. reload_in_time: [
  25. '<div id="reload-in-time" class="warning-box reload">\
  26. <div class="message-small">'+App.Constants.FM_HIT+' <span>F5</span> '+App.Constants.FM_TO_RELOAD_THE_PAGE+'</div>\
  27. </div>'
  28. ],
  29. entry_line: ['<li class="dir">\
  30. <span class="marker">\
  31. </span>\
  32. <span class="icon ~!:ITEM_TYPE~!" ></span>\
  33. <input type="hidden" class="source" value=\'~!:SOURCE~!\'/>\
  34. <span class="filename-holder"><div class="filename ripple" ~!:CL_ACTION_1~!>~!:NAME~!</div></span>\
  35. <span class="mode">~!:PERMISSIONS~!</span>\
  36. <span class="owner">~!:OWNER~!</span>\
  37. <span class="size-unit">~!:SIZE_UNIT~!</span>\
  38. <span class="size-value">~!:SIZE_VALUE~!</span>\
  39. <span class="date">~!:DATE~!</span>\
  40. <span class="time">~!:TIME~!</span>\
  41. <!-- span class="subcontext-control ~!:SUBMENU_CLASS~!" onClick="FM.toggleSubContextMenu(this)">&#8226;&#8226;&#8226;&nbsp;\
  42. <ul class="subcontext-menu subcontext-menu-hidden"><li onClick="FM.downloadFileFromSubcontext(this);">Download</li><li onClick="FM.editFileFromSubcontext(this);">Edit</li></ul>\
  43. </span -->\
  44. </li>'],
  45. popup_alert: ['<div class="confirm-box alarm popup-box">\
  46. <div class="message">~!:TEXT~!</div>\
  47. <div class="controls">\
  48. <p class="ok" onClick="FM.popupClose();">'+App.Constants.FM_CLOSE+'</p>\
  49. </div>\
  50. </div>'],
  51. popup_bulk_remove: ['<div class="confirm-box delete popup-box">\
  52. <div class="message">'+App.Constants.FM_CONFIRM_DELETE_BULK+' (~!:NUMBER_OF_ITEMS~!)?</div>\
  53. <div class="results"></div>\
  54. <div class="controls">\
  55. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  56. <p class="ok" onClick="FM.bulkRemoveDo();">'+App.Constants.FM_DELETE+'</p>\
  57. </div>\
  58. </div>'],
  59. popup_bulk_copy: ['<div class="confirm-box copy popup-box">\
  60. <div class="message">'+App.Constants.FM_COPY_BULK+' (~!:NUMBER_OF_ITEMS~!) '+ App.Constants.FM_INTO_KEYWORD +':</div>\
  61. <div class="actions">\
  62. <input type="text" id="copy_dest" value="~!:DST_FILENAME~!" class="new-title">\
  63. </div>\
  64. <div class="results"></div>\
  65. <div class="warning">'+App.Constants.FM_EXISTING_FILES_WILL_BE_REPLACED+'</div>\
  66. <div class="controls">\
  67. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  68. <p class="ok" onClick="FM.bulkCopyDo();">'+App.Constants.FM_COPY+'</p>\
  69. </div>\
  70. </div>'],
  71. popup_bulk_move: ['<div class="confirm-box copy popup-box">\
  72. <div class="message">'+App.Constants.FM_MOVE_BULK+' (~!:NUMBER_OF_ITEMS~!) '+ App.Constants.FM_INTO_KEYWORD +':</div>\
  73. <div class="actions">\
  74. <input type="text" id="dst-name" value="~!:DST_NAME~!" class="new-title">\
  75. </div>\
  76. <div class="results"></div>\
  77. <div class="warning">'+App.Constants.FM_EXISTING_FILES_WILL_BE_REPLACED+'</div>\
  78. <div class="controls">\
  79. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  80. <p class="ok" onClick="FM.bulkMoveDo();">'+App.Constants.FM_MOVE+'</p>\
  81. </div>\
  82. </div>'],
  83. popup_delete: ['<div class="confirm-box delete popup-box">\
  84. <div class="message">'+App.Constants.FM_CONFIRM_DELETE+' <span class="title">"~!:FILENAME~!"</span>?</div>\
  85. <div class="warning warning-message"></div>\
  86. <div class="controls">\
  87. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  88. <p class="ok" onClick="FM.confirmDelete();">'+App.Constants.FM_DELETE+'</p>\
  89. </div>\
  90. </div>'],
  91. popup_copy: ['<div class="confirm-box copy popup-box">\
  92. <div class="message">'+App.Constants.FM_COPY+' <span class="title">"~!:SRC_FILENAME~!"</span> '+App.Constants.FM_INTO_KEYWORD+':</div>\
  93. <div class="actions">\
  94. <input type="text" id="copy_dest" value="~!:DST_FILENAME~!" class="new-title">\
  95. </div>\
  96. <div class="message"></div>\
  97. <div class="warning warning-message">'+App.Constants.FM_EXISTING_FILES_WILL_BE_REPLACED+'</div>\
  98. <div class="controls">\
  99. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  100. <p class="ok" onClick="FM.confirmCopyItems();">'+App.Constants.FM_COPY+'</p>\
  101. </div>\
  102. </div>'],
  103. popup_move: ['<div class="confirm-box copy popup-box">\
  104. <div class="message">'+App.Constants.FM_MOVE+' <span class="title">"~!:FILENAME~!"</span> '+App.Constants.FM_INTO_KEYWORD+':</div>\
  105. <div class="actions">\
  106. <input type="text" id="dst-name" value="~!:DST_NAME~!" class="new-title">\
  107. </div>\
  108. <div class="message"></div>\
  109. <div class="warning warning-message">'+App.Constants.FM_EXISTING_FILES_WILL_BE_REPLACED+'</div>\
  110. <div class="controls">\
  111. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  112. <p class="ok" onClick="FM.confirmMove();">'+App.Constants.FM_MOVE+'</p>\
  113. </div>\
  114. </div>'],
  115. popup_rename: ['<div class="confirm-box rename warning">\
  116. <div class="message">'+App.Constants.FM_RENAME+': <span class="title">"~!:FILENAME~!"</span></div>\
  117. <div class="warning warning-message"></div>\
  118. <div class="actions">\
  119. <input type="text" id="rename-title" class="new-title" value="~!:NEW_NAME~!" />\
  120. </div>\
  121. <div class="controls">\
  122. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  123. <p class="ok" onClick="FM.confirmRename();">'+App.Constants.FM_RENAME+'</p>\
  124. </div>\
  125. <div class="controls replace">\
  126. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  127. <p class="ok" onClick="FM.confirmRename();">'+App.Constants.FM_RENAME+'</p>\
  128. </div>\
  129. </div>'],
  130. popup_chmod: ['<div class="confirm-box chmod warning">\
  131. <div class="message">'+App.Constants.FM_CHMOD+': <span class="title">"~!:FILENAME~!"</span></div>\
  132. <div class="warning warning-message"></div>\
  133. <div class="actions">\
  134. <ul>\
  135. <li><label><input type="checkbox" name="read-by-owner" value="1" ~!:READ_BY_OWNER~! /> '+App.Constants.FM_READ_BY_OWNER+'</label></li>\
  136. <li><label><input type="checkbox" name="write-by-owner" value="1" ~!:WRITE_BY_OWNER~! /> '+App.Constants.FM_WRITE_BY_OWNER+'</label></li>\
  137. <li><label><input type="checkbox" name="execute-by-owner" value="1" ~!:EXECUTE_BY_OWNER~! /> '+App.Constants.FM_EXECUTE_BY_OWNER+'</label></li>\
  138. </ul><ul>\
  139. <li><label><input type="checkbox" name="read-by-group" value="1" ~!:READ_BY_GROUP~! /> '+App.Constants.FM_READ_BY_GROUP+'</label></li>\
  140. <li><label><input type="checkbox" name="write-by-group" value="1" ~!:WRITE_BY_GROUP~! /> '+App.Constants.FM_WRITE_BY_GROUP+'</label></li>\
  141. <li><label><input type="checkbox" name="execute-by-group" value="1" ~!:EXECUTE_BY_GROUP~! /> '+App.Constants.FM_EXECUTE_BY_GROUP+'</label></li>\
  142. </ul><ul>\
  143. <li><label><input type="checkbox" name="read-by-others" value="1" ~!:READ_BY_OTHERS~! /> '+App.Constants.FM_READ_BY_OTHERS+'</label></li>\
  144. <li><label><input type="checkbox" name="write-by-others" value="1" ~!:WRITE_BY_OTHERS~! /> '+App.Constants.FM_WRITE_BY_OTHERS+'</label></li>\
  145. <li><label><input type="checkbox" name="execute-by-others" value="1" ~!:EXECUTE_BY_OTHERS~! /> '+App.Constants.FM_EXECUTE_BY_OTHERS+'</label></li>\
  146. </ul>\
  147. <input type="text" name="mask" class="chmod-mask" maxlength="3" />\
  148. </div>\
  149. <div class="controls">\
  150. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  151. <p class="ok" onClick="FM.confirmChmod();">'+App.Constants.FM_OK+'</p>\
  152. </div>\
  153. </div>'],
  154. popup_bulk_chmod: ['<div class="confirm-box chmod warning">\
  155. <div class="message">'+App.Constants.FM_CHMOD+' (~!:NUMBER_OF_ITEMS~!)</div>\
  156. <div class="warning warning-message"></div>\
  157. <div class="actions">\
  158. <ul>\
  159. <li><label><input type="checkbox" name="read-by-owner" value="1" checked /> '+App.Constants.FM_READ_BY_OWNER+'</label></li>\
  160. <li><label><input type="checkbox" name="write-by-owner" value="1" checked /> '+App.Constants.FM_WRITE_BY_OWNER+'</label></li>\
  161. <li><label><input type="checkbox" name="execute-by-owner" value="1" checked /> '+App.Constants.FM_EXECUTE_BY_OWNER+'</label></li>\
  162. </ul><ul>\
  163. <li><label><input type="checkbox" name="read-by-group" value="1" checked /> '+App.Constants.FM_READ_BY_GROUP+'</label></li>\
  164. <li><label><input type="checkbox" name="write-by-group" value="1" checked /> '+App.Constants.FM_WRITE_BY_GROUP+'</label></li>\
  165. <li><label><input type="checkbox" name="execute-by-group" value="1" checked /> '+App.Constants.FM_EXECUTE_BY_GROUP+'</label></li>\
  166. </ul><ul>\
  167. <li><label><input type="checkbox" name="read-by-others" value="1" checked /> '+App.Constants.FM_READ_BY_OTHERS+'</label></li>\
  168. <li><label><input type="checkbox" name="write-by-others" value="1" checked /> '+App.Constants.FM_WRITE_BY_OTHERS+'</label></li>\
  169. <li><label><input type="checkbox" name="execute-by-others" value="1" checked /> '+App.Constants.FM_EXECUTE_BY_OTHERS+'</label></li>\
  170. </ul>\
  171. <input type="text" name="mask" class="chmod-mask" maxlength="3" value="777" />\
  172. </div>\
  173. <div class="controls">\
  174. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  175. <p class="ok" onClick="FM.confirmBulkChmod();">'+App.Constants.FM_OK+'</p>\
  176. </div>\
  177. </div>'],
  178. popup_pack: ['<div class="confirm-box pack warning">\
  179. <div class="message">'+App.Constants.FM_PACK+' <span class="title">"~!:FILENAME~!"</span></div>\
  180. <div class="actions">\
  181. <input type="text" id="pack-destination" class="new-title" value="~!:DST_DIRNAME~!">\
  182. </div>\
  183. <div class="warning warning-message"></div>\
  184. <!-- div class="actions">\
  185. <label><input type="checkbox" name="overwrite" class="title" />Overwrite exising files</label>\
  186. </div -->\
  187. <div class="controls">\
  188. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  189. <p class="ok" onClick="FM.confirmPackItem();">'+App.Constants.FM_PACK_BUTTON+'</p>\
  190. </div>\
  191. </div>'],
  192. popup_bulk_pack: ['<div class="confirm-box pack warning">\
  193. <div class="message">'+App.Constants.FM_PACK+' (~!:NUMBER_OF_ITEMS~!)</div>\
  194. <div class="actions">\
  195. <input type="text" id="pack-destination" class="new-title" value="~!:DST_DIRNAME~!">\
  196. </div>\
  197. <div class="warning warning-message"></div>\
  198. <!-- div class="actions">\
  199. <label><input type="checkbox" name="overwrite" class="title" />Overwrite exising files</label>\
  200. </div -->\
  201. <div class="controls">\
  202. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  203. <p class="ok" onClick="FM.confirmPackItem();">'+App.Constants.FM_PACK_BUTTON+'</p>\
  204. </div>\
  205. </div>'],
  206. popup_unpack: ['<div class="confirm-box unpack warning">\
  207. <div class="message">'+App.Constants.FM_EXTRACT+' <span class="title">"~!:FILENAME~!"</span> '+App.Constants.FM_INTO_KEYWORD+':</div>\
  208. <div class="actions">\
  209. <input type="text" id="unpack-destination" class="new-title" value="~!:DST_DIRNAME~!">\
  210. </div>\
  211. <div class="warning warning-message"></div>\
  212. <!-- div class="actions">\
  213. <label><input type="checkbox" name="overwrite" class="title" />Overwrite exising files</label>\
  214. </div -->\
  215. <div class="controls">\
  216. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  217. <p class="ok" onClick="FM.confirmUnpackItem();">'+App.Constants.FM_EXTRACT+'</p>\
  218. </div>\
  219. </div>'],
  220. popup_create_file: ['<div class="confirm-box rename warning">\
  221. <div class="message">'+App.Constants.FM_CREATE_FILE+'</div>\
  222. <!-- div class="warning">File <span class="title">"reading.txt"</span> already exists</div -->\
  223. <div class="warning warning-message"></div>\
  224. <div class="actions">\
  225. <input type="text" id="rename-title" class="new-title" />\
  226. </div>\
  227. <div class="controls replace">\
  228. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  229. <p class="ok" onClick="FM.confirmCreateFile();">'+App.Constants.FM_CREATE+'</p>\
  230. </div>\
  231. </div>'],
  232. popup_create_dir: ['<div class="confirm-box rename warning">\
  233. <div class="message">'+App.Constants.FM_CREATE_DIRECTORY+'</div>\
  234. <!-- div class="warning">File <span class="title">"reading.txt"</span> already exists</div -->\
  235. <div class="warning warning-message"></div>\
  236. <div class="actions">\
  237. <input type="text" id="rename-title" class="new-title" />\
  238. </div>\
  239. <div class="controls replace">\
  240. <p class="cancel" onClick="FM.popupClose();">'+App.Constants.FM_CANCEL+'</p>\
  241. <p class="ok" onClick="FM.confirmCreateDir();">'+App.Constants.FM_CREATE+'</p>\
  242. </div>\
  243. </div>'],
  244. popup_no_file_selected: ['<div class="confirm-box no-file-selected">\
  245. <div class="message">Please select a file</div>\
  246. <div class="controls">\
  247. <p class="ok" onClick="FM.confirmCreateDir();">'+App.Constants.FM_OK+'</p>\
  248. </div>\
  249. </div>']
  250. }
  251. };
  252. // Internals
  253. var Tpl = App.Templates;
  254. var Templator = function()
  255. {
  256. var init = function()
  257. {
  258. fb.info('Templator work');
  259. Templator.splitThemAll();
  260. Templator.freezeTplIndexes();
  261. };
  262. /**
  263. * Split the tpl strings into arrays
  264. */
  265. Templator.splitThemAll = function(){
  266. fb.info('splitting tpls');
  267. jQuery.each(App.Templates.html, function(o){
  268. //try{
  269. var tpls = App.Templates.html[o];
  270. jQuery.each(tpls, function(t){
  271. tpls[t] = tpls[t][0].split('~!');
  272. });
  273. //}catch(e){fb.error('%o %o', o, e);}
  274. });
  275. },
  276. /**
  277. * Iterates tpls
  278. */
  279. Templator.freezeTplIndexes = function(){
  280. fb.info('freezing tpl keys');
  281. jQuery.each(App.Templates.html, Templator.cacheTplIndexes);
  282. },
  283. /**
  284. * Grab the tpl group key and process it
  285. */
  286. Templator.cacheTplIndexes = function(key)
  287. {
  288. var tpls = App.Templates.html[key];
  289. jQuery.each(tpls, function(o)
  290. {
  291. var tpl = tpls[o];
  292. Templator.catchIndex(key, o, tpl);
  293. });
  294. },
  295. /**
  296. * Set the indexes
  297. */
  298. Templator.catchIndex = function(key, ref_key, tpl)
  299. {
  300. 'undefined' == typeof App.Templates._indexes[key] ? App.Templates._indexes[key] = {} : false;
  301. 'undefined' == typeof App.Templates._indexes[key][ref_key] ?
  302. App.Templates._indexes[key][ref_key] = {} : false;
  303. jQuery(tpl).each(function(index, o) {
  304. if (':' == o.charAt(0)) {
  305. App.Templates._indexes[key][ref_key][o.toString()] = index;
  306. }
  307. });
  308. }
  309. /**
  310. * Get concrete templates
  311. */
  312. init();
  313. return Templator;
  314. };
  315. Templator.getTemplate = function(ns, key){
  316. return [
  317. App.Templates._indexes[ns][key],
  318. App.Templates.html[ns][key].slice(0)
  319. ];
  320. }
  321. // init templator
  322. Tpl.Templator = Templator();
  323. Tpl.get = function(key, group){
  324. return Tpl.Templator.getTemplate(group, key);
  325. }