extkeywidget.js 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575
  1. // Copyright (C) 2010-2016 Combodo SARL
  2. //
  3. // This file is part of iTop.
  4. //
  5. // iTop is free software; you can redistribute it and/or modify
  6. // it under the terms of the GNU Affero General Public License as published by
  7. // the Free Software Foundation, either version 3 of the License, or
  8. // (at your option) any later version.
  9. //
  10. // iTop is distributed in the hope that it will be useful,
  11. // but WITHOUT ANY WARRANTY; without even the implied warranty of
  12. // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
  13. // GNU Affero General Public License for more details.
  14. //
  15. // You should have received a copy of the GNU Affero General Public License
  16. // along with iTop. If not, see <http://www.gnu.org/licenses/>
  17. function ExtKeyWidget(id, sTargetClass, sFilter, sTitle, bSelectMode, oWizHelper, sAttCode, bSearchMode)
  18. {
  19. this.id = id;
  20. this.sTargetClass = sTargetClass;
  21. this.sFilter = sFilter;
  22. this.sTitle = sTitle;
  23. this.sAttCode = sAttCode;
  24. this.emptyHtml = ''; // content to be displayed when the search results are empty (when opening the dialog)
  25. this.emptyOnClose = true; // Workaround for the JQuery dialog being very slow when opening and closing if the content contains many INPUT tags
  26. this.oWizardHelper = oWizHelper;
  27. this.ajax_request = null;
  28. this.bSelectMode = bSelectMode; // true if the edited field is a SELECT, false if it's an autocomplete
  29. this.bSearchMode = bSearchMode; // true if selecting a value in the context of a search form
  30. var me = this;
  31. this.Init = function()
  32. {
  33. // make sure that the form is clean
  34. $('#'+this.id+'_btnRemove').attr('disabled','disabled');
  35. $('#'+this.id+'_linksToRemove').val('');
  36. };
  37. this.StopPendingRequest = function()
  38. {
  39. if (me.ajax_request)
  40. {
  41. me.ajax_request.abort();
  42. me.ajax_request = null;
  43. }
  44. };
  45. this.Search = function()
  46. {
  47. if($('#'+me.id).attr('disabled')) return; // Disabled, do nothing
  48. var value = $('#'+me.id).val(); // Current value
  49. // Query the server to get the form to search for target objects
  50. if (me.bSelectMode)
  51. {
  52. $('#fstatus_'+me.id).html('<img src="../images/indicator.gif" />');
  53. }
  54. else
  55. {
  56. $('#label_'+me.id).addClass('ac_dlg_loading');
  57. }
  58. var theMap = { sAttCode: me.sAttCode,
  59. iInputId: me.id,
  60. sTitle: me.sTitle,
  61. sAttCode: me.sAttCode,
  62. sTargetClass: me.sTargetClass,
  63. bSearchMode: me.bSearchMode,
  64. operation: 'objectSearchForm'
  65. };
  66. if (me.oWizardHelper == null)
  67. {
  68. theMap['json'] = '';
  69. }
  70. else
  71. {
  72. // Not inside a "search form", updating a real object
  73. me.oWizardHelper.UpdateWizard();
  74. theMap['json'] = me.oWizardHelper.ToJSON();
  75. }
  76. // Make sure that we cancel any pending request before issuing another
  77. // since responses may arrive in arbitrary order
  78. me.StopPendingRequest();
  79. // Run the query and get the result back directly in HTML
  80. me.ajax_request = $.post( AddAppContext(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php'), theMap,
  81. function(data)
  82. {
  83. $('#ac_dlg_'+me.id).html(data);
  84. $('#ac_dlg_'+me.id).dialog('open');
  85. me.UpdateSizes();
  86. me.UpdateButtons();
  87. me.ajax_request = null;
  88. FixSearchFormsDisposition();
  89. me.DoSearchObjects();
  90. },
  91. 'html'
  92. );
  93. };
  94. this.UpdateSizes = function()
  95. {
  96. var dlg = $('#ac_dlg_'+me.id);
  97. // Adjust the dialog's size to fit into the screen
  98. if (dlg.width() > ($(window).width()-40))
  99. {
  100. dlg.width($(window).width()-40);
  101. }
  102. if (dlg.height() > ($(window).height()-70))
  103. {
  104. dlg.height($(window).height()-70);
  105. }
  106. var searchForm = dlg.find('div.display_block:first'); // Top search form, enclosing display_block
  107. var results = $('#dr_'+me.id);
  108. var oPadding = {};
  109. var aKeys = ['top', 'right', 'bottom', 'left'];
  110. for(k in aKeys)
  111. {
  112. oPadding[aKeys[k]] = 0;
  113. if (dlg.css('padding-'+aKeys[k]))
  114. {
  115. oPadding[aKeys[k]] = parseInt(dlg.css('padding-'+aKeys[k]).replace('px', ''));
  116. }
  117. }
  118. width = dlg.innerWidth() - oPadding['right'] - oPadding['left'] - 22; // 5 (margin-left) + 5 (padding-left) + 5 (padding-right) + 5 (margin-right) + 2 for rounding !
  119. height = dlg.innerHeight() - oPadding['top'] - oPadding['bottom'] -22;
  120. form_height = searchForm.outerHeight();
  121. results.height(height - form_height - 40); // Leave some space for the buttons
  122. };
  123. this.UpdateButtons = function()
  124. {
  125. var okBtn = $('#btn_ok_'+me.id);
  126. if ($('#count_'+me.id).val() > 0)
  127. {
  128. okBtn.removeAttr('disabled');
  129. }
  130. else
  131. {
  132. okBtn.attr('disabled', 'disabled');
  133. }
  134. };
  135. this.DoSearchObjects = function(id)
  136. {
  137. var theMap = { sTargetClass: me.sTargetClass,
  138. iInputId: me.id,
  139. sFilter: me.sFilter,
  140. bSearchMode: me.bSearchMode
  141. };
  142. // Gather the parameters from the search form
  143. $('#fs_'+me.id+' :input').each( function() {
  144. if (this.name != '')
  145. {
  146. var val = $(this).val(); // supports multiselect as well
  147. if (val !== null)
  148. {
  149. theMap[this.name] = val;
  150. }
  151. }
  152. });
  153. if (me.oWizardHelper == null)
  154. {
  155. theMap['json'] = '';
  156. }
  157. else
  158. {
  159. // Not inside a "search form", updating a real object
  160. me.oWizardHelper.UpdateWizard();
  161. theMap['json'] = me.oWizardHelper.ToJSON();
  162. }
  163. theMap['sRemoteClass'] = theMap['class']; // swap 'class' (defined in the form) and 'remoteClass'
  164. theMap.operation = 'searchObjectsToSelect'; // Override what is defined in the form itself
  165. theMap.sAttCode = me.sAttCode,
  166. sSearchAreaId = '#dr_'+me.id;
  167. //$(sSearchAreaId).html('<div style="text-align:center;width:100%;height:24px;vertical-align:middle;"><img src="../images/indicator.gif" /></div>');
  168. $(sSearchAreaId).block();
  169. me.UpdateButtons();
  170. // Make sure that we cancel any pending request before issuing another
  171. // since responses may arrive in arbitrary order
  172. me.StopPendingRequest();
  173. // Run the query and display the results
  174. me.ajax_request = $.post( AddAppContext(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php'), theMap,
  175. function(data)
  176. {
  177. $(sSearchAreaId).html(data);
  178. $(sSearchAreaId+' .listResults').tableHover();
  179. $('#fr_'+me.id+' input:radio').click(function() { me.UpdateButtons(); });
  180. me.UpdateButtons();
  181. me.ajax_request = null;
  182. $('#count_'+me.id).change(function(){
  183. me.UpdateButtons();
  184. });
  185. me.UpdateSizes();
  186. },
  187. 'html'
  188. );
  189. return false; // Don't submit the form, stay in the current page !
  190. };
  191. this.DoOk = function()
  192. {
  193. var s = $('#'+me.id+'_results').find(':input[name^=storedSelection]');
  194. var iObjectId = 0;
  195. if (s.length > 0)
  196. {
  197. iObjectId = s.val();
  198. }
  199. else
  200. {
  201. iObjectId = $('#fr_'+me.id+' input[name=selectObject]:checked').val();
  202. }
  203. $('#ac_dlg_'+this.id).dialog('close');
  204. $('#label_'+this.id).addClass('ac_dlg_loading');
  205. // Query the server again to get the display name of the selected object
  206. var theMap = { sTargetClass: me.sTargetClass,
  207. iInputId: me.id,
  208. iObjectId: iObjectId,
  209. sAttCode: me.sAttCode,
  210. bSearchMode: me.bSearchMode,
  211. operation: 'getObjectName'
  212. };
  213. // Make sure that we cancel any pending request before issuing another
  214. // since responses may arrive in arbitrary order
  215. me.StopPendingRequest();
  216. // Run the query and get the result back directly in JSON
  217. me.ajax_request = $.post( AddAppContext(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php'), theMap,
  218. function(data)
  219. {
  220. var oTemp = $('<div id="ac_temp" style="display:none">'+data.name+'</div>');
  221. var txt = oTemp.html(); // this causes HTML entities to be interpreted
  222. $('#label_'+me.id).val(txt);
  223. $('#label_'+me.id).removeClass('ac_dlg_loading');
  224. var prevValue = $('#'+me.id).val();
  225. $('#'+me.id).val(iObjectId);
  226. if (prevValue != iObjectId)
  227. {
  228. $('#'+me.id).trigger('validate');
  229. $('#'+me.id).trigger('extkeychange');
  230. $('#'+me.id).trigger('change');
  231. }
  232. $('#label_'+me.id).focus();
  233. me.ajax_request = null;
  234. },
  235. 'json'
  236. );
  237. return false; // Do NOT submit the form in case we are called by OnSubmit...
  238. };
  239. // Workaround for a ui.jquery limitation: if the content of
  240. // the dialog contains many INPUTs, closing and opening the
  241. // dialog is very slow. So empty it each time.
  242. this.OnClose = function()
  243. {
  244. me.StopPendingRequest();
  245. // called by the dialog, so in the context 'this' points to the jQueryObject
  246. if (me.emptyOnClose)
  247. {
  248. $('#dr_'+me.id).html(me.emptyHtml);
  249. }
  250. $('#label_'+me.id).removeClass('ac_dlg_loading');
  251. $('#label_'+me.id).focus();
  252. me.ajax_request = null;
  253. };
  254. this.CreateObject = function(oWizHelper)
  255. {
  256. if($('#'+me.id).attr('disabled')) return; // Disabled, do nothing
  257. // Query the server to get the form to create a target object
  258. if (me.bSelectMode)
  259. {
  260. $('#fstatus_'+me.id).html('<img src="../images/indicator.gif" />');
  261. }
  262. else
  263. {
  264. $('#label_'+me.id).addClass('ac_dlg_loading');
  265. }
  266. me.oWizardHelper.UpdateWizard();
  267. var theMap = { sTargetClass: me.sTargetClass,
  268. iInputId: me.id,
  269. sAttCode: me.sAttCode,
  270. 'json': me.oWizardHelper.ToJSON(),
  271. operation: 'objectCreationForm'
  272. };
  273. // Make sure that we cancel any pending request before issuing another
  274. // since responses may arrive in arbitrary order
  275. me.StopPendingRequest();
  276. // Run the query and get the result back directly in HTML
  277. me.ajax_request = $.post( AddAppContext(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php'), theMap,
  278. function(data)
  279. {
  280. $('#ajax_'+me.id).html(data);
  281. $('#ac_create_'+me.id).dialog('open');
  282. $('#ac_create_'+me.id).dialog( "option", "close", me.OnCloseCreateObject );
  283. // Modify the action of the cancel button
  284. $('#ac_create_'+me.id+' button.cancel').unbind('click').click( me.CloseCreateObject );
  285. me.ajax_request = null;
  286. // Adjust the dialog's size to fit into the screen
  287. if ($('#ac_create_'+me.id).width() > ($(window).width()-40))
  288. {
  289. $('#ac_create_'+me.id).width($(window).width()-40);
  290. }
  291. if ($('#ac_create_'+me.id).height() > ($(window).height()-70))
  292. {
  293. $('#ac_create_'+me.id).height($(window).height()-70);
  294. }
  295. },
  296. 'html'
  297. );
  298. };
  299. this.CloseCreateObject = function()
  300. {
  301. $('#ac_create_'+me.id).dialog( "close" );
  302. };
  303. this.OnCloseCreateObject = function()
  304. {
  305. if (me.bSelectMode)
  306. {
  307. $('#fstatus_'+me.id).html('');
  308. }
  309. else
  310. {
  311. $('#label_'+me.id).removeClass('ac_dlg_loading');
  312. }
  313. $('#label_'+me.id).focus();
  314. $('#ac_create_'+me.id).dialog("destroy");
  315. $('#ac_create_'+me.id).remove();
  316. $('#ajax_'+me.id).html('');
  317. };
  318. this.DoCreateObject = function()
  319. {
  320. var sFormId = $('#dcr_'+me.id+' form').attr('id');
  321. if (CheckFields(sFormId, true))
  322. {
  323. $('#'+sFormId).block();
  324. var theMap = { sTargetClass: me.sTargetClass,
  325. iInputId: me.id,
  326. sAttCode: me.sAttCode,
  327. 'json': me.oWizardHelper.ToJSON()
  328. };
  329. // Gather the values from the form
  330. // Gather the parameters from the search form
  331. $('#'+sFormId+' :input').each(
  332. function(i)
  333. {
  334. if (this.name != '')
  335. {
  336. if ($(this).hasClass('htmlEditor'))
  337. {
  338. var sId = $(this).attr('id');
  339. var editorInst = CKEDITOR.instances[sId];
  340. if (editorInst)
  341. {
  342. editorInst.updateElement();
  343. }
  344. }
  345. theMap[this.name] = this.value;
  346. }
  347. }
  348. );
  349. // Override the 'operation' code
  350. theMap['operation'] = 'doCreateObject';
  351. theMap['class'] = me.sClass;
  352. $('#ac_create_'+me.id).dialog('close');
  353. // Make sure that we cancel any pending request before issuing another
  354. // since responses may arrive in arbitrary order
  355. me.StopPendingRequest();
  356. // Run the query and get the result back directly in JSON
  357. me.ajax_request = $.post( AddAppContext(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php'), theMap,
  358. function(data)
  359. {
  360. $('#fstatus_'+me.id).html('');
  361. if (data.id == 0)
  362. {
  363. $('#label_'+me.id).removeClass('ac_dlg_loading');
  364. alert(data.error);
  365. }
  366. else if (me.bSelectMode)
  367. {
  368. // Add the newly created object to the drop-down list and select it
  369. $('<option/>', { value : data.id }).html(data.name).appendTo('#'+me.id);
  370. $('#'+me.id+' option[value="'+data.id+'"]').attr('selected', 'selected');
  371. $('#'+me.id).focus();
  372. }
  373. else
  374. {
  375. // Put the value corresponding to the newly created object in the autocomplete
  376. var oTemp = $('<div id="ac_temp" style="display:none">'+data.name+'</div>');
  377. var txt = oTemp.html(); // this causes HTML entities to be interpreted
  378. $('#label_'+me.id).val(txt);
  379. $('#'+me.id).val(data.id);
  380. $('#label_'+me.id).removeClass('ac_dlg_loading');
  381. $('#label_'+me.id).focus();
  382. }
  383. $('#'+me.id).trigger('validate');
  384. $('#'+me.id).trigger('extkeychange');
  385. $('#'+me.id).trigger('change');
  386. me.ajax_request = null;
  387. },
  388. 'json'
  389. );
  390. }
  391. return false; // do NOT submit the form
  392. };
  393. this.Update = function()
  394. {
  395. if ($('#'+me.id).attr('disabled'))
  396. {
  397. $('#v_'+me.id).html('');
  398. $('#label_'+me.id).attr('disabled', 'disabled');
  399. $('#label_'+me.id).css({'background': 'transparent'});
  400. $('#mini_add_'+me.id).hide();
  401. $('#mini_tree_'+me.id).hide();
  402. $('#mini_search_'+me.id).hide();
  403. }
  404. else
  405. {
  406. $('#label_'+me.id).removeAttr('disabled');
  407. $('#label_'+me.id).css({'background': '#fff url(../images/ac-background.gif) no-repeat right'});
  408. $('#mini_add_'+me.id).show();
  409. $('#mini_tree_'+me.id).show();
  410. $('#mini_search_'+me.id).show();
  411. }
  412. };
  413. this.HKDisplay = function()
  414. {
  415. var theMap = { sTargetClass: me.sTargetClass,
  416. sInputId: me.id,
  417. sFilter: me.sFilter,
  418. bSearchMode: me.bSearchMode,
  419. sAttCode: me.sAttCode,
  420. value: $('#'+me.id).val()
  421. };
  422. if (me.bSelectMode)
  423. {
  424. $('#fstatus_'+me.id).html('<img src="../images/indicator.gif" />');
  425. }
  426. else
  427. {
  428. $('#label_'+me.id).addClass('ac_dlg_loading');
  429. }
  430. if (me.oWizardHelper == null)
  431. {
  432. theMap['json'] = '';
  433. }
  434. else
  435. {
  436. // Not inside a "search form", updating a real object
  437. me.oWizardHelper.UpdateWizard();
  438. theMap['json'] = me.oWizardHelper.ToJSON();
  439. }
  440. theMap['sRemoteClass'] = me.sTargetClass;
  441. theMap.operation = 'displayHierarchy';
  442. // Make sure that we cancel any pending request before issuing another
  443. // since responses may arrive in arbitrary order
  444. me.StopPendingRequest();
  445. // Run the query and display the results
  446. me.ajax_request = $.post( AddAppContext(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php'), theMap,
  447. function(data)
  448. {
  449. $('#ac_tree_'+me.id).html(data);
  450. var maxHeight = $(window).height()-110;
  451. $('#tree_'+me.id).css({maxHeight: maxHeight});
  452. },
  453. 'html'
  454. );
  455. };
  456. this.OnHKResize = function(event, ui)
  457. {
  458. var dh = ui.size.height - ui.originalSize.height;
  459. if (dh != 0)
  460. {
  461. var dlg_content = $('#dlg_tree_'+me.id+' .wizContainer');
  462. var h = dlg_content.height();
  463. dlg_content.height(h + dh);
  464. var tree = $('#tree_'+me.id);
  465. var h = tree.height();
  466. tree.height(h + dh - 1);
  467. }
  468. };
  469. this.OnHKClose = function()
  470. {
  471. if (me.bSelectMode)
  472. {
  473. }
  474. else
  475. {
  476. $('#label_'+me.id).removeClass('ac_dlg_loading');
  477. }
  478. $('#label_'+me.id).focus();
  479. $('#dlg_tree_'+me.id).dialog("destroy");
  480. $('#dlg_tree_'+me.id).remove();
  481. };
  482. this.DoHKOk = function()
  483. {
  484. iObjectId = $('#tree_'+me.id+' input[name=selectObject]:checked').val();
  485. $('#dlg_tree_'+me.id).dialog('close');
  486. // Query the server again to get the display name of the selected object
  487. var theMap = { sTargetClass: me.sTargetClass,
  488. iInputId: me.id,
  489. iObjectId: iObjectId,
  490. sAttCode: me.sAttCode,
  491. bSearchMode: me.bSearchMode,
  492. operation: 'getObjectName'
  493. };
  494. // Make sure that we cancel any pending request before issuing another
  495. // since responses may arrive in arbitrary order
  496. me.StopPendingRequest();
  497. // Run the query and get the result back directly in JSON
  498. me.ajax_request = $.post( AddAppContext(GetAbsoluteUrlAppRoot()+'pages/ajax.render.php'), theMap,
  499. function(data)
  500. {
  501. var oTemp = $('<div id="ac_temp" style="display:none">'+data.name+'</div>');
  502. var txt = oTemp.html(); // this causes HTML entities to be interpreted
  503. $('#label_'+me.id).val(txt);
  504. $('#label_'+me.id).removeClass('ac_dlg_loading');
  505. var prevValue = $('#'+me.id).val();
  506. $('#'+me.id).val(iObjectId);
  507. if (prevValue != iObjectId)
  508. {
  509. $('#'+me.id).trigger('validate');
  510. $('#'+me.id).trigger('extkeychange');
  511. $('#'+me.id).trigger('change');
  512. }
  513. if ( $('#'+me.id).hasClass('multiselect'))
  514. {
  515. $('#'+me.id+' option').each(function() { this.selected = ($(this).attr('value') == iObjectId); });
  516. $('#'+me.id).multiselect('refresh');
  517. }
  518. $('#label_'+me.id).focus();
  519. me.ajax_request = null;
  520. },
  521. 'json'
  522. );
  523. return false; // Do NOT submit the form in case we are called by OnSubmit...
  524. };
  525. }