Mercurial > nebulaweb3

comparison default/node_modules/tablesaw/src/tables.js @ 0:1d038bc9b3d2 default tip

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Up:default
author Liny <dev@neowd.com>
date Sat, 31 May 2025 09:21:51 +0800
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:1d038bc9b3d2
1 /*
2 * tablesaw: A set of plugins for responsive tables
3 * Stack and Column Toggle tables
4 * Copyright (c) 2013 Filament Group, Inc.
5 * MIT License
6 */
7
8 var domContentLoadedTriggered = false;
9 document.addEventListener("DOMContentLoaded", function() {
10 domContentLoadedTriggered = true;
11 });
12
13 var Tablesaw = {
14 i18n: {
15 modeStack: "Stack",
16 modeSwipe: "Swipe",
17 modeToggle: "Toggle",
18 modeSwitchColumnsAbbreviated: "Cols",
19 modeSwitchColumns: "Columns",
20 columnToggleButton: "Columns",
21 columnToggleError: "No eligible columns.",
22 sort: "Sort",
23 swipePreviousColumn: "Previous column",
24 swipeNextColumn: "Next column"
25 },
26 // cut the mustard
27 mustard:
28 "head" in document && // IE9+, Firefox 4+, Safari 5.1+, Mobile Safari 4.1+, Opera 11.5+, Android 2.3+
29 (!window.blackberry || window.WebKitPoint) && // only WebKit Blackberry (OS 6+)
30 !window.operamini,
31 $: $,
32 _init: function(element) {
33 Tablesaw.$(element || document).trigger("enhance.tablesaw");
34 },
35 init: function(element) {
36 if (!domContentLoadedTriggered) {
37 if ("addEventListener" in document) {
38 // Use raw DOMContentLoaded instead of shoestring (may have issues in Android 2.3, exhibited by stack table)
39 document.addEventListener("DOMContentLoaded", function() {
40 Tablesaw._init(element);
41 });
42 }
43 } else {
44 Tablesaw._init(element);
45 }
46 }
47 };
48
49 $(document).on("enhance.tablesaw", function() {
50 // Extend i18n config, if one exists.
51 if (typeof TablesawConfig !== "undefined" && TablesawConfig.i18n) {
52 Tablesaw.i18n = $.extend(Tablesaw.i18n, TablesawConfig.i18n || {});
53 }
54
55 Tablesaw.i18n.modes = [
56 Tablesaw.i18n.modeStack,
57 Tablesaw.i18n.modeSwipe,
58 Tablesaw.i18n.modeToggle
59 ];
60 });
61
62 if (Tablesaw.mustard) {
63 $(document.documentElement).addClass("tablesaw-enhanced");
64 }
65
66 (function() {
67 var pluginName = "tablesaw";
68 var classes = {
69 toolbar: "tablesaw-bar"
70 };
71 var events = {
72 create: "tablesawcreate",
73 destroy: "tablesawdestroy",
74 refresh: "tablesawrefresh",
75 resize: "tablesawresize"
76 };
77 var defaultMode = "stack";
78 var initSelector = "table";
79 var initFilterSelector = "[data-tablesaw],[data-tablesaw-mode],[data-tablesaw-sortable]";
80 var defaultConfig = {};
81
82 Tablesaw.events = events;
83
84 var Table = function(element) {
85 if (!element) {
86 throw new Error("Tablesaw requires an element.");
87 }
88
89 this.table = element;
90 this.$table = $(element);
91
92 // only one <thead> and <tfoot> are allowed, per the specification
93 this.$thead = this.$table
94 .children()
95 .filter("thead")
96 .eq(0);
97
98 // multiple <tbody> are allowed, per the specification
99 this.$tbody = this.$table.children().filter("tbody");
100
101 this.mode = this.$table.attr("data-tablesaw-mode") || defaultMode;
102
103 this.$toolbar = null;
104
105 this.attributes = {
106 subrow: "data-tablesaw-subrow",
107 ignorerow: "data-tablesaw-ignorerow"
108 };
109
110 this.init();
111 };
112
113 Table.prototype.init = function() {
114 if (!this.$thead.length) {
115 throw new Error("tablesaw: a <thead> is required, but none was found.");
116 }
117
118 if (!this.$thead.find("th").length) {
119 throw new Error("tablesaw: no header cells found. Are you using <th> inside of <thead>?");
120 }
121
122 // assign an id if there is none
123 if (!this.$table.attr("id")) {
124 this.$table.attr("id", pluginName + "-" + Math.round(Math.random() * 10000));
125 }
126
127 this.createToolbar();
128
129 this._initCells();
130
131 this.$table.data(pluginName, this);
132
133 this.$table.trigger(events.create, [this]);
134 };
135
136 Table.prototype.getConfig = function(pluginSpecificConfig) {
137 // shoestring extend doesn’t support arbitrary args
138 var configs = $.extend(defaultConfig, pluginSpecificConfig || {});
139 return $.extend(configs, typeof TablesawConfig !== "undefined" ? TablesawConfig : {});
140 };
141
142 Table.prototype._getPrimaryHeaderRow = function() {
143 return this._getHeaderRows().eq(0);
144 };
145
146 Table.prototype._getHeaderRows = function() {
147 return this.$thead
148 .children()
149 .filter("tr")
150 .filter(function() {
151 return !$(this).is("[data-tablesaw-ignorerow]");
152 });
153 };
154
155 Table.prototype._getRowIndex = function($row) {
156 return $row.prevAll().length;
157 };
158
159 Table.prototype._getHeaderRowIndeces = function() {
160 var self = this;
161 var indeces = [];
162 this._getHeaderRows().each(function() {
163 indeces.push(self._getRowIndex($(this)));
164 });
165 return indeces;
166 };
167
168 Table.prototype._getPrimaryHeaderCells = function($row) {
169 return ($row || this._getPrimaryHeaderRow()).find("th");
170 };
171
172 Table.prototype._$getCells = function(th) {
173 var self = this;
174 return $(th)
175 .add(th.cells)
176 .filter(function() {
177 var $t = $(this);
178 var $row = $t.parent();
179 var hasColspan = $t.is("[colspan]");
180 // no subrows or ignored rows (keep cells in ignored rows that do not have a colspan)
181 return (
182 !$row.is("[" + self.attributes.subrow + "]") &&
183 (!$row.is("[" + self.attributes.ignorerow + "]") || !hasColspan)
184 );
185 });
186 };
187
188 Table.prototype._getVisibleColspan = function() {
189 var colspan = 0;
190 this._getPrimaryHeaderCells().each(function() {
191 var $t = $(this);
192 if ($t.css("display") !== "none") {
193 colspan += parseInt($t.attr("colspan"), 10) || 1;
194 }
195 });
196 return colspan;
197 };
198
199 Table.prototype.getColspanForCell = function($cell) {
200 var visibleColspan = this._getVisibleColspan();
201 var visibleSiblingColumns = 0;
202 if ($cell.closest("tr").data("tablesaw-rowspanned")) {
203 visibleSiblingColumns++;
204 }
205
206 $cell.siblings().each(function() {
207 var $t = $(this);
208 var colColspan = parseInt($t.attr("colspan"), 10) || 1;
209
210 if ($t.css("display") !== "none") {
211 visibleSiblingColumns += colColspan;
212 }
213 });
214 // console.log( $cell[ 0 ], visibleColspan, visibleSiblingColumns );
215
216 return visibleColspan - visibleSiblingColumns;
217 };
218
219 Table.prototype.isCellInColumn = function(header, cell) {
220 return $(header)
221 .add(header.cells)
222 .filter(function() {
223 return this === cell;
224 }).length;
225 };
226
227 Table.prototype.updateColspanCells = function(cls, header, userAction) {
228 var self = this;
229 var primaryHeaderRow = self._getPrimaryHeaderRow();
230
231 // find persistent column rowspans
232 this.$table.find("[rowspan][data-tablesaw-priority]").each(function() {
233 var $t = $(this);
234 if ($t.attr("data-tablesaw-priority") !== "persist") {
235 return;
236 }
237
238 var $row = $t.closest("tr");
239 var rowspan = parseInt($t.attr("rowspan"), 10);
240 if (rowspan > 1) {
241 $row = $row.next();
242
243 $row.data("tablesaw-rowspanned", true);
244
245 rowspan--;
246 }
247 });
248
249 this.$table
250 .find("[colspan],[data-tablesaw-maxcolspan]")
251 .filter(function() {
252 // is not in primary header row
253 return $(this).closest("tr")[0] !== primaryHeaderRow[0];
254 })
255 .each(function() {
256 var $cell = $(this);
257
258 if (userAction === undefined || self.isCellInColumn(header, this)) {
259 } else {
260 // if is not a user action AND the cell is not in the updating column, kill it
261 return;
262 }
263
264 var colspan = self.getColspanForCell($cell);
265
266 if (cls && userAction !== undefined) {
267 // console.log( colspan === 0 ? "addClass" : "removeClass", $cell );
268 $cell[colspan === 0 ? "addClass" : "removeClass"](cls);
269 }
270
271 // cache original colspan
272 var maxColspan = parseInt($cell.attr("data-tablesaw-maxcolspan"), 10);
273 if (!maxColspan) {
274 $cell.attr("data-tablesaw-maxcolspan", $cell.attr("colspan"));
275 } else if (colspan > maxColspan) {
276 colspan = maxColspan;
277 }
278
279 // console.log( this, "setting colspan to ", colspan );
280 $cell.attr("colspan", colspan);
281 });
282 };
283
284 Table.prototype._findPrimaryHeadersForCell = function(cell) {
285 var $headerRow = this._getPrimaryHeaderRow();
286 var $headers = this._getPrimaryHeaderCells($headerRow);
287 var headerRowIndex = this._getRowIndex($headerRow);
288 var results = [];
289
290 for (var rowNumber = 0; rowNumber < this.headerMapping.length; rowNumber++) {
291 if (rowNumber === headerRowIndex) {
292 continue;
293 }
294 for (var colNumber = 0; colNumber < this.headerMapping[rowNumber].length; colNumber++) {
295 if (this.headerMapping[rowNumber][colNumber] === cell) {
296 results.push($headers[colNumber]);
297 }
298 }
299 }
300 return results;
301 };
302
303 // used by init cells
304 Table.prototype.getRows = function() {
305 var self = this;
306 return this.$table.find("tr").filter(function() {
307 return $(this)
308 .closest("table")
309 .is(self.$table);
310 });
311 };
312
313 // used by sortable
314 Table.prototype.getBodyRows = function(tbody) {
315 return (tbody ? $(tbody) : this.$tbody).children().filter("tr");
316 };
317
318 Table.prototype.getHeaderCellIndex = function(cell) {
319 var lookup = this.headerMapping[0];
320 for (var colIndex = 0; colIndex < lookup.length; colIndex++) {
321 if (lookup[colIndex] === cell) {
322 return colIndex;
323 }
324 }
325
326 return -1;
327 };
328
329 Table.prototype._initCells = function() {
330 // re-establish original colspans
331 this.$table.find("[data-tablesaw-maxcolspan]").each(function() {
332 var $t = $(this);
333 $t.attr("colspan", $t.attr("data-tablesaw-maxcolspan"));
334 });
335
336 var $rows = this.getRows();
337 var columnLookup = [];
338
339 $rows.each(function(rowNumber) {
340 columnLookup[rowNumber] = [];
341 });
342
343 $rows.each(function(rowNumber) {
344 var coltally = 0;
345 var $t = $(this);
346 var children = $t.children();
347
348 children.each(function() {
349 var colspan = parseInt(
350 this.getAttribute("data-tablesaw-maxcolspan") || this.getAttribute("colspan"),
351 10
352 );
353 var rowspan = parseInt(this.getAttribute("rowspan"), 10);
354
355 // set in a previous rowspan
356 while (columnLookup[rowNumber][coltally]) {
357 coltally++;
358 }
359
360 columnLookup[rowNumber][coltally] = this;
361
362 // TODO? both colspan and rowspan
363 if (colspan) {
364 for (var k = 0; k < colspan - 1; k++) {
365 coltally++;
366 columnLookup[rowNumber][coltally] = this;
367 }
368 }
369 if (rowspan) {
370 for (var j = 1; j < rowspan; j++) {
371 columnLookup[rowNumber + j][coltally] = this;
372 }
373 }
374
375 coltally++;
376 });
377 });
378
379 var headerRowIndeces = this._getHeaderRowIndeces();
380 for (var colNumber = 0; colNumber < columnLookup[0].length; colNumber++) {
381 for (var headerIndex = 0, k = headerRowIndeces.length; headerIndex < k; headerIndex++) {
382 var headerCol = columnLookup[headerRowIndeces[headerIndex]][colNumber];
383
384 var rowNumber = headerRowIndeces[headerIndex];
385 var rowCell;
386
387 if (!headerCol.cells) {
388 headerCol.cells = [];
389 }
390
391 while (rowNumber < columnLookup.length) {
392 rowCell = columnLookup[rowNumber][colNumber];
393
394 if (headerCol !== rowCell) {
395 headerCol.cells.push(rowCell);
396 }
397
398 rowNumber++;
399 }
400 }
401 }
402
403 this.headerMapping = columnLookup;
404 };
405
406 Table.prototype.refresh = function() {
407 this._initCells();
408
409 this.$table.trigger(events.refresh, [this]);
410 };
411
412 Table.prototype._getToolbarAnchor = function() {
413 var $parent = this.$table.parent();
414 if ($parent.is(".tablesaw-overflow")) {
415 return $parent;
416 }
417 return this.$table;
418 };
419
420 Table.prototype._getToolbar = function($anchor) {
421 if (!$anchor) {
422 $anchor = this._getToolbarAnchor();
423 }
424 return $anchor.prev().filter("." + classes.toolbar);
425 };
426
427 Table.prototype.createToolbar = function() {
428 // Insert the toolbar
429 // TODO move this into a separate component
430 var $anchor = this._getToolbarAnchor();
431 var $toolbar = this._getToolbar($anchor);
432 if (!$toolbar.length) {
433 $toolbar = $("<div>")
434 .addClass(classes.toolbar)
435 .insertBefore($anchor);
436 }
437 this.$toolbar = $toolbar;
438
439 if (this.mode) {
440 this.$toolbar.addClass("tablesaw-mode-" + this.mode);
441 }
442 };
443
444 Table.prototype.destroy = function() {
445 // Don’t remove the toolbar, just erase the classes on it.
446 // Some of the table features are not yet destroy-friendly.
447 this._getToolbar().each(function() {
448 this.className = this.className.replace(/\btablesaw-mode\-\w*\b/gi, "");
449 });
450
451 var tableId = this.$table.attr("id");
452 $(document).off("." + tableId);
453 $(window).off("." + tableId);
454
455 // other plugins
456 this.$table.trigger(events.destroy, [this]);
457
458 this.$table.removeData(pluginName);
459 };
460
461 // Collection method.
462 $.fn[pluginName] = function() {
463 return this.each(function() {
464 var $t = $(this);
465
466 if ($t.data(pluginName)) {
467 return;
468 }
469
470 new Table(this);
471 });
472 };
473
474 var $doc = $(document);
475 $doc.on("enhance.tablesaw", function(e) {
476 // Cut the mustard
477 if (Tablesaw.mustard) {
478 $(e.target)
479 .find(initSelector)
480 .filter(initFilterSelector)
481 [pluginName]();
482 }
483 });
484
485 // Avoid a resize during scroll:
486 // Some Mobile devices trigger a resize during scroll (sometimes when
487 // doing elastic stretch at the end of the document or from the
488 // location bar hide)
489 var isScrolling = false;
490 var scrollTimeout;
491 $doc.on("scroll.tablesaw", function() {
492 isScrolling = true;
493
494 window.clearTimeout(scrollTimeout);
495 scrollTimeout = window.setTimeout(function() {
496 isScrolling = false;
497 }, 300); // must be greater than the resize timeout below
498 });
499
500 var resizeTimeout;
501 $(window).on("resize", function() {
502 if (!isScrolling) {
503 window.clearTimeout(resizeTimeout);
504 resizeTimeout = window.setTimeout(function() {
505 $doc.trigger(events.resize);
506 }, 150); // must be less than the scrolling timeout above.
507 }
508 });
509
510 Tablesaw.Table = Table;
511 })();