extkeywidget.js 17 KB

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