TableAjax.php.TableAjax.js 109 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989
  1. if (!URI_BASE) throw "Missing URI_BASE"; // => Request::getPathUri()
  2. if (!global.jQuery) throw "Missing jQuery"
  3. var $ = global.jQuery
  4. var TableAjax = function() {
  5. var priv = {}; //private api
  6. var publ = {}; //public api
  7. priv.options = {};
  8. var defaults = {
  9. namespace: '',
  10. url: '', //webservice url
  11. urlPost: false, //use POST instead of GET
  12. removeTheGeomAjaxUrl: '',
  13. moreFunctionsCellAjaxUrl: '',
  14. editInlineSaveUrl: '',
  15. theGeomSaveUrl: '',
  16. pageSizeSave: '',
  17. hiddenColsSaveUrl: '',
  18. editInlineUrl: '',
  19. addUserTableFilterAjaxUrl: '',
  20. rmUserTableFilterAjaxUrl: '',
  21. hasAdditionalLayers: 0,
  22. labelHtml: '',
  23. debug: false, //prints debug info to console
  24. filter: false, //show filter row
  25. filterInit: false,// init filters data
  26. forceFilterInit: false,
  27. columnPicker: false, //show columnpicker
  28. checkboxes: false, //show body checkboxes
  29. actions: '', //holds action links
  30. pageSize: 10, //current pagesize
  31. pageSizes: [10, 20, 30, 40, 50, 'All'], //available pagesizes
  32. hidePagerOnEmpty: false, //removes pager if no rows
  33. types: { //type specific options
  34. string: {},
  35. number: {},
  36. bool: {},
  37. date: {}
  38. },
  39. rowFunctions: false,
  40. tblFunctions: false,
  41. specialFilterFunctions: false,
  42. filtersClean: false,
  43. router: false,
  44. longDesc: false,
  45. exportFields: [],
  46. mapEditor: false, // mapEditor visible or not
  47. mapEditorContainer: 'window' // 'window' or 'dock'
  48. };
  49. var _uiNodeCont; // container holding table
  50. var _uiNode$Table; // the table node
  51. var _head; // table header
  52. var _headSort; // table header sorting row
  53. var _headFilter; // table header columns filter row
  54. var _headSpecialFilter; // table header special filter row
  55. var _bodyNode; // table body
  56. var _body; // TODO: table body need render?
  57. var _foot; // table footer
  58. var _inlineEditBox; // inline edit box with form
  59. var _popoverCell; // inline popover cell
  60. var _popoverCellCurrent; // inline popover cell
  61. var _popoverCellAjaxXhr;
  62. var _mapEditor; // map editor node
  63. var _mapEditorWrap; // map editor wrapper node
  64. var _mapEditorDialog; // map editor jquery ui dialog node
  65. var _state = {};// state - to replace variables below (date, ...)
  66. var _data; //columns and rows
  67. var _totalPages; // total pages
  68. var _currDpOp; // clicked datetimepicker operator
  69. var _filterFields = {}; // array with filter DOM elements
  70. var _filterTimeout; // timer for delayed filtering
  71. var _uniqueCols = {}; // array with checked rows /// TODO: mv to _state.
  72. var _checkToggleChecked = false; // check-all toggle state
  73. var _exportFieldsSelect = {};
  74. var _tableWidth;
  75. var _fieldWidgets = {};
  76. /*
  77. initialize the plugin.
  78. */
  79. priv.init = function() {
  80. _uiNodeCont = priv.options.id;
  81. _state = {};// init state
  82. _state.page = 1;
  83. _state.specialFilters = {};
  84. _state.filters = {};
  85. _state.filters.currSortCol = '';
  86. _state.filters.currSortFlip = false;
  87. _state.filters.filterCols = {};
  88. { // init events
  89. jQuery(_uiNodeCont).on('TableAjax:render', priv.onRender);
  90. jQuery(window).on('resize', priv.onWindowResize)
  91. }
  92. priv.initialRender();// set up _uiNode$...
  93. priv.options.types.string = ((priv.options.types || {}).string || {});
  94. priv.options.types.number = ((priv.options.types || {}).number || {});
  95. priv.options.types.bool = ((priv.options.types || {}).bool || {});
  96. priv.options.types.date = ((priv.options.types || {}).date || {});
  97. if (priv.options.mapEditorContainer != 'dock'
  98. && priv.options.mapEditorContainer != 'window') {
  99. priv.options.mapEditorContainer = 'window';
  100. }
  101. if (priv.options.filterInit) {
  102. priv.setStateFilters(priv.options.filterInit);
  103. }
  104. if (priv.options.exportFields) {
  105. $.each(priv.options.exportFields, function(ind, col) {
  106. _exportFieldsSelect[col] = true;
  107. });
  108. }
  109. if (location.hash) {
  110. priv.options.router()
  111. } else {
  112. priv.update(priv.options.router)
  113. }
  114. if (typeof priv.options.router == "function") {
  115. $(window).bind('hashchange', function() {
  116. priv.options.router.apply(this);
  117. });
  118. }
  119. };
  120. priv.onRender = function(e) {
  121. if (priv.options.debug) console.log('onRender.arguments:', arguments.length, arguments, 'e:', e);
  122. // console.log("priv.onRender arguments:", arguments);
  123. // console.trace();
  124. if (arguments.length > 1) {
  125. for (var i=1; i<arguments.length; i++) {
  126. switch (arguments[i]) {
  127. case 'head': _head = undefined; break;
  128. case 'body': _body = undefined; break;
  129. case 'foot': _foot = undefined; break;
  130. case 'foot_pagination': {
  131. priv.renderFooterInfo();
  132. priv.renderFooterPagination();
  133. priv.renderFooterPageSizes();
  134. }
  135. break;
  136. case 'footer__toolbar__info': priv.renderFooterInfo(); break;
  137. case 'footer__toolbar__pagination': priv.renderFooterPagination(); break;
  138. case 'footer__toolbar__pagesizes': priv.renderFooterPageSizes(); break;
  139. case 'foot__columnPicker': priv.renderFooterColumnPicker(); break;
  140. case 'head__specialFilters': priv.renderHeadSpecialFilters(); break;
  141. }
  142. }
  143. priv.renderTable();
  144. priv.onWindowResize();
  145. {// activate saveBtn if some columns hidden
  146. var selectedFilter = priv.modelColFilter_getSelected();
  147. if (null === selectedFilter) {
  148. priv.modelColFilter_getSaveBtn().prop("disabled", false)
  149. } else {
  150. priv.modelColFilter_getSaveBtn().prop("disabled", true)
  151. }
  152. }
  153. }
  154. };
  155. priv.onWindowResize = function() {
  156. var stickyCol1Width = (12 + 3) * 4 + 2 * 5 + 1;
  157. var stickyCol2Width = 50 + 2 * 5 + 1;
  158. var contW = jQuery(_uiNodeCont).parent().width();
  159. var colsW = stickyCol1Width + stickyCol2Width;
  160. jQuery(_uiNodeCont).css({width:'' + (contW - colsW) + 'px'})//, marginLeft:'' + colsW + 'px', overflowX:'scroll', overflowY:'visible', paddingBottom:'1px'});
  161. var wh = jQuery(window).height(); // returns height of browser viewport
  162. var dh = jQuery(document).height(); // returns height of HTML document (same as pageHeight in screenshot)
  163. if (dh > wh) {
  164. jQuery(_uiNodeCont).doubleScroll()
  165. jQuery(_uiNodeCont).prev('.doubleScroll-scroll-wrapper').css({float: 'right', display:'block'})
  166. } else {
  167. jQuery(_uiNodeCont).prev('.doubleScroll-scroll-wrapper').css({display:'none'})
  168. }
  169. }
  170. priv.initialRender = function() {
  171. _uiNode$Table = $('<table class="AjaxTable table table-striped table-hover table-bordered table-condensed"></table>').appendTo(_uiNodeCont);
  172. _head = $('<thead></thead>').prependTo(_uiNode$Table);
  173. _headSort = $('<tr class="sort tblAjax__head__sort"></tr>').prependTo(_head);
  174. _headFilter = $('<tr class="filter tblAjax__head__filter"></tr>').appendTo(_head);
  175. _bodyNode = $('<tbody></tbody>').insertAfter(_head);
  176. $('<tfoot></tfoot>').insertAfter(_bodyNode);
  177. _foot = $('<div class="foot tblAjax__footer"></div>').insertAfter(_uiNodeCont);
  178. var footToolbar = $('<div class="btn-toolbar tblAjax__footer__toolbar"></div>').appendTo(_foot);
  179. $('<span class="tblAjax__footer__toolbar__info"></span>').appendTo(footToolbar);
  180. $('<span class="tblAjax__footer__toolbar__pagination"></span>').appendTo(footToolbar);
  181. $('<span class="tblAjax__footer__toolbar__pagesizes"></span>').appendTo(footToolbar);
  182. $('<span class="tblAjax__footer__toolbar__columnPicker"></span>').appendTo(footToolbar);
  183. $('<span class="tblAjax__footer__toolbar__functions"></span>').appendTo(footToolbar);
  184. $('<span class="tblAjax__footer__toolbar__export"></span>').appendTo(footToolbar);
  185. _mapEditorWrap = $('<div class="mapEditor" style="display:none"></div>').insertAfter(_foot);
  186. _mapEditor = $('<div class="mapEditor-map"></div>').appendTo(_mapEditorWrap);
  187. _popoverCell = $('<div class="popoverCell" style="display:none"></div>').insertAfter(_foot);
  188. $('<div class="tblAjax__inlineEditBox"></div>').insertAfter(_foot);
  189. $('<div class="btn-toolbar tblAjax__head__specialFilter"></div>').insertBefore(_uiNodeCont);
  190. priv.renderInlineEditBox();// .tblAjax__inlineEditBox
  191. _foot = _head = _body = _headSort = _headFilter = undefined;// TODO: refactor
  192. };
  193. priv.renderTable = function() {
  194. if (!_state.colsSorted) return;
  195. if (!_head) {
  196. _headSort = _headFilter = _headSpecialFilter = undefined;
  197. _head = _uiNode$Table.find('thead');
  198. }
  199. if (!_headSort) priv.renderTableTheadSort();
  200. if (!_headFilter && priv.options.filter) {
  201. priv.renderTableTheadFilter();
  202. _headFilter = true;
  203. }
  204. if (!_headSpecialFilter && priv.options.specialFilterFunctions) {
  205. priv.renderHeadSpecialFilters();
  206. _headSpecialFilter = true;
  207. }
  208. if (!_body) {
  209. _uiNode$Table.find('tbody').remove();
  210. _bodyNode = $('<tbody></tbody>').insertAfter(_head);
  211. //_bodyNode.on('change', '.unique', priv.rowChecked);
  212. // find out what rows to show next...
  213. var rowsAdded = 0;
  214. // slice out the chunk of data we need and create rows
  215. $.each(_data.rows, function(index, props) {
  216. var rowNode = priv.renderRow(props);
  217. if (rowNode) rowNode.appendTo(_bodyNode);
  218. rowsAdded++;
  219. if (rowsAdded >= priv.options.pageSize) { // enough rows created
  220. return false;
  221. }
  222. });
  223. if (_state.page == 1) {
  224. _totalPages = Math.ceil(_data.total / priv.options.pageSize);
  225. }
  226. if (_state.page == _totalPages) { // pad with empty rows if we're at last page.
  227. while (rowsAdded < priv.options.pageSize) {
  228. var rowNode = priv.renderRowEmptyNode();
  229. if (rowNode) rowNode.appendTo(_bodyNode);
  230. rowsAdded++;
  231. }
  232. }
  233. }
  234. if (!_foot) {
  235. priv.renderTableTfoot();
  236. priv.renderFooter();
  237. }
  238. _foot = $(_uiNodeCont).next('.foot');
  239. var stickyCol1Width = (12 + 3) * 4 + 2 * 5 + 1;
  240. var stickyCol2Width = 50 + 2 * 5 + 1;
  241. if (undefined === _tableWidth) {
  242. _tableWidth = true;
  243. var contW = jQuery(_uiNodeCont).width();
  244. var th1 = _uiNode$Table.find('.stickyCol1:first');
  245. var th2 = th1.next();
  246. var th1W = th1.innerWidth();
  247. var th2W = 50 + 2 * 5;//th2.innerWidth();
  248. var colsW = stickyCol1Width + stickyCol2Width;
  249. jQuery(_uiNodeCont).css({width:'' + (contW - colsW) + 'px', marginLeft:'' + colsW + 'px', minHeight: '360px', overflowX:'scroll', overflowY:'visible', paddingBottom:'1px'});
  250. }
  251. _uiNode$Table.find('.stickyCol1').css({
  252. position: 'absolute',
  253. left: '0',
  254. top: 'auto',
  255. width: '' + stickyCol1Width + 'px',
  256. });
  257. //_uiNode$Table.find('.filter').find('.stickyCol1').css({height:'34px'});
  258. var sortStickyColHeight = _uiNode$Table.find('.sort').find('th:last').outerHeight();
  259. _uiNode$Table.find('.sort').find('.stickyCol1').css({height: sortStickyColHeight + 'px'});
  260. _uiNode$Table.find('.sort').find('.stickyCol2').css({height: sortStickyColHeight + 'px'});
  261. _uiNode$Table.find('.stickyCol2').css({
  262. position: 'absolute',
  263. left: '' + (stickyCol1Width) + 'px',
  264. top: 'auto',
  265. width: '' + stickyCol2Width + 'px',
  266. borderRight: '1px solid silver',
  267. overflow: 'hidden'
  268. });
  269. if (_data.total == 0 && priv.options.hidePagerOnEmpty) {
  270. $('.btn-toolbar', _foot).remove();
  271. }
  272. if (priv.options.debug) console.log('table created');
  273. if (typeof priv.options.tableCreated == 'function') {
  274. priv.options.tableCreated.call(_uiNode$Table.get(0), {table: _uiNode$Table.get(0)});
  275. }
  276. };
  277. // TODO: priv.renderFieldWidget_InlineEdit = function(fldName, value) {}
  278. // TODO: priv.renderFieldWidget_FormField = function(fldName, value) {}
  279. // @usage: priv.renderFieldWidget_TableCell(fldName, val, rowPK, row)
  280. priv.renderFieldWidget_TableCell = function(fldName, value, rowPK, row) {
  281. var renderFieldAsTableCell = priv.getFieldWidget_TableCell(fldName);
  282. if (!renderFieldAsTableCell) return null;
  283. return renderFieldAsTableCell(value, rowPK, row);
  284. };
  285. priv.registerFieldWidget = function(type, fldName, fieldProps) {
  286. var fieldWidget = null;
  287. switch (type) {
  288. case "date":// @return Element - TODO: not used yet
  289. fieldWidget = (function(fldName, fieldProps) {
  290. var _fieldName = fldName,
  291. _fieldProps = fieldProps;
  292. // console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
  293. return function(val, fieldPK, row) {
  294. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
  295. return val;
  296. }
  297. }(fldName, fieldProps));
  298. break;
  299. case "bool":// @return Element - TODO: not used yet
  300. fieldWidget = (function(fldName, fieldProps) {
  301. var _fieldName = fldName,
  302. _fieldProps = fieldProps;
  303. // console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
  304. return function(val, fieldPK, row) {
  305. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
  306. fldNode = document.createElement('input');
  307. fldNode.setAttribute('type', 'checkbox');
  308. if (val) fldNode.setAttribute('checked', 'checked');
  309. fldNode.setAttribute('disabled', 'disabled');
  310. fldNode.appendChild(document.createTextNode(val));
  311. return fldNode;
  312. }
  313. }(fldName, fieldProps));
  314. break;
  315. case "number":// @return String - TODO: not used yet
  316. fieldWidget = (function(fldName, fieldProps) {
  317. var _fieldName = fldName,
  318. _fieldProps = fieldProps,
  319. _fractionDigits = _.get(_fieldProps, 'fractionDigits', 2);
  320. // console.log('FieldWidget: generate function to render field('+_fieldName+') _fractionDigits('+_fractionDigits+')', fieldProps);
  321. return function(val, fieldPK, row) {
  322. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
  323. if ('' === val) return null; // is nullable
  324. if ('*****' === val) return val
  325. // enumeration
  326. // fractionDigits
  327. // maxExclusive
  328. // maxInclusive
  329. // minExclusive
  330. // minInclusive
  331. // pattern
  332. // totalDigits
  333. // whiteSpace
  334. val = Number(val);
  335. return ((val || 0) % 1 === 0)? val : val.toFixed(_fractionDigits);
  336. }
  337. }(fldName, fieldProps));
  338. break;
  339. case "string":// @return String
  340. fieldWidget = (function(fldName, fieldProps) {
  341. var _fieldName = fldName,
  342. _fieldProps = fieldProps,
  343. _format = _.get(_fieldProps, 'format', '{0}');
  344. // console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
  345. return function(val, fieldPK, row) {
  346. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
  347. return p5Utils__format(_format, [val]);
  348. }
  349. }(fldName, fieldProps));
  350. break;
  351. case "p5:price":// @return String
  352. fieldWidget = (function(fldName, fieldProps) {
  353. var _fieldName = fldName,
  354. _fieldProps = fieldProps,
  355. _format = _.get(_fieldProps, 'format', '<span style="text-align:right">{0}</span>');
  356. // console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
  357. return function(val, fieldPK, row) {
  358. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
  359. return p5Utils__format(_format, [val]);
  360. }
  361. }(fldName, fieldProps));
  362. break;
  363. case "p5:string":// @return String
  364. fieldWidget = (function(fldName, fieldProps) {
  365. var _fieldName = fldName;
  366. var _fieldProps = fieldProps;
  367. var _formatByValue = _.get(_fieldProps, 'formatByValue', null);
  368. var _aliasMap = _.get(_fieldProps, 'aliasMap', null);
  369. return function(val, fieldPK, row) {
  370. if (_formatByValue && val in _formatByValue) {
  371. val = p5Utils__format(_formatByValue[val], [val])
  372. // console.log('p5:string value', val, '_aliasMap', _aliasMap)
  373. if (_aliasMap) {
  374. Object.keys(_aliasMap).map(function (mapKey) {
  375. var mapField = _aliasMap[mapKey]
  376. if (undefined !== row[mapField]) {
  377. val = val.replace(new RegExp('\{' + mapKey + '\}', 'g'), row[mapField]);
  378. }
  379. })
  380. }
  381. }
  382. return val;
  383. }
  384. }(fldName, fieldProps));
  385. break;
  386. case "p5:www_link":// @return Element
  387. fieldWidget = (function(fldName, fieldProps) {
  388. var _fieldName = fldName,
  389. _fieldProps = fieldProps;
  390. // console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
  391. return function(val, fieldPK, row) {
  392. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
  393. var link = '',
  394. a = null,
  395. dbg = false;
  396. if (!val.length) return '';
  397. if ('index.php' == val.substr(0, 9) || 'procesy5.php' == val.substr(0, 12)) {
  398. link = window.location.protocol + '//' + window.location.hostname
  399. link += window.location.pathname.split('/').slice(0, -1).join('/')
  400. link += '/' + val
  401. } else {
  402. if ('http' == val.substr(0, 4)) link = val
  403. //else if ('ftp' == val.substr(0, 3))
  404. else link = 'http://' + val
  405. }
  406. var linkErrors = validate({www_link: link}, {www_link: {url: true}});
  407. if (linkErrors) {
  408. // if(dbg)console.log('linkErrors for (' + link +')', linkErrors);
  409. return val;
  410. }
  411. fldNode = document.createElement('a');
  412. fldNode.setAttribute('href', link);
  413. fldNode.setAttribute('target', '_blank');
  414. fldNode.appendChild(document.createTextNode(val));
  415. return fldNode;
  416. }
  417. }(fldName, fieldProps));
  418. break;
  419. case "special":
  420. fieldWidget = (function(fldName, fieldProps) {
  421. var _fieldName = fldName;
  422. var _fieldProps = fieldProps;
  423. var _format = _.get(_fieldProps, 'format', '{0}');
  424. var _aliasMap = _.get(_fieldProps, 'aliasMap', null);
  425. // console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
  426. return function(val, fieldPK, row) {
  427. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps, 'row', row);
  428. var format = _format;
  429. if (_aliasMap) {
  430. Object.keys(_aliasMap).map(function (mapKey) {
  431. var mapField = _aliasMap[mapKey]
  432. if (undefined !== row[mapField]) {
  433. format = format.replace(new RegExp('\{' + mapKey + '\}', 'g'), row[mapField]);
  434. }
  435. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') _aliasMap:', _aliasMap, 'row['+mapField+']', row[mapField], 'converted val:', val);
  436. })
  437. }
  438. return p5Utils__format(format, [val]);
  439. }
  440. }(fldName, fieldProps));
  441. break;
  442. case "simpleLink":
  443. fieldWidget = (function(fldName, fieldProps) {
  444. var _fieldName = fldName,
  445. _fieldProps = fieldProps,
  446. _format = _.get(_fieldProps, 'format', '{0}');
  447. // console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
  448. return function(val, fieldPK, row) {
  449. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
  450. var valLink = String(val);
  451. if (undefined !== _fieldProps._tsRetId
  452. && (0 === _fieldProps._tsRetId || '0' === _fieldProps._tsRetId || null === _fieldProps._tsRetId)
  453. && undefined !== _fieldProps._tsSimpleLink) {
  454. valLink = _fieldProps._tsSimpleLink.format;
  455. $.each(_fieldProps._tsSimpleLink.aliasMap, function(i, v) {
  456. // console.log('simpleLink aliasMap fldName:', fldName, 'i:', i, 'v:', v, 'row['+v+']', row[v], 'val', val, 'typeof val', typeof val);
  457. if (undefined !== row[v]) {
  458. //valLink = valLink.replace(new RegExp('\{' + i + '\}', 'g'), row[v]);
  459. valLink = valLink.replace(new RegExp('\{' + i + '\}', 'g'), row[v].replace('"','') ); //naprawa <a href="mailto:?subject=W spr. p
  460. }
  461. });
  462. }
  463. return p5Utils__format(_format, [valLink]);
  464. }
  465. }(fldName, fieldProps));
  466. break;
  467. case "gml:PolygonPropertyType":
  468. case "gml:LineStringPropertyType":
  469. case "gml:PointPropertyType":
  470. case "geom":
  471. fieldWidget = (function(fldName, fieldProps) {
  472. var _fieldName = fldName,
  473. _fieldProps = fieldProps,
  474. _format = _.get(_fieldProps, 'format', '{0}');
  475. // console.log('FieldWidget: generate function to render field('+_fieldName+') ', fieldProps);
  476. return function(val, fieldPK, row) {
  477. // console.log('FieldWidget: run function to render field('+_fieldName+') with value('+val+') ', fieldProps);
  478. // console.log('FieldWidget: test priv', priv);
  479. var node = jQuery('<span></span>');
  480. node.TableAjaxGeomField({
  481. recordID: fieldPK,
  482. fieldValue: val,
  483. hasValueClassName: 'cell-mapfld-hasValue',
  484. linkClassNamePrefix: 'cell-mapfld',
  485. linkSelectClassName: 'select',
  486. linkSelectAddClassNames: 'glyphicon glyphicon-map-marker',
  487. linkRemoveClassName: 'remove',
  488. linkRemoveAddClassNames: 'glyphicon glyphicon-remove',
  489. onSelect: function(recordID, geomShape) {
  490. if (priv.options.debug) console.log('recordID:', recordID, 'geomShape:', geomShape);
  491. priv.mapEditorShow();
  492. _mapEditor.TableAjaxMapSelectRecord(recordID, geomShape);
  493. },
  494. onRemove: function(geomField, recordID, geomShape) {
  495. if (confirm('Czy usunąć obiekt z mapy dla rekordu ' + recordID + '?')) {
  496. if (!recordID) return;
  497. var selectedRecordId = recordID;
  498. superagent
  499. .post(priv.options.removeTheGeomAjaxUrl)
  500. .type('json') // header ĺapplication/x-www-form-urlencoded' requires type('form');
  501. .send({
  502. ID: recordID,
  503. namespace: priv.options.namespace
  504. })
  505. .set('Accept', 'application/json')
  506. .end(function(err, res) {
  507. if(priv.options.debug)console.log('DBG: res:', res, 'res.body:', res.body);
  508. var payload;
  509. if (err || !res.ok || 'application/json' !== res.type) {
  510. payload = {type: 'warning', msg: res.body.msg || 'Wystąpiły błędy', body: res.body};
  511. } else {
  512. payload = {type: 'success', msg: res.body.msg || '', body: res.body};
  513. }
  514. p5UI__notifyAjaxCallback(payload);
  515. var data = res.body;
  516. if (data && data.record && data.record.the_geom) {
  517. if (priv.options.debug) console.log('data.record.the_geom:2:', data.record.the_geom);
  518. geomField.setValue(data.record.the_geom);
  519. }
  520. else if (data && data.record) {
  521. if (priv.options.debug) console.log('data.record.the_geom:2:', data.record.the_geom);
  522. geomField.setValue(data.record.the_geom);
  523. }
  524. _mapEditor.TableAjaxMapRefresh();
  525. });
  526. }
  527. }
  528. });
  529. return node;
  530. }
  531. }(fldName, fieldProps));
  532. break;
  533. case "ref":
  534. fieldWidget = (function(fldName, fieldProps) {
  535. var _fieldName = fldName,
  536. _fieldProps = fieldProps;
  537. // console.log('FieldWidget: generate function to render field('+_fieldName+') fieldProps: ', fieldProps);
  538. return function(val, fieldPK, row) {
  539. // console.log('FieldWidget: pk('+fieldPK+') run function to render field('+_fieldName+') with value: ', val, ', fieldProps: ', fieldProps);
  540. // if (val.length > 5) return '('+val.length+')' + printFirst5 + '...' => open more info
  541. return _.map(val, function(v) {
  542. if (!v || !v.xlink) return '';
  543. var idRemote = v.xlink.split('.').pop()
  544. var nsRemote = v.xlink.split(':').pop().split('.').shift()
  545. var seLink = URI_BASE + 'index.php?_route=ViewTableAjax&namespace=' + fieldProps.xsdRefNsPrefix.replace(/__x3A__/g, '/') + '/' + nsRemote + '#EDIT/' + idRemote;
  546. var wfsLink = fieldProps.xsdRefUri + '#' + fieldProps.xsdRefType + '.' + idRemote;
  547. return '<a class="btn btn-xs btn-default" href="' + seLink + '" title="' + wfsLink + '">' + idRemote + '</a>';
  548. }).join(' ');
  549. }
  550. }(fldName, fieldProps));
  551. break;
  552. }
  553. _fieldWidgets[fldName] = fieldWidget;
  554. };
  555. priv.getFieldWidget_TableCell = function(fieldName) {
  556. var props = _data.cols[fieldName],
  557. type = null,
  558. renderFieldAsTableCell = null;
  559. if (!props) return null;
  560. type = _.get(props, 'type');
  561. if (!type) type = 'string';// TODO: throw Exception? / default string
  562. renderFieldAsTableCell = _.get(_fieldWidgets, fieldName);
  563. if (renderFieldAsTableCell) return renderFieldAsTableCell;
  564. priv.registerFieldWidget(type, fieldName, props);
  565. renderFieldAsTableCell = _.get(_fieldWidgets, fieldName);
  566. if (!renderFieldAsTableCell) throw "Field type '" + type + "' not implemented";
  567. return renderFieldAsTableCell;
  568. };
  569. priv.renderRow = function(props) {
  570. var rowNode = $('<tr></tr>'),
  571. rowPK = (_state.primaryKey in props) ? props[_state.primaryKey] : null,
  572. cellNode,
  573. columnName, columnProps, val, cellCnt, format, showTooltip, fldWidgetNode,
  574. dbg = priv.options.debug
  575. ;
  576. // ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event);"
  577. rowNode.attr('ondrop', "p5TA_onDrop(event, '"+rowPK+"', '"+priv.options.namespace+"')")
  578. rowNode.attr('ondragover', "p5TA_onDragOver(event, this, '"+rowPK+"', '"+priv.options.namespace+"')")
  579. rowNode.attr('ondragend', "p5TA_onDragEnd(event, this, '"+rowPK+"', '"+priv.options.namespace+"')")
  580. if (priv.options.rowFunctions || priv.options.filtersClean) {
  581. cellNode = priv.renderCellRowFunctions(priv.options.rowFunctions, rowPK, props);
  582. cellNode.addClass('text-right stickyCol1');
  583. cellNode.appendTo(rowNode);
  584. }
  585. //create checkbox
  586. if (_state.primaryKey && priv.options.checkboxes) {
  587. var check = _uniqueCols[props[_state.primaryKey]] != undefined ? 'checked' : '';
  588. var checkable = props['checkable'] === false ? 'disabled' : '';
  589. cellNode = $('<td></td>').appendTo(rowNode);
  590. $(p5Utils__format('<input class="unique" {0} {1} type="checkbox" />', [check, checkable])).appendTo(cellNode);
  591. }
  592. if (_state.primaryKey) rowNode.data('unique', rowPK);
  593. //create cells
  594. for (var i = 0; i < _state.colsSorted.length; i++) {
  595. columnName = _state.colsSorted[i];
  596. columnProps = _data.cols[columnName];
  597. val = '';
  598. if (!columnProps) continue;
  599. if (columnProps.hidden) continue;// TODO: "unique" is hidden
  600. showTooltip = true;
  601. val = props[columnName];
  602. cellNode = $('<td></td>').appendTo(rowNode);
  603. if (i === 1) cellNode.addClass('stickyCol2');// primaryKey(ID)
  604. if (i !== 1) cellNode.on('dblclick', {id:rowPK, col:columnName}, priv.rowDblClicked);
  605. cellCnt = (i === 1)? '<div></div>' : '<span></span>';
  606. cellCnt = $(cellCnt).appendTo(cellNode);// fix dblclick for copy
  607. cellNode.data('column', columnName);
  608. if (val === undefined) continue;
  609. format = _.get(columnProps, 'format', '{0}');
  610. // test use field widgets
  611. fldWidgetNode = priv.renderFieldWidget_TableCell(columnName, val, rowPK, props);
  612. if (fldWidgetNode || fldWidgetNode === 0) {
  613. cellCnt.empty();
  614. cellCnt.append(fldWidgetNode);
  615. } else if (fldWidgetNode === '') {
  616. cellCnt.empty();
  617. } else {
  618. console.log('TODO: !FieldWidget for row.pk('+rowPK+') col('+columnName+') typeof fldWidgetNode(' + (typeof fldWidgetNode) + ') columnProps', columnProps, 'fldWidgetNode', fldWidgetNode, 'value', props[columnName]);
  619. }// test fld widgets
  620. if (columnProps._tsRetId) {
  621. showTooltip = false;
  622. if (columnProps._tsRetId > 0) {
  623. cellCnt.on('click', {id:rowPK, col:columnName, friendly:columnProps.friendly, value:p5Utils__format(format, [val])}, priv.popoverCellTypeSpecial);
  624. }
  625. }
  626. if ('ref' === columnProps.type) showTooltip = false;
  627. if ('ref' === columnProps.type) cellNode.css('padding', "3px")
  628. if ('ref' === columnProps.type && priv.options.debug) console.log('renderRow rowPK('+rowPK+') columnProps', columnProps)
  629. // if ('ref' === columnProps.type) cellNode.html('<a href="index.php?_route=ViewTableAjax' +
  630. // '&namespace=' + columnProps.xsdRefNsPrefix.replace('__x3A__', '/') + '/' + columnProps.xsdRefType +
  631. // '&backRefNS=' + priv.options.namespace +
  632. // '&backRefPK=' + rowPK +
  633. // '&backRefField=' + columnProps.column +
  634. // '">przeglądaj</a>')
  635. if ('ref' === columnProps.type) {
  636. cellNode.html('<a onClick="return p5UI__tableAjaxOpenRefCell(' +
  637. '\'' + columnProps.xsdRefNsPrefix.replace('__x3A__', '/') + '/' + columnProps.xsdRefType + '\', ' + // namespace
  638. '\'' + priv.options.namespace + '\', ' + // backRefNS
  639. '\'' + rowPK + '\', ' + // backRefPK
  640. '\'' + columnProps.column + '\')' + // backRefField
  641. '" ' +
  642. 'href="index.php?_route=ViewTableAjax' +
  643. '&namespace=' + columnProps.xsdRefNsPrefix.replace('__x3A__', '/') + '/' + columnProps.xsdRefType +
  644. '&backRefNS=' + priv.options.namespace +
  645. '&backRefPK=' + rowPK +
  646. '&backRefField=' + columnProps.column +
  647. '">przeglądaj</a>')
  648. }
  649. if (columnProps.xsdType && 'xsd:base64Binary' === columnProps.xsdType) {
  650. cellCnt.empty();
  651. if (val) {
  652. cellCnt.append('<a target="_blank" href="wfs-data.php?SERVICE=WFS&VERSION=1.0.0&REQUEST=GetBlob&namespace='+priv.options.namespace+'&primaryKey='+rowPK+'&fieldName='+columnName+'">'+"otwórz"+'</a>');
  653. } else {
  654. cellCnt.append('<span style="color:silver" title="Brak danych">N/S;</span>');
  655. }
  656. }
  657. if (i > 1 && priv.options.longDesc) {// TODO: use better check for columns: functions and pk
  658. cellNode.addClass('tbl-short-txt');
  659. if (showTooltip) {
  660. cellCnt.tooltip({title: cellCnt.text(), placement: 'left'});
  661. }
  662. }
  663. }
  664. return rowNode;
  665. };
  666. priv.renderCellRowFunctions = function(rowFunctions, rowPK, rowProps) {
  667. var cellNode = $('<td></td>'),
  668. keys = Object.keys(rowFunctions),
  669. total = keys.length,
  670. moreFuncBtnNode,
  671. moreFunctions = [],
  672. idx
  673. ;
  674. if (priv.options.debug) console.log('TableAjax::renderCellRowFunctions: rowFunctions', rowFunctions);
  675. idx = keys.indexOf('hist');
  676. if (idx !== -1) {
  677. histFunc = keys.splice(idx, 1);
  678. keys.push('hist');
  679. }
  680. moreFunctions = keys.splice(3);
  681. keys.forEach(function(key) {
  682. var funObj = rowFunctions[key],
  683. funcNode = p5UI_TableAjax_generateFunctionNode(funObj, rowPK, {ico: true, label: false})
  684. ;
  685. funcNode.appendTo(cellNode);
  686. });
  687. moreFuncBtnNode = $('<a href="#" style="margin:0 2px;text-decoration:none" title="Więcej funkcji dla rekordu nr '+rowPK+'" class="glyphicon glyphicon-menu-hamburger"> </a>');
  688. moreFuncBtnNode.on('click', {rowPK: rowPK, rowFunctions: rowFunctions, more: moreFunctions}, priv.popoverCellMoreFunctions);
  689. moreFuncBtnNode.appendTo(cellNode);
  690. return cellNode;
  691. };
  692. priv.popoverCellMoreFunctions = function(e) {
  693. e.preventDefault();
  694. e.stopPropagation();
  695. if (priv.options.debug) console.log('TableAjax::popoverCellMoreFunctions: rowPK', e.data.rowPK, 'moreFunctions', e.data.more, 'rowFunctions', e.data.rowFunctions);
  696. if ('rowPK' in e.data && e.data.rowPK > 0) {
  697. var lastId = _popoverCell.data('rowid'),
  698. lastCol = _popoverCell.data('col'),
  699. rowPK = e.data.rowPK,
  700. moreFunctions = e.data.more,
  701. rowFunctions = e.data.rowFunctions,
  702. funcListNode
  703. ;
  704. if (lastId == e.data.rowPK && lastCol == 'moreFunctions') {
  705. //_popoverCellCurrent.popover('toggle');
  706. }
  707. else {
  708. if (_popoverCellCurrent) {
  709. _popoverCellCurrent.popover('destroy');
  710. }
  711. _popoverCell.data('rowid', rowPK);
  712. _popoverCell.data('col', 'rowFunctions');
  713. _popoverCell.empty();
  714. funcListNode = $('<ul class="list-unstyled popoverRowFunctions"></ul>').appendTo(_popoverCell);
  715. moreFunctions.forEach(function(funcName) {
  716. var funcItemNode = $('<li></li>').appendTo(funcListNode),
  717. funObj = rowFunctions[funcName],
  718. funcNode = p5UI_TableAjax_generateFunctionNode(funObj, rowPK, {ico: true, label: true})
  719. ;
  720. funcNode.addClass('func_name-' + funcName);
  721. funcItemNode.append(funcNode);
  722. });
  723. { // TODO: id namesapce is AntAcl [ and has ref fields or back ref ]
  724. var funcItemNode = $('<li></li>').appendTo(funcListNode)
  725. var funObj = {
  726. ico: 'glyphicon glyphicon-random',
  727. label: 'Przeglądaj powiązania',
  728. href: 'index.php?_route=RefGraph&namespace=' + priv.options.namespace + '&primaryKey=' + rowPK,
  729. // onclick: function (e) { // TODO: open in
  730. // console.log('TODO: przeglądaj powiązania')
  731. // }
  732. }
  733. var funcNode = p5UI_TableAjax_generateFunctionNode(funObj, rowPK, { ico: true, label: true })
  734. funcItemNode.append(funcNode);
  735. }
  736. _popoverCell.append('<div class="popoverCellContent" style="white-space:normal"></div>');
  737. _popoverCellCurrent = jQuery(e.currentTarget);
  738. // title : '<span class="text-info"><strong>title</strong></span> <button type="button" id="close" class="close">&times;</button>'
  739. var opts = {
  740. container: 'body',
  741. placement: 'right',
  742. trigger: 'click',
  743. template: '',
  744. html: true,
  745. content: _popoverCell.html()
  746. }
  747. opts.template += '<div class="popover" role="tooltip" style="max-width:600px;width:440px;">';
  748. {
  749. opts.template += '<div class="arrow"></div>';
  750. //opts.template += '<h3 class="popover-title"></h3>';
  751. opts.template += '<div style="display:block;position:relative;">';
  752. {
  753. opts.template += '<div class="popover-title">';
  754. opts.template += '</div>';
  755. opts.template += '<button type="button" class="close" onclick="return hidePopover();" style="position:absolute;right:8px;top:6px;">&times;</button>';
  756. }
  757. opts.template += '</div>';
  758. opts.template += '<div class="popover-content"></div>';
  759. }
  760. opts.template += '</div>';
  761. _popoverCellCurrent.popover(opts);
  762. _popoverCellCurrent.on('shown.bs.popover', function(e) {
  763. if (!_popoverCellCurrent) return;
  764. var popoverNodeId = _popoverCellCurrent.attr('aria-describedby');
  765. if (!popoverNodeId) return;
  766. var popover$Node = jQuery('#' + popoverNodeId);
  767. if (!popover$Node.length) return;
  768. var arrow$Node = popover$Node.children('.arrow');
  769. if (arrow$Node.length) {
  770. var posTop = parseFloat(arrow$Node.css('top'));
  771. arrow$Node.css('top', '' + posTop + 'px')
  772. }
  773. popover$Node.find('.popoverCellContent').html('<p class="text-muted">Pobieranie funkcji...<p>');
  774. priv.ajaxLoadMoreFunctionsCell(rowPK);
  775. });
  776. _popoverCellCurrent.popover('show');
  777. }
  778. } else {
  779. if (priv.options.debug) console.log('NO data');
  780. return false;
  781. }
  782. return;
  783. };
  784. priv.ajaxLoadMoreFunctionsCell = function(rowPK) {
  785. var dbg = priv.options.debug;
  786. if (_popoverCellAjaxXhr) {
  787. _popoverCellAjaxXhr.abort();
  788. }
  789. _popoverCellAjaxXhr = $.ajax({
  790. type: 'GET',
  791. url: priv.options.moreFunctionsCellAjaxUrl + '&ID=' + rowPK,
  792. dataType: 'json',
  793. contentType: "application/json; charset=utf-8",
  794. data: ''
  795. })
  796. .done(function(data, textStatus, jqXHR){
  797. if (data && 'success' === data.type) {
  798. var popoverCellContent,
  799. rowFunctions = [],
  800. funcNodesToUpdate = []
  801. ;
  802. if (data.rowFunctions && data.rowFunctions.length > 0) {
  803. rowFunctions = data.rowFunctions;
  804. }
  805. if (rowFunctions.length > 0) {
  806. var popoverCellContent = $('<ul class="list-unstyled"></ul>');
  807. rowFunctions.forEach(function(funObj) {
  808. var funcNode = p5UI_TableAjax_generateFunctionNode(funObj, rowPK, {ico: true, label: true});
  809. if (funObj.id) {
  810. funcNodesToUpdate.push({id: funObj.id, node: funcNode});
  811. } else {
  812. var funcItemNode = $('<li></li>').appendTo(popoverCellContent);
  813. funcItemNode.append(funcNode);
  814. }
  815. });
  816. } else {
  817. popoverCellContent = '<p class="text-muted">Brak dodatkowych funkcji</p>';
  818. }
  819. //_popoverCell.append(popoverCellContent);// cache
  820. if (_popoverCellCurrent) {
  821. var popoverNodeId = _popoverCellCurrent.attr('aria-describedby');
  822. if (popoverNodeId) {
  823. var popoverNode = jQuery('#' + popoverNodeId),
  824. popoverCntNode = popoverNode.find('.popoverCellContent'),
  825. popoverRowFuncNode = popoverNode.find('.popoverRowFunctions');
  826. ;
  827. {// fix generated row Functions by loaded from ajax call
  828. if(dbg) console.log('popoverRowFunctions. popoverRowFuncNode', popoverRowFuncNode);
  829. if(dbg) console.log('popoverRowFunctions. funcNodesToUpdate', funcNodesToUpdate);
  830. funcNodesToUpdate.forEach(function(funcNodeInfo) {
  831. var className = 'func_name-' + funcNodeInfo.id,
  832. foundRowFuncNode = null
  833. ;
  834. if(dbg) console.log('popoverRowFunctions. funcNodesToUpdate loop:', funcNodeInfo);
  835. popoverRowFuncNode.find('li > a').each(function(ind, n) {
  836. var n$ = $(n);
  837. if(dbg) console.log('popoverRowFunctions loop(',ind,'):', n, 'data(func_name)', n$.data('func_name'), 'data', n$.data());
  838. if (n$.hasClass(className)) {
  839. foundRowFuncNode = n$;
  840. }
  841. });
  842. if (foundRowFuncNode) {
  843. foundRowFuncNode.replaceWith(funcNodeInfo.node);
  844. } else {
  845. var funcItemNode = $('<li></li>').appendTo(popoverCellContent);
  846. funcItemNode.append(foundRowFuncNode);
  847. }
  848. });
  849. }
  850. popoverCntNode.empty().append(popoverCellContent);
  851. if (rowFunctions.length <= 0) {
  852. popoverCntNode.find('p.text-muted').delay(600).hide(300);
  853. }
  854. }
  855. }
  856. }
  857. });
  858. };
  859. priv.renderRowEmptyNode = function() {
  860. var rowNode = $('<tr></tr>');
  861. if (priv.options.rowFunctions || priv.options.filtersClean) {
  862. $('<td class="text-right stickyCol1">&nbsp;</td>').appendTo(rowNode);
  863. }
  864. if (_state.primaryKey && priv.options.checkboxes) {
  865. $('<td><input disabled type="checkbox" /></td>').appendTo(rowNode);
  866. }
  867. for (var i = 0; i < _state.colsSorted.length; i++) {
  868. var columnName = _state.colsSorted[i],
  869. columnProps = _data.cols[columnName]
  870. ;
  871. if (!columnProps) return;
  872. if (columnProps.hidden) continue;// "unique" is hidden - TODO: rm "unique" from _state.colsSorted ?
  873. if (i == 1) {// TODO: 1 is pk - use better check
  874. $('<td class="stickyCol2">&nbsp;</td>').appendTo(rowNode);
  875. } else {
  876. $('<td>&nbsp;</td>').appendTo(rowNode);
  877. }
  878. }
  879. return rowNode;
  880. };
  881. priv.renderTableTheadSort = function() {
  882. var nodeClass = 'tblAjax__' + 'head__sort'
  883. var currentNode = _uiNode$Table.find('thead').find('.' + nodeClass)
  884. var node = $('<tr class="sort ' + nodeClass + '"></tr>')
  885. if (priv.options.tblFunctions || priv.options.filtersClean) {
  886. var headCell = $('<th class="text-right head-info stickyCol1"></th>').appendTo(node)
  887. $.map(priv.options.tblFunctions, function (funObj, funName) {
  888. var funHtml = $('<a></a>')
  889. funHtml.attr('href', funObj.href || '#')
  890. if (funObj.title) funHtml.attr('title', funObj.title)
  891. if (funObj.icon) funHtml.html('<span class="glyphicon glyphicon-' + funObj.icon + '"></span> ')
  892. if (funObj.method && priv[funObj.method] && typeof priv[funObj.method] == 'function') {
  893. funHtml.on('click', priv[funObj.method])
  894. }
  895. funHtml.appendTo(headCell)
  896. })
  897. }
  898. if (_state.primaryKey && priv.options.checkboxes) {
  899. var checked = _checkToggleChecked ? 'checked' : ''
  900. var headCell = $('<th></th>').appendTo(node)
  901. var elem = $(p5Utils__format('<input {0} class="checkToggle" type="checkbox" />', [checked])).appendTo(headCell)
  902. elem.on('change', priv.checkToggleChanged)
  903. }
  904. for (var i = 0; i < _state.colsSorted.length; i++) {
  905. var column = _state.colsSorted[i]
  906. var props = _data.cols[column]
  907. if (props.hidden) continue
  908. var headCell = $('<th class="ta-ordering"></th>').appendTo(node)
  909. if (i == 1) headCell.addClass('stickyCol2')
  910. if (props.type != 'special' && props.type != 'geom') { // TODO: props.isSortable
  911. headCell.on('click', {column: column}, priv.columnClicked)
  912. }
  913. var nodeLabel = (props.friendly) ? props.friendly : column
  914. var nodeTitle = column
  915. if (props.description && props.description.length > 0) {
  916. nodeTitle = p5Utils__format("{0} ({1})", [props.description, column])
  917. }
  918. else if (props._tsRetId > 0) {
  919. nodeTitle = p5Utils__format("Kliknij na pole i przejdź do powiązanych rekordów ({0})", [nodeTitle])
  920. }
  921. if ('ref' === props.type && props.xsdRefType) {
  922. nodeLabel = '<i class="glyphicon glyphicon-export"></i> ' + props.xsdRefType
  923. if (props.description && props.description.length > 0 && props.description !== column) {
  924. nodeTitle = p5Utils__format("{0} (ref {1})", [props.description, column])
  925. } else {
  926. nodeTitle = p5Utils__format("(ref {0})", [column])
  927. }
  928. }
  929. var headCnt = $(p5Utils__format('<span class="pull-left" title="{1}">{0}</span>', [nodeLabel, nodeTitle]))
  930. headCnt.appendTo(headCell)
  931. if (column == _state.filters.currSortCol) {
  932. headCell.addClass((_state.filters.currSortFlip) ? 'ta-ordering-down' : 'ta-ordering-up')
  933. }
  934. if (column !== _state.primaryKey) {
  935. var hideColBtn = $('<i class="glyphicon glyphicon-remove remove-cell"></i>')
  936. hideColBtn.on('click', {column: column}, priv.columnHideClicked)
  937. hideColBtn.appendTo(headCell)
  938. }
  939. }
  940. currentNode.replaceWith(node)
  941. };
  942. priv.renderHeadSpecialFilters = function() {
  943. // console.log("priv.renderHeadSpecialFilters state:", { 'priv.options.specialFilterFunctions': priv.options.specialFilterFunctions, '_state.specialFilters': _state.specialFilters });
  944. var nodeClass = 'tblAjax__' + 'head__specialFilter',
  945. currentNode = $(_uiNodeCont).prevAll('.' + nodeClass),
  946. node;
  947. if (!priv.options.specialFilterFunctions) {
  948. return;
  949. }
  950. var node = $('<div class="btn-toolbar tblAjax__head__specialFilter"></div>');
  951. $.map(priv.options.specialFilterFunctions, function(groupObj, groupName) {
  952. var btnHtml,
  953. btnSelected,
  954. groupLabel = groupObj.label || groupName,
  955. groupHtml = $('<div class="btn-group"></div>')
  956. ;
  957. // _state.specialFilters[e.data.group] = e.data.value;
  958. if (groupName in _state.specialFilters) {
  959. btnSelected = _state.specialFilters[groupName];
  960. }
  961. // console.log("priv.renderHeadSpecialFilters loop:", {groupName: groupName, btnSelected: btnSelected});
  962. if (groupObj.icon) {
  963. $('<button class="btn btn-xs btn-default" title="' + groupLabel + '"><i class="' + groupObj.icon + '"></i></button>').appendTo(groupHtml);
  964. }
  965. $.map(groupObj.btns, function(btnObj, btnName) {
  966. btnHtml = $('<button class="btn btn-xs btn-default' + ((btnSelected && btnSelected == btnObj.value)? ' active' : '') + '">' + btnName + '</button>').appendTo(groupHtml);
  967. btnHtml.on('click', {group: groupName, value: btnObj.value}, priv.specialFilterChanged);
  968. });
  969. btnHtml = $('<button class="btn btn-xs btn-default' + ((!btnSelected)? ' disabled' : '') + '" title="Kasuj filtr"><i class="glyphicon glyphicon-remove"></i></button>').appendTo(groupHtml);
  970. btnHtml.on('click', {group: groupName, value: ''}, priv.specialFilterChanged);
  971. groupHtml.appendTo(node);
  972. });
  973. // console.log("priv.renderHeadSpecialFilters replace:", { 'priv.options.specialFilterFunctions': priv.options.specialFilterFunctions, '_state.specialFilters': _state.specialFilters });
  974. // console.log("priv.renderHeadSpecialFilters replace node:", { 'currentNode': currentNode, 'node': node, '_uiNodeCont': _uiNodeCont });
  975. currentNode.replaceWith(node);
  976. };
  977. priv.renderTableTheadFilter = function() {
  978. var nodeClass = 'tblAjax__' + 'head__filter',
  979. currentNode = _uiNode$Table.find('thead').find('.' + nodeClass),
  980. node;
  981. // currentNode.find('i').tooltip('hide');
  982. node = $('<tr class="filter ' + nodeClass + '"></tr>');
  983. //_head.find(".filter").remove();
  984. //_headFilter = $('<tr class="filter"></tr>').appendTo(_head);
  985. var headCell;
  986. var elem;
  987. var placeHolder = '';
  988. var tooltip = '';
  989. //create the functions column
  990. if (priv.options.rowFunctions || priv.options.filtersClean) {
  991. var headCell = $('<th class="text-right stickyCol1"></th>').appendTo(node);
  992. headCell.css({padding: '0'});
  993. if (priv.options.filtersClean) {
  994. var elem = $('<button title="Kasuj filtry" class="btn btn-xs btn-link glyphicon glyphicon-remove"></button>').appendTo(headCell);
  995. elem.on('click', priv.filtersClean);
  996. }
  997. }
  998. //create the filter checkbox
  999. if (_state.primaryKey && priv.options.checkboxes) {
  1000. tooltip = priv.options.types.bool.filterTooltip || 'Toggle between:<br/>indeterminate,<br/>checked,<br/>unchecked';
  1001. headCell = $('<th></th>').appendTo(node);
  1002. elem = $('<input class="filter indeterminate" checked type="checkbox" />').appendTo(headCell);
  1003. $.map(_state.filters.filterCols, function(colProps, col) {
  1004. if (col == "unique") {
  1005. if (colProps.filter) elem.prop('checked', true).removeClass('indeterminate');
  1006. else if (!colProps.filter) elem.prop('checked', false).removeClass('indeterminate');
  1007. else if (colProps.filter == '') elem.addClass('indeterminate');
  1008. }
  1009. });
  1010. if (tooltip) {
  1011. elem.tooltip({
  1012. title: tooltip.trim(),
  1013. html: true,
  1014. container: 'body',
  1015. trigger: 'hover',
  1016. placement: 'top',
  1017. delay: {
  1018. show: 500,
  1019. hide: 100
  1020. }
  1021. });
  1022. }
  1023. elem.on('click', {column: "unique"}, priv.filterChanged);
  1024. }
  1025. //create the column filters
  1026. for (var i = 0; i < _state.colsSorted.length; i++) {
  1027. var column = _state.colsSorted[i];
  1028. var props = _data.cols[column];
  1029. tooltip = props.filterTooltip === true ? undefined : props.filterTooltip === false ? '' : props.filterTooltip;
  1030. placeHolder = props.placeHolder === true ? undefined : props.placeHolder === false ? '' : props.placeHolder;
  1031. if (props.hidden) continue;
  1032. headCell = $('<th></th>').appendTo(node);
  1033. headCell.css({padding: '0'});
  1034. if (i == 1) headCell.addClass('stickyCol2');
  1035. // @mark MarkTableAjaxFilterColType
  1036. switch (props.type || 'string') {
  1037. case "number":
  1038. if (placeHolder == undefined) placeHolder = priv.options.types.number.placeHolder;
  1039. placeHolder = (placeHolder === true || placeHolder == undefined) ? '' : placeHolder === false ? '' : placeHolder;
  1040. if (tooltip == undefined) tooltip = priv.options.types.number.filterTooltip;
  1041. tooltip = (tooltip === true || tooltip == undefined) ? '' : tooltip === false ? '' : tooltip;
  1042. elem = $(p5Utils__format('<input placeholder="{0}" class="filter" type="text" />', [placeHolder]));
  1043. elem.on('keyup', {column: column}, priv.filterChanged);
  1044. break;
  1045. case "date":
  1046. if (placeHolder == undefined) placeHolder = priv.options.types.date.placeHolder;
  1047. placeHolder = (placeHolder === true || placeHolder == undefined) ? '' : placeHolder === false ? '' : placeHolder;
  1048. if (tooltip == undefined) tooltip = priv.options.types.date.filterTooltip;
  1049. tooltip = (tooltip === true || tooltip == undefined) ? '' : tooltip === false ? '' : tooltip;
  1050. elem = $(p5Utils__format('<div><input placeholder="{0}" class="filter" type="text" /></div>', [placeHolder]));
  1051. if (priv.options.types.date.datePicker === true || priv.options.types.date.datePicker == undefined)
  1052. {
  1053. if ($().datepicker)
  1054. {
  1055. elem.addClass('date-wrap');
  1056. var today = 0;//new priv.ext.XDate(false).setHours(0, 0, 0, 0).toString('yyyy-MM-dd');
  1057. var dp = $(p5Utils__format('<div style="float:right" class="date" data-date="{0}" data-date-format="{1}" />', [today, 'yyyy-mm-dd'])).appendTo(elem);
  1058. $('<input style="display:none" type="text" />').appendTo(dp);
  1059. $('<span class="add-on"><i class="glyphicon glyphicon-chevron-right"></i></span>').on('click', {op: "l"}, priv.dpOpChanged).appendTo(dp);
  1060. $('<span class="add-on"><i class="glyphicon glyphicon-chevron-left"></i></span>').on('click', {op: "r"}, priv.dpOpChanged).appendTo(dp);
  1061. dp.datepicker({weekStart:1});
  1062. dp.on('changeDate', {column: column, input: $('input.filter', elem)}, priv.dpClicked);
  1063. }
  1064. else
  1065. if (priv.options.debug) console.log('datepicker plugin not found');
  1066. }
  1067. elem.on('keyup', 'input.filter', {column: column}, priv.filterChanged);
  1068. break;
  1069. case "bool":
  1070. if (tooltip == undefined) tooltip = priv.options.types.bool.filterTooltip;
  1071. tooltip = (tooltip === true || tooltip == undefined) ? 'Toggle between:<br/>indeterminate,<br/>checked,<br/>unchecked' : tooltip === false ? '' : tooltip;
  1072. elem = $('<input class="filter indeterminate" checked type="checkbox" />');
  1073. elem.on('click', {column: column}, priv.filterChanged);
  1074. break;
  1075. case "p5:price":
  1076. case "p5:www_link":
  1077. case "p5:string":
  1078. case "string":
  1079. if (placeHolder == undefined) placeHolder = priv.options.types.string.placeHolder;
  1080. placeHolder = (placeHolder === true || placeHolder == undefined) ? '%' : placeHolder === false ? '' : placeHolder;
  1081. if (tooltip == undefined) tooltip = priv.options.types.string.filterTooltip;
  1082. tooltip = (tooltip === true || tooltip == undefined) ? 'Find str: str<br/>Find all but str: !str<br/>Find str inside: %str%' : tooltip === false ? '' : tooltip;
  1083. elem = $(p5Utils__format('<input placeholder="{0}" class="filter" type="text" size="8" />', [placeHolder]));
  1084. elem.on('keyup', {column: column}, priv.filterChanged);
  1085. break;
  1086. case "special":
  1087. elem = $('<div>&nbsp;</div>');
  1088. break;
  1089. case "simpleLink":
  1090. elem = $('<div>&nbsp;</div>');
  1091. break;
  1092. case "geom":
  1093. if (placeHolder == undefined) placeHolder = priv.options.types.string.placeHolder;
  1094. placeHolder = (placeHolder === true || placeHolder == undefined) ? '%' : placeHolder === false ? '' : placeHolder;
  1095. elem = $(p5Utils__format('<input placeholder="{0}" class="filter" type="text" size="8" />', [placeHolder]));
  1096. elem.on('keyup', {column: column}, priv.filterChanged);
  1097. break;
  1098. case "none":
  1099. elem = $('<div>&nbsp;</div>');
  1100. break;
  1101. case "ref": // TODO: search for ref fields
  1102. elem = $('<div>&nbsp;</div>')
  1103. break;
  1104. default:
  1105. elem = $('<div>&nbsp;</div>')
  1106. break;
  1107. }
  1108. if (false) {// tooltip OFF - (tooltip)
  1109. elem.tooltip({
  1110. title: tooltip.trim(),
  1111. html: true,
  1112. container: 'body',
  1113. trigger: 'focus',
  1114. placement: 'top',
  1115. delay: {
  1116. show: 500,
  1117. hide: 100
  1118. }
  1119. });
  1120. }
  1121. if (elem && props.filter) {
  1122. $.map(_state.filters.filterCols, function(colProps, col) {
  1123. if (col == column) {
  1124. var columnSettings = _data.cols[col];
  1125. if (columnSettings.type == 'bool') {
  1126. if (colProps.filter) elem.prop('checked', true).removeClass('indeterminate');
  1127. else if (!colProps.filter) elem.prop('checked', false).removeClass('indeterminate');
  1128. else if (colProps.filter == '') elem.addClass('indeterminate');
  1129. }
  1130. else elem.val(colProps.filter);
  1131. }
  1132. });
  1133. if (priv.options.forceFilterInit && undefined !== priv.options.forceFilterInit[column]) {
  1134. elem.prop('disabled', true);
  1135. }
  1136. elem.appendTo(headCell);
  1137. _filterFields[column] = elem;
  1138. }
  1139. }
  1140. currentNode.replaceWith(node);
  1141. };
  1142. priv.renderTableTfoot = function() {
  1143. _uiNode$Table.find('tfoot').remove();
  1144. _foot = $('<tfoot></tfoot>').insertAfter(_bodyNode);
  1145. //$(_uiNodeCont).next('.foot').replaceWith(_foot);
  1146. };
  1147. priv.renderFooter = function() {
  1148. priv.renderFooterInfo();
  1149. priv.renderFooterPagination();
  1150. priv.renderFooterPageSizes();
  1151. priv.renderFooterColumnPicker();
  1152. priv.renderFooterFunctions();
  1153. priv.renderFooterExport();
  1154. };
  1155. priv.renderFooterInfo = function() {
  1156. var nodeClass = 'tblAjax__' + 'footer__toolbar__info',
  1157. currentNode = $(_uiNodeCont).next('.foot').find('.' + nodeClass),
  1158. node;
  1159. if (priv.options.debug) console.log('Render: ', nodeClass);
  1160. node = $('<div class="foot-info ' + nodeClass + '"></div>');
  1161. //console.log('renderFooterInfo total', _data.total, 'page', _state.page, 'priv.options.pageSize', priv.options.pageSize);
  1162. var fromRow = Math.max(_state.page - 1, 0) * _state.pageSize;
  1163. var total = _data.total;
  1164. var toRow = Math.min(fromRow + _state.pageSize, total);
  1165. if (_data.total > 0) {
  1166. $(p5Utils__format('<p>Wiersze od {0} do {1} z {2}</p>', [fromRow + 1, toRow, total])).appendTo(node);
  1167. } else {
  1168. $('<p>Brak wierszy pasujących do kryteriów wyszukiwania</p>').appendTo(node);
  1169. }
  1170. currentNode.replaceWith(node);
  1171. };
  1172. priv.renderFooterPagination = function() {
  1173. var nodeClass = 'tblAjax__' + 'footer__toolbar__pagination',
  1174. currentNode = $(_uiNodeCont).next('.foot').find('.' + nodeClass),
  1175. node;
  1176. var currPage = _state.page;
  1177. var totalPages = Math.ceil(_data.total / _state.pageSize);
  1178. if (priv.options.debug) console.log('Render: ', nodeClass, '_data.total', _data.total, 'currPage', currPage);
  1179. /// console.log('Render: ', nodeClass, '_data.total', _data.total, 'currPage', currPage, '_state.page', _state.page);
  1180. if (_data.total > 0) {
  1181. node = $('<div class="btn-group ' + nodeClass + '"></div>');
  1182. //create the pager.
  1183. var lowerPage = currPage - 2;
  1184. var upperPage = currPage + 2;
  1185. if (upperPage > totalPages) {
  1186. var diff = upperPage - totalPages;
  1187. upperPage = totalPages;
  1188. lowerPage -= diff;
  1189. }
  1190. if (lowerPage < 1) lowerPage = 1;
  1191. if (upperPage < 5) upperPage = 5;
  1192. //$(p5Utils__format('<li class="{0}"><a href="#">&lt;&lt;</a></li>', [currPage == 1 ? 'disabled' : '']))
  1193. $(p5Utils__format('<button type="button" class="btn btn-default{0}">&lt;&lt;</button>', [currPage == 1 ? ' disabled' : '']))
  1194. .on('click', {pageIndex: 1}, priv.pageChanged)
  1195. .appendTo(node);
  1196. //$(p5Utils__format('<li class="{0}"><a href="#">&lt;</a></li>', [currPage == 1 ? 'disabled' : '']))
  1197. $(p5Utils__format('<button type="button" class="btn btn-default{0}">&lt;</button>', [currPage == 1 ? ' disabled' : '']))
  1198. .on('click', {pageIndex: currPage - 1}, priv.pageChanged)
  1199. .appendTo(node);
  1200. for (var i = lowerPage; i <= upperPage; i++) {
  1201. var link;
  1202. //if (i != currPage) link = $(p5Utils__format('<li class="{1}"><a href="#">{0}</a></li>', [i, i > totalPages ? 'disabled' : '']));
  1203. if (i != currPage) link = $(p5Utils__format('<button type="button" class="btn btn-default{1}">{0}</button>', [i, i > totalPages ? ' disabled' : '']));
  1204. //if (i == currPage) link = $(p5Utils__format('<li class="active"><a href="#">{0}</a></li>', [i]));
  1205. if (i == currPage) link = $(p5Utils__format('<button type="button" class="btn btn-default active">{0}</button>', [i]));
  1206. if (link) {
  1207. link.on('click', {pageIndex: i}, priv.pageChanged);
  1208. link.appendTo(node);
  1209. }
  1210. }
  1211. //$(p5Utils__format('<li class="{0}"><a href="#">&gt;</a></li>', [currPage == totalPages ? 'disabled' : '']))
  1212. $(p5Utils__format('<button type="button" class="btn btn-default{0}">&gt;</button>', [currPage == totalPages ? ' disabled' : '']))
  1213. .on('click', {pageIndex: currPage + 1}, priv.pageChanged)
  1214. .appendTo(node);
  1215. //$(p5Utils__format('<li class="{0}"><a href="#">&gt;&gt;</a></li>', [currPage == totalPages ? 'disabled' : '']))
  1216. $(p5Utils__format('<button type="button" class="btn btn-default{0}">&gt;&gt;</button>', [currPage == totalPages ? ' disabled' : '']))
  1217. .on('click', {pageIndex: totalPages}, priv.pageChanged)
  1218. .appendTo(node);
  1219. } else {
  1220. node = $('<span class="' + nodeClass + '"></span>');
  1221. }
  1222. currentNode.replaceWith(node);
  1223. };
  1224. priv.renderFooterPageSizes = function() {
  1225. var nodeClass = 'tblAjax__' + 'footer__toolbar__pagesizes',
  1226. currentNode = $(_uiNodeCont).next('.foot').find('.' + nodeClass),
  1227. node;
  1228. if (priv.options.debug) console.log('Render: ', nodeClass);
  1229. if (_data.total > 0 && priv.options.pageSizes.length > 0) {
  1230. node = $('<div class="btn-group dropup pagesize ' + nodeClass + '"></div>');
  1231. var btn = $('<button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown" href="#">Liczba wierszy&nbsp;</button>').appendTo(node);
  1232. var span = $('<span class="caret"></span>').appendTo(btn);
  1233. var ul = $('<ul class="dropdown-menu" style="max-height:250px;overflow:auto;">').appendTo(node);
  1234. $.each(priv.options.pageSizes, function(index, val) {
  1235. var li = $('<li></li>').appendTo(ul);
  1236. if (val == priv.options.pageSize) {
  1237. $(p5Utils__format('<a style="color:#337AB7;">{0}</a>', [val])).appendTo(li);
  1238. } else {
  1239. $(p5Utils__format('<a href="#">{0}</a>', [val])).appendTo(li);
  1240. }
  1241. });
  1242. node.on('click', 'a', priv.pageSizeChanged);
  1243. } else {
  1244. node = $('<span class="' + nodeClass + '"></span>');
  1245. }
  1246. currentNode.replaceWith(node);
  1247. };
  1248. priv.renderFooterColumnPicker = function() {
  1249. var nodeClass = 'tblAjax__' + 'footer__toolbar__columnPicker',
  1250. currentNode = $(_uiNodeCont).next('.foot').find('.' + nodeClass),
  1251. node;
  1252. if (priv.options.debug) console.log('Render: ', nodeClass);
  1253. if (priv.options.columnPicker) {
  1254. node = $('<div class="btn-group dropup columnpicker ' + nodeClass + '"></div>');
  1255. var btn = $('<button class="btn btn-sm btn-default dropdown-toggle" data-toggle="dropdown" href="#">Kolumny&nbsp;</button>').appendTo(node);
  1256. var span = $('<span class="caret"></span>').appendTo(btn);
  1257. var ul = $('<ul class="dropdown-menu" style="max-height:250px;overflow:auto;">').appendTo(node);
  1258. var selectedFilter = priv.modelColFilter_getSelected();
  1259. priv.modelColFilter_getFilters().map(function(colFltr) {
  1260. var li = $('<li></li>').appendTo(ul),
  1261. selected = (selectedFilter && selectedFilter == colFltr.name)? 'checked="checked"' : '',
  1262. input = '<input ' + selected + ' type="radio" style="margin:0"/>',
  1263. a = $('<a href="#" data-col_filter="' + colFltr.name + '" style="padding:0px 20px;">' + input + ' ' + colFltr.label + '</a>').appendTo(li);
  1264. if ('all' != colFltr.name && 'most_used' != colFltr.name) {
  1265. arm = $('<button data-col_filter="' + colFltr.name + '" class="pull-right btn btn-xs btn-link" style="margin:0;padding:0;border:0;color:red">' + '&times;' + '</a>').appendTo(a);
  1266. arm.on('click', priv.modelColFilter_onClickRemoveFilter)
  1267. }
  1268. });
  1269. {// if (!selectedFilter) {// save current filter
  1270. var li = $('<li style="text-align:center; clear:both"></li>').appendTo(ul)
  1271. priv.modelColFilter_getSaveBtn().appendTo(li);
  1272. }
  1273. $('<li class="divider"></li>').appendTo(ul);
  1274. $.each(_data.cols, function(col, props) {
  1275. if (props.type != "unique" && col != _state.primaryKey) {
  1276. var li = $('<li></li>').appendTo(ul),
  1277. label = (props.friendly || col).replace(/<br\/?>/g, ' '),
  1278. input = p5Utils__format('<input {0} type="checkbox" title="{1}" value="{1}" style="margin:0"/>&nbsp;{2}', [(props.hidden) ? '' : 'checked', col, label]),
  1279. a = $('<a href="#" style="padding:0px 20px;">' + input + '</a>').appendTo(li);
  1280. }
  1281. });
  1282. node.on('click', 'input[type="checkbox"]', priv.columnPickerClicked);
  1283. node.on('click', 'a', priv.columnPickerLinkClicked);
  1284. } else {
  1285. node = $('<span class="' + nodeClass + '"></span>');
  1286. }
  1287. currentNode.replaceWith(node);
  1288. };
  1289. priv.renderFooterFunctions = function() {
  1290. var nodeClass = 'tblAjax__' + 'footer__toolbar__functions',
  1291. currentNode = $(_uiNodeCont).next('.foot').find('.' + nodeClass),
  1292. node;
  1293. if (priv.options.debug) console.log('Render: ', nodeClass);
  1294. if (priv.options.tblFunctions) {
  1295. node = $('<div class="btn-group ' + nodeClass + '"></div>');
  1296. $.map(priv.options.tblFunctions, function(funObj, funName){
  1297. var funHtml = $('<button class="btn btn-sm btn-default"></button>');
  1298. if (funObj.title) funHtml.attr('title', funObj.title);
  1299. if (funObj.method) funHtml.on('click', priv[funObj.method]);
  1300. else if (funObj.href) funHtml.on('click', {hash:funObj.href}, priv.routeChanged);
  1301. var funIconHtml = $('<i></i>');
  1302. if (funObj.icon) funIconHtml.attr('class', 'glyphicon glyphicon-' + funObj.icon);
  1303. funIconHtml.prependTo(funHtml);
  1304. funHtml.addClass('btn');
  1305. funHtml.appendTo(node);
  1306. });
  1307. } else {
  1308. node = $('<span class="' + nodeClass + '"></span>');
  1309. }
  1310. currentNode.replaceWith(node);
  1311. };
  1312. priv.renderFooterExport = function() {
  1313. var nodeClass = 'tblAjax__' + 'footer__toolbar__export',
  1314. currentNode = $(_uiNodeCont).next('.foot').find('.' + nodeClass),
  1315. node;
  1316. if (priv.options.debug) console.log('Render: ', nodeClass);
  1317. if (priv.options.exportFields && priv.options.exportFields.length) {
  1318. node = $('<div class="btn-group dropup pagesize ' + nodeClass + '"></div>');
  1319. var btn = $('<button class="btn btn-sm dropdown-toggle" data-toggle="dropdown" href="#">Export&nbsp;</button>').appendTo(node);
  1320. var span = $('<span class="caret"></span>').appendTo(btn);
  1321. var ul = $('<ul class="dropdown-menu" style="max-height:250px;padding:5px 20px 5px 8px;overflow:auto;">').appendTo(node);
  1322. $.each(_data.cols, function(col, props) {
  1323. if (-1 !== priv.options.exportFields.indexOf(col)) {
  1324. var li = $('<li></li>').appendTo(ul);
  1325. $(p5Utils__format('<input {0} type="checkbox" title="{1}" value="{1}" >&nbsp;{2}</input>', [(_exportFieldsSelect[col])? 'checked' : '', col, props.friendly || col])).appendTo(li);
  1326. li.on('click', 'input', priv.exportFieldChanged);
  1327. }
  1328. });
  1329. var li = $('<li></li>').appendTo(ul);
  1330. $('<a href="index.php" target="_blank" class=""><i class="glyphicon glyphicon-share"></i>Export do HTML</a>').appendTo(li);
  1331. li.on('click', 'a', priv.exportToHTML);
  1332. var li = $('<li></li>').appendTo(ul);
  1333. $('<a href="index.php" target="_blank" class=""><i class="glyphicon glyphicon-share"></i>Export do CSV</a>').appendTo(li);
  1334. li.on('click', 'a', priv.exportToCSV);
  1335. var li = $('<li></li>').appendTo(ul);
  1336. $('<a href="index.php" target="_blank" class=""><i class="glyphicon glyphicon-share" title="Export do pliku CSV w kodowaniu Windows-1250"></i>Export do CSV (Windows-1250)</a>').appendTo(li);
  1337. li.on('click', 'a', priv.exportToCSVWinCP1250);
  1338. } else {
  1339. node = $('<span class="' + nodeClass + '"></span>');
  1340. }
  1341. currentNode.replaceWith(node);
  1342. };
  1343. priv.renderInlineEditBox = function() {
  1344. var nodeClass = 'tblAjax__' + 'inlineEditBox',
  1345. currentNode = $(_uiNodeCont).parent().children('.' + nodeClass),
  1346. node;
  1347. var node = $('<div class="' + nodeClass + ' modal fade" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>');
  1348. var modalWrap = $('<div class="modal-dialog"></div>').appendTo(node);
  1349. var modalWrap = $('<div class="modal-content"></div>').appendTo(modalWrap);
  1350. var frmInlineEdit = $('<form style="margin:0;padding:0;"></form>').appendTo(modalWrap);
  1351. var iebHead = $('<div class="modal-header" style="cursor:pointer">').appendTo(frmInlineEdit);
  1352. $('<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><i class="glyphicon glyphicon-remove" style="color:red"></i></button>').appendTo(iebHead);
  1353. $('<h4 id="myModalLabel">Edytuj</h4>').appendTo(iebHead);
  1354. var iebBodyWrap = $('<div class="modal-body" style="padding:0"></div>').appendTo(frmInlineEdit);
  1355. var iebBody = $('<div style="padding:15px"></div>').appendTo(iebBodyWrap);
  1356. $('<input type="hidden" name="ID" value="">').appendTo(iebBody);
  1357. $('<input type="hidden" name="col" value="">').appendTo(iebBody);
  1358. $('<div class="inlineEditBox-cnt"></div>').appendTo(iebBody);
  1359. var iebFoot = $('<div class="modal-footer"></div>').appendTo(frmInlineEdit);
  1360. $('<button class="btn btn-close" data-dismiss="modal" aria-hidden="true">Zamknij</button>').appendTo(iebFoot);
  1361. var iebBtnSave = $('<input type="submit" value="Zapisz" class="btn btn-primary btn-save">').appendTo(iebFoot);
  1362. frmInlineEdit.on('submit', function() {
  1363. var inlineEditBox$Node = $(_uiNodeCont).parent().children('.tblAjax__inlineEditBox');
  1364. var data = inlineEditBox$Node.find('form').serialize();
  1365. inlineEditBox$Node.find('.inlineEditBox-cnt').html('<span class="loading-info"> loading ...</span>');
  1366. function notifyAjaxCallback(data) {
  1367. var notify = {};
  1368. notify.type = (data && data.type)? data.type : '';
  1369. notify.msg = (data && data.msg)? data.msg : '';
  1370. switch (notify.type) {
  1371. case 'success':
  1372. if (!notify.msg) notify.msg = 'Dane poprawnie zaktualizowane';
  1373. break;
  1374. case 'info':
  1375. if (!notify.msg) notify.msg = 'Nie wprowadzono żadnych zmian';
  1376. break;
  1377. case 'error':
  1378. if (!notify.msg) notify.msg = 'Wystąpiły błędy';
  1379. break;
  1380. case 'warning':
  1381. notify.type = 'warn';
  1382. if (!notify.msg) notify.msg = 'Wystąpiły błędy';
  1383. break;
  1384. default:
  1385. notify.msg = 'Nieznany błąd';
  1386. if (data && data.errorCode) notify.msg += ' ' + data.errorCode;
  1387. notify.type = '';
  1388. }
  1389. jQuery.notify(notify.msg, notify.type);
  1390. }
  1391. $.ajax({
  1392. data: data,
  1393. dataType: 'json',
  1394. type: "POST",
  1395. url: priv.options.editInlineSaveUrl
  1396. })
  1397. .done(function(data, textStatus, jqXHR){
  1398. notifyAjaxCallback(data);
  1399. publ.refresh();
  1400. inlineEditBox$Node.modal('hide');
  1401. })
  1402. .fail(function(jqXHR){// jqXHR.fail(function( jqXHR, textStatus, errorThrown ) {});
  1403. if (jqXHR.responseJSON) {
  1404. notifyAjaxCallback(jqXHR.responseJSON);
  1405. }
  1406. else {
  1407. var txt = jqXHR.responseText || 'Wystąpiły błędy';
  1408. if (jqXHR.status == 404) {
  1409. jQuery.notify(jqXHR.responseText, 'error');
  1410. } else {
  1411. jQuery.notify(jqXHR.responseText, 'warn');
  1412. }
  1413. }
  1414. inlineEditBox$Node.modal('hide');
  1415. });
  1416. return false;
  1417. });
  1418. currentNode.replaceWith(node);
  1419. };
  1420. priv.exportFieldChanged = function(e) {
  1421. e.stopPropagation();
  1422. var column = $(this).val();
  1423. _exportFieldsSelect[column] = !_exportFieldsSelect[column];
  1424. };
  1425. priv.exportToHTML = function(e) {
  1426. priv.exportData('html', $(this), e);
  1427. };
  1428. priv.exportToCSV = function(e) {
  1429. priv.exportData('csv', $(this), e);
  1430. };
  1431. priv.exportToCSVWinCP1250 = function(e) {
  1432. priv.exportData('csv_cp1250', $(this), e);
  1433. };
  1434. priv.exportData = function(format, node, e) {
  1435. var exportFields = [];
  1436. $.each(_exportFieldsSelect, function(col, selected) {
  1437. if (selected) {
  1438. exportFields.push(col);
  1439. }
  1440. });
  1441. if (!exportFields.length) {
  1442. alert('Nie wybrano żadnych pól do eksportu.');
  1443. e.preventDefault();
  1444. return false;
  1445. }
  1446. var limit = 10000;
  1447. if (!_data.total || _data.total <= 0) {
  1448. alert('Brak rekordów do eksportu.');
  1449. e.preventDefault();
  1450. return false;
  1451. }
  1452. if (_data.total > limit) {
  1453. if (!confirm('Za dużo rekordów. Wyeksportowane zostaną tylko pierwsze ' + limit + ' z ' + _data.total + ' rekordów.')) {
  1454. e.preventDefault();
  1455. return false;
  1456. }
  1457. }
  1458. var exportUrl = 'index.php?_route=ViewTableAjax&_task=export&namespace=' + priv.options.namespace;
  1459. exportUrl += '&format=' + format;
  1460. exportUrl += '&flds=' + exportFields.join(',');
  1461. exportUrl += '&sortCol=' + (_state.filters.currSortCol || '');
  1462. exportUrl += '&sortDir=' + (_state.filters.currSortFlip ? "desc" : "asc");
  1463. if (Object.keys(_state.filters.filterCols).length > 0) {
  1464. $.each(_state.filters.filterCols, function(col, colProps) {
  1465. if (colProps.filter && colProps.filter.length > 0) {
  1466. exportUrl += '&f_' + col + '=' + colProps.filter;
  1467. }
  1468. });
  1469. }
  1470. // specialFilters
  1471. $.each(_state.specialFilters, function(groupName, btnValue) {
  1472. if (btnValue.length > 0) {
  1473. exportUrl += '&sf_' + groupName + '=' + btnValue;
  1474. }
  1475. });
  1476. if (priv.options.forceFilterInit) {
  1477. $.map(priv.options.forceFilterInit, function(fltrProps, fltr) {
  1478. exportUrl += '&sf_' + fltr + '=' + fltrProps;
  1479. });
  1480. }
  1481. node.attr('href', exportUrl);
  1482. };
  1483. /*
  1484. calls the webservice(if defined).
  1485. used only inside priv.init
  1486. */
  1487. priv.update = function(callback) {
  1488. var skipCols, resetChecked;// undefined
  1489. if (!priv.options.url) {
  1490. if (priv.options.debug) console.log('no url found');
  1491. return;
  1492. }
  1493. if (priv.options.debug) console.log(p5Utils__format('requesting data from url:{0}', priv.options.url));
  1494. var initUrlAdd = '';
  1495. var filtersInitSet = false;
  1496. initUrlAdd += '&currSortCol=' + _state.filters.currSortCol;
  1497. initUrlAdd += '&currSortFlip=' + ((_state.filters.currSortCol)? "desc" : "asc");
  1498. if (Object.keys(_state.filters.filterCols).length > 0) {
  1499. $.each(_state.filters.filterCols, function(col, colProps) {
  1500. if (colProps.filter && colProps.filter.length > 0) {
  1501. initUrlAdd += '&f_' + col + '=' + encodeURIComponent(colProps.filter);
  1502. filtersInitSet = true;
  1503. }
  1504. });
  1505. }
  1506. $.each(_state.specialFilters, function(groupName, btnValue) {
  1507. if (btnValue.length > 0) {
  1508. initUrlAdd += '&sf_' + groupName + '=' + encodeURIComponent(btnValue);
  1509. filtersInitSet = true;
  1510. }
  1511. });
  1512. if (priv.options.forceFilterInit) {
  1513. $.map(priv.options.forceFilterInit, function(fltrProps, fltr) {
  1514. initUrlAdd += '&f_' + fltr + '=' + encodeURIComponent(fltrProps);
  1515. filtersInitSet = true;
  1516. });
  1517. }
  1518. // p5UI__notifyAjaxCallback({type: 'info', msg: 'pobieranie danych (init) ...'});
  1519. window.fetch(priv.options.url + initUrlAdd, {
  1520. method: priv.options.urlPost ? 'POST' : 'GET',
  1521. credentials: 'same-origin',// add cookies
  1522. }).then(function (response) {
  1523. return response.json()
  1524. }).then(function (data) {
  1525. if (priv.options.debug) console.log('loadDataAjax:fetch:update: request finished response data:', data);
  1526. if ('success' == data.type) {
  1527. // p5UI__notifyAjaxCallback(data);
  1528. return data;
  1529. } else if ('error' == data.type) {
  1530. p5UI__notifyAjaxCallback(data);
  1531. } else {
  1532. p5UI__notifyAjaxCallback(data);
  1533. }
  1534. return null;
  1535. }).then(function (data) {
  1536. if (priv.options.debug) console.log('loadDataAjax:fetch:update: request finished data:', data);
  1537. if (!data) return;
  1538. if (data && data.cols) {
  1539. priv.setStateCols(data.cols, data.primaryKey);
  1540. }
  1541. // set initial filters (_state.filters.filterCols)
  1542. if (filtersInitSet && _data && _data.cols) {
  1543. $.map(reqData, function(fltrValue, fltr){
  1544. var colName = null;
  1545. if (fltr.substr(0, 3) == 'sf_') {
  1546. colName = fltr.substr(3);
  1547. }
  1548. else if (fltr.substr(0, 2) == 'f_') {
  1549. colName = fltr.substr(2);
  1550. }
  1551. if (colName && _data.cols[colName]) {
  1552. //add the filter to the filter array
  1553. _state.filters.filterCols[colName] = {
  1554. filter: fltrValue,
  1555. colName: colName
  1556. };
  1557. }
  1558. });
  1559. }
  1560. // assign the new state (data)
  1561. state = {data: {}};
  1562. if (!skipCols) state.data.cols = data.cols || {};
  1563. state.data.rows = data.rows || [];
  1564. state.data.total = data.total || 0;
  1565. state.data.primaryKey = data.primaryKey || 'ID';
  1566. state.page = data.page || 0;
  1567. state.pageSize = data.pageSize || priv.options.pageSize;
  1568. state.filters = data.filters || {};
  1569. priv.setState(state);
  1570. if (typeof callback == "function") {
  1571. callback.call(this);
  1572. }
  1573. }).catch(function (e) {
  1574. console.log('loadDataAjax:fetch: ERR:', e);
  1575. });
  1576. };
  1577. /*
  1578. assigns the new data.
  1579. */
  1580. priv.setState = function(state) {
  1581. var oldState = _state; // TODO: use to check what really changed (use extend!)
  1582. var renderParts = {};
  1583. if (state.data) {
  1584. if (state.data.cols && Object.keys(state.data.cols).length > 0) {// TODO: never happen, but if happend then rerender all
  1585. priv.setStateCols(state.data.cols, state.data.primaryKey);
  1586. priv.setStateData(state.data);
  1587. } else {
  1588. priv.setStateData(state.data);
  1589. }
  1590. renderParts['body'] = true;
  1591. renderParts['foot_pagination'] = true;
  1592. }
  1593. if (state.hasOwnProperty('specialFilters')) {
  1594. _state.specialFilters = state.specialFilters;
  1595. renderParts['head__specialFilters'] = true;
  1596. }
  1597. if (state.hasOwnProperty('page')) {
  1598. if (state.page != _state.page) {
  1599. _state.page = state.page;
  1600. renderParts['foot_pagination'] = true;
  1601. }
  1602. }
  1603. if (state.hasOwnProperty('pageSize')) {
  1604. if (state.pageSize != _state.pageSize) {
  1605. _state.pageSize = state.pageSize;
  1606. renderParts['foot_pagination'] = true;
  1607. }
  1608. }
  1609. if (state.hasOwnProperty('filters')) {
  1610. priv.setStateFilters(state.filters);
  1611. renderParts['head__specialFilters'] = true;
  1612. renderParts['foot_pagination'] = true;
  1613. }
  1614. renderParts = Object.keys(renderParts);
  1615. if (priv.options.debug) console.log('setState::renderParts: ', renderParts);//TODO:DBG:RMME
  1616. if (renderParts.length > 0) {
  1617. jQuery(_uiNodeCont).trigger('TableAjax:render', renderParts);
  1618. }
  1619. };
  1620. priv.setStateCols = function(cols, primaryKey) {
  1621. if (priv.options.debug) console.log('priv.setStateCols: ', {primaryKey: primaryKey, cols: cols});
  1622. // console.log("priv.setStateCols");
  1623. // console.trace();
  1624. _state.cols = cols;
  1625. _state.primaryKey = primaryKey || _state.primaryKey;
  1626. // fix col name - props.column
  1627. $.each(_state.cols, function(col, props) {
  1628. props.column = col;
  1629. });
  1630. // fix col types - default 'string'
  1631. $.each(_state.cols, function(col, props) {
  1632. if (!props.type) cols[col].type = "string";
  1633. });
  1634. // fix props.filter - set true if not set - TODO: allow filter this col?
  1635. $.each(_state.cols, function(col, props) {
  1636. if (props.filter == undefined) props.filter = true;
  1637. });
  1638. if (_state.primaryKey) {
  1639. //create a unique column definition
  1640. _state.cols["unique"] = {
  1641. column: "unique",
  1642. type: "unique",
  1643. index: -1,
  1644. hidden: true
  1645. };
  1646. }
  1647. _state.colsSorted = Object.keys(_state.cols).sort(function(a, b) {
  1648. return _state.cols[a].index - _state.cols[b].index;
  1649. });
  1650. };
  1651. priv.setStateFilters = function(stateFilters) {
  1652. var newFilterCols = {},
  1653. newSpecialFilters = {};
  1654. $.map(stateFilters, function(fltrProps, fltr) {
  1655. switch (fltr) {
  1656. case 'currSortCol': _state.filters.currSortCol = fltrProps; break;
  1657. case 'currSortFlip': _state.filters.currSortFlip = (fltrProps == 'desc')? true : false; break;
  1658. default:
  1659. if (fltr.substr(0, 2) == 'f_') {
  1660. newFilterCols[fltr.substr(2)] = {
  1661. filter: fltrProps,
  1662. colName: fltr.substr(2)
  1663. };
  1664. }
  1665. else if (fltr.substr(0, 3) == 'sf_') {
  1666. var groupName = fltr.substr(3);
  1667. if (priv.options.specialFilterFunctions.hasOwnProperty(groupName)) {
  1668. newSpecialFilters[groupName] = fltrProps;
  1669. }
  1670. }
  1671. }
  1672. });
  1673. _state.filters.filterCols = newFilterCols;
  1674. _state.specialFilters = newSpecialFilters;
  1675. };
  1676. priv.setStateData = function(pData, skipCols, resetChecked) {
  1677. var data = $.extend(true, {}, pData);
  1678. data.cols = _state.cols;// always use old cols - change cols mved to priv.setStateCols
  1679. _data = data;
  1680. _data.rowsOrg = _data.rows;
  1681. //we might have more/less data now. Recalculate stuff.
  1682. if (_state.page > 1) {
  1683. _totalPages = Math.ceil(_data.total / priv.options.pageSize);
  1684. }
  1685. //keep any previously checked rows around?
  1686. if (resetChecked === true || resetChecked === undefined)
  1687. _uniqueCols = {};
  1688. else {
  1689. for (var key in _uniqueCols)
  1690. _uniqueCols[key] = priv.getRow(key);
  1691. }
  1692. if (_state.primaryKey) {
  1693. //add rows that needs to be pre-checked
  1694. $.each(_data.rows, function(index, row) {
  1695. if (row["checked"] === true)
  1696. _uniqueCols[row[_state.primaryKey]] = row;
  1697. });
  1698. }
  1699. };
  1700. /*
  1701. sorts the data on the current sorting column
  1702. */
  1703. priv.sort = function() {
  1704. if (!_data.cols[_state.filters.currSortCol]) _state.filters.currSortCol = "";
  1705. if (!_state.filters.currSortCol) return;
  1706. publ.loadPage(0);
  1707. };
  1708. /*
  1709. helper that returns the underlying data by the unique value
  1710. */
  1711. priv.getRow = function(uniqueValue) {
  1712. var row;
  1713. $.each(_data.rowsOrg, function(i, r) {
  1714. if (r[_state.primaryKey] == uniqueValue) {
  1715. row = r;
  1716. return false;
  1717. }
  1718. });
  1719. return row;
  1720. };
  1721. /*
  1722. when: typing a filter
  1723. what: triggers filtering on the value
  1724. */
  1725. priv.filterChanged = function(e) {
  1726. //clear old timer if we're typing fast enough
  1727. if (priv.options.debug) console.log('filterChanged::#1');
  1728. if (_filterTimeout) {
  1729. clearTimeout(_filterTimeout);
  1730. if (priv.options.debug) console.log('filterChanged::#2 previous filtering cancelled');
  1731. }
  1732. var filter = this.value
  1733. , fltr = $(this)
  1734. , col = _data.cols[e.data.column]
  1735. , timeout = 450;
  1736. if (this.value) {
  1737. if (!fltr.hasClass('filter-active')) {
  1738. fltr.addClass('filter-active');
  1739. }
  1740. } else {
  1741. if (fltr.hasClass('filter-active')) {
  1742. fltr.removeClass('filter-active');
  1743. }
  1744. }
  1745. //boolean filters needs some special care
  1746. if (col.type == "bool" || col.type == "unique") {
  1747. timeout = 0;
  1748. var elem = $(this);
  1749. var cssClass = 'indeterminate';
  1750. if (elem.hasClass(cssClass)) {
  1751. e.preventDefault();
  1752. elem.removeClass(cssClass);
  1753. filter = true;
  1754. } else {
  1755. if (!elem.is(':checked')) {
  1756. filter = false;
  1757. } else {
  1758. elem.addClass(cssClass);
  1759. filter = '';
  1760. }
  1761. }
  1762. }
  1763. //add the filter to the filter array
  1764. _state.filters.filterCols[col.column] = {
  1765. filter: filter,
  1766. colName: col.column
  1767. };
  1768. //wait a few deciseconds before filtering
  1769. _filterTimeout = setTimeout(function(filterValue, colName) {
  1770. _state.filters.filterCols[colName] = {
  1771. filter: filterValue,
  1772. colName: colName
  1773. };
  1774. priv.filter();
  1775. }, timeout, filter, col.column);
  1776. };
  1777. priv.filtersClean = function(e) {
  1778. if (_filterTimeout) {
  1779. clearTimeout(_filterTimeout);
  1780. if (priv.options.debug) console.log('filtering cancelled - filtersClean');
  1781. }
  1782. var filtersActive = false;
  1783. $.map(_state.filters.filterCols, function(colProps, col) {
  1784. if (colProps.filter.length > 0) {
  1785. filtersActive = true;
  1786. colProps.filter = '';
  1787. }
  1788. });
  1789. if (filtersActive) {
  1790. // TODO: dont remove value from forceFilterInit fields - no field names in search fields?
  1791. /// TODO: rerender _head (thead.filter)
  1792. var elems = _uiNode$Table.find('thead').find('.filter').find('input');
  1793. elems.val('').prop('disabled', false);
  1794. elems.removeClass('filter-active');
  1795. priv.filter();
  1796. }
  1797. return false;
  1798. },
  1799. /**
  1800. * Filters the data.
  1801. */
  1802. priv.filter = function() {
  1803. if (!priv.options.filter) return;
  1804. if (Object.keys(_state.filters.filterCols).length == 0) return;
  1805. priv.loadPage(0);
  1806. };
  1807. /**
  1808. * Filters the data by specialFilter.
  1809. * when: click on special filter
  1810. * what: triggers filtering on the value
  1811. */
  1812. priv.specialFilterChanged = function(e) {
  1813. if (priv.options.debug) console.log('specialFilterChanged e.data:', e.data);
  1814. var state = {};
  1815. state.specialFilters = _state.specialFilters;
  1816. state.specialFilters[e.data.group] = e.data.value;
  1817. priv.setState(state);
  1818. publ.loadPage(0);
  1819. };
  1820. priv.longTextChanged = function(e) {
  1821. priv.options.longDesc = !priv.options.longDesc;
  1822. _bodyNode.find('td').each(function(ind, el){
  1823. var $el = jQuery(el);
  1824. if (!$el.attr('class') || $el.attr('class') == 'tbl-short-txt') {
  1825. //console.log(el.attr('class') + ': ' + el.text());
  1826. if (el.firstChild && el.firstChild.nodeName == 'SPAN') {
  1827. if (priv.options.longDesc) {
  1828. $el.addClass('tbl-short-txt');
  1829. var $elSpan = jQuery(el.firstChild);
  1830. $elSpan.tooltip({title: $elSpan.text(), placement: 'left'});
  1831. } else {
  1832. $el.removeClass('tbl-short-txt');
  1833. }
  1834. }
  1835. }
  1836. });
  1837. return false;
  1838. };
  1839. priv.mapEditorHide = function() {
  1840. priv.options.mapEditor = false;
  1841. if ('window' == priv.options.mapEditorContainer) {
  1842. //_mapEditorDialog.dialog("close");
  1843. _mapEditorDialog.dialog("destroy");
  1844. }
  1845. _mapEditorWrap.hide();
  1846. _mapEditor.hide();
  1847. };
  1848. priv.mapEditorShow = function() {
  1849. //console.log('TODO:mapEditorShow():', priv.options.mapEditorContainer, 'visible:', priv.options.mapEditor);
  1850. priv.options.mapEditor = true;
  1851. _mapEditor.show();
  1852. _mapEditorWrap.show();
  1853. _mapEditor.TableAjaxMap({
  1854. //debug: true,
  1855. wpsUrl: 'http://biuro.biall-net.pl/wps',
  1856. wfsUrl: 'http://biuro.biall-net.pl/wps',
  1857. showAddLayerWidget: (priv.options.hasAdditionalLayers) ? true : false,
  1858. zoomStrategyActivate: 14,
  1859. layerName: priv.options.labelHtml,
  1860. addBtn: {
  1861. title: 'Przenieś mapę do okna',
  1862. displayClass: 'mapEditor-btnBackToWindow',
  1863. trigger: function() {
  1864. priv.mapEditorHide();
  1865. priv.options.mapEditorContainer = 'window';
  1866. priv.mapEditorShow();
  1867. priv.resizableMapDockNode('destroy');
  1868. }
  1869. },
  1870. onSaveFeature: function(selectedRecordId, selectedFeatureExtent) {
  1871. if (priv.options.debug) console.log('onSaveFeature (',selectedRecordId,'/',selectedFeatureExtent,') ', this);
  1872. if (!selectedRecordId) {
  1873. alert('Brak zaznaczonego rekordu - wybierz rekord z tabeli');
  1874. return;
  1875. }
  1876. function notifyAjaxCallback(data) {
  1877. var notify = {};
  1878. notify.type = (data && data.type)? data.type : '';
  1879. notify.msg = (data && data.msg)? data.msg : '';
  1880. switch (notify.type) {
  1881. case 'success':
  1882. if (!notify.msg) notify.msg = 'Aktualizacja danych dla rekordu ' + selectedRecordId;
  1883. break;
  1884. case 'info':
  1885. if (!notify.msg) notify.msg = 'Nie wprowadzono żadnych zmian';
  1886. break;
  1887. case 'error':
  1888. if (!notify.msg) notify.msg = 'Wystąpiły błędy';
  1889. break;
  1890. case 'warning':
  1891. notify.type = 'warn';
  1892. if (!notify.msg) notify.msg = 'Wystąpiły błędy';
  1893. break;
  1894. default:
  1895. notify.msg = 'Nieznany błąd';
  1896. if (data && data.errorCode) notify.msg += ' ' + data.errorCode;
  1897. notify.type = '';
  1898. }
  1899. jQuery.notify(notify.msg, notify.type);
  1900. }
  1901. $.ajax({
  1902. data: {polygon: selectedFeatureExtent},
  1903. dataType: 'json',
  1904. type: "POST",
  1905. url: priv.options.theGeomSaveUrl + '&ID=' + selectedRecordId
  1906. })
  1907. .done(function(data, textStatus, jqXHR){
  1908. notifyAjaxCallback(data);
  1909. //jQuery.notify('Aktualizacja danych dla rekordu ' + selectedRecordId, 'success');
  1910. publ.loadPage(0);// TODO: reload table data
  1911. })
  1912. .fail(function(jqXHR){// jqXHR.fail(function( jqXHR, textStatus, errorThrown ) {});
  1913. if (jqXHR.responseJSON) {
  1914. notifyAjaxCallback(jqXHR.responseJSON);
  1915. }
  1916. else {
  1917. var txt = jqXHR.responseText || 'Wystąpiły błędy';
  1918. if (jqXHR.status == 404) {
  1919. jQuery.notify(jqXHR.responseText, 'error');
  1920. } else {
  1921. jQuery.notify(jqXHR.responseText, 'warn');
  1922. }
  1923. }
  1924. });
  1925. },
  1926. onSelectBox: function(bounds) {
  1927. if (undefined !== OpenLayers.Bounds && bounds instanceof OpenLayers.Bounds) {
  1928. var column = 'the_geom';
  1929. if (undefined !== _filterFields['the_geom']) {
  1930. var filter = 'BBOX:' + bounds.top + ',' + bounds.right + ',' + bounds.bottom + ',' + bounds.left;
  1931. _filterFields[column].val(filter);
  1932. _state.filters.filterCols[column] = {
  1933. filter: filter,
  1934. colName: column
  1935. };
  1936. priv.filter();
  1937. }
  1938. }
  1939. }
  1940. });
  1941. priv.mapEditorShowElement();
  1942. };
  1943. priv.mapEditorShowElement = function() {
  1944. if ('window' == priv.options.mapEditorContainer) {
  1945. var mapEditor = _mapEditorWrap.children('.mapEditor-map');
  1946. if (!mapEditor || !mapEditor.length) {
  1947. var tblCont = jQuery(_uiNodeCont).parent('.AjaxTableCont');
  1948. var mapEditor = tblCont.children('.AjaxTableCont-mapEditorContainer').children('.mapEditor-map');
  1949. if (!mapEditor || !mapEditor.length) {
  1950. // TODO: create new map
  1951. }
  1952. _mapEditorWrap.append(mapEditor);
  1953. }
  1954. _mapEditorWrap.css({padding:'5px'});
  1955. _mapEditorDialog = _mapEditorWrap.dialog({
  1956. width: 540,
  1957. minWidth: 400,
  1958. minHeight: 400,
  1959. open: function(e, ui) {
  1960. var n = jQuery(this),
  1961. mapWrap = n.children(":first"),
  1962. map = mapWrap.children(":first");
  1963. map.css({width: n.width() - 5, height: n.height() - 5});
  1964. _mapEditor.TableAjaxMapUpdateSize();
  1965. },
  1966. resizeStart: function(e, ui) {
  1967. jQuery(this).children(":first").children(":first").css({display:'none'});
  1968. },
  1969. resizeStop: function(e, ui){
  1970. var n = jQuery(this),
  1971. map = n.children(":first").children(":first");
  1972. n.css({width: n.parent().width()});
  1973. map.css({display: 'block', height: n.height(), width: n.width()});
  1974. _mapEditor.TableAjaxMapUpdateSize();
  1975. },
  1976. dragStop: function(e, ui){
  1977. _mapEditor.TableAjaxMapUpdateSize();// to prevent drag-zoom error
  1978. }
  1979. });
  1980. _mapEditorWrap.bind('dialogclose', function(e) {
  1981. priv.options.mapEditor = false;
  1982. });
  1983. var dialogTitleBar = _mapEditorDialog.parent().parent().find('.ui-dialog-titlebar');
  1984. var dialogTitleBarCloseBtn = dialogTitleBar.find('.ui-dialog-titlebar-close');
  1985. if (dialogTitleBarCloseBtn) {
  1986. var btnToggle = jQuery('<span style="width:18px;height:18px;position:absolute;top:50%;right:25px;margin-top:-9px;" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only"><i style="margin-top:3px;" class="glyphicon glyphicon-fullscreen"></i></span>');
  1987. btnToggle.on('click', function(e) {
  1988. priv.options.mapEditorContainer = 'dock';
  1989. _mapEditorWrap.dialog('close');
  1990. priv.mapEditorShowElement();
  1991. });
  1992. btnToggle.insertBefore(dialogTitleBarCloseBtn);
  1993. }
  1994. }
  1995. else if ('dock' == priv.options.mapEditorContainer) {
  1996. priv.resizableMapDockNode('prepare');
  1997. _mapEditor.TableAjaxMapUpdateSize();
  1998. }
  1999. };
  2000. priv.resizableMapDockNode = function(task) {
  2001. if ('prepare' == task) {
  2002. var mapEditor = _mapEditorWrap.children('.mapEditor-map');
  2003. if (mapEditor && mapEditor.length) {// map is inside _mapEditorWrap (window)
  2004. var mapDockNode = jQuery('<div class="AjaxTableCont-mapEditorContainer"></div>');
  2005. var tblCont = jQuery(_uiNodeCont).parent('.AjaxTableCont');
  2006. tblCont.children('.AjaxTableCont-mapEditorContainer').remove();
  2007. var breadcrumb = tblCont.children('.breadcrumb');
  2008. if (!breadcrumb || !breadcrumb.length) {
  2009. tblCont.prepend(mapDockNode);
  2010. } else {
  2011. mapDockNode.insertAfter(breadcrumb);
  2012. }
  2013. mapDockNode.append(mapEditor);
  2014. }
  2015. var mapDockResizable = mapEditor.parent();
  2016. mapDockResizable.resizable({handles: 's', minHeight: 300, minWidth: 300});
  2017. var resizeLineHeigth = 6;
  2018. mapDockResizable.children(":first").css({height: 'auto'});
  2019. mapDockResizable.css({marginBottom: resizeLineHeigth+'px'});
  2020. mapEditor.css({marginBottom: resizeLineHeigth+'px'});
  2021. mapEditor.children(":first").css({width: mapEditor.width()});
  2022. mapDockResizable.find('.ui-resizable-s').css({height:resizeLineHeigth+'px', bottom: '-'+resizeLineHeigth+'px'});
  2023. mapDockResizable.on('resizestart', function(event, ui) {
  2024. ui.element.children(":first").children(":first").css({display:'none'})
  2025. });
  2026. mapDockResizable.on('resizestop', function(event, ui) {
  2027. ui.element.children(":first").children(":first").css({display:'block', height: ui.element.height()});
  2028. });
  2029. } else if ('destroy' == task) {
  2030. var mapDockResizable = jQuery(_uiNodeCont).parent('.AjaxTableCont').children('.AjaxTableCont-mapEditorContainer');
  2031. mapDockResizable.resizable('destroy');
  2032. mapDockResizable.remove();
  2033. }
  2034. };
  2035. priv.mapEditorChanged = function(e) {
  2036. if (priv.options.debug) console.log('mapEditorChanged option(',priv.options.mapEditor,')');
  2037. priv.options.mapEditor = !priv.options.mapEditor;
  2038. if (priv.options.mapEditor) {
  2039. priv.mapEditorShow();
  2040. }
  2041. else {
  2042. priv.mapEditorHide();
  2043. }
  2044. return false;
  2045. };
  2046. /*
  2047. when: changing page in pager
  2048. what: triggers table to be created with new page
  2049. */
  2050. priv.pageChanged = function(e) {
  2051. e.preventDefault();
  2052. var totalPages = Math.ceil(_data.total / _state.pageSize);
  2053. if (e.data.pageIndex < 1 || e.data.pageIndex > totalPages) return;
  2054. //set the new page
  2055. _state.page = e.data.pageIndex;
  2056. publ.loadPage(_state.page);
  2057. };
  2058. /*
  2059. when: changing pagesize in pagesize dropdown
  2060. what: triggers table to be created with new pagesize
  2061. */
  2062. priv.pageSizeChanged = function(e) {
  2063. e.preventDefault();
  2064. var val = $(this).text();
  2065. if (priv.options.debug) console.log(p5Utils__format('pagesize changed to:{0}', [val]));
  2066. if (parseInt(val) == priv.options.pageSize) {
  2067. return false;
  2068. }
  2069. priv.options.pageSize = parseInt(val);
  2070. publ.loadPage(1, priv.options.pageSize);
  2071. jQuery(_uiNodeCont).trigger('TableAjax:render', ['body', 'foot_pagination']);
  2072. priv.saveProfilePageSize(priv.options.pageSize);
  2073. };
  2074. /*
  2075. when: clicking a column
  2076. what: triggers table to be sorted by the column
  2077. */
  2078. priv.columnClicked = function(e) {
  2079. e.preventDefault();
  2080. if (priv.options.debug) console.log(p5Utils__format('col:{0} clicked', [e.data.column]));
  2081. //set the new sorting column
  2082. if (_state.filters.currSortCol == e.data.column) _state.filters.currSortFlip = !_state.filters.currSortFlip;
  2083. _state.filters.currSortCol = e.data.column;
  2084. /// TODO: var state = {}; state.currSortCol = ''; state.currSortFlip = ''; priv.setState(state);
  2085. _headSort = undefined;
  2086. _body = undefined;
  2087. priv.sort();
  2088. };
  2089. priv.saveProfilePageSize = function(pageSize) {
  2090. var reqData = {};
  2091. reqData.pageSize = pageSize;
  2092. $.ajax({
  2093. data: reqData,
  2094. type: "POST",
  2095. dataType: 'json',
  2096. // async: true,
  2097. url: priv.options.pageSizeSave
  2098. })
  2099. .done(function(data, textStatus, jqXHR){
  2100. if (data && data.type && data.type == 'info') {
  2101. jQuery.notify('Nie wprowadzono żadnych zmian', 'info');
  2102. } else {
  2103. jQuery.notify('Zapisano ustawienia', 'success');
  2104. }
  2105. })
  2106. .fail(function(){
  2107. jQuery.notify('Wystąpił błąd podczas zapisywania ustawień', 'error');
  2108. });
  2109. };
  2110. priv.saveHiddenCols = function() {
  2111. var reqData = {};
  2112. $.each(_data.cols, function(col, props) {
  2113. if (props.type != "unique" && col != 'unique' && col != _state.primaryKey) {
  2114. reqData[col] = (props.hidden)? 'HIDE' : 'SHOW';
  2115. }
  2116. });
  2117. $.ajax({
  2118. data: reqData,
  2119. type: "POST",
  2120. dataType: 'json',
  2121. // async: true,
  2122. url: priv.options.hiddenColsSaveUrl
  2123. })
  2124. .done(function(data, textStatus, jqXHR){
  2125. if (data && data.type && data.type == 'info') {
  2126. jQuery.notify('Nie wprowadzono żadnych zmian', 'info');
  2127. } else {
  2128. jQuery.notify('Zapisano ustawienia', 'success');
  2129. }
  2130. })
  2131. .fail(function(){
  2132. jQuery.notify('Wystąpił błąd podczas zapisywania ustawień', 'error');
  2133. });
  2134. };
  2135. /*
  2136. when: clicking a column in columnpicker
  2137. what: triggers table to show/hide the column
  2138. */
  2139. priv.columnPickerClicked = function(e) {
  2140. e.stopPropagation();
  2141. var column = $(this).val();
  2142. //toggle column visibility
  2143. priv.modelColFilter_toggleColumn(column);
  2144. priv.saveHiddenCols();
  2145. //_data.cols[column].index = new priv.ext.XDate();
  2146. jQuery(_uiNodeCont).trigger('TableAjax:render', ['head', 'body']);
  2147. };
  2148. priv.modelColFilter_init = function() {// run only once, set _state._modelColFilter {selected, filters: [ {name, label, visibleCols} ]}
  2149. var isAllSelected = true;
  2150. if (undefined === _state._modelColFilter) {
  2151. var columnFilters = [];
  2152. {
  2153. var fltrAll = {'name': 'all', 'label': 'Wszystkie', visibleCols: []};
  2154. $.each(_data.cols, function(col, props) {
  2155. if ("unique" == props.type) return;
  2156. fltrAll.visibleCols.push(col);
  2157. if (_data.cols[col].hidden) isAllSelected = false;
  2158. });
  2159. columnFilters.push(fltrAll);
  2160. }
  2161. // {
  2162. // var fltrMostUsed = {'name': 'most_used', 'label': 'Najczęściej używane', visibleCols: []};
  2163. // var fltrMostUsedLimit = 10;
  2164. // $.each(_data.cols, function(col, props) {
  2165. // if ("unique" == props.type) return;
  2166. // if (fltrMostUsedLimit-- > 0) {
  2167. // fltrMostUsed.visibleCols.push(col);
  2168. // }
  2169. // });
  2170. // columnFilters.push(fltrMostUsed);
  2171. // }
  2172. _state._modelColFilter = {
  2173. selected: (isAllSelected)? 'all' : null,
  2174. filters: columnFilters,
  2175. saveBtn: $('<button class="btn btn-xs btn-primary" disabled="disabled">Zapisz widoczne kolumny</button>')
  2176. };
  2177. _state._modelColFilter.saveBtn.on('click', priv.modelColFilter_saveBtnClicked)
  2178. if (priv.options.userTableFilterUrl) {
  2179. window.fetch(priv.options.userTableFilterUrl, {
  2180. method: 'POST',
  2181. headers: {
  2182. 'Content-Type': 'application/json'
  2183. },
  2184. credentials: 'same-origin',// add cookies
  2185. body: JSON.stringify({
  2186. namespace: priv.options.namespace,
  2187. })
  2188. }).then(function (response) {
  2189. return response.json()
  2190. }).then(function (result) {
  2191. if ('success' == result.type) {
  2192. // p5UI__notifyAjaxCallback(result)
  2193. _state._modelColFilter.filters = _state._modelColFilter.filters.filter(function (filter) {
  2194. return ('all' === filter.name || 'most_used' == filter.name)
  2195. }).concat(Object.keys(result.data).map(function (fltr) {
  2196. return {
  2197. name: fltr,
  2198. label: fltr,
  2199. visibleCols: result.data[fltr].split(',')
  2200. }
  2201. }))
  2202. jQuery(_uiNodeCont).trigger('TableAjax:render', ['foot__columnPicker']);
  2203. } else {
  2204. p5UI__notifyAjaxCallback(result)
  2205. }
  2206. }).catch(function (e) {
  2207. // TODO: show error ("ajax response error: " + e)
  2208. });
  2209. }
  2210. }
  2211. };
  2212. priv.modelColFilter_onClickRemoveFilter = function (e) {
  2213. e.preventDefault()
  2214. e.stopPropagation()
  2215. var filtrName = $(this).data('col_filter')
  2216. if (!filtrName) return
  2217. window.fetch(priv.options.rmUserTableFilterAjaxUrl, {
  2218. method: 'POST',
  2219. headers: {
  2220. 'Content-Type': 'application/json'
  2221. },
  2222. credentials: 'same-origin',// add cookies
  2223. body: JSON.stringify({
  2224. namespace: priv.options.namespace,
  2225. filtrName: filtrName,
  2226. })
  2227. }).then(function (response) {
  2228. return response.json()
  2229. }).then(function (result) {
  2230. if ('success' == result.type) {
  2231. p5UI__notifyAjaxCallback(result)
  2232. var userTableFilters = result.data;// resolve(result.data)
  2233. _state._modelColFilter.filters = _state._modelColFilter.filters.filter(function (filter) {
  2234. return ('all' === filter.name || 'most_used' == filter.name)
  2235. }).concat(Object.keys(userTableFilters).map(function (fltr) {
  2236. return {
  2237. name: fltr,
  2238. label: fltr,
  2239. visibleCols: userTableFilters[fltr].split(',')
  2240. }
  2241. }))
  2242. jQuery(_uiNodeCont).trigger('TableAjax:render', ['foot__columnPicker']);
  2243. } else {
  2244. p5UI__notifyAjaxCallback(result)
  2245. }
  2246. }).catch(function (e) {
  2247. p5UI__notifyAjaxCallback({ type: 'error', msg: new String(e) })
  2248. });
  2249. };
  2250. priv.modelColFilter_saveBtnClicked = function (e) {
  2251. swal({
  2252. title: 'Zapisz widoczne kolumny',
  2253. html: '',
  2254. animation: true,
  2255. input: 'text',
  2256. inputPlaceholder: 'nazwa filtra',
  2257. // inputValue: null,
  2258. // inputAttributes: {'step': '0.01'},
  2259. showCancelButton: true,
  2260. confirmButtonText: 'Zapisz',
  2261. showLoaderOnConfirm: true,
  2262. showCloseButton: true,
  2263. preConfirm: function(filtrName) {
  2264. return new Promise(function(resolve, reject) {
  2265. if (!filtrName) reject('Proszę podać nazwę filtra')
  2266. if (filtrName.length > 255) reject('Nazwa za długa')
  2267. window.fetch(priv.options.addUserTableFilterAjaxUrl, {
  2268. method: 'POST',
  2269. headers: {
  2270. 'Content-Type': 'application/json'
  2271. },
  2272. credentials: 'same-origin',// add cookies
  2273. body: JSON.stringify({
  2274. namespace: priv.options.namespace,
  2275. filtrName: filtrName,
  2276. visibleCols: Object.keys(_data.cols).filter(function(col) {
  2277. return !_data.cols[col].hidden
  2278. }).join(','),
  2279. })
  2280. }).then(function (response) {
  2281. return response.text()
  2282. }).then(function (responseText) {
  2283. try {
  2284. // json = response.json() // BUG: error trafia do catch promisów, zamiast aktualnego bloku
  2285. // -- obiekt response pewnie jest powiązany z Promisem z fetch
  2286. // -- response.json() zwraca Promise tak samo jak response.text()
  2287. return JSON.parse(responseText)
  2288. } catch (e) {
  2289. throw responseText
  2290. }
  2291. }).then(function (result) {
  2292. if ('success' == result.type) {
  2293. p5UI__notifyAjaxCallback(result)
  2294. resolve(result.data)
  2295. } else {
  2296. p5UI__notifyAjaxCallback(result)
  2297. reject(result.msg || "Wystąpił błąd!")
  2298. }
  2299. }).catch(function (e) {
  2300. reject("ajax response error: " + e)
  2301. });
  2302. })
  2303. },
  2304. allowOutsideClick: false
  2305. }).then(function(userTableFilters) {
  2306. _state._modelColFilter.filters = _state._modelColFilter.filters.filter(function (filter) {
  2307. return ('all' === filter.name || 'most_used' == filter.name)
  2308. }).concat(Object.keys(userTableFilters).map(function (fltr) {
  2309. return {
  2310. name: fltr,
  2311. label: fltr,
  2312. visibleCols: userTableFilters[fltr].split(',')
  2313. }
  2314. }))
  2315. jQuery(_uiNodeCont).trigger('TableAjax:render', ['head', 'body', 'foot__columnPicker']);
  2316. }).catch(function(e) {
  2317. // eg. hit Cancel
  2318. })
  2319. }
  2320. priv.modelColFilter_getSaveBtn = function () {
  2321. priv.modelColFilter_init();
  2322. return _state._modelColFilter.saveBtn
  2323. }
  2324. priv.modelColFilter_getFilters = function() {
  2325. priv.modelColFilter_init();
  2326. return _state._modelColFilter.filters;
  2327. };
  2328. priv.modelColFilter_getSelected = function() {
  2329. priv.modelColFilter_init();
  2330. return _state._modelColFilter.selected;
  2331. };
  2332. priv.modelColFilter_setFilter = function(filterKey) {
  2333. priv.modelColFilter_init();
  2334. _state._modelColFilter.selected = filterKey;
  2335. priv.modelColFilter_uiUncheckAllColFilters();
  2336. priv.modelColFilter_uiCheckColFilter(filterKey);
  2337. };
  2338. priv.modelColFilter_toggleColumn = function(column, value) {
  2339. priv.modelColFilter_init();
  2340. _state._modelColFilter.selected = null;
  2341. if (!_data.cols[column] || !_data.cols[column]) return;
  2342. _data.cols[column].hidden = (undefined !== value)? value : !_data.cols[column].hidden;
  2343. priv.modelColFilter_uiUncheckAllColFilters();
  2344. {
  2345. var isAllSelected = true;
  2346. $.each(_data.cols, function(col, props) {
  2347. if ("unique" == props.type) return;
  2348. if (_data.cols[col].hidden) isAllSelected = false;
  2349. });
  2350. if (isAllSelected) {
  2351. _state._modelColFilter.selected = 'all';
  2352. priv.modelColFilter_uiCheckColFilter('all');
  2353. }
  2354. }
  2355. };
  2356. priv.modelColFilter_uiUncheckAllColFilters = function() {
  2357. var nodeClass = 'tblAjax__' + 'footer__toolbar__columnPicker',
  2358. currentNode = $(_uiNodeCont).next('.foot').find('.' + nodeClass)
  2359. ;
  2360. currentNode.find('input[type="radio"]').prop("checked", false);
  2361. };
  2362. priv.modelColFilter_uiCheckColFilter = function(filterKey) {
  2363. var nodeClass = 'tblAjax__' + 'footer__toolbar__columnPicker',
  2364. currentNode = $(_uiNodeCont).next('.foot').find('.' + nodeClass)
  2365. ;
  2366. currentNode.find('input[type="radio"]').each(function(idx, input) {
  2367. var input$ = jQuery(input);
  2368. if (filterKey == jQuery(input$).parent().data('col_filter')) {
  2369. input$.prop("checked", true);
  2370. } else {
  2371. input$.prop("checked", false);
  2372. }
  2373. });
  2374. };
  2375. priv.columnPickerLinkClicked = function(e) {
  2376. e.stopPropagation();
  2377. var input$ = $(this).find('input'),
  2378. col_filter = $(this).data('col_filter'),
  2379. columnFilters = priv.modelColFilter_getFilters()
  2380. ;
  2381. if (col_filter) {
  2382. var filter = null;
  2383. $.each(columnFilters, function(idx, colFltr) {
  2384. if (col_filter == colFltr.name) {
  2385. filter = colFltr;
  2386. }
  2387. });
  2388. if (!filter) return;
  2389. $.each(_data.cols, function(col, props) {
  2390. var isHidden = (-1 === filter.visibleCols.indexOf(col));
  2391. priv.modelColFilter_toggleColumn(col, isHidden);
  2392. });
  2393. priv.modelColFilter_setFilter(col_filter);
  2394. priv.saveHiddenCols();
  2395. jQuery(_uiNodeCont).trigger('TableAjax:render', ['head', 'body', 'foot__columnPicker']);
  2396. } else {
  2397. e.preventDefault();
  2398. if (input$.length != 1) return;
  2399. var column = input$.val();
  2400. if (!column) return;
  2401. //toggle column visibility
  2402. priv.modelColFilter_toggleColumn(column);
  2403. input$.prop("checked", !input$.is(':checked'));// update view
  2404. priv.saveHiddenCols();
  2405. //_data.cols[column].index = new priv.ext.XDate();
  2406. jQuery(_uiNodeCont).trigger('TableAjax:render', ['head', 'body']);
  2407. }
  2408. };
  2409. priv.columnHideClicked = function(e) {
  2410. e.stopPropagation();
  2411. var column;
  2412. if (e.data && e.data.column) {
  2413. column = e.data.column;
  2414. } else {
  2415. return;
  2416. }
  2417. //toggle column visibility
  2418. priv.modelColFilter_toggleColumn(column);
  2419. priv.saveHiddenCols();
  2420. //_data.cols[column].index = new priv.ext.XDate();
  2421. jQuery(_uiNodeCont).trigger('TableAjax:render', ['head', 'body', 'foot__columnPicker']);
  2422. };
  2423. /*
  2424. when: clicking a row checkbox
  2425. what: toggles checked state on row, and add/removes it from checked array
  2426. */
  2427. priv.rowChecked = function(e) {
  2428. var elem = $(this);
  2429. //get the row's unique value
  2430. var unique = elem.closest('tr').data('unique');
  2431. if (priv.options.debug) console.log(p5Utils__format('row({0}) {1}', [unique, elem.is(':checked') ? 'checked' : 'unchecked']));
  2432. //store the row in checked array
  2433. if (elem.is(':checked')) _uniqueCols[unique] = priv.getRow(unique);
  2434. else delete _uniqueCols[unique];
  2435. };
  2436. /*
  2437. when: clicking anywhere on a row
  2438. what: row data and other info is returned to caller
  2439. */
  2440. // priv.rowClicked = function(e) {// TODO: not used
  2441. // if (!_state.primaryKey) {
  2442. // if (priv.options.debug) console.log('no unique column specified');
  2443. // return;
  2444. // }
  2445. //
  2446. // //gather callback data
  2447. // var elem = $(this);
  2448. // var column = _data.cols[elem.data('column')];
  2449. // var unique = elem.closest('tr').data('unique');
  2450. // var row = priv.getRow(unique);
  2451. // var isChecked = elem.closest('tr').find('.unique').is(':checked');
  2452. //
  2453. // //trigger callback
  2454. // if (typeof priv.options.rowClicked == 'function') {
  2455. // priv.options.rowClicked.call(e.target, {
  2456. // event: e,
  2457. // row: row,
  2458. // column: column,
  2459. // checked: isChecked
  2460. // });
  2461. // }
  2462. // };
  2463. /**
  2464. * Inline edit.
  2465. */
  2466. priv.rowDblClicked = function(e) {
  2467. var inlineEditBox$Node = $(_uiNodeCont).parent().children('.tblAjax__inlineEditBox');
  2468. // hide popover for typespecial fld on click
  2469. if (_popoverCellCurrent) {
  2470. _popoverCellCurrent.popover('hide');
  2471. }
  2472. // e.clientX: 1002; e.clientY: 245
  2473. if ('id' in e.data && 'col' in e.data && e.data.id > 0) {
  2474. inlineEditBox$Node.modal();
  2475. inlineEditBox$Node.show();
  2476. inlineEditBox$Node.on('shown.bs.modal', function(e) {
  2477. var dialogBox = jQuery(this).find('.modal-dialog'),
  2478. modalBody = dialogBox.find('.modal-body'),
  2479. boudingRect = dialogBox.get(0).getBoundingClientRect();
  2480. dialogBox.css({position: 'absolute', margin:0, top: boudingRect.top, left: boudingRect.left});
  2481. modalBody.css({overflow: 'scroll'});
  2482. dialogBox.resizable({minHeight: 300, minWidth: 300, alsoResize: modalBody});
  2483. dialogBox.draggable({handle: '.modal-header'});
  2484. });
  2485. inlineEditBox$Node.on('hidden.bs.modal', function(e) {
  2486. var dialogBox = jQuery(this).find('.modal-dialog'),
  2487. modalBody = dialogBox.find('.modal-body');
  2488. dialogBox.removeAttr('style');
  2489. modalBody.removeAttr('style');
  2490. modalBody.css({padding: '0'});
  2491. dialogBox.resizable();
  2492. dialogBox.draggable();
  2493. dialogBox.resizable('destroy');
  2494. dialogBox.draggable('destroy');
  2495. });
  2496. inlineEditBox$Node.find('input[name=ID]').val(e.data.id);
  2497. inlineEditBox$Node.find('input[name=col]').val(e.data.col);
  2498. inlineEditBox$Node.find('.inlineEditBox-cnt').html('<span class="loading-info"> loading ...</span>');
  2499. $.ajax({
  2500. url: priv.options.editInlineUrl + '&ID=' + e.data.id + '&col=' + e.data.col,
  2501. type: 'GET',
  2502. dataType: 'json',
  2503. success: function(data) {
  2504. if ('p5:www_link' == _.get(data, 'simpleType')) {
  2505. inlineEditBox$Node.find('.inlineEditBox-cnt').empty();
  2506. var label = jQuery('<label>');// for="' + data.htmlFieldName + '">');// "<label for="f22579" class="AjaxTableEdit-label"> ... </label>
  2507. label.attr('for', data.htmlFieldName);
  2508. label.attr('class', 'AjaxTableEdit-label');
  2509. inlineEditBox$Node.find('.inlineEditBox-cnt').append(label);
  2510. var inLabel = jQuery('<strong title="[' + data.idZasob + '] ' + data.fieldLabel + '">' + data.fieldLabel + '</strong>');
  2511. label.append(inLabel);
  2512. var frmItem = jQuery('<input>');
  2513. frmItem.attr('type', 'text');
  2514. frmItem.attr('name', data.htmlFieldName);
  2515. frmItem.attr('value', data.formItem.value);
  2516. frmItem.attr('maxlength', _.get(data, 'restrictions.maxLength', 255));
  2517. frmItem.attr('style', 'width:98%');
  2518. frmItem.attr('class', 'form-control');
  2519. frmItem.insertAfter(label);
  2520. } else {
  2521. var content = _.get(data, 'legacy_html', "Nieznany błąd");
  2522. inlineEditBox$Node.find('.inlineEditBox-cnt').html(content);
  2523. }
  2524. inlineEditBox$Node.find('.btn-save').show();
  2525. initDateTimePicker(inlineEditBox$Node);
  2526. inlineEditBox$Node.find('textarea').autosize();
  2527. var fld = inlineEditBox$Node.find('input[name^="f"]');
  2528. if (fld.length > 0 && !fld.hasClass('se_type-date')) {
  2529. fld.keydown(function(event) {
  2530. if (event.which == 13) {
  2531. event.preventDefault();
  2532. inlineEditBox$Node.find('form').submit();
  2533. }
  2534. });
  2535. }
  2536. (function setFocusAtFirstInlineEditFormFld(modal$node){
  2537. var fld, dbg = false;
  2538. if(dbg)console.log('focus...');
  2539. fld = modal$node.find('input[name^="f"]:first');
  2540. if (fld.length > 0 && !fld.hasClass('se_type-date')) {
  2541. if(dbg)console.log('set focus to first input element');
  2542. fld.focus(); return;
  2543. }
  2544. fld = modal$node.find('select[name^="f"]:first');
  2545. if (fld.length) {
  2546. if (fld.get(0).selectize) {
  2547. if(dbg)console.log('set focus to first typepecial element');
  2548. } else {
  2549. if(dbg)console.log('set focus to first select element');
  2550. fld.focus(); return;
  2551. }
  2552. }
  2553. if(dbg)console.log('set focus to close btn');
  2554. modal$node.find('.btn-close').focus();
  2555. })(inlineEditBox$Node);
  2556. },
  2557. error: function(err) {
  2558. if (priv.options.debug) console.log('err');
  2559. }
  2560. });
  2561. } else {
  2562. if (priv.options.debug) console.log('NO data');
  2563. return false;
  2564. }
  2565. };
  2566. priv.ajaxLoadTypeSpeciallCell = function(id, col) {
  2567. if (_popoverCellAjaxXhr) {
  2568. _popoverCellAjaxXhr.abort();
  2569. }
  2570. _popoverCellAjaxXhr = $.ajax({
  2571. type: 'GET',
  2572. url: 'index.php?_route=ViewTableAjax&_task=typeSpecialCell&namespace=' + priv.options.namespace + '&ID=' + id + '&col=' + col,
  2573. dataType: 'json',
  2574. contentType: "application/json; charset=utf-8",
  2575. data: '',
  2576. success: function(req){
  2577. if (_.get(req, 'data.tbl_id') > 0) {
  2578. var addHtml = '';
  2579. for (var i in req.data.items) {
  2580. var url = 'index.php?_route=ViewTableAjax';
  2581. url += '&namespace=' + req.namespace;
  2582. url += '&f_' + req.data.fld_name + '=' + req.data.items[i].id;
  2583. url += '&_hash=' + Math.random().toString(36).substring(2);
  2584. addHtml += '<a href="' + url + '">Wyszukaj ' + req.data.items[i].id + '</a>: ' + req.data.items[i].label;
  2585. addHtml += '<br>';
  2586. }
  2587. //_popoverCell.append(addHtml);// cache
  2588. if (_popoverCellCurrent) {
  2589. var popoverNodeId = _popoverCellCurrent.attr('aria-describedby');
  2590. if (popoverNodeId) {
  2591. jQuery('#' + popoverNodeId).find('.popoverCellContent').append(addHtml);
  2592. }
  2593. }
  2594. }
  2595. }
  2596. });
  2597. };
  2598. priv.popoverCellTypeSpecial = function(e) {
  2599. e.preventDefault();
  2600. e.stopPropagation();
  2601. if ('id' in e.data && 'col' in e.data && e.data.id > 0) {
  2602. var lastId = _popoverCell.data('rowid'),
  2603. lastCol = _popoverCell.data('col'),
  2604. rowPK = e.data.id,
  2605. colName = e.data.col
  2606. ;
  2607. if (lastId == rowPK && lastCol == colName) {
  2608. //_popoverCellCurrent.popover('toggle');
  2609. }
  2610. else {
  2611. if (_popoverCellCurrent) {
  2612. _popoverCellCurrent.popover('destroy');
  2613. }
  2614. _popoverCell.data('rowid', rowPK);
  2615. _popoverCell.data('col', colName);
  2616. _popoverCell.html(e.data.value + '<div class="popoverCellContent loading" style="white-space:normal"></div>');
  2617. _popoverCellCurrent = jQuery(e.currentTarget);
  2618. // title : '<span class="text-info"><strong>title</strong></span> <button type="button" id="close" class="close">&times;</button>'
  2619. var opts = {
  2620. placement: 'left'
  2621. , trigger: 'click'
  2622. // , title: e.data.col + '<a href="#" class="glyphicon glyphicon-remove pull-right" onclick="return hidePopover();"></a>'
  2623. , title: '<div style="display:block;position:relative;padding:0 20px 0 0;">' + (e.data.friendly || colName) + ' <button type="button" class="close" onclick="return hidePopover();" style="position:absolute;right:0;top:0;">&times;</button>' + '</div>'
  2624. , html: true
  2625. , content: _popoverCell.html()
  2626. }
  2627. _popoverCellCurrent.popover(opts);
  2628. if (_data.cols[colName]) {
  2629. if (_data.cols[colName]._tsRetId > 0) {
  2630. _popoverCellCurrent.on('shown.bs.popover', function() {
  2631. priv.ajaxLoadTypeSpeciallCell(rowPK, colName);
  2632. });
  2633. }
  2634. }
  2635. _popoverCellCurrent.popover('show');
  2636. }
  2637. } else {
  2638. if (priv.options.debug) console.log('NO data');
  2639. return false;
  2640. }
  2641. return;
  2642. };
  2643. priv.routeChanged = function(e) {
  2644. hash = e.data.hash || '';
  2645. if (hash.length == 0) {
  2646. return;
  2647. }
  2648. if (hash.substring(0, 1) != '#') {
  2649. hash = '#' + hash;
  2650. }
  2651. location.hash = hash;
  2652. };
  2653. priv.refresh = function(e) {
  2654. e.preventDefault();
  2655. publ.loadPage(_state.page);
  2656. };
  2657. publ.init = function(options) {
  2658. if (priv.options.debug) console.log('TableAjax initialization...');
  2659. //merge supplied options with defaults
  2660. $.extend(priv.options, defaults, options);
  2661. priv.init();
  2662. return publ;
  2663. };
  2664. publ.refresh = function() {
  2665. publ.loadPage(_state.page);
  2666. };
  2667. publ.loadPage = function(page, pageSize) {
  2668. priv.loadPage(page, pageSize);
  2669. }
  2670. priv.loadPage = function(page, pageSize) {
  2671. var resetChecked = false;
  2672. var reqData = {
  2673. page: page,
  2674. pageSize: (pageSize || priv.options.pageSize),
  2675. currSortCol: (_state.filters.currSortCol || ''),
  2676. currSortFlip: _state.filters.currSortFlip ? "desc" : "asc"
  2677. };
  2678. var urlAdd = '';
  2679. urlAdd += '&page=' + page;
  2680. urlAdd += '&pageSize=' + (pageSize || priv.options.pageSize);
  2681. urlAdd += '&currSortCol=' + (_state.filters.currSortCol || '');
  2682. urlAdd += '&currSortFlip=' + (_state.filters.currSortFlip ? "desc" : "asc");
  2683. if (Object.keys(_state.filters.filterCols).length > 0) {
  2684. $.each(_state.filters.filterCols, function(col, colProps) {
  2685. if (colProps.filter && colProps.filter.length > 0) {
  2686. urlAdd += '&f_' + col + '=' + encodeURIComponent(colProps.filter);
  2687. }
  2688. });
  2689. }
  2690. // specialFilters
  2691. $.each(_state.specialFilters, function(groupName, btnValue) {
  2692. if (btnValue.length > 0) {
  2693. urlAdd += '&sf_' + groupName + '=' + encodeURIComponent(btnValue);
  2694. }
  2695. });
  2696. if (priv.options.forceFilterInit) {
  2697. $.map(priv.options.forceFilterInit, function(fltrProps, fltr) {
  2698. urlAdd += '&f_' + fltr + '=' + encodeURIComponent(fltrProps);
  2699. filtersInitSet = true;
  2700. });
  2701. }
  2702. _uiNode$Table.parent().parent().addClass('AjaxTable-loading');
  2703. // p5UI__notifyAjaxCallback({type: 'info', msg: 'pobieranie danych...'});
  2704. window.fetch(priv.options.url + urlAdd, {
  2705. method: priv.options.urlPost ? 'POST' : 'GET',
  2706. credentials: 'same-origin',// add cookies
  2707. }).then(function (response) {
  2708. return response.json()
  2709. }).then(function (data) {
  2710. if (priv.options.debug) console.log('loadDataAjax:fetch:loadPage: request finished, data:', data);
  2711. // p5UI__notifyAjaxCallback(data);
  2712. if ('success' == data.type) {
  2713. state = {data: {}};
  2714. state.data.cols = data.cols || {};
  2715. state.data.rows = data.rows || [];
  2716. state.data.total = data.total || 0;
  2717. state.data.primaryKey = data.primaryKey || 'ID';
  2718. state.page = data.page || 0;
  2719. state.pageSize = data.pageSize || priv.options.pageSize;
  2720. state.filters = data.filters || {};
  2721. priv.setState(state);
  2722. _uiNode$Table.parent().parent().removeClass('AjaxTable-loading');
  2723. } else if ('error' == data.type) {
  2724. p5UI__notifyAjaxCallback(data);
  2725. } else {
  2726. p5UI__notifyAjaxCallback(data);
  2727. }
  2728. }).catch(function (e) {
  2729. console.log('loadDataAjax:fetch: ERR:', e);
  2730. });
  2731. };
  2732. publ.getCurrentPage = function() {
  2733. return _state.page;
  2734. };
  2735. publ.popoverCellRemove = function() {
  2736. if (_popoverCellCurrent) {
  2737. _popoverCellCurrent.popover('destroy');
  2738. }
  2739. _popoverCell.data('rowid', -1);
  2740. _popoverCell.data('col', -1);
  2741. _popoverCell.html('');
  2742. };
  2743. return publ;
  2744. }
  2745. $.fn.TableAjax = function(options) {
  2746. options = options || {};
  2747. return this.each(function() {
  2748. options.id = this;
  2749. $(this).data('TableAjax', new TableAjax().init(options));
  2750. });
  2751. };
  2752. $.fn.TableAjaxLoadPage = function(page, pageSize) {
  2753. return this.each(function() {
  2754. var tblAjax = jQuery(this).data('TableAjax');
  2755. var curPage = page || tblAjax.getCurrentPage();
  2756. if (tblAjax) tblAjax.loadPage(curPage, pageSize);
  2757. });
  2758. };
  2759. $.fn.TableAjaxRefresh = function(page, pageSize) {
  2760. return this.each(function() {
  2761. var tblAjax = jQuery(this).data('TableAjax');
  2762. if (tblAjax) tblAjax.refresh();
  2763. });
  2764. };