templates.js 20 KB

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