dataTables.scroller.js 41 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410
  1. /*! Scroller 1.4.3
  2. * ©2011-2017 SpryMedia Ltd - datatables.net/license
  3. */
  4. /**
  5. * @summary Scroller
  6. * @description Virtual rendering for DataTables
  7. * @version 1.4.3
  8. * @file dataTables.scroller.js
  9. * @author SpryMedia Ltd (www.sprymedia.co.uk)
  10. * @contact www.sprymedia.co.uk/contact
  11. * @copyright Copyright 2011-2017 SpryMedia Ltd.
  12. *
  13. * This source file is free software, available under the following license:
  14. * MIT license - http://datatables.net/license/mit
  15. *
  16. * This source file is distributed in the hope that it will be useful, but
  17. * WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY
  18. * or FITNESS FOR A PARTICULAR PURPOSE. See the license files for details.
  19. *
  20. * For details please refer to: http://www.datatables.net
  21. */
  22. (function( factory ){
  23. if ( typeof define === 'function' && define.amd ) {
  24. // AMD
  25. define( ['jquery', 'datatables.net'], function ( $ ) {
  26. return factory( $, window, document );
  27. } );
  28. }
  29. else if ( typeof exports === 'object' ) {
  30. // CommonJS
  31. module.exports = function (root, $) {
  32. if ( ! root ) {
  33. root = window;
  34. }
  35. if ( ! $ || ! $.fn.dataTable ) {
  36. $ = require('datatables.net')(root, $).$;
  37. }
  38. return factory( $, root, root.document );
  39. };
  40. }
  41. else {
  42. // Browser
  43. factory( jQuery, window, document );
  44. }
  45. }(function( $, window, document, undefined ) {
  46. 'use strict';
  47. var DataTable = $.fn.dataTable;
  48. /**
  49. * Scroller is a virtual rendering plug-in for DataTables which allows large
  50. * datasets to be drawn on screen every quickly. What the virtual rendering means
  51. * is that only the visible portion of the table (and a bit to either side to make
  52. * the scrolling smooth) is drawn, while the scrolling container gives the
  53. * visual impression that the whole table is visible. This is done by making use
  54. * of the pagination abilities of DataTables and moving the table around in the
  55. * scrolling container DataTables adds to the page. The scrolling container is
  56. * forced to the height it would be for the full table display using an extra
  57. * element.
  58. *
  59. * Note that rows in the table MUST all be the same height. Information in a cell
  60. * which expands on to multiple lines will cause some odd behaviour in the scrolling.
  61. *
  62. * Scroller is initialised by simply including the letter 'S' in the sDom for the
  63. * table you want to have this feature enabled on. Note that the 'S' must come
  64. * AFTER the 't' parameter in `dom`.
  65. *
  66. * Key features include:
  67. * <ul class="limit_length">
  68. * <li>Speed! The aim of Scroller for DataTables is to make rendering large data sets fast</li>
  69. * <li>Full compatibility with deferred rendering in DataTables for maximum speed</li>
  70. * <li>Display millions of rows</li>
  71. * <li>Integration with state saving in DataTables (scrolling position is saved)</li>
  72. * <li>Easy to use</li>
  73. * </ul>
  74. *
  75. * @class
  76. * @constructor
  77. * @global
  78. * @param {object} dt DataTables settings object or API instance
  79. * @param {object} [opts={}] Configuration object for FixedColumns. Options
  80. * are defined by {@link Scroller.defaults}
  81. *
  82. * @requires jQuery 1.7+
  83. * @requires DataTables 1.10.0+
  84. *
  85. * @example
  86. * $(document).ready(function() {
  87. * $('#example').DataTable( {
  88. * "scrollY": "200px",
  89. * "ajax": "media/dataset/large.txt",
  90. * "dom": "frtiS",
  91. * "deferRender": true
  92. * } );
  93. * } );
  94. */
  95. var Scroller = function ( dt, opts ) {
  96. /* Sanity check - you just know it will happen */
  97. if ( ! (this instanceof Scroller) ) {
  98. alert( "Scroller warning: Scroller must be initialised with the 'new' keyword." );
  99. return;
  100. }
  101. if ( opts === undefined ) {
  102. opts = {};
  103. }
  104. /**
  105. * Settings object which contains customisable information for the Scroller instance
  106. * @namespace
  107. * @private
  108. * @extends Scroller.defaults
  109. */
  110. this.s = {
  111. /**
  112. * DataTables settings object
  113. * @type object
  114. * @default Passed in as first parameter to constructor
  115. */
  116. "dt": $.fn.dataTable.Api( dt ).settings()[0],
  117. /**
  118. * Pixel location of the top of the drawn table in the viewport
  119. * @type int
  120. * @default 0
  121. */
  122. "tableTop": 0,
  123. /**
  124. * Pixel location of the bottom of the drawn table in the viewport
  125. * @type int
  126. * @default 0
  127. */
  128. "tableBottom": 0,
  129. /**
  130. * Pixel location of the boundary for when the next data set should be loaded and drawn
  131. * when scrolling up the way.
  132. * @type int
  133. * @default 0
  134. * @private
  135. */
  136. "redrawTop": 0,
  137. /**
  138. * Pixel location of the boundary for when the next data set should be loaded and drawn
  139. * when scrolling down the way. Note that this is actually calculated as the offset from
  140. * the top.
  141. * @type int
  142. * @default 0
  143. * @private
  144. */
  145. "redrawBottom": 0,
  146. /**
  147. * Auto row height or not indicator
  148. * @type bool
  149. * @default 0
  150. */
  151. "autoHeight": true,
  152. /**
  153. * Number of rows calculated as visible in the visible viewport
  154. * @type int
  155. * @default 0
  156. */
  157. "viewportRows": 0,
  158. /**
  159. * setTimeout reference for state saving, used when state saving is enabled in the DataTable
  160. * and when the user scrolls the viewport in order to stop the cookie set taking too much
  161. * CPU!
  162. * @type int
  163. * @default 0
  164. */
  165. "stateTO": null,
  166. /**
  167. * setTimeout reference for the redraw, used when server-side processing is enabled in the
  168. * DataTables in order to prevent DoSing the server
  169. * @type int
  170. * @default null
  171. */
  172. "drawTO": null,
  173. heights: {
  174. jump: null,
  175. page: null,
  176. virtual: null,
  177. scroll: null,
  178. /**
  179. * Height of rows in the table
  180. * @type int
  181. * @default 0
  182. */
  183. row: null,
  184. /**
  185. * Pixel height of the viewport
  186. * @type int
  187. * @default 0
  188. */
  189. viewport: null
  190. },
  191. topRowFloat: 0,
  192. scrollDrawDiff: null,
  193. loaderVisible: false,
  194. forceReposition: false
  195. };
  196. // @todo The defaults should extend a `c` property and the internal settings
  197. // only held in the `s` property. At the moment they are mixed
  198. this.s = $.extend( this.s, Scroller.oDefaults, opts );
  199. // Workaround for row height being read from height object (see above comment)
  200. this.s.heights.row = this.s.rowHeight;
  201. /**
  202. * DOM elements used by the class instance
  203. * @private
  204. * @namespace
  205. *
  206. */
  207. this.dom = {
  208. "force": document.createElement('div'),
  209. "scroller": null,
  210. "table": null,
  211. "loader": null
  212. };
  213. // Attach the instance to the DataTables instance so it can be accessed in
  214. // future. Don't initialise Scroller twice on the same table
  215. if ( this.s.dt.oScroller ) {
  216. return;
  217. }
  218. this.s.dt.oScroller = this;
  219. /* Let's do it */
  220. this._fnConstruct();
  221. };
  222. $.extend( Scroller.prototype, {
  223. /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
  224. * Public methods
  225. * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
  226. /**
  227. * Calculate the pixel position from the top of the scrolling container for
  228. * a given row
  229. * @param {int} iRow Row number to calculate the position of
  230. * @returns {int} Pixels
  231. * @example
  232. * $(document).ready(function() {
  233. * $('#example').dataTable( {
  234. * "sScrollY": "200px",
  235. * "sAjaxSource": "media/dataset/large.txt",
  236. * "sDom": "frtiS",
  237. * "bDeferRender": true,
  238. * "fnInitComplete": function (o) {
  239. * // Find where row 25 is
  240. * alert( o.oScroller.fnRowToPixels( 25 ) );
  241. * }
  242. * } );
  243. * } );
  244. */
  245. "fnRowToPixels": function ( rowIdx, intParse, virtual )
  246. {
  247. var pixels;
  248. if ( virtual ) {
  249. pixels = this._domain( 'virtualToPhysical', rowIdx * this.s.heights.row );
  250. }
  251. else {
  252. var diff = rowIdx - this.s.baseRowTop;
  253. pixels = this.s.baseScrollTop + (diff * this.s.heights.row);
  254. }
  255. return intParse || intParse === undefined ?
  256. parseInt( pixels, 10 ) :
  257. pixels;
  258. },
  259. /**
  260. * Calculate the row number that will be found at the given pixel position
  261. * (y-scroll).
  262. *
  263. * Please note that when the height of the full table exceeds 1 million
  264. * pixels, Scroller switches into a non-linear mode for the scrollbar to fit
  265. * all of the records into a finite area, but this function returns a linear
  266. * value (relative to the last non-linear positioning).
  267. * @param {int} iPixels Offset from top to calculate the row number of
  268. * @param {int} [intParse=true] If an integer value should be returned
  269. * @param {int} [virtual=false] Perform the calculations in the virtual domain
  270. * @returns {int} Row index
  271. * @example
  272. * $(document).ready(function() {
  273. * $('#example').dataTable( {
  274. * "sScrollY": "200px",
  275. * "sAjaxSource": "media/dataset/large.txt",
  276. * "sDom": "frtiS",
  277. * "bDeferRender": true,
  278. * "fnInitComplete": function (o) {
  279. * // Find what row number is at 500px
  280. * alert( o.oScroller.fnPixelsToRow( 500 ) );
  281. * }
  282. * } );
  283. * } );
  284. */
  285. "fnPixelsToRow": function ( pixels, intParse, virtual )
  286. {
  287. var diff = pixels - this.s.baseScrollTop;
  288. var row = virtual ?
  289. this._domain( 'physicalToVirtual', pixels ) / this.s.heights.row :
  290. ( diff / this.s.heights.row ) + this.s.baseRowTop;
  291. return intParse || intParse === undefined ?
  292. parseInt( row, 10 ) :
  293. row;
  294. },
  295. /**
  296. * Calculate the row number that will be found at the given pixel position (y-scroll)
  297. * @param {int} iRow Row index to scroll to
  298. * @param {bool} [bAnimate=true] Animate the transition or not
  299. * @returns {void}
  300. * @example
  301. * $(document).ready(function() {
  302. * $('#example').dataTable( {
  303. * "sScrollY": "200px",
  304. * "sAjaxSource": "media/dataset/large.txt",
  305. * "sDom": "frtiS",
  306. * "bDeferRender": true,
  307. * "fnInitComplete": function (o) {
  308. * // Immediately scroll to row 1000
  309. * o.oScroller.fnScrollToRow( 1000 );
  310. * }
  311. * } );
  312. *
  313. * // Sometime later on use the following to scroll to row 500...
  314. * var oSettings = $('#example').dataTable().fnSettings();
  315. * oSettings.oScroller.fnScrollToRow( 500 );
  316. * } );
  317. */
  318. "fnScrollToRow": function ( iRow, bAnimate )
  319. {
  320. var that = this;
  321. var ani = false;
  322. var px = this.fnRowToPixels( iRow );
  323. // We need to know if the table will redraw or not before doing the
  324. // scroll. If it will not redraw, then we need to use the currently
  325. // displayed table, and scroll with the physical pixels. Otherwise, we
  326. // need to calculate the table's new position from the virtual
  327. // transform.
  328. var preRows = ((this.s.displayBuffer-1)/2) * this.s.viewportRows;
  329. var drawRow = iRow - preRows;
  330. if ( drawRow < 0 ) {
  331. drawRow = 0;
  332. }
  333. if ( (px > this.s.redrawBottom || px < this.s.redrawTop) && this.s.dt._iDisplayStart !== drawRow ) {
  334. ani = true;
  335. px = this.fnRowToPixels( iRow, false, true );
  336. // If we need records outside the current draw region, but the new
  337. // scrolling position is inside that (due to the non-linear nature
  338. // for larger numbers of records), we need to force position update.
  339. if ( this.s.redrawTop < px && px < this.s.redrawBottom ) {
  340. this.s.forceReposition = true;
  341. bAnimate = false;
  342. }
  343. }
  344. if ( typeof bAnimate == 'undefined' || bAnimate )
  345. {
  346. this.s.ani = ani;
  347. $(this.dom.scroller).animate( {
  348. "scrollTop": px
  349. }, function () {
  350. // This needs to happen after the animation has completed and
  351. // the final scroll event fired
  352. setTimeout( function () {
  353. that.s.ani = false;
  354. }, 25 );
  355. } );
  356. }
  357. else
  358. {
  359. $(this.dom.scroller).scrollTop( px );
  360. }
  361. },
  362. /**
  363. * Calculate and store information about how many rows are to be displayed
  364. * in the scrolling viewport, based on current dimensions in the browser's
  365. * rendering. This can be particularly useful if the table is initially
  366. * drawn in a hidden element - for example in a tab.
  367. * @param {bool} [bRedraw=true] Redraw the table automatically after the recalculation, with
  368. * the new dimensions forming the basis for the draw.
  369. * @returns {void}
  370. * @example
  371. * $(document).ready(function() {
  372. * // Make the example container hidden to throw off the browser's sizing
  373. * document.getElementById('container').style.display = "none";
  374. * var oTable = $('#example').dataTable( {
  375. * "sScrollY": "200px",
  376. * "sAjaxSource": "media/dataset/large.txt",
  377. * "sDom": "frtiS",
  378. * "bDeferRender": true,
  379. * "fnInitComplete": function (o) {
  380. * // Immediately scroll to row 1000
  381. * o.oScroller.fnScrollToRow( 1000 );
  382. * }
  383. * } );
  384. *
  385. * setTimeout( function () {
  386. * // Make the example container visible and recalculate the scroller sizes
  387. * document.getElementById('container').style.display = "block";
  388. * oTable.fnSettings().oScroller.fnMeasure();
  389. * }, 3000 );
  390. */
  391. "fnMeasure": function ( bRedraw )
  392. {
  393. if ( this.s.autoHeight )
  394. {
  395. this._fnCalcRowHeight();
  396. }
  397. var heights = this.s.heights;
  398. if ( heights.row ) {
  399. heights.viewport = $.contains(document, this.dom.scroller) ?
  400. $(this.dom.scroller).height() :
  401. this._parseHeight($(this.dom.scroller).css('height'));
  402. // If collapsed (no height) use the max-height parameter
  403. if ( ! heights.viewport ) {
  404. heights.viewport = this._parseHeight($(this.dom.scroller).css('max-height'));
  405. }
  406. this.s.viewportRows = parseInt( heights.viewport / heights.row, 10 )+1;
  407. this.s.dt._iDisplayLength = this.s.viewportRows * this.s.displayBuffer;
  408. }
  409. if ( bRedraw === undefined || bRedraw )
  410. {
  411. this.s.dt.oInstance.fnDraw( false );
  412. }
  413. },
  414. /**
  415. * Get information about current displayed record range. This corresponds to
  416. * the information usually displayed in the "Info" block of the table.
  417. *
  418. * @returns {object} info as an object:
  419. * {
  420. * start: {int}, // the 0-indexed record at the top of the viewport
  421. * end: {int}, // the 0-indexed record at the bottom of the viewport
  422. * }
  423. */
  424. "fnPageInfo": function()
  425. {
  426. var
  427. dt = this.s.dt,
  428. iScrollTop = this.dom.scroller.scrollTop,
  429. iTotal = dt.fnRecordsDisplay(),
  430. iPossibleEnd = Math.ceil(this.fnPixelsToRow(iScrollTop + this.s.heights.viewport, false, this.s.ani));
  431. return {
  432. start: Math.floor(this.fnPixelsToRow(iScrollTop, false, this.s.ani)),
  433. end: iTotal < iPossibleEnd ? iTotal-1 : iPossibleEnd-1
  434. };
  435. },
  436. /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
  437. * Private methods (they are of course public in JS, but recommended as private)
  438. * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
  439. /**
  440. * Initialisation for Scroller
  441. * @returns {void}
  442. * @private
  443. */
  444. "_fnConstruct": function ()
  445. {
  446. var that = this;
  447. /* Sanity check */
  448. if ( !this.s.dt.oFeatures.bPaginate ) {
  449. this.s.dt.oApi._fnLog( this.s.dt, 0, 'Pagination must be enabled for Scroller' );
  450. return;
  451. }
  452. /* Insert a div element that we can use to force the DT scrolling container to
  453. * the height that would be required if the whole table was being displayed
  454. */
  455. this.dom.force.style.position = "relative";
  456. this.dom.force.style.top = "0px";
  457. this.dom.force.style.left = "0px";
  458. this.dom.force.style.width = "1px";
  459. this.dom.scroller = $('div.'+this.s.dt.oClasses.sScrollBody, this.s.dt.nTableWrapper)[0];
  460. this.dom.scroller.appendChild( this.dom.force );
  461. this.dom.scroller.style.position = "relative";
  462. this.dom.table = $('>table', this.dom.scroller)[0];
  463. this.dom.table.style.position = "absolute";
  464. this.dom.table.style.top = "0px";
  465. this.dom.table.style.left = "0px";
  466. // Add class to 'announce' that we are a Scroller table
  467. $(this.s.dt.nTableWrapper).addClass('DTS');
  468. // Add a 'loading' indicator
  469. if ( this.s.loadingIndicator )
  470. {
  471. this.dom.loader = $('<div class="dataTables_processing DTS_Loading">'+this.s.dt.oLanguage.sLoadingRecords+'</div>')
  472. .css('display', 'none');
  473. $(this.dom.scroller.parentNode)
  474. .css('position', 'relative')
  475. .append( this.dom.loader );
  476. }
  477. /* Initial size calculations */
  478. if ( this.s.heights.row && this.s.heights.row != 'auto' )
  479. {
  480. this.s.autoHeight = false;
  481. }
  482. this.fnMeasure( false );
  483. /* Scrolling callback to see if a page change is needed - use a throttled
  484. * function for the save save callback so we aren't hitting it on every
  485. * scroll
  486. */
  487. this.s.ingnoreScroll = true;
  488. this.s.stateSaveThrottle = this.s.dt.oApi._fnThrottle( function () {
  489. that.s.dt.oApi._fnSaveState( that.s.dt );
  490. }, 500 );
  491. $(this.dom.scroller).on( 'scroll.DTS', function (e) {
  492. that._fnScroll.call( that );
  493. } );
  494. /* In iOS we catch the touchstart event in case the user tries to scroll
  495. * while the display is already scrolling
  496. */
  497. $(this.dom.scroller).on('touchstart.DTS', function () {
  498. that._fnScroll.call( that );
  499. } );
  500. /* Update the scroller when the DataTable is redrawn */
  501. this.s.dt.aoDrawCallback.push( {
  502. "fn": function () {
  503. if ( that.s.dt.bInitialised ) {
  504. that._fnDrawCallback.call( that );
  505. }
  506. },
  507. "sName": "Scroller"
  508. } );
  509. /* On resize, update the information element, since the number of rows shown might change */
  510. $(window).on( 'resize.DTS', function () {
  511. that.fnMeasure( false );
  512. that._fnInfo();
  513. } );
  514. /* Add a state saving parameter to the DT state saving so we can restore the exact
  515. * position of the scrolling
  516. */
  517. var initialStateSave = true;
  518. this.s.dt.oApi._fnCallbackReg( this.s.dt, 'aoStateSaveParams', function (oS, oData) {
  519. /* Set iScroller to saved scroll position on initialization.
  520. */
  521. if(initialStateSave && that.s.dt.oLoadedState){
  522. oData.iScroller = that.s.dt.oLoadedState.iScroller;
  523. oData.iScrollerTopRow = that.s.dt.oLoadedState.iScrollerTopRow;
  524. initialStateSave = false;
  525. } else {
  526. oData.iScroller = that.dom.scroller.scrollTop;
  527. oData.iScrollerTopRow = that.s.topRowFloat;
  528. }
  529. }, "Scroller_State" );
  530. if ( this.s.dt.oLoadedState ) {
  531. this.s.topRowFloat = this.s.dt.oLoadedState.iScrollerTopRow || 0;
  532. }
  533. // Measure immediately. Scroller will have been added using preInit, so
  534. // we can reliably do this here. We could potentially also measure on
  535. // init complete, which would be useful for cases where the data is Ajax
  536. // loaded and longer than a single line.
  537. $(this.s.dt.nTable).one( 'init.dt', function () {
  538. that.fnMeasure();
  539. } );
  540. /* Destructor */
  541. this.s.dt.aoDestroyCallback.push( {
  542. "sName": "Scroller",
  543. "fn": function () {
  544. $(window).off( 'resize.DTS' );
  545. $(that.dom.scroller).off('touchstart.DTS scroll.DTS');
  546. $(that.s.dt.nTableWrapper).removeClass('DTS');
  547. $('div.DTS_Loading', that.dom.scroller.parentNode).remove();
  548. $(that.s.dt.nTable).off( 'init.dt' );
  549. that.dom.table.style.position = "";
  550. that.dom.table.style.top = "";
  551. that.dom.table.style.left = "";
  552. }
  553. } );
  554. },
  555. /**
  556. * Scrolling function - fired whenever the scrolling position is changed.
  557. * This method needs to use the stored values to see if the table should be
  558. * redrawn as we are moving towards the end of the information that is
  559. * currently drawn or not. If needed, then it will redraw the table based on
  560. * the new position.
  561. * @returns {void}
  562. * @private
  563. */
  564. "_fnScroll": function ()
  565. {
  566. var
  567. that = this,
  568. heights = this.s.heights,
  569. iScrollTop = this.dom.scroller.scrollTop,
  570. iTopRow;
  571. if ( this.s.skip ) {
  572. return;
  573. }
  574. if ( this.s.ingnoreScroll ) {
  575. return;
  576. }
  577. /* If the table has been sorted or filtered, then we use the redraw that
  578. * DataTables as done, rather than performing our own
  579. */
  580. if ( this.s.dt.bFiltered || this.s.dt.bSorted ) {
  581. this.s.lastScrollTop = 0;
  582. return;
  583. }
  584. /* Update the table's information display for what is now in the viewport */
  585. this._fnInfo();
  586. /* We don't want to state save on every scroll event - that's heavy
  587. * handed, so use a timeout to update the state saving only when the
  588. * scrolling has finished
  589. */
  590. clearTimeout( this.s.stateTO );
  591. this.s.stateTO = setTimeout( function () {
  592. that.s.dt.oApi._fnSaveState( that.s.dt );
  593. }, 250 );
  594. /* Check if the scroll point is outside the trigger boundary which would required
  595. * a DataTables redraw
  596. */
  597. if ( this.s.forceReposition || iScrollTop < this.s.redrawTop || iScrollTop > this.s.redrawBottom ) {
  598. var preRows = Math.ceil( ((this.s.displayBuffer-1)/2) * this.s.viewportRows );
  599. if ( Math.abs( iScrollTop - this.s.lastScrollTop ) > heights.viewport || this.s.ani || this.s.forceReposition ) {
  600. iTopRow = parseInt(this._domain( 'physicalToVirtual', iScrollTop ) / heights.row, 10) - preRows;
  601. this.s.topRowFloat = this._domain( 'physicalToVirtual', iScrollTop ) / heights.row;
  602. }
  603. else {
  604. iTopRow = this.fnPixelsToRow( iScrollTop ) - preRows;
  605. this.s.topRowFloat = this.fnPixelsToRow( iScrollTop, false );
  606. }
  607. this.s.forceReposition = false;
  608. if ( iTopRow <= 0 ) {
  609. /* At the start of the table */
  610. iTopRow = 0;
  611. }
  612. else if ( iTopRow + this.s.dt._iDisplayLength > this.s.dt.fnRecordsDisplay() ) {
  613. /* At the end of the table */
  614. iTopRow = this.s.dt.fnRecordsDisplay() - this.s.dt._iDisplayLength;
  615. if ( iTopRow < 0 ) {
  616. iTopRow = 0;
  617. }
  618. }
  619. else if ( iTopRow % 2 !== 0 ) {
  620. // For the row-striping classes (odd/even) we want only to start
  621. // on evens otherwise the stripes will change between draws and
  622. // look rubbish
  623. iTopRow++;
  624. }
  625. if ( iTopRow != this.s.dt._iDisplayStart ) {
  626. /* Cache the new table position for quick lookups */
  627. this.s.tableTop = $(this.s.dt.nTable).offset().top;
  628. this.s.tableBottom = $(this.s.dt.nTable).height() + this.s.tableTop;
  629. var draw = function () {
  630. if ( that.s.scrollDrawReq === null ) {
  631. that.s.scrollDrawReq = iScrollTop;
  632. }
  633. that.s.dt._iDisplayStart = iTopRow;
  634. that.s.dt.oApi._fnDraw( that.s.dt );
  635. };
  636. /* Do the DataTables redraw based on the calculated start point - note that when
  637. * using server-side processing we introduce a small delay to not DoS the server...
  638. */
  639. if ( this.s.dt.oFeatures.bServerSide ) {
  640. clearTimeout( this.s.drawTO );
  641. this.s.drawTO = setTimeout( draw, this.s.serverWait );
  642. }
  643. else {
  644. draw();
  645. }
  646. if ( this.dom.loader && ! this.s.loaderVisible ) {
  647. this.dom.loader.css( 'display', 'block' );
  648. this.s.loaderVisible = true;
  649. }
  650. }
  651. }
  652. else {
  653. this.s.topRowFloat = this._domain( 'physicalToVirtual', iScrollTop ) / heights.row;
  654. }
  655. this.s.lastScrollTop = iScrollTop;
  656. this.s.stateSaveThrottle();
  657. },
  658. /**
  659. * Convert from one domain to another. The physical domain is the actual
  660. * pixel count on the screen, while the virtual is if we had browsers which
  661. * had scrolling containers of infinite height (i.e. the absolute value)
  662. *
  663. * @param {string} dir Domain transform direction, `virtualToPhysical` or
  664. * `physicalToVirtual`
  665. * @returns {number} Calculated transform
  666. * @private
  667. */
  668. _domain: function ( dir, val )
  669. {
  670. var heights = this.s.heights;
  671. var coeff;
  672. // If the virtual and physical height match, then we use a linear
  673. // transform between the two, allowing the scrollbar to be linear
  674. if ( heights.virtual === heights.scroll ) {
  675. return val;
  676. }
  677. // Otherwise, we want a non-linear scrollbar to take account of the
  678. // redrawing regions at the start and end of the table, otherwise these
  679. // can stutter badly - on large tables 30px (for example) scroll might
  680. // be hundreds of rows, so the table would be redrawing every few px at
  681. // the start and end. Use a simple quadratic to stop this. It does mean
  682. // the scrollbar is non-linear, but with such massive data sets, the
  683. // scrollbar is going to be a best guess anyway
  684. var xMax = (heights.scroll - heights.viewport) / 2;
  685. var yMax = (heights.virtual - heights.viewport) / 2;
  686. coeff = yMax / ( xMax * xMax );
  687. if ( dir === 'virtualToPhysical' ) {
  688. if ( val < yMax ) {
  689. return Math.pow(val / coeff, 0.5);
  690. }
  691. else {
  692. val = (yMax*2) - val;
  693. return val < 0 ?
  694. heights.scroll :
  695. (xMax*2) - Math.pow(val / coeff, 0.5);
  696. }
  697. }
  698. else if ( dir === 'physicalToVirtual' ) {
  699. if ( val < xMax ) {
  700. return val * val * coeff;
  701. }
  702. else {
  703. val = (xMax*2) - val;
  704. return val < 0 ?
  705. heights.virtual :
  706. (yMax*2) - (val * val * coeff);
  707. }
  708. }
  709. },
  710. /**
  711. * Parse CSS height property string as number
  712. *
  713. * An attempt is made to parse the string as a number. Currently supported units are 'px',
  714. * 'vh', and 'rem'. 'em' is partially supported; it works as long as the parent element's
  715. * font size matches the body element. Zero is returned for unrecognized strings.
  716. * @param {string} cssHeight CSS height property string
  717. * @returns {number} height
  718. * @private
  719. */
  720. _parseHeight: function(cssHeight) {
  721. var height;
  722. var matches = /^([+-]?(?:\d+(?:\.\d+)?|\.\d+))(px|em|rem|vh)$/.exec(cssHeight);
  723. if (matches === null) {
  724. return 0;
  725. }
  726. var value = parseFloat(matches[1]);
  727. var unit = matches[2];
  728. if ( unit === 'px' ) {
  729. height = value;
  730. }
  731. else if ( unit === 'vh' ) {
  732. height = ( value / 100 ) * $(window).height();
  733. }
  734. else if ( unit === 'rem' ) {
  735. height = value * parseFloat($(':root').css('font-size'));
  736. }
  737. else if ( unit === 'em' ) {
  738. height = value * parseFloat($('body').css('font-size'));
  739. }
  740. return height ?
  741. height :
  742. 0;
  743. },
  744. /**
  745. * Draw callback function which is fired when the DataTable is redrawn. The main function of
  746. * this method is to position the drawn table correctly the scrolling container for the rows
  747. * that is displays as a result of the scrolling position.
  748. * @returns {void}
  749. * @private
  750. */
  751. "_fnDrawCallback": function ()
  752. {
  753. var
  754. that = this,
  755. heights = this.s.heights,
  756. iScrollTop = this.dom.scroller.scrollTop,
  757. iActualScrollTop = iScrollTop,
  758. iScrollBottom = iScrollTop + heights.viewport,
  759. iTableHeight = $(this.s.dt.nTable).height(),
  760. displayStart = this.s.dt._iDisplayStart,
  761. displayLen = this.s.dt._iDisplayLength,
  762. displayEnd = this.s.dt.fnRecordsDisplay();
  763. // Disable the scroll event listener while we are updating the DOM
  764. this.s.skip = true;
  765. // Resize the scroll forcing element
  766. this._fnScrollForce();
  767. // Reposition the scrolling for the updated virtual position if needed
  768. if ( displayStart === 0 ) {
  769. // Linear calculation at the top of the table
  770. iScrollTop = this.s.topRowFloat * heights.row;
  771. }
  772. else if ( displayStart + displayLen >= displayEnd ) {
  773. // Linear calculation that the bottom as well
  774. iScrollTop = heights.scroll - ((displayEnd - this.s.topRowFloat) * heights.row);
  775. }
  776. else {
  777. // Domain scaled in the middle
  778. iScrollTop = this._domain( 'virtualToPhysical', this.s.topRowFloat * heights.row );
  779. }
  780. this.dom.scroller.scrollTop = iScrollTop;
  781. // Store positional information so positional calculations can be based
  782. // upon the current table draw position
  783. this.s.baseScrollTop = iScrollTop;
  784. this.s.baseRowTop = this.s.topRowFloat;
  785. // Position the table in the virtual scroller
  786. var tableTop = iScrollTop - ((this.s.topRowFloat - displayStart) * heights.row);
  787. if ( displayStart === 0 ) {
  788. tableTop = 0;
  789. }
  790. else if ( displayStart + displayLen >= displayEnd ) {
  791. tableTop = heights.scroll - iTableHeight;
  792. }
  793. this.dom.table.style.top = tableTop+'px';
  794. /* Cache some information for the scroller */
  795. this.s.tableTop = tableTop;
  796. this.s.tableBottom = iTableHeight + this.s.tableTop;
  797. // Calculate the boundaries for where a redraw will be triggered by the
  798. // scroll event listener
  799. var boundaryPx = (iScrollTop - this.s.tableTop) * this.s.boundaryScale;
  800. this.s.redrawTop = iScrollTop - boundaryPx;
  801. this.s.redrawBottom = iScrollTop + boundaryPx > heights.scroll - heights.viewport - heights.row ?
  802. heights.scroll - heights.viewport - heights.row :
  803. iScrollTop + boundaryPx;
  804. this.s.skip = false;
  805. // Restore the scrolling position that was saved by DataTable's state
  806. // saving Note that this is done on the second draw when data is Ajax
  807. // sourced, and the first draw when DOM soured
  808. if ( this.s.dt.oFeatures.bStateSave && this.s.dt.oLoadedState !== null &&
  809. typeof this.s.dt.oLoadedState.iScroller != 'undefined' )
  810. {
  811. // A quirk of DataTables is that the draw callback will occur on an
  812. // empty set if Ajax sourced, but not if server-side processing.
  813. var ajaxSourced = (this.s.dt.sAjaxSource || that.s.dt.ajax) && ! this.s.dt.oFeatures.bServerSide ?
  814. true :
  815. false;
  816. if ( ( ajaxSourced && this.s.dt.iDraw == 2) ||
  817. (!ajaxSourced && this.s.dt.iDraw == 1) )
  818. {
  819. setTimeout( function () {
  820. $(that.dom.scroller).scrollTop( that.s.dt.oLoadedState.iScroller );
  821. that.s.redrawTop = that.s.dt.oLoadedState.iScroller - (heights.viewport/2);
  822. // In order to prevent layout thrashing we need another
  823. // small delay
  824. setTimeout( function () {
  825. that.s.ingnoreScroll = false;
  826. }, 0 );
  827. }, 0 );
  828. }
  829. }
  830. else {
  831. that.s.ingnoreScroll = false;
  832. }
  833. // Because of the order of the DT callbacks, the info update will
  834. // take precedence over the one we want here. So a 'thread' break is
  835. // needed. Only add the thread break if bInfo is set
  836. if ( this.s.dt.oFeatures.bInfo ) {
  837. setTimeout( function () {
  838. that._fnInfo.call( that );
  839. }, 0 );
  840. }
  841. // Hide the loading indicator
  842. if ( this.dom.loader && this.s.loaderVisible ) {
  843. this.dom.loader.css( 'display', 'none' );
  844. this.s.loaderVisible = false;
  845. }
  846. },
  847. /**
  848. * Force the scrolling container to have height beyond that of just the
  849. * table that has been drawn so the user can scroll the whole data set.
  850. *
  851. * Note that if the calculated required scrolling height exceeds a maximum
  852. * value (1 million pixels - hard-coded) the forcing element will be set
  853. * only to that maximum value and virtual / physical domain transforms will
  854. * be used to allow Scroller to display tables of any number of records.
  855. * @returns {void}
  856. * @private
  857. */
  858. _fnScrollForce: function ()
  859. {
  860. var heights = this.s.heights;
  861. var max = 1000000;
  862. heights.virtual = heights.row * this.s.dt.fnRecordsDisplay();
  863. heights.scroll = heights.virtual;
  864. if ( heights.scroll > max ) {
  865. heights.scroll = max;
  866. }
  867. // Minimum height so there is always a row visible (the 'no rows found'
  868. // if reduced to zero filtering)
  869. this.dom.force.style.height = heights.scroll > this.s.heights.row ?
  870. heights.scroll+'px' :
  871. this.s.heights.row+'px';
  872. },
  873. /**
  874. * Automatic calculation of table row height. This is just a little tricky here as using
  875. * initialisation DataTables has tale the table out of the document, so we need to create
  876. * a new table and insert it into the document, calculate the row height and then whip the
  877. * table out.
  878. * @returns {void}
  879. * @private
  880. */
  881. "_fnCalcRowHeight": function ()
  882. {
  883. var dt = this.s.dt;
  884. var origTable = dt.nTable;
  885. var nTable = origTable.cloneNode( false );
  886. var tbody = $('<tbody/>').appendTo( nTable );
  887. var container = $(
  888. '<div class="'+dt.oClasses.sWrapper+' DTS">'+
  889. '<div class="'+dt.oClasses.sScrollWrapper+'">'+
  890. '<div class="'+dt.oClasses.sScrollBody+'"></div>'+
  891. '</div>'+
  892. '</div>'
  893. );
  894. // Want 3 rows in the sizing table so :first-child and :last-child
  895. // CSS styles don't come into play - take the size of the middle row
  896. $('tbody tr:lt(4)', origTable).clone().appendTo( tbody );
  897. while( $('tr', tbody).length < 3 ) {
  898. tbody.append( '<tr><td>&nbsp;</td></tr>' );
  899. }
  900. $('div.'+dt.oClasses.sScrollBody, container).append( nTable );
  901. // If initialised using `dom`, use the holding element as the insert point
  902. var insertEl = this.s.dt.nHolding || origTable.parentNode;
  903. if ( ! $(insertEl).is(':visible') ) {
  904. insertEl = 'body';
  905. }
  906. container.appendTo( insertEl );
  907. this.s.heights.row = $('tr', tbody).eq(1).outerHeight();
  908. container.remove();
  909. },
  910. /**
  911. * Update any information elements that are controlled by the DataTable based on the scrolling
  912. * viewport and what rows are visible in it. This function basically acts in the same way as
  913. * _fnUpdateInfo in DataTables, and effectively replaces that function.
  914. * @returns {void}
  915. * @private
  916. */
  917. "_fnInfo": function ()
  918. {
  919. if ( !this.s.dt.oFeatures.bInfo )
  920. {
  921. return;
  922. }
  923. var
  924. dt = this.s.dt,
  925. language = dt.oLanguage,
  926. iScrollTop = this.dom.scroller.scrollTop,
  927. iStart = Math.floor( this.fnPixelsToRow(iScrollTop, false, this.s.ani)+1 ),
  928. iMax = dt.fnRecordsTotal(),
  929. iTotal = dt.fnRecordsDisplay(),
  930. iPossibleEnd = Math.ceil( this.fnPixelsToRow(iScrollTop+this.s.heights.viewport, false, this.s.ani) ),
  931. iEnd = iTotal < iPossibleEnd ? iTotal : iPossibleEnd,
  932. sStart = dt.fnFormatNumber( iStart ),
  933. sEnd = dt.fnFormatNumber( iEnd ),
  934. sMax = dt.fnFormatNumber( iMax ),
  935. sTotal = dt.fnFormatNumber( iTotal ),
  936. sOut;
  937. if ( dt.fnRecordsDisplay() === 0 &&
  938. dt.fnRecordsDisplay() == dt.fnRecordsTotal() )
  939. {
  940. /* Empty record set */
  941. sOut = language.sInfoEmpty+ language.sInfoPostFix;
  942. }
  943. else if ( dt.fnRecordsDisplay() === 0 )
  944. {
  945. /* Empty record set after filtering */
  946. sOut = language.sInfoEmpty +' '+
  947. language.sInfoFiltered.replace('_MAX_', sMax)+
  948. language.sInfoPostFix;
  949. }
  950. else if ( dt.fnRecordsDisplay() == dt.fnRecordsTotal() )
  951. {
  952. /* Normal record set */
  953. sOut = language.sInfo.
  954. replace('_START_', sStart).
  955. replace('_END_', sEnd).
  956. replace('_MAX_', sMax).
  957. replace('_TOTAL_', sTotal)+
  958. language.sInfoPostFix;
  959. }
  960. else
  961. {
  962. /* Record set after filtering */
  963. sOut = language.sInfo.
  964. replace('_START_', sStart).
  965. replace('_END_', sEnd).
  966. replace('_MAX_', sMax).
  967. replace('_TOTAL_', sTotal) +' '+
  968. language.sInfoFiltered.replace(
  969. '_MAX_',
  970. dt.fnFormatNumber(dt.fnRecordsTotal())
  971. )+
  972. language.sInfoPostFix;
  973. }
  974. var callback = language.fnInfoCallback;
  975. if ( callback ) {
  976. sOut = callback.call( dt.oInstance,
  977. dt, iStart, iEnd, iMax, iTotal, sOut
  978. );
  979. }
  980. var n = dt.aanFeatures.i;
  981. if ( typeof n != 'undefined' )
  982. {
  983. for ( var i=0, iLen=n.length ; i<iLen ; i++ )
  984. {
  985. $(n[i]).html( sOut );
  986. }
  987. }
  988. // DT doesn't actually (yet) trigger this event, but it will in future
  989. $(dt.nTable).triggerHandler( 'info.dt' );
  990. }
  991. } );
  992. /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
  993. * Statics
  994. * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
  995. /**
  996. * Scroller default settings for initialisation
  997. * @namespace
  998. * @name Scroller.defaults
  999. * @static
  1000. */
  1001. Scroller.defaults = /** @lends Scroller.defaults */{
  1002. /**
  1003. * Indicate if Scroller show show trace information on the console or not. This can be
  1004. * useful when debugging Scroller or if just curious as to what it is doing, but should
  1005. * be turned off for production.
  1006. * @type bool
  1007. * @default false
  1008. * @static
  1009. * @example
  1010. * var oTable = $('#example').dataTable( {
  1011. * "sScrollY": "200px",
  1012. * "sDom": "frtiS",
  1013. * "bDeferRender": true,
  1014. * "oScroller": {
  1015. * "trace": true
  1016. * }
  1017. * } );
  1018. */
  1019. "trace": false,
  1020. /**
  1021. * Scroller will attempt to automatically calculate the height of rows for it's internal
  1022. * calculations. However the height that is used can be overridden using this parameter.
  1023. * @type int|string
  1024. * @default auto
  1025. * @static
  1026. * @example
  1027. * var oTable = $('#example').dataTable( {
  1028. * "sScrollY": "200px",
  1029. * "sDom": "frtiS",
  1030. * "bDeferRender": true,
  1031. * "oScroller": {
  1032. * "rowHeight": 30
  1033. * }
  1034. * } );
  1035. */
  1036. "rowHeight": "auto",
  1037. /**
  1038. * When using server-side processing, Scroller will wait a small amount of time to allow
  1039. * the scrolling to finish before requesting more data from the server. This prevents
  1040. * you from DoSing your own server! The wait time can be configured by this parameter.
  1041. * @type int
  1042. * @default 200
  1043. * @static
  1044. * @example
  1045. * var oTable = $('#example').dataTable( {
  1046. * "sScrollY": "200px",
  1047. * "sDom": "frtiS",
  1048. * "bDeferRender": true,
  1049. * "oScroller": {
  1050. * "serverWait": 100
  1051. * }
  1052. * } );
  1053. */
  1054. "serverWait": 200,
  1055. /**
  1056. * The display buffer is what Scroller uses to calculate how many rows it should pre-fetch
  1057. * for scrolling. Scroller automatically adjusts DataTables' display length to pre-fetch
  1058. * rows that will be shown in "near scrolling" (i.e. just beyond the current display area).
  1059. * The value is based upon the number of rows that can be displayed in the viewport (i.e.
  1060. * a value of 1), and will apply the display range to records before before and after the
  1061. * current viewport - i.e. a factor of 3 will allow Scroller to pre-fetch 1 viewport's worth
  1062. * of rows before the current viewport, the current viewport's rows and 1 viewport's worth
  1063. * of rows after the current viewport. Adjusting this value can be useful for ensuring
  1064. * smooth scrolling based on your data set.
  1065. * @type int
  1066. * @default 7
  1067. * @static
  1068. * @example
  1069. * var oTable = $('#example').dataTable( {
  1070. * "sScrollY": "200px",
  1071. * "sDom": "frtiS",
  1072. * "bDeferRender": true,
  1073. * "oScroller": {
  1074. * "displayBuffer": 10
  1075. * }
  1076. * } );
  1077. */
  1078. "displayBuffer": 9,
  1079. /**
  1080. * Scroller uses the boundary scaling factor to decide when to redraw the table - which it
  1081. * typically does before you reach the end of the currently loaded data set (in order to
  1082. * allow the data to look continuous to a user scrolling through the data). If given as 0
  1083. * then the table will be redrawn whenever the viewport is scrolled, while 1 would not
  1084. * redraw the table until the currently loaded data has all been shown. You will want
  1085. * something in the middle - the default factor of 0.5 is usually suitable.
  1086. * @type float
  1087. * @default 0.5
  1088. * @static
  1089. * @example
  1090. * var oTable = $('#example').dataTable( {
  1091. * "sScrollY": "200px",
  1092. * "sDom": "frtiS",
  1093. * "bDeferRender": true,
  1094. * "oScroller": {
  1095. * "boundaryScale": 0.75
  1096. * }
  1097. * } );
  1098. */
  1099. "boundaryScale": 0.5,
  1100. /**
  1101. * Show (or not) the loading element in the background of the table. Note that you should
  1102. * include the dataTables.scroller.css file for this to be displayed correctly.
  1103. * @type boolean
  1104. * @default false
  1105. * @static
  1106. * @example
  1107. * var oTable = $('#example').dataTable( {
  1108. * "sScrollY": "200px",
  1109. * "sDom": "frtiS",
  1110. * "bDeferRender": true,
  1111. * "oScroller": {
  1112. * "loadingIndicator": true
  1113. * }
  1114. * } );
  1115. */
  1116. "loadingIndicator": false
  1117. };
  1118. Scroller.oDefaults = Scroller.defaults;
  1119. /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
  1120. * Constants
  1121. * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
  1122. /**
  1123. * Scroller version
  1124. * @type String
  1125. * @default See code
  1126. * @name Scroller.version
  1127. * @static
  1128. */
  1129. Scroller.version = "1.4.3";
  1130. /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
  1131. * Initialisation
  1132. * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */
  1133. // Legacy `dom` parameter initialisation support
  1134. if ( typeof $.fn.dataTable == "function" &&
  1135. typeof $.fn.dataTableExt.fnVersionCheck == "function" &&
  1136. $.fn.dataTableExt.fnVersionCheck('1.10.0') )
  1137. {
  1138. $.fn.dataTableExt.aoFeatures.push( {
  1139. "fnInit": function( oDTSettings ) {
  1140. var init = oDTSettings.oInit;
  1141. var opts = init.scroller || init.oScroller || {};
  1142. new Scroller( oDTSettings, opts );
  1143. },
  1144. "cFeature": "S",
  1145. "sFeature": "Scroller"
  1146. } );
  1147. }
  1148. else
  1149. {
  1150. alert( "Warning: Scroller requires DataTables 1.10.0 or greater - www.datatables.net/download");
  1151. }
  1152. // Attach a listener to the document which listens for DataTables initialisation
  1153. // events so we can automatically initialise
  1154. $(document).on( 'preInit.dt.dtscroller', function (e, settings) {
  1155. if ( e.namespace !== 'dt' ) {
  1156. return;
  1157. }
  1158. var init = settings.oInit.scroller;
  1159. var defaults = DataTable.defaults.scroller;
  1160. if ( init || defaults ) {
  1161. var opts = $.extend( {}, init, defaults );
  1162. if ( init !== false ) {
  1163. new Scroller( settings, opts );
  1164. }
  1165. }
  1166. } );
  1167. // Attach Scroller to DataTables so it can be accessed as an 'extra'
  1168. $.fn.dataTable.Scroller = Scroller;
  1169. $.fn.DataTable.Scroller = Scroller;
  1170. // DataTables 1.10 API method aliases
  1171. var Api = $.fn.dataTable.Api;
  1172. Api.register( 'scroller()', function () {
  1173. return this;
  1174. } );
  1175. // Undocumented and deprecated - is it actually useful at all?
  1176. Api.register( 'scroller().rowToPixels()', function ( rowIdx, intParse, virtual ) {
  1177. var ctx = this.context;
  1178. if ( ctx.length && ctx[0].oScroller ) {
  1179. return ctx[0].oScroller.fnRowToPixels( rowIdx, intParse, virtual );
  1180. }
  1181. // undefined
  1182. } );
  1183. // Undocumented and deprecated - is it actually useful at all?
  1184. Api.register( 'scroller().pixelsToRow()', function ( pixels, intParse, virtual ) {
  1185. var ctx = this.context;
  1186. if ( ctx.length && ctx[0].oScroller ) {
  1187. return ctx[0].oScroller.fnPixelsToRow( pixels, intParse, virtual );
  1188. }
  1189. // undefined
  1190. } );
  1191. // Undocumented and deprecated - use `row().scrollTo()` instead
  1192. Api.register( 'scroller().scrollToRow()', function ( row, ani ) {
  1193. this.iterator( 'table', function ( ctx ) {
  1194. if ( ctx.oScroller ) {
  1195. ctx.oScroller.fnScrollToRow( row, ani );
  1196. }
  1197. } );
  1198. return this;
  1199. } );
  1200. Api.register( 'row().scrollTo()', function ( ani ) {
  1201. var that = this;
  1202. this.iterator( 'row', function ( ctx, rowIdx ) {
  1203. if ( ctx.oScroller ) {
  1204. var displayIdx = that
  1205. .rows( { order: 'applied', search: 'applied' } )
  1206. .indexes()
  1207. .indexOf( rowIdx );
  1208. ctx.oScroller.fnScrollToRow( displayIdx, ani );
  1209. }
  1210. } );
  1211. return this;
  1212. } );
  1213. Api.register( 'scroller.measure()', function ( redraw ) {
  1214. this.iterator( 'table', function ( ctx ) {
  1215. if ( ctx.oScroller ) {
  1216. ctx.oScroller.fnMeasure( redraw );
  1217. }
  1218. } );
  1219. return this;
  1220. } );
  1221. Api.register( 'scroller.page()', function() {
  1222. var ctx = this.context;
  1223. if ( ctx.length && ctx[0].oScroller ) {
  1224. return ctx[0].oScroller.fnPageInfo();
  1225. }
  1226. // undefined
  1227. } );
  1228. return Scroller;
  1229. }));