TableAjax.php.TableAjax.js 109 KB

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