Mercurial > nebulaweb3
comparison default/node_modules/tablesaw/dist/tablesaw.jquery.js @ 0:1d038bc9b3d2 default tip
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 /*! Tablesaw - v3.0.8 - 2018-01-25 | |
| 2 * https://github.com/filamentgroup/tablesaw | |
| 3 * Copyright (c) 2018 Filament Group; Licensed MIT */ | |
| 4 (function (root, factory) { | |
| 5 if (typeof define === 'function' && define.amd) { | |
| 6 define(["jquery"], function (jQuery) { | |
| 7 return (root.Tablesaw = factory(jQuery, root)); | |
| 8 }); | |
| 9 } else if (typeof exports === 'object') { | |
| 10 if( "document" in root ) { | |
| 11 module.exports = factory(require('jquery'), root); | |
| 12 } else { | |
| 13 // special jQuery case for CommonJS (pass in a window) | |
| 14 module.exports = factory(require('jquery')(root), root); | |
| 15 } | |
| 16 } else { | |
| 17 root.Tablesaw = factory(jQuery, root); | |
| 18 } | |
| 19 }(typeof window !== "undefined" ? window : this, function ($, window) { | |
| 20 "use strict"; | |
| 21 | |
| 22 var document = window.document; | |
| 23 | |
| 24 var domContentLoadedTriggered = false; | |
| 25 document.addEventListener("DOMContentLoaded", function() { | |
| 26 domContentLoadedTriggered = true; | |
| 27 }); | |
| 28 | |
| 29 var Tablesaw = { | |
| 30 i18n: { | |
| 31 modeStack: "Stack", | |
| 32 modeSwipe: "Swipe", | |
| 33 modeToggle: "Toggle", | |
| 34 modeSwitchColumnsAbbreviated: "Cols", | |
| 35 modeSwitchColumns: "Columns", | |
| 36 columnToggleButton: "Columns", | |
| 37 columnToggleError: "No eligible columns.", | |
| 38 sort: "Sort", | |
| 39 swipePreviousColumn: "Previous column", | |
| 40 swipeNextColumn: "Next column" | |
| 41 }, | |
| 42 // cut the mustard | |
| 43 mustard: | |
| 44 "head" in document && // IE9+, Firefox 4+, Safari 5.1+, Mobile Safari 4.1+, Opera 11.5+, Android 2.3+ | |
| 45 (!window.blackberry || window.WebKitPoint) && // only WebKit Blackberry (OS 6+) | |
| 46 !window.operamini, | |
| 47 $: $, | |
| 48 _init: function(element) { | |
| 49 Tablesaw.$(element || document).trigger("enhance.tablesaw"); | |
| 50 }, | |
| 51 init: function(element) { | |
| 52 if (!domContentLoadedTriggered) { | |
| 53 if ("addEventListener" in document) { | |
| 54 // Use raw DOMContentLoaded instead of shoestring (may have issues in Android 2.3, exhibited by stack table) | |
| 55 document.addEventListener("DOMContentLoaded", function() { | |
| 56 Tablesaw._init(element); | |
| 57 }); | |
| 58 } | |
| 59 } else { | |
| 60 Tablesaw._init(element); | |
| 61 } | |
| 62 } | |
| 63 }; | |
| 64 | |
| 65 $(document).on("enhance.tablesaw", function() { | |
| 66 // Extend i18n config, if one exists. | |
| 67 if (typeof TablesawConfig !== "undefined" && TablesawConfig.i18n) { | |
| 68 Tablesaw.i18n = $.extend(Tablesaw.i18n, TablesawConfig.i18n || {}); | |
| 69 } | |
| 70 | |
| 71 Tablesaw.i18n.modes = [ | |
| 72 Tablesaw.i18n.modeStack, | |
| 73 Tablesaw.i18n.modeSwipe, | |
| 74 Tablesaw.i18n.modeToggle | |
| 75 ]; | |
| 76 }); | |
| 77 | |
| 78 if (Tablesaw.mustard) { | |
| 79 $(document.documentElement).addClass("tablesaw-enhanced"); | |
| 80 } | |
| 81 | |
| 82 (function() { | |
| 83 var pluginName = "tablesaw"; | |
| 84 var classes = { | |
| 85 toolbar: "tablesaw-bar" | |
| 86 }; | |
| 87 var events = { | |
| 88 create: "tablesawcreate", | |
| 89 destroy: "tablesawdestroy", | |
| 90 refresh: "tablesawrefresh", | |
| 91 resize: "tablesawresize" | |
| 92 }; | |
| 93 var defaultMode = "stack"; | |
| 94 var initSelector = "table"; | |
| 95 var initFilterSelector = "[data-tablesaw],[data-tablesaw-mode],[data-tablesaw-sortable]"; | |
| 96 var defaultConfig = {}; | |
| 97 | |
| 98 Tablesaw.events = events; | |
| 99 | |
| 100 var Table = function(element) { | |
| 101 if (!element) { | |
| 102 throw new Error("Tablesaw requires an element."); | |
| 103 } | |
| 104 | |
| 105 this.table = element; | |
| 106 this.$table = $(element); | |
| 107 | |
| 108 // only one <thead> and <tfoot> are allowed, per the specification | |
| 109 this.$thead = this.$table | |
| 110 .children() | |
| 111 .filter("thead") | |
| 112 .eq(0); | |
| 113 | |
| 114 // multiple <tbody> are allowed, per the specification | |
| 115 this.$tbody = this.$table.children().filter("tbody"); | |
| 116 | |
| 117 this.mode = this.$table.attr("data-tablesaw-mode") || defaultMode; | |
| 118 | |
| 119 this.$toolbar = null; | |
| 120 | |
| 121 this.attributes = { | |
| 122 subrow: "data-tablesaw-subrow", | |
| 123 ignorerow: "data-tablesaw-ignorerow" | |
| 124 }; | |
| 125 | |
| 126 this.init(); | |
| 127 }; | |
| 128 | |
| 129 Table.prototype.init = function() { | |
| 130 if (!this.$thead.length) { | |
| 131 throw new Error("tablesaw: a <thead> is required, but none was found."); | |
| 132 } | |
| 133 | |
| 134 if (!this.$thead.find("th").length) { | |
| 135 throw new Error("tablesaw: no header cells found. Are you using <th> inside of <thead>?"); | |
| 136 } | |
| 137 | |
| 138 // assign an id if there is none | |
| 139 if (!this.$table.attr("id")) { | |
| 140 this.$table.attr("id", pluginName + "-" + Math.round(Math.random() * 10000)); | |
| 141 } | |
| 142 | |
| 143 this.createToolbar(); | |
| 144 | |
| 145 this._initCells(); | |
| 146 | |
| 147 this.$table.data(pluginName, this); | |
| 148 | |
| 149 this.$table.trigger(events.create, [this]); | |
| 150 }; | |
| 151 | |
| 152 Table.prototype.getConfig = function(pluginSpecificConfig) { | |
| 153 // shoestring extend doesn’t support arbitrary args | |
| 154 var configs = $.extend(defaultConfig, pluginSpecificConfig || {}); | |
| 155 return $.extend(configs, typeof TablesawConfig !== "undefined" ? TablesawConfig : {}); | |
| 156 }; | |
| 157 | |
| 158 Table.prototype._getPrimaryHeaderRow = function() { | |
| 159 return this._getHeaderRows().eq(0); | |
| 160 }; | |
| 161 | |
| 162 Table.prototype._getHeaderRows = function() { | |
| 163 return this.$thead | |
| 164 .children() | |
| 165 .filter("tr") | |
| 166 .filter(function() { | |
| 167 return !$(this).is("[data-tablesaw-ignorerow]"); | |
| 168 }); | |
| 169 }; | |
| 170 | |
| 171 Table.prototype._getRowIndex = function($row) { | |
| 172 return $row.prevAll().length; | |
| 173 }; | |
| 174 | |
| 175 Table.prototype._getHeaderRowIndeces = function() { | |
| 176 var self = this; | |
| 177 var indeces = []; | |
| 178 this._getHeaderRows().each(function() { | |
| 179 indeces.push(self._getRowIndex($(this))); | |
| 180 }); | |
| 181 return indeces; | |
| 182 }; | |
| 183 | |
| 184 Table.prototype._getPrimaryHeaderCells = function($row) { | |
| 185 return ($row || this._getPrimaryHeaderRow()).find("th"); | |
| 186 }; | |
| 187 | |
| 188 Table.prototype._$getCells = function(th) { | |
| 189 var self = this; | |
| 190 return $(th) | |
| 191 .add(th.cells) | |
| 192 .filter(function() { | |
| 193 var $t = $(this); | |
| 194 var $row = $t.parent(); | |
| 195 var hasColspan = $t.is("[colspan]"); | |
| 196 // no subrows or ignored rows (keep cells in ignored rows that do not have a colspan) | |
| 197 return ( | |
| 198 !$row.is("[" + self.attributes.subrow + "]") && | |
| 199 (!$row.is("[" + self.attributes.ignorerow + "]") || !hasColspan) | |
| 200 ); | |
| 201 }); | |
| 202 }; | |
| 203 | |
| 204 Table.prototype._getVisibleColspan = function() { | |
| 205 var colspan = 0; | |
| 206 this._getPrimaryHeaderCells().each(function() { | |
| 207 var $t = $(this); | |
| 208 if ($t.css("display") !== "none") { | |
| 209 colspan += parseInt($t.attr("colspan"), 10) || 1; | |
| 210 } | |
| 211 }); | |
| 212 return colspan; | |
| 213 }; | |
| 214 | |
| 215 Table.prototype.getColspanForCell = function($cell) { | |
| 216 var visibleColspan = this._getVisibleColspan(); | |
| 217 var visibleSiblingColumns = 0; | |
| 218 if ($cell.closest("tr").data("tablesaw-rowspanned")) { | |
| 219 visibleSiblingColumns++; | |
| 220 } | |
| 221 | |
| 222 $cell.siblings().each(function() { | |
| 223 var $t = $(this); | |
| 224 var colColspan = parseInt($t.attr("colspan"), 10) || 1; | |
| 225 | |
| 226 if ($t.css("display") !== "none") { | |
| 227 visibleSiblingColumns += colColspan; | |
| 228 } | |
| 229 }); | |
| 230 // console.log( $cell[ 0 ], visibleColspan, visibleSiblingColumns ); | |
| 231 | |
| 232 return visibleColspan - visibleSiblingColumns; | |
| 233 }; | |
| 234 | |
| 235 Table.prototype.isCellInColumn = function(header, cell) { | |
| 236 return $(header) | |
| 237 .add(header.cells) | |
| 238 .filter(function() { | |
| 239 return this === cell; | |
| 240 }).length; | |
| 241 }; | |
| 242 | |
| 243 Table.prototype.updateColspanCells = function(cls, header, userAction) { | |
| 244 var self = this; | |
| 245 var primaryHeaderRow = self._getPrimaryHeaderRow(); | |
| 246 | |
| 247 // find persistent column rowspans | |
| 248 this.$table.find("[rowspan][data-tablesaw-priority]").each(function() { | |
| 249 var $t = $(this); | |
| 250 if ($t.attr("data-tablesaw-priority") !== "persist") { | |
| 251 return; | |
| 252 } | |
| 253 | |
| 254 var $row = $t.closest("tr"); | |
| 255 var rowspan = parseInt($t.attr("rowspan"), 10); | |
| 256 if (rowspan > 1) { | |
| 257 $row = $row.next(); | |
| 258 | |
| 259 $row.data("tablesaw-rowspanned", true); | |
| 260 | |
| 261 rowspan--; | |
| 262 } | |
| 263 }); | |
| 264 | |
| 265 this.$table | |
| 266 .find("[colspan],[data-tablesaw-maxcolspan]") | |
| 267 .filter(function() { | |
| 268 // is not in primary header row | |
| 269 return $(this).closest("tr")[0] !== primaryHeaderRow[0]; | |
| 270 }) | |
| 271 .each(function() { | |
| 272 var $cell = $(this); | |
| 273 | |
| 274 if (userAction === undefined || self.isCellInColumn(header, this)) { | |
| 275 } else { | |
| 276 // if is not a user action AND the cell is not in the updating column, kill it | |
| 277 return; | |
| 278 } | |
| 279 | |
| 280 var colspan = self.getColspanForCell($cell); | |
| 281 | |
| 282 if (cls && userAction !== undefined) { | |
| 283 // console.log( colspan === 0 ? "addClass" : "removeClass", $cell ); | |
| 284 $cell[colspan === 0 ? "addClass" : "removeClass"](cls); | |
| 285 } | |
| 286 | |
| 287 // cache original colspan | |
| 288 var maxColspan = parseInt($cell.attr("data-tablesaw-maxcolspan"), 10); | |
| 289 if (!maxColspan) { | |
| 290 $cell.attr("data-tablesaw-maxcolspan", $cell.attr("colspan")); | |
| 291 } else if (colspan > maxColspan) { | |
| 292 colspan = maxColspan; | |
| 293 } | |
| 294 | |
| 295 // console.log( this, "setting colspan to ", colspan ); | |
| 296 $cell.attr("colspan", colspan); | |
| 297 }); | |
| 298 }; | |
| 299 | |
| 300 Table.prototype._findPrimaryHeadersForCell = function(cell) { | |
| 301 var $headerRow = this._getPrimaryHeaderRow(); | |
| 302 var $headers = this._getPrimaryHeaderCells($headerRow); | |
| 303 var headerRowIndex = this._getRowIndex($headerRow); | |
| 304 var results = []; | |
| 305 | |
| 306 for (var rowNumber = 0; rowNumber < this.headerMapping.length; rowNumber++) { | |
| 307 if (rowNumber === headerRowIndex) { | |
| 308 continue; | |
| 309 } | |
| 310 for (var colNumber = 0; colNumber < this.headerMapping[rowNumber].length; colNumber++) { | |
| 311 if (this.headerMapping[rowNumber][colNumber] === cell) { | |
| 312 results.push($headers[colNumber]); | |
| 313 } | |
| 314 } | |
| 315 } | |
| 316 return results; | |
| 317 }; | |
| 318 | |
| 319 // used by init cells | |
| 320 Table.prototype.getRows = function() { | |
| 321 var self = this; | |
| 322 return this.$table.find("tr").filter(function() { | |
| 323 return $(this) | |
| 324 .closest("table") | |
| 325 .is(self.$table); | |
| 326 }); | |
| 327 }; | |
| 328 | |
| 329 // used by sortable | |
| 330 Table.prototype.getBodyRows = function(tbody) { | |
| 331 return (tbody ? $(tbody) : this.$tbody).children().filter("tr"); | |
| 332 }; | |
| 333 | |
| 334 Table.prototype.getHeaderCellIndex = function(cell) { | |
| 335 var lookup = this.headerMapping[0]; | |
| 336 for (var colIndex = 0; colIndex < lookup.length; colIndex++) { | |
| 337 if (lookup[colIndex] === cell) { | |
| 338 return colIndex; | |
| 339 } | |
| 340 } | |
| 341 | |
| 342 return -1; | |
| 343 }; | |
| 344 | |
| 345 Table.prototype._initCells = function() { | |
| 346 // re-establish original colspans | |
| 347 this.$table.find("[data-tablesaw-maxcolspan]").each(function() { | |
| 348 var $t = $(this); | |
| 349 $t.attr("colspan", $t.attr("data-tablesaw-maxcolspan")); | |
| 350 }); | |
| 351 | |
| 352 var $rows = this.getRows(); | |
| 353 var columnLookup = []; | |
| 354 | |
| 355 $rows.each(function(rowNumber) { | |
| 356 columnLookup[rowNumber] = []; | |
| 357 }); | |
| 358 | |
| 359 $rows.each(function(rowNumber) { | |
| 360 var coltally = 0; | |
| 361 var $t = $(this); | |
| 362 var children = $t.children(); | |
| 363 | |
| 364 children.each(function() { | |
| 365 var colspan = parseInt( | |
| 366 this.getAttribute("data-tablesaw-maxcolspan") || this.getAttribute("colspan"), | |
| 367 10 | |
| 368 ); | |
| 369 var rowspan = parseInt(this.getAttribute("rowspan"), 10); | |
| 370 | |
| 371 // set in a previous rowspan | |
| 372 while (columnLookup[rowNumber][coltally]) { | |
| 373 coltally++; | |
| 374 } | |
| 375 | |
| 376 columnLookup[rowNumber][coltally] = this; | |
| 377 | |
| 378 // TODO? both colspan and rowspan | |
| 379 if (colspan) { | |
| 380 for (var k = 0; k < colspan - 1; k++) { | |
| 381 coltally++; | |
| 382 columnLookup[rowNumber][coltally] = this; | |
| 383 } | |
| 384 } | |
| 385 if (rowspan) { | |
| 386 for (var j = 1; j < rowspan; j++) { | |
| 387 columnLookup[rowNumber + j][coltally] = this; | |
| 388 } | |
| 389 } | |
| 390 | |
| 391 coltally++; | |
| 392 }); | |
| 393 }); | |
| 394 | |
| 395 var headerRowIndeces = this._getHeaderRowIndeces(); | |
| 396 for (var colNumber = 0; colNumber < columnLookup[0].length; colNumber++) { | |
| 397 for (var headerIndex = 0, k = headerRowIndeces.length; headerIndex < k; headerIndex++) { | |
| 398 var headerCol = columnLookup[headerRowIndeces[headerIndex]][colNumber]; | |
| 399 | |
| 400 var rowNumber = headerRowIndeces[headerIndex]; | |
| 401 var rowCell; | |
| 402 | |
| 403 if (!headerCol.cells) { | |
| 404 headerCol.cells = []; | |
| 405 } | |
| 406 | |
| 407 while (rowNumber < columnLookup.length) { | |
| 408 rowCell = columnLookup[rowNumber][colNumber]; | |
| 409 | |
| 410 if (headerCol !== rowCell) { | |
| 411 headerCol.cells.push(rowCell); | |
| 412 } | |
| 413 | |
| 414 rowNumber++; | |
| 415 } | |
| 416 } | |
| 417 } | |
| 418 | |
| 419 this.headerMapping = columnLookup; | |
| 420 }; | |
| 421 | |
| 422 Table.prototype.refresh = function() { | |
| 423 this._initCells(); | |
| 424 | |
| 425 this.$table.trigger(events.refresh, [this]); | |
| 426 }; | |
| 427 | |
| 428 Table.prototype._getToolbarAnchor = function() { | |
| 429 var $parent = this.$table.parent(); | |
| 430 if ($parent.is(".tablesaw-overflow")) { | |
| 431 return $parent; | |
| 432 } | |
| 433 return this.$table; | |
| 434 }; | |
| 435 | |
| 436 Table.prototype._getToolbar = function($anchor) { | |
| 437 if (!$anchor) { | |
| 438 $anchor = this._getToolbarAnchor(); | |
| 439 } | |
| 440 return $anchor.prev().filter("." + classes.toolbar); | |
| 441 }; | |
| 442 | |
| 443 Table.prototype.createToolbar = function() { | |
| 444 // Insert the toolbar | |
| 445 // TODO move this into a separate component | |
| 446 var $anchor = this._getToolbarAnchor(); | |
| 447 var $toolbar = this._getToolbar($anchor); | |
| 448 if (!$toolbar.length) { | |
| 449 $toolbar = $("<div>") | |
| 450 .addClass(classes.toolbar) | |
| 451 .insertBefore($anchor); | |
| 452 } | |
| 453 this.$toolbar = $toolbar; | |
| 454 | |
| 455 if (this.mode) { | |
| 456 this.$toolbar.addClass("tablesaw-mode-" + this.mode); | |
| 457 } | |
| 458 }; | |
| 459 | |
| 460 Table.prototype.destroy = function() { | |
| 461 // Don’t remove the toolbar, just erase the classes on it. | |
| 462 // Some of the table features are not yet destroy-friendly. | |
| 463 this._getToolbar().each(function() { | |
| 464 this.className = this.className.replace(/\btablesaw-mode\-\w*\b/gi, ""); | |
| 465 }); | |
| 466 | |
| 467 var tableId = this.$table.attr("id"); | |
| 468 $(document).off("." + tableId); | |
| 469 $(window).off("." + tableId); | |
| 470 | |
| 471 // other plugins | |
| 472 this.$table.trigger(events.destroy, [this]); | |
| 473 | |
| 474 this.$table.removeData(pluginName); | |
| 475 }; | |
| 476 | |
| 477 // Collection method. | |
| 478 $.fn[pluginName] = function() { | |
| 479 return this.each(function() { | |
| 480 var $t = $(this); | |
| 481 | |
| 482 if ($t.data(pluginName)) { | |
| 483 return; | |
| 484 } | |
| 485 | |
| 486 new Table(this); | |
| 487 }); | |
| 488 }; | |
| 489 | |
| 490 var $doc = $(document); | |
| 491 $doc.on("enhance.tablesaw", function(e) { | |
| 492 // Cut the mustard | |
| 493 if (Tablesaw.mustard) { | |
| 494 $(e.target) | |
| 495 .find(initSelector) | |
| 496 .filter(initFilterSelector) | |
| 497 [pluginName](); | |
| 498 } | |
| 499 }); | |
| 500 | |
| 501 // Avoid a resize during scroll: | |
| 502 // Some Mobile devices trigger a resize during scroll (sometimes when | |
| 503 // doing elastic stretch at the end of the document or from the | |
| 504 // location bar hide) | |
| 505 var isScrolling = false; | |
| 506 var scrollTimeout; | |
| 507 $doc.on("scroll.tablesaw", function() { | |
| 508 isScrolling = true; | |
| 509 | |
| 510 window.clearTimeout(scrollTimeout); | |
| 511 scrollTimeout = window.setTimeout(function() { | |
| 512 isScrolling = false; | |
| 513 }, 300); // must be greater than the resize timeout below | |
| 514 }); | |
| 515 | |
| 516 var resizeTimeout; | |
| 517 $(window).on("resize", function() { | |
| 518 if (!isScrolling) { | |
| 519 window.clearTimeout(resizeTimeout); | |
| 520 resizeTimeout = window.setTimeout(function() { | |
| 521 $doc.trigger(events.resize); | |
| 522 }, 150); // must be less than the scrolling timeout above. | |
| 523 } | |
| 524 }); | |
| 525 | |
| 526 Tablesaw.Table = Table; | |
| 527 })(); | |
| 528 | |
| 529 (function() { | |
| 530 var classes = { | |
| 531 stackTable: "tablesaw-stack", | |
| 532 cellLabels: "tablesaw-cell-label", | |
| 533 cellContentLabels: "tablesaw-cell-content" | |
| 534 }; | |
| 535 | |
| 536 var data = { | |
| 537 key: "tablesaw-stack" | |
| 538 }; | |
| 539 | |
| 540 var attrs = { | |
| 541 labelless: "data-tablesaw-no-labels", | |
| 542 hideempty: "data-tablesaw-hide-empty" | |
| 543 }; | |
| 544 | |
| 545 var Stack = function(element, tablesaw) { | |
| 546 this.tablesaw = tablesaw; | |
| 547 this.$table = $(element); | |
| 548 | |
| 549 this.labelless = this.$table.is("[" + attrs.labelless + "]"); | |
| 550 this.hideempty = this.$table.is("[" + attrs.hideempty + "]"); | |
| 551 | |
| 552 this.$table.data(data.key, this); | |
| 553 }; | |
| 554 | |
| 555 Stack.prototype.init = function() { | |
| 556 this.$table.addClass(classes.stackTable); | |
| 557 | |
| 558 if (this.labelless) { | |
| 559 return; | |
| 560 } | |
| 561 | |
| 562 var self = this; | |
| 563 | |
| 564 this.$table | |
| 565 .find("th, td") | |
| 566 .filter(function() { | |
| 567 return !$(this).closest("thead").length; | |
| 568 }) | |
| 569 .filter(function() { | |
| 570 return ( | |
| 571 !$(this) | |
| 572 .closest("tr") | |
| 573 .is("[" + attrs.labelless + "]") && | |
| 574 (!self.hideempty || !!$(this).html()) | |
| 575 ); | |
| 576 }) | |
| 577 .each(function() { | |
| 578 var $newHeader = $(document.createElement("b")).addClass(classes.cellLabels); | |
| 579 var $cell = $(this); | |
| 580 | |
| 581 $(self.tablesaw._findPrimaryHeadersForCell(this)).each(function(index) { | |
| 582 var $header = $(this.cloneNode(true)); | |
| 583 // TODO decouple from sortable better | |
| 584 // Changed from .text() in https://github.com/filamentgroup/tablesaw/commit/b9c12a8f893ec192830ec3ba2d75f062642f935b | |
| 585 // to preserve structural html in headers, like <a> | |
| 586 var $sortableButton = $header.find(".tablesaw-sortable-btn"); | |
| 587 $header.find(".tablesaw-sortable-arrow").remove(); | |
| 588 | |
| 589 // TODO decouple from checkall better | |
| 590 var $checkall = $header.find("[data-tablesaw-checkall]"); | |
| 591 $checkall.closest("label").remove(); | |
| 592 if ($checkall.length) { | |
| 593 $newHeader = $([]); | |
| 594 return; | |
| 595 } | |
| 596 | |
| 597 if (index > 0) { | |
| 598 $newHeader.append(document.createTextNode(", ")); | |
| 599 } | |
| 600 $newHeader.append( | |
| 601 $sortableButton.length ? $sortableButton[0].childNodes : $header[0].childNodes | |
| 602 ); | |
| 603 }); | |
| 604 | |
| 605 if ($newHeader.length && !$cell.find("." + classes.cellContentLabels).length) { | |
| 606 $cell.wrapInner("<span class='" + classes.cellContentLabels + "'></span>"); | |
| 607 } | |
| 608 | |
| 609 // Update if already exists. | |
| 610 var $label = $cell.find("." + classes.cellLabels); | |
| 611 if (!$label.length) { | |
| 612 $cell.prepend($newHeader); | |
| 613 } else { | |
| 614 // only if changed | |
| 615 $label.replaceWith($newHeader); | |
| 616 } | |
| 617 }); | |
| 618 }; | |
| 619 | |
| 620 Stack.prototype.destroy = function() { | |
| 621 this.$table.removeClass(classes.stackTable); | |
| 622 this.$table.find("." + classes.cellLabels).remove(); | |
| 623 this.$table.find("." + classes.cellContentLabels).each(function() { | |
| 624 $(this).replaceWith(this.childNodes); | |
| 625 }); | |
| 626 }; | |
| 627 | |
| 628 // on tablecreate, init | |
| 629 $(document) | |
| 630 .on(Tablesaw.events.create, function(e, tablesaw) { | |
| 631 if (tablesaw.mode === "stack") { | |
| 632 var table = new Stack(tablesaw.table, tablesaw); | |
| 633 table.init(); | |
| 634 } | |
| 635 }) | |
| 636 .on(Tablesaw.events.refresh, function(e, tablesaw) { | |
| 637 if (tablesaw.mode === "stack") { | |
| 638 $(tablesaw.table) | |
| 639 .data(data.key) | |
| 640 .init(); | |
| 641 } | |
| 642 }) | |
| 643 .on(Tablesaw.events.destroy, function(e, tablesaw) { | |
| 644 if (tablesaw.mode === "stack") { | |
| 645 $(tablesaw.table) | |
| 646 .data(data.key) | |
| 647 .destroy(); | |
| 648 } | |
| 649 }); | |
| 650 | |
| 651 Tablesaw.Stack = Stack; | |
| 652 })(); | |
| 653 | |
| 654 (function() { | |
| 655 var pluginName = "tablesawbtn", | |
| 656 methods = { | |
| 657 _create: function() { | |
| 658 return $(this).each(function() { | |
| 659 $(this) | |
| 660 .trigger("beforecreate." + pluginName) | |
| 661 [pluginName]("_init") | |
| 662 .trigger("create." + pluginName); | |
| 663 }); | |
| 664 }, | |
| 665 _init: function() { | |
| 666 var oEl = $(this), | |
| 667 sel = this.getElementsByTagName("select")[0]; | |
| 668 | |
| 669 if (sel) { | |
| 670 // TODO next major version: remove .btn-select | |
| 671 $(this) | |
| 672 .addClass("btn-select tablesaw-btn-select") | |
| 673 [pluginName]("_select", sel); | |
| 674 } | |
| 675 return oEl; | |
| 676 }, | |
| 677 _select: function(sel) { | |
| 678 var update = function(oEl, sel) { | |
| 679 var opts = $(sel).find("option"); | |
| 680 var label = document.createElement("span"); | |
| 681 var el; | |
| 682 var children; | |
| 683 var found = false; | |
| 684 | |
| 685 label.setAttribute("aria-hidden", "true"); | |
| 686 label.innerHTML = " "; | |
| 687 | |
| 688 opts.each(function() { | |
| 689 var opt = this; | |
| 690 if (opt.selected) { | |
| 691 label.innerHTML = opt.text; | |
| 692 } | |
| 693 }); | |
| 694 | |
| 695 children = oEl.childNodes; | |
| 696 if (opts.length > 0) { | |
| 697 for (var i = 0, l = children.length; i < l; i++) { | |
| 698 el = children[i]; | |
| 699 | |
| 700 if (el && el.nodeName.toUpperCase() === "SPAN") { | |
| 701 oEl.replaceChild(label, el); | |
| 702 found = true; | |
| 703 } | |
| 704 } | |
| 705 | |
| 706 if (!found) { | |
| 707 oEl.insertBefore(label, oEl.firstChild); | |
| 708 } | |
| 709 } | |
| 710 }; | |
| 711 | |
| 712 update(this, sel); | |
| 713 // todo should this be tablesawrefresh? | |
| 714 $(this).on("change refresh", function() { | |
| 715 update(this, sel); | |
| 716 }); | |
| 717 } | |
| 718 }; | |
| 719 | |
| 720 // Collection method. | |
| 721 $.fn[pluginName] = function(arrg, a, b, c) { | |
| 722 return this.each(function() { | |
| 723 // if it's a method | |
| 724 if (arrg && typeof arrg === "string") { | |
| 725 return $.fn[pluginName].prototype[arrg].call(this, a, b, c); | |
| 726 } | |
| 727 | |
| 728 // don't re-init | |
| 729 if ($(this).data(pluginName + "active")) { | |
| 730 return $(this); | |
| 731 } | |
| 732 | |
| 733 $(this).data(pluginName + "active", true); | |
| 734 | |
| 735 $.fn[pluginName].prototype._create.call(this); | |
| 736 }); | |
| 737 }; | |
| 738 | |
| 739 // add methods | |
| 740 $.extend($.fn[pluginName].prototype, methods); | |
| 741 | |
| 742 // TODO OOP this and add to Tablesaw object | |
| 743 })(); | |
| 744 | |
| 745 (function() { | |
| 746 var data = { | |
| 747 key: "tablesaw-coltoggle" | |
| 748 }; | |
| 749 | |
| 750 var ColumnToggle = function(element) { | |
| 751 this.$table = $(element); | |
| 752 | |
| 753 if (!this.$table.length) { | |
| 754 return; | |
| 755 } | |
| 756 | |
| 757 this.tablesaw = this.$table.data("tablesaw"); | |
| 758 | |
| 759 this.attributes = { | |
| 760 btnTarget: "data-tablesaw-columntoggle-btn-target", | |
| 761 set: "data-tablesaw-columntoggle-set" | |
| 762 }; | |
| 763 | |
| 764 this.classes = { | |
| 765 columnToggleTable: "tablesaw-columntoggle", | |
| 766 columnBtnContain: "tablesaw-columntoggle-btnwrap tablesaw-advance", | |
| 767 columnBtn: "tablesaw-columntoggle-btn tablesaw-nav-btn down", | |
| 768 popup: "tablesaw-columntoggle-popup", | |
| 769 priorityPrefix: "tablesaw-priority-" | |
| 770 }; | |
| 771 | |
| 772 this.set = []; | |
| 773 this.$headers = this.tablesaw._getPrimaryHeaderCells(); | |
| 774 | |
| 775 this.$table.data(data.key, this); | |
| 776 }; | |
| 777 | |
| 778 // Column Toggle Sets (one column chooser can control multiple tables) | |
| 779 ColumnToggle.prototype.initSet = function() { | |
| 780 var set = this.$table.attr(this.attributes.set); | |
| 781 if (set) { | |
| 782 // Should not include the current table | |
| 783 var table = this.$table[0]; | |
| 784 this.set = $("table[" + this.attributes.set + "='" + set + "']") | |
| 785 .filter(function() { | |
| 786 return this !== table; | |
| 787 }) | |
| 788 .get(); | |
| 789 } | |
| 790 }; | |
| 791 | |
| 792 ColumnToggle.prototype.init = function() { | |
| 793 if (!this.$table.length) { | |
| 794 return; | |
| 795 } | |
| 796 | |
| 797 var tableId, | |
| 798 id, | |
| 799 $menuButton, | |
| 800 $popup, | |
| 801 $menu, | |
| 802 $btnContain, | |
| 803 self = this; | |
| 804 | |
| 805 var cfg = this.tablesaw.getConfig({ | |
| 806 getColumnToggleLabelTemplate: function(text) { | |
| 807 return "<label><input type='checkbox' checked>" + text + "</label>"; | |
| 808 } | |
| 809 }); | |
| 810 | |
| 811 this.$table.addClass(this.classes.columnToggleTable); | |
| 812 | |
| 813 tableId = this.$table.attr("id"); | |
| 814 id = tableId + "-popup"; | |
| 815 $btnContain = $("<div class='" + this.classes.columnBtnContain + "'></div>"); | |
| 816 // TODO next major version: remove .btn | |
| 817 $menuButton = $( | |
| 818 "<a href='#" + | |
| 819 id + | |
| 820 "' class='btn tablesaw-btn btn-micro " + | |
| 821 this.classes.columnBtn + | |
| 822 "' data-popup-link>" + | |
| 823 "<span>" + | |
| 824 Tablesaw.i18n.columnToggleButton + | |
| 825 "</span></a>" | |
| 826 ); | |
| 827 $popup = $("<div class='" + this.classes.popup + "' id='" + id + "'></div>"); | |
| 828 $menu = $("<div class='btn-group'></div>"); | |
| 829 | |
| 830 this.$popup = $popup; | |
| 831 | |
| 832 var hasNonPersistentHeaders = false; | |
| 833 this.$headers.each(function() { | |
| 834 var $this = $(this), | |
| 835 priority = $this.attr("data-tablesaw-priority"), | |
| 836 $cells = self.tablesaw._$getCells(this); | |
| 837 | |
| 838 if (priority && priority !== "persist") { | |
| 839 $cells.addClass(self.classes.priorityPrefix + priority); | |
| 840 | |
| 841 $(cfg.getColumnToggleLabelTemplate($this.text())) | |
| 842 .appendTo($menu) | |
| 843 .find('input[type="checkbox"]') | |
| 844 .data("tablesaw-header", this); | |
| 845 | |
| 846 hasNonPersistentHeaders = true; | |
| 847 } | |
| 848 }); | |
| 849 | |
| 850 if (!hasNonPersistentHeaders) { | |
| 851 $menu.append("<label>" + Tablesaw.i18n.columnToggleError + "</label>"); | |
| 852 } | |
| 853 | |
| 854 $menu.appendTo($popup); | |
| 855 | |
| 856 function onToggleCheckboxChange(checkbox) { | |
| 857 var checked = checkbox.checked; | |
| 858 | |
| 859 var header = self.getHeaderFromCheckbox(checkbox); | |
| 860 var $cells = self.tablesaw._$getCells(header); | |
| 861 | |
| 862 $cells[!checked ? "addClass" : "removeClass"]("tablesaw-toggle-cellhidden"); | |
| 863 $cells[checked ? "addClass" : "removeClass"]("tablesaw-toggle-cellvisible"); | |
| 864 | |
| 865 self.updateColspanCells(header, checked); | |
| 866 | |
| 867 self.$table.trigger("tablesawcolumns"); | |
| 868 } | |
| 869 | |
| 870 // bind change event listeners to inputs - TODO: move to a private method? | |
| 871 $menu.find('input[type="checkbox"]').on("change", function(e) { | |
| 872 onToggleCheckboxChange(e.target); | |
| 873 | |
| 874 if (self.set.length) { | |
| 875 var index; | |
| 876 $(self.$popup) | |
| 877 .find("input[type='checkbox']") | |
| 878 .each(function(j) { | |
| 879 if (this === e.target) { | |
| 880 index = j; | |
| 881 return false; | |
| 882 } | |
| 883 }); | |
| 884 | |
| 885 $(self.set).each(function() { | |
| 886 var checkbox = $(this) | |
| 887 .data(data.key) | |
| 888 .$popup.find("input[type='checkbox']") | |
| 889 .get(index); | |
| 890 if (checkbox) { | |
| 891 checkbox.checked = e.target.checked; | |
| 892 onToggleCheckboxChange(checkbox); | |
| 893 } | |
| 894 }); | |
| 895 } | |
| 896 }); | |
| 897 | |
| 898 $menuButton.appendTo($btnContain); | |
| 899 | |
| 900 // Use a different target than the toolbar | |
| 901 var $btnTarget = $(this.$table.attr(this.attributes.btnTarget)); | |
| 902 $btnContain.appendTo($btnTarget.length ? $btnTarget : this.tablesaw.$toolbar); | |
| 903 | |
| 904 function closePopup(event) { | |
| 905 // Click came from inside the popup, ignore. | |
| 906 if (event && $(event.target).closest("." + self.classes.popup).length) { | |
| 907 return; | |
| 908 } | |
| 909 | |
| 910 $(document).off("click." + tableId); | |
| 911 $menuButton.removeClass("up").addClass("down"); | |
| 912 $btnContain.removeClass("visible"); | |
| 913 } | |
| 914 | |
| 915 var closeTimeout; | |
| 916 function openPopup() { | |
| 917 $btnContain.addClass("visible"); | |
| 918 $menuButton.removeClass("down").addClass("up"); | |
| 919 | |
| 920 $(document).off("click." + tableId, closePopup); | |
| 921 | |
| 922 window.clearTimeout(closeTimeout); | |
| 923 closeTimeout = window.setTimeout(function() { | |
| 924 $(document).on("click." + tableId, closePopup); | |
| 925 }, 15); | |
| 926 } | |
| 927 | |
| 928 $menuButton.on("click.tablesaw", function(event) { | |
| 929 event.preventDefault(); | |
| 930 | |
| 931 if (!$btnContain.is(".visible")) { | |
| 932 openPopup(); | |
| 933 } else { | |
| 934 closePopup(); | |
| 935 } | |
| 936 }); | |
| 937 | |
| 938 $popup.appendTo($btnContain); | |
| 939 | |
| 940 this.$menu = $menu; | |
| 941 | |
| 942 // Fix for iOS not rendering shadows correctly when using `-webkit-overflow-scrolling` | |
| 943 var $overflow = this.$table.closest(".tablesaw-overflow"); | |
| 944 if ($overflow.css("-webkit-overflow-scrolling")) { | |
| 945 var timeout; | |
| 946 $overflow.on("scroll", function() { | |
| 947 var $div = $(this); | |
| 948 window.clearTimeout(timeout); | |
| 949 timeout = window.setTimeout(function() { | |
| 950 $div.css("-webkit-overflow-scrolling", "auto"); | |
| 951 window.setTimeout(function() { | |
| 952 $div.css("-webkit-overflow-scrolling", "touch"); | |
| 953 }, 0); | |
| 954 }, 100); | |
| 955 }); | |
| 956 } | |
| 957 | |
| 958 $(window).on(Tablesaw.events.resize + "." + tableId, function() { | |
| 959 self.refreshToggle(); | |
| 960 }); | |
| 961 | |
| 962 this.initSet(); | |
| 963 this.refreshToggle(); | |
| 964 }; | |
| 965 | |
| 966 ColumnToggle.prototype.getHeaderFromCheckbox = function(checkbox) { | |
| 967 return $(checkbox).data("tablesaw-header"); | |
| 968 }; | |
| 969 | |
| 970 ColumnToggle.prototype.refreshToggle = function() { | |
| 971 var self = this; | |
| 972 var invisibleColumns = 0; | |
| 973 this.$menu.find("input").each(function() { | |
| 974 var header = self.getHeaderFromCheckbox(this); | |
| 975 this.checked = | |
| 976 self.tablesaw | |
| 977 ._$getCells(header) | |
| 978 .eq(0) | |
| 979 .css("display") === "table-cell"; | |
| 980 }); | |
| 981 | |
| 982 this.updateColspanCells(); | |
| 983 }; | |
| 984 | |
| 985 ColumnToggle.prototype.updateColspanCells = function(header, userAction) { | |
| 986 this.tablesaw.updateColspanCells("tablesaw-toggle-cellhidden", header, userAction); | |
| 987 }; | |
| 988 | |
| 989 ColumnToggle.prototype.destroy = function() { | |
| 990 this.$table.removeClass(this.classes.columnToggleTable); | |
| 991 this.$table.find("th, td").each(function() { | |
| 992 var $cell = $(this); | |
| 993 $cell.removeClass("tablesaw-toggle-cellhidden").removeClass("tablesaw-toggle-cellvisible"); | |
| 994 | |
| 995 this.className = this.className.replace(/\bui\-table\-priority\-\d\b/g, ""); | |
| 996 }); | |
| 997 }; | |
| 998 | |
| 999 // on tablecreate, init | |
| 1000 $(document).on(Tablesaw.events.create, function(e, tablesaw) { | |
| 1001 if (tablesaw.mode === "columntoggle") { | |
| 1002 var table = new ColumnToggle(tablesaw.table); | |
| 1003 table.init(); | |
| 1004 } | |
| 1005 }); | |
| 1006 | |
| 1007 $(document).on(Tablesaw.events.destroy, function(e, tablesaw) { | |
| 1008 if (tablesaw.mode === "columntoggle") { | |
| 1009 $(tablesaw.table) | |
| 1010 .data(data.key) | |
| 1011 .destroy(); | |
| 1012 } | |
| 1013 }); | |
| 1014 | |
| 1015 $(document).on(Tablesaw.events.refresh, function(e, tablesaw) { | |
| 1016 if (tablesaw.mode === "columntoggle") { | |
| 1017 $(tablesaw.table) | |
| 1018 .data(data.key) | |
| 1019 .refreshPriority(); | |
| 1020 } | |
| 1021 }); | |
| 1022 | |
| 1023 Tablesaw.ColumnToggle = ColumnToggle; | |
| 1024 })(); | |
| 1025 | |
| 1026 (function() { | |
| 1027 function getSortValue(cell) { | |
| 1028 var text = []; | |
| 1029 $(cell.childNodes).each(function() { | |
| 1030 var $el = $(this); | |
| 1031 if ($el.is("input, select")) { | |
| 1032 text.push($el.val()); | |
| 1033 } else if ($el.is(".tablesaw-cell-label")) { | |
| 1034 } else { | |
| 1035 text.push(($el.text() || "").replace(/^\s+|\s+$/g, "")); | |
| 1036 } | |
| 1037 }); | |
| 1038 | |
| 1039 return text.join(""); | |
| 1040 } | |
| 1041 | |
| 1042 var pluginName = "tablesaw-sortable", | |
| 1043 initSelector = "table[data-" + pluginName + "]", | |
| 1044 sortableSwitchSelector = "[data-" + pluginName + "-switch]", | |
| 1045 attrs = { | |
| 1046 sortCol: "data-tablesaw-sortable-col", | |
| 1047 defaultCol: "data-tablesaw-sortable-default-col", | |
| 1048 numericCol: "data-tablesaw-sortable-numeric", | |
| 1049 subRow: "data-tablesaw-subrow", | |
| 1050 ignoreRow: "data-tablesaw-ignorerow" | |
| 1051 }, | |
| 1052 classes = { | |
| 1053 head: pluginName + "-head", | |
| 1054 ascend: pluginName + "-ascending", | |
| 1055 descend: pluginName + "-descending", | |
| 1056 switcher: pluginName + "-switch", | |
| 1057 tableToolbar: "tablesaw-bar-section", | |
| 1058 sortButton: pluginName + "-btn" | |
| 1059 }, | |
| 1060 methods = { | |
| 1061 _create: function(o) { | |
| 1062 return $(this).each(function() { | |
| 1063 var init = $(this).data(pluginName + "-init"); | |
| 1064 if (init) { | |
| 1065 return false; | |
| 1066 } | |
| 1067 $(this) | |
| 1068 .data(pluginName + "-init", true) | |
| 1069 .trigger("beforecreate." + pluginName) | |
| 1070 [pluginName]("_init", o) | |
| 1071 .trigger("create." + pluginName); | |
| 1072 }); | |
| 1073 }, | |
| 1074 _init: function() { | |
| 1075 var el = $(this); | |
| 1076 var tblsaw = el.data("tablesaw"); | |
| 1077 var heads; | |
| 1078 var $switcher; | |
| 1079 | |
| 1080 function addClassToHeads(h) { | |
| 1081 $.each(h, function(i, v) { | |
| 1082 $(v).addClass(classes.head); | |
| 1083 }); | |
| 1084 } | |
| 1085 | |
| 1086 function makeHeadsActionable(h, fn) { | |
| 1087 $.each(h, function(i, col) { | |
| 1088 var b = $("<button class='" + classes.sortButton + "'/>"); | |
| 1089 b.on("click", { col: col }, fn); | |
| 1090 $(col) | |
| 1091 .wrapInner(b) | |
| 1092 .find("button") | |
| 1093 .append("<span class='tablesaw-sortable-arrow'>"); | |
| 1094 }); | |
| 1095 } | |
| 1096 | |
| 1097 function clearOthers(headcells) { | |
| 1098 $.each(headcells, function(i, v) { | |
| 1099 var col = $(v); | |
| 1100 col.removeAttr(attrs.defaultCol); | |
| 1101 col.removeClass(classes.ascend); | |
| 1102 col.removeClass(classes.descend); | |
| 1103 }); | |
| 1104 } | |
| 1105 | |
| 1106 function headsOnAction(e) { | |
| 1107 if ($(e.target).is("a[href]")) { | |
| 1108 return; | |
| 1109 } | |
| 1110 | |
| 1111 e.stopPropagation(); | |
| 1112 var headCell = $(e.target).closest("[" + attrs.sortCol + "]"), | |
| 1113 v = e.data.col, | |
| 1114 newSortValue = heads.index(headCell[0]); | |
| 1115 | |
| 1116 clearOthers( | |
| 1117 headCell | |
| 1118 .closest("thead") | |
| 1119 .find("th") | |
| 1120 .filter(function() { | |
| 1121 return this !== headCell[0]; | |
| 1122 }) | |
| 1123 ); | |
| 1124 if (headCell.is("." + classes.descend) || !headCell.is("." + classes.ascend)) { | |
| 1125 el[pluginName]("sortBy", v, true); | |
| 1126 newSortValue += "_asc"; | |
| 1127 } else { | |
| 1128 el[pluginName]("sortBy", v); | |
| 1129 newSortValue += "_desc"; | |
| 1130 } | |
| 1131 if ($switcher) { | |
| 1132 $switcher | |
| 1133 .find("select") | |
| 1134 .val(newSortValue) | |
| 1135 .trigger("refresh"); | |
| 1136 } | |
| 1137 | |
| 1138 e.preventDefault(); | |
| 1139 } | |
| 1140 | |
| 1141 function handleDefault(heads) { | |
| 1142 $.each(heads, function(idx, el) { | |
| 1143 var $el = $(el); | |
| 1144 if ($el.is("[" + attrs.defaultCol + "]")) { | |
| 1145 if (!$el.is("." + classes.descend)) { | |
| 1146 $el.addClass(classes.ascend); | |
| 1147 } | |
| 1148 } | |
| 1149 }); | |
| 1150 } | |
| 1151 | |
| 1152 function addSwitcher(heads) { | |
| 1153 $switcher = $("<div>") | |
| 1154 .addClass(classes.switcher) | |
| 1155 .addClass(classes.tableToolbar); | |
| 1156 | |
| 1157 var html = ["<label>" + Tablesaw.i18n.sort + ":"]; | |
| 1158 | |
| 1159 // TODO next major version: remove .btn | |
| 1160 html.push('<span class="btn tablesaw-btn"><select>'); | |
| 1161 heads.each(function(j) { | |
| 1162 var $t = $(this); | |
| 1163 var isDefaultCol = $t.is("[" + attrs.defaultCol + "]"); | |
| 1164 var isDescending = $t.is("." + classes.descend); | |
| 1165 | |
| 1166 var hasNumericAttribute = $t.is("[" + attrs.numericCol + "]"); | |
| 1167 var numericCount = 0; | |
| 1168 // Check only the first four rows to see if the column is numbers. | |
| 1169 var numericCountMax = 5; | |
| 1170 | |
| 1171 $(this.cells.slice(0, numericCountMax)).each(function() { | |
| 1172 if (!isNaN(parseInt(getSortValue(this), 10))) { | |
| 1173 numericCount++; | |
| 1174 } | |
| 1175 }); | |
| 1176 var isNumeric = numericCount === numericCountMax; | |
| 1177 if (!hasNumericAttribute) { | |
| 1178 $t.attr(attrs.numericCol, isNumeric ? "" : "false"); | |
| 1179 } | |
| 1180 | |
| 1181 html.push( | |
| 1182 "<option" + | |
| 1183 (isDefaultCol && !isDescending ? " selected" : "") + | |
| 1184 ' value="' + | |
| 1185 j + | |
| 1186 '_asc">' + | |
| 1187 $t.text() + | |
| 1188 " " + | |
| 1189 (isNumeric ? "↑" : "(A-Z)") + | |
| 1190 "</option>" | |
| 1191 ); | |
| 1192 html.push( | |
| 1193 "<option" + | |
| 1194 (isDefaultCol && isDescending ? " selected" : "") + | |
| 1195 ' value="' + | |
| 1196 j + | |
| 1197 '_desc">' + | |
| 1198 $t.text() + | |
| 1199 " " + | |
| 1200 (isNumeric ? "↓" : "(Z-A)") + | |
| 1201 "</option>" | |
| 1202 ); | |
| 1203 }); | |
| 1204 html.push("</select></span></label>"); | |
| 1205 | |
| 1206 $switcher.html(html.join("")); | |
| 1207 | |
| 1208 var $firstChild = tblsaw.$toolbar.children().eq(0); | |
| 1209 if ($firstChild.length) { | |
| 1210 $switcher.insertBefore($firstChild); | |
| 1211 } else { | |
| 1212 $switcher.appendTo(tblsaw.$toolbar); | |
| 1213 } | |
| 1214 $switcher.find(".tablesaw-btn").tablesawbtn(); | |
| 1215 $switcher.find("select").on("change", function() { | |
| 1216 var val = $(this) | |
| 1217 .val() | |
| 1218 .split("_"), | |
| 1219 head = heads.eq(val[0]); | |
| 1220 | |
| 1221 clearOthers(head.siblings()); | |
| 1222 el[pluginName]("sortBy", head.get(0), val[1] === "asc"); | |
| 1223 }); | |
| 1224 } | |
| 1225 | |
| 1226 el.addClass(pluginName); | |
| 1227 | |
| 1228 heads = el | |
| 1229 .children() | |
| 1230 .filter("thead") | |
| 1231 .find("th[" + attrs.sortCol + "]"); | |
| 1232 | |
| 1233 addClassToHeads(heads); | |
| 1234 makeHeadsActionable(heads, headsOnAction); | |
| 1235 handleDefault(heads); | |
| 1236 | |
| 1237 if (el.is(sortableSwitchSelector)) { | |
| 1238 addSwitcher(heads); | |
| 1239 } | |
| 1240 }, | |
| 1241 sortRows: function(rows, colNum, ascending, col, tbody) { | |
| 1242 function convertCells(cellArr, belongingToTbody) { | |
| 1243 var cells = []; | |
| 1244 $.each(cellArr, function(i, cell) { | |
| 1245 var row = cell.parentNode; | |
| 1246 var $row = $(row); | |
| 1247 // next row is a subrow | |
| 1248 var subrows = []; | |
| 1249 var $next = $row.next(); | |
| 1250 while ($next.is("[" + attrs.subRow + "]")) { | |
| 1251 subrows.push($next[0]); | |
| 1252 $next = $next.next(); | |
| 1253 } | |
| 1254 | |
| 1255 var tbody = row.parentNode; | |
| 1256 | |
| 1257 // current row is a subrow | |
| 1258 if ($row.is("[" + attrs.subRow + "]")) { | |
| 1259 } else if (tbody === belongingToTbody) { | |
| 1260 cells.push({ | |
| 1261 element: cell, | |
| 1262 cell: getSortValue(cell), | |
| 1263 row: row, | |
| 1264 subrows: subrows.length ? subrows : null, | |
| 1265 ignored: $row.is("[" + attrs.ignoreRow + "]") | |
| 1266 }); | |
| 1267 } | |
| 1268 }); | |
| 1269 return cells; | |
| 1270 } | |
| 1271 | |
| 1272 function getSortFxn(ascending, forceNumeric) { | |
| 1273 var fn, | |
| 1274 regex = /[^\-\+\d\.]/g; | |
| 1275 if (ascending) { | |
| 1276 fn = function(a, b) { | |
| 1277 if (a.ignored || b.ignored) { | |
| 1278 return 0; | |
| 1279 } | |
| 1280 if (forceNumeric) { | |
| 1281 return ( | |
| 1282 parseFloat(a.cell.replace(regex, "")) - parseFloat(b.cell.replace(regex, "")) | |
| 1283 ); | |
| 1284 } else { | |
| 1285 return a.cell.toLowerCase() > b.cell.toLowerCase() ? 1 : -1; | |
| 1286 } | |
| 1287 }; | |
| 1288 } else { | |
| 1289 fn = function(a, b) { | |
| 1290 if (a.ignored || b.ignored) { | |
| 1291 return 0; | |
| 1292 } | |
| 1293 if (forceNumeric) { | |
| 1294 return ( | |
| 1295 parseFloat(b.cell.replace(regex, "")) - parseFloat(a.cell.replace(regex, "")) | |
| 1296 ); | |
| 1297 } else { | |
| 1298 return a.cell.toLowerCase() < b.cell.toLowerCase() ? 1 : -1; | |
| 1299 } | |
| 1300 }; | |
| 1301 } | |
| 1302 return fn; | |
| 1303 } | |
| 1304 | |
| 1305 function convertToRows(sorted) { | |
| 1306 var newRows = [], | |
| 1307 i, | |
| 1308 l; | |
| 1309 for (i = 0, l = sorted.length; i < l; i++) { | |
| 1310 newRows.push(sorted[i].row); | |
| 1311 if (sorted[i].subrows) { | |
| 1312 newRows.push(sorted[i].subrows); | |
| 1313 } | |
| 1314 } | |
| 1315 return newRows; | |
| 1316 } | |
| 1317 | |
| 1318 var fn; | |
| 1319 var sorted; | |
| 1320 var cells = convertCells(col.cells, tbody); | |
| 1321 | |
| 1322 var customFn = $(col).data("tablesaw-sort"); | |
| 1323 | |
| 1324 fn = | |
| 1325 (customFn && typeof customFn === "function" ? customFn(ascending) : false) || | |
| 1326 getSortFxn( | |
| 1327 ascending, | |
| 1328 $(col).is("[" + attrs.numericCol + "]") && | |
| 1329 !$(col).is("[" + attrs.numericCol + '="false"]') | |
| 1330 ); | |
| 1331 | |
| 1332 sorted = cells.sort(fn); | |
| 1333 | |
| 1334 rows = convertToRows(sorted); | |
| 1335 | |
| 1336 return rows; | |
| 1337 }, | |
| 1338 makeColDefault: function(col, a) { | |
| 1339 var c = $(col); | |
| 1340 c.attr(attrs.defaultCol, "true"); | |
| 1341 if (a) { | |
| 1342 c.removeClass(classes.descend); | |
| 1343 c.addClass(classes.ascend); | |
| 1344 } else { | |
| 1345 c.removeClass(classes.ascend); | |
| 1346 c.addClass(classes.descend); | |
| 1347 } | |
| 1348 }, | |
| 1349 sortBy: function(col, ascending) { | |
| 1350 var el = $(this); | |
| 1351 var colNum; | |
| 1352 var tbl = el.data("tablesaw"); | |
| 1353 tbl.$tbody.each(function() { | |
| 1354 var tbody = this; | |
| 1355 var $tbody = $(this); | |
| 1356 var rows = tbl.getBodyRows(tbody); | |
| 1357 var sortedRows; | |
| 1358 var map = tbl.headerMapping[0]; | |
| 1359 var j, k; | |
| 1360 | |
| 1361 // find the column number that we’re sorting | |
| 1362 for (j = 0, k = map.length; j < k; j++) { | |
| 1363 if (map[j] === col) { | |
| 1364 colNum = j; | |
| 1365 break; | |
| 1366 } | |
| 1367 } | |
| 1368 | |
| 1369 sortedRows = el[pluginName]("sortRows", rows, colNum, ascending, col, tbody); | |
| 1370 | |
| 1371 // replace Table rows | |
| 1372 for (j = 0, k = sortedRows.length; j < k; j++) { | |
| 1373 $tbody.append(sortedRows[j]); | |
| 1374 } | |
| 1375 }); | |
| 1376 | |
| 1377 el[pluginName]("makeColDefault", col, ascending); | |
| 1378 | |
| 1379 el.trigger("tablesaw-sorted"); | |
| 1380 } | |
| 1381 }; | |
| 1382 | |
| 1383 // Collection method. | |
| 1384 $.fn[pluginName] = function(arrg) { | |
| 1385 var args = Array.prototype.slice.call(arguments, 1), | |
| 1386 returnVal; | |
| 1387 | |
| 1388 // if it's a method | |
| 1389 if (arrg && typeof arrg === "string") { | |
| 1390 returnVal = $.fn[pluginName].prototype[arrg].apply(this[0], args); | |
| 1391 return typeof returnVal !== "undefined" ? returnVal : $(this); | |
| 1392 } | |
| 1393 // check init | |
| 1394 if (!$(this).data(pluginName + "-active")) { | |
| 1395 $(this).data(pluginName + "-active", true); | |
| 1396 $.fn[pluginName].prototype._create.call(this, arrg); | |
| 1397 } | |
| 1398 return $(this); | |
| 1399 }; | |
| 1400 // add methods | |
| 1401 $.extend($.fn[pluginName].prototype, methods); | |
| 1402 | |
| 1403 $(document).on(Tablesaw.events.create, function(e, Tablesaw) { | |
| 1404 if (Tablesaw.$table.is(initSelector)) { | |
| 1405 Tablesaw.$table[pluginName](); | |
| 1406 } | |
| 1407 }); | |
| 1408 | |
| 1409 // TODO OOP this and add to Tablesaw object | |
| 1410 })(); | |
| 1411 | |
| 1412 (function() { | |
| 1413 var classes = { | |
| 1414 hideBtn: "disabled", | |
| 1415 persistWidths: "tablesaw-fix-persist", | |
| 1416 hiddenCol: "tablesaw-swipe-cellhidden", | |
| 1417 persistCol: "tablesaw-swipe-cellpersist", | |
| 1418 allColumnsVisible: "tablesaw-all-cols-visible" | |
| 1419 }; | |
| 1420 var attrs = { | |
| 1421 disableTouchEvents: "data-tablesaw-no-touch", | |
| 1422 ignorerow: "data-tablesaw-ignorerow", | |
| 1423 subrow: "data-tablesaw-subrow" | |
| 1424 }; | |
| 1425 | |
| 1426 function createSwipeTable(tbl, $table) { | |
| 1427 var tblsaw = $table.data("tablesaw"); | |
| 1428 | |
| 1429 var $btns = $("<div class='tablesaw-advance'></div>"); | |
| 1430 // TODO next major version: remove .btn | |
| 1431 var $prevBtn = $( | |
| 1432 "<a href='#' class='btn tablesaw-nav-btn tablesaw-btn btn-micro left'>" + | |
| 1433 Tablesaw.i18n.swipePreviousColumn + | |
| 1434 "</a>" | |
| 1435 ).appendTo($btns); | |
| 1436 // TODO next major version: remove .btn | |
| 1437 var $nextBtn = $( | |
| 1438 "<a href='#' class='btn tablesaw-nav-btn tablesaw-btn btn-micro right'>" + | |
| 1439 Tablesaw.i18n.swipeNextColumn + | |
| 1440 "</a>" | |
| 1441 ).appendTo($btns); | |
| 1442 | |
| 1443 var $headerCells = tbl._getPrimaryHeaderCells(); | |
| 1444 var $headerCellsNoPersist = $headerCells.not('[data-tablesaw-priority="persist"]'); | |
| 1445 var headerWidths = []; | |
| 1446 var $head = $(document.head || "head"); | |
| 1447 var tableId = $table.attr("id"); | |
| 1448 | |
| 1449 if (!$headerCells.length) { | |
| 1450 throw new Error("tablesaw swipe: no header cells found."); | |
| 1451 } | |
| 1452 | |
| 1453 $table.addClass("tablesaw-swipe"); | |
| 1454 | |
| 1455 function initMinHeaderWidths() { | |
| 1456 $table.css({ | |
| 1457 width: "1px" | |
| 1458 }); | |
| 1459 | |
| 1460 // remove any hidden columns | |
| 1461 $table.find("." + classes.hiddenCol).removeClass(classes.hiddenCol); | |
| 1462 | |
| 1463 headerWidths = []; | |
| 1464 // Calculate initial widths | |
| 1465 $headerCells.each(function() { | |
| 1466 headerWidths.push(this.offsetWidth); | |
| 1467 }); | |
| 1468 | |
| 1469 // reset props | |
| 1470 $table.css({ | |
| 1471 width: "" | |
| 1472 }); | |
| 1473 } | |
| 1474 | |
| 1475 initMinHeaderWidths(); | |
| 1476 | |
| 1477 $btns.appendTo(tblsaw.$toolbar); | |
| 1478 | |
| 1479 if (!tableId) { | |
| 1480 tableId = "tableswipe-" + Math.round(Math.random() * 10000); | |
| 1481 $table.attr("id", tableId); | |
| 1482 } | |
| 1483 | |
| 1484 function showColumn(headerCell) { | |
| 1485 tblsaw._$getCells(headerCell).removeClass(classes.hiddenCol); | |
| 1486 } | |
| 1487 | |
| 1488 function hideColumn(headerCell) { | |
| 1489 tblsaw._$getCells(headerCell).addClass(classes.hiddenCol); | |
| 1490 } | |
| 1491 | |
| 1492 function persistColumn(headerCell) { | |
| 1493 tblsaw._$getCells(headerCell).addClass(classes.persistCol); | |
| 1494 } | |
| 1495 | |
| 1496 function isPersistent(headerCell) { | |
| 1497 return $(headerCell).is('[data-tablesaw-priority="persist"]'); | |
| 1498 } | |
| 1499 | |
| 1500 function unmaintainWidths() { | |
| 1501 $table.removeClass(classes.persistWidths); | |
| 1502 $("#" + tableId + "-persist").remove(); | |
| 1503 } | |
| 1504 | |
| 1505 function maintainWidths() { | |
| 1506 var prefix = "#" + tableId + ".tablesaw-swipe ", | |
| 1507 styles = [], | |
| 1508 tableWidth = $table.width(), | |
| 1509 hash = [], | |
| 1510 newHash; | |
| 1511 | |
| 1512 // save persistent column widths (as long as they take up less than 75% of table width) | |
| 1513 $headerCells.each(function(index) { | |
| 1514 var width; | |
| 1515 if (isPersistent(this)) { | |
| 1516 width = this.offsetWidth; | |
| 1517 | |
| 1518 if (width < tableWidth * 0.75) { | |
| 1519 hash.push(index + "-" + width); | |
| 1520 styles.push( | |
| 1521 prefix + | |
| 1522 " ." + | |
| 1523 classes.persistCol + | |
| 1524 ":nth-child(" + | |
| 1525 (index + 1) + | |
| 1526 ") { width: " + | |
| 1527 width + | |
| 1528 "px; }" | |
| 1529 ); | |
| 1530 } | |
| 1531 } | |
| 1532 }); | |
| 1533 newHash = hash.join("_"); | |
| 1534 | |
| 1535 if (styles.length) { | |
| 1536 $table.addClass(classes.persistWidths); | |
| 1537 var $style = $("#" + tableId + "-persist"); | |
| 1538 // If style element not yet added OR if the widths have changed | |
| 1539 if (!$style.length || $style.data("tablesaw-hash") !== newHash) { | |
| 1540 // Remove existing | |
| 1541 $style.remove(); | |
| 1542 | |
| 1543 $("<style>" + styles.join("\n") + "</style>") | |
| 1544 .attr("id", tableId + "-persist") | |
| 1545 .data("tablesaw-hash", newHash) | |
| 1546 .appendTo($head); | |
| 1547 } | |
| 1548 } | |
| 1549 } | |
| 1550 | |
| 1551 function getNext() { | |
| 1552 var next = [], | |
| 1553 checkFound; | |
| 1554 | |
| 1555 $headerCellsNoPersist.each(function(i) { | |
| 1556 var $t = $(this), | |
| 1557 isHidden = $t.css("display") === "none" || $t.is("." + classes.hiddenCol); | |
| 1558 | |
| 1559 if (!isHidden && !checkFound) { | |
| 1560 checkFound = true; | |
| 1561 next[0] = i; | |
| 1562 } else if (isHidden && checkFound) { | |
| 1563 next[1] = i; | |
| 1564 | |
| 1565 return false; | |
| 1566 } | |
| 1567 }); | |
| 1568 | |
| 1569 return next; | |
| 1570 } | |
| 1571 | |
| 1572 function getPrev() { | |
| 1573 var next = getNext(); | |
| 1574 return [next[1] - 1, next[0] - 1]; | |
| 1575 } | |
| 1576 | |
| 1577 function nextpair(fwd) { | |
| 1578 return fwd ? getNext() : getPrev(); | |
| 1579 } | |
| 1580 | |
| 1581 function canAdvance(pair) { | |
| 1582 return pair[1] > -1 && pair[1] < $headerCellsNoPersist.length; | |
| 1583 } | |
| 1584 | |
| 1585 function matchesMedia() { | |
| 1586 var matchMedia = $table.attr("data-tablesaw-swipe-media"); | |
| 1587 return !matchMedia || ("matchMedia" in window && window.matchMedia(matchMedia).matches); | |
| 1588 } | |
| 1589 | |
| 1590 function fakeBreakpoints() { | |
| 1591 if (!matchesMedia()) { | |
| 1592 return; | |
| 1593 } | |
| 1594 | |
| 1595 var containerWidth = $table.parent().width(), | |
| 1596 persist = [], | |
| 1597 sum = 0, | |
| 1598 sums = [], | |
| 1599 visibleNonPersistantCount = $headerCells.length; | |
| 1600 | |
| 1601 $headerCells.each(function(index) { | |
| 1602 var $t = $(this), | |
| 1603 isPersist = $t.is('[data-tablesaw-priority="persist"]'); | |
| 1604 | |
| 1605 persist.push(isPersist); | |
| 1606 sum += headerWidths[index]; | |
| 1607 sums.push(sum); | |
| 1608 | |
| 1609 // is persistent or is hidden | |
| 1610 if (isPersist || sum > containerWidth) { | |
| 1611 visibleNonPersistantCount--; | |
| 1612 } | |
| 1613 }); | |
| 1614 | |
| 1615 // We need at least one column to swipe. | |
| 1616 var needsNonPersistentColumn = visibleNonPersistantCount === 0; | |
| 1617 | |
| 1618 $headerCells.each(function(index) { | |
| 1619 if (sums[index] > containerWidth) { | |
| 1620 hideColumn(this); | |
| 1621 } | |
| 1622 }); | |
| 1623 | |
| 1624 $headerCells.each(function(index) { | |
| 1625 if (persist[index]) { | |
| 1626 // for visual box-shadow | |
| 1627 persistColumn(this); | |
| 1628 return; | |
| 1629 } | |
| 1630 | |
| 1631 if (sums[index] <= containerWidth || needsNonPersistentColumn) { | |
| 1632 needsNonPersistentColumn = false; | |
| 1633 showColumn(this); | |
| 1634 tblsaw.updateColspanCells(classes.hiddenCol, this, true); | |
| 1635 } | |
| 1636 }); | |
| 1637 | |
| 1638 unmaintainWidths(); | |
| 1639 | |
| 1640 $table.trigger("tablesawcolumns"); | |
| 1641 } | |
| 1642 | |
| 1643 function advance(fwd) { | |
| 1644 var pair = nextpair(fwd); | |
| 1645 if (canAdvance(pair)) { | |
| 1646 if (isNaN(pair[0])) { | |
| 1647 if (fwd) { | |
| 1648 pair[0] = 0; | |
| 1649 } else { | |
| 1650 pair[0] = $headerCellsNoPersist.length - 1; | |
| 1651 } | |
| 1652 } | |
| 1653 | |
| 1654 // TODO just blindly hiding the previous column and showing the next column can result in | |
| 1655 // column content overflow | |
| 1656 maintainWidths(); | |
| 1657 hideColumn($headerCellsNoPersist.get(pair[0])); | |
| 1658 tblsaw.updateColspanCells(classes.hiddenCol, $headerCellsNoPersist.get(pair[0]), false); | |
| 1659 | |
| 1660 showColumn($headerCellsNoPersist.get(pair[1])); | |
| 1661 tblsaw.updateColspanCells(classes.hiddenCol, $headerCellsNoPersist.get(pair[1]), true); | |
| 1662 | |
| 1663 $table.trigger("tablesawcolumns"); | |
| 1664 } | |
| 1665 } | |
| 1666 | |
| 1667 $prevBtn.add($nextBtn).on("click", function(e) { | |
| 1668 advance(!!$(e.target).closest($nextBtn).length); | |
| 1669 e.preventDefault(); | |
| 1670 }); | |
| 1671 | |
| 1672 function getCoord(event, key) { | |
| 1673 return (event.touches || event.originalEvent.touches)[0][key]; | |
| 1674 } | |
| 1675 | |
| 1676 if (!$table.is("[" + attrs.disableTouchEvents + "]")) { | |
| 1677 $table.on("touchstart.swipetoggle", function(e) { | |
| 1678 var originX = getCoord(e, "pageX"); | |
| 1679 var originY = getCoord(e, "pageY"); | |
| 1680 var x; | |
| 1681 var y; | |
| 1682 var scrollTop = window.pageYOffset; | |
| 1683 | |
| 1684 $(window).off(Tablesaw.events.resize, fakeBreakpoints); | |
| 1685 | |
| 1686 $(this) | |
| 1687 .on("touchmove.swipetoggle", function(e) { | |
| 1688 x = getCoord(e, "pageX"); | |
| 1689 y = getCoord(e, "pageY"); | |
| 1690 }) | |
| 1691 .on("touchend.swipetoggle", function() { | |
| 1692 var cfg = tbl.getConfig({ | |
| 1693 swipeHorizontalThreshold: 30, | |
| 1694 swipeVerticalThreshold: 30 | |
| 1695 }); | |
| 1696 | |
| 1697 // This config code is a little awkward because shoestring doesn’t support deep $.extend | |
| 1698 // Trying to work around when devs only override one of (not both) horizontalThreshold or | |
| 1699 // verticalThreshold in their TablesawConfig. | |
| 1700 // @TODO major version bump: remove cfg.swipe, move to just use the swipePrefix keys | |
| 1701 var verticalThreshold = cfg.swipe | |
| 1702 ? cfg.swipe.verticalThreshold | |
| 1703 : cfg.swipeVerticalThreshold; | |
| 1704 var horizontalThreshold = cfg.swipe | |
| 1705 ? cfg.swipe.horizontalThreshold | |
| 1706 : cfg.swipeHorizontalThreshold; | |
| 1707 | |
| 1708 var isPageScrolled = Math.abs(window.pageYOffset - scrollTop) >= verticalThreshold; | |
| 1709 var isVerticalSwipe = Math.abs(y - originY) >= verticalThreshold; | |
| 1710 | |
| 1711 if (!isVerticalSwipe && !isPageScrolled) { | |
| 1712 if (x - originX < -1 * horizontalThreshold) { | |
| 1713 advance(true); | |
| 1714 } | |
| 1715 if (x - originX > horizontalThreshold) { | |
| 1716 advance(false); | |
| 1717 } | |
| 1718 } | |
| 1719 | |
| 1720 window.setTimeout(function() { | |
| 1721 $(window).on(Tablesaw.events.resize, fakeBreakpoints); | |
| 1722 }, 300); | |
| 1723 | |
| 1724 $(this).off("touchmove.swipetoggle touchend.swipetoggle"); | |
| 1725 }); | |
| 1726 }); | |
| 1727 } | |
| 1728 | |
| 1729 $table | |
| 1730 .on("tablesawcolumns.swipetoggle", function() { | |
| 1731 var canGoPrev = canAdvance(getPrev()); | |
| 1732 var canGoNext = canAdvance(getNext()); | |
| 1733 $prevBtn[canGoPrev ? "removeClass" : "addClass"](classes.hideBtn); | |
| 1734 $nextBtn[canGoNext ? "removeClass" : "addClass"](classes.hideBtn); | |
| 1735 | |
| 1736 tblsaw.$toolbar[!canGoPrev && !canGoNext ? "addClass" : "removeClass"]( | |
| 1737 classes.allColumnsVisible | |
| 1738 ); | |
| 1739 }) | |
| 1740 .on("tablesawnext.swipetoggle", function() { | |
| 1741 advance(true); | |
| 1742 }) | |
| 1743 .on("tablesawprev.swipetoggle", function() { | |
| 1744 advance(false); | |
| 1745 }) | |
| 1746 .on(Tablesaw.events.destroy + ".swipetoggle", function() { | |
| 1747 var $t = $(this); | |
| 1748 | |
| 1749 $t.removeClass("tablesaw-swipe"); | |
| 1750 tblsaw.$toolbar.find(".tablesaw-advance").remove(); | |
| 1751 $(window).off(Tablesaw.events.resize, fakeBreakpoints); | |
| 1752 | |
| 1753 $t.off(".swipetoggle"); | |
| 1754 }) | |
| 1755 .on(Tablesaw.events.refresh, function() { | |
| 1756 unmaintainWidths(); | |
| 1757 initMinHeaderWidths(); | |
| 1758 fakeBreakpoints(); | |
| 1759 }); | |
| 1760 | |
| 1761 fakeBreakpoints(); | |
| 1762 $(window).on(Tablesaw.events.resize, fakeBreakpoints); | |
| 1763 } | |
| 1764 | |
| 1765 // on tablecreate, init | |
| 1766 $(document).on(Tablesaw.events.create, function(e, tablesaw) { | |
| 1767 if (tablesaw.mode === "swipe") { | |
| 1768 createSwipeTable(tablesaw, tablesaw.$table); | |
| 1769 } | |
| 1770 }); | |
| 1771 | |
| 1772 // TODO OOP this and add to Tablesaw object | |
| 1773 })(); | |
| 1774 | |
| 1775 (function() { | |
| 1776 var MiniMap = { | |
| 1777 attr: { | |
| 1778 init: "data-tablesaw-minimap" | |
| 1779 }, | |
| 1780 show: function(table) { | |
| 1781 var mq = table.getAttribute(MiniMap.attr.init); | |
| 1782 | |
| 1783 if (mq === "") { | |
| 1784 // value-less but exists | |
| 1785 return true; | |
| 1786 } else if (mq && "matchMedia" in window) { | |
| 1787 // has a mq value | |
| 1788 return window.matchMedia(mq).matches; | |
| 1789 } | |
| 1790 | |
| 1791 return false; | |
| 1792 } | |
| 1793 }; | |
| 1794 | |
| 1795 function createMiniMap($table) { | |
| 1796 var tblsaw = $table.data("tablesaw"); | |
| 1797 var $btns = $('<div class="tablesaw-advance minimap">'); | |
| 1798 var $dotNav = $('<ul class="tablesaw-advance-dots">').appendTo($btns); | |
| 1799 var hideDot = "tablesaw-advance-dots-hide"; | |
| 1800 var $headerCells = $table.data("tablesaw")._getPrimaryHeaderCells(); | |
| 1801 | |
| 1802 // populate dots | |
| 1803 $headerCells.each(function() { | |
| 1804 $dotNav.append("<li><i></i></li>"); | |
| 1805 }); | |
| 1806 | |
| 1807 $btns.appendTo(tblsaw.$toolbar); | |
| 1808 | |
| 1809 function showHideNav() { | |
| 1810 if (!MiniMap.show($table[0])) { | |
| 1811 $btns.css("display", "none"); | |
| 1812 return; | |
| 1813 } | |
| 1814 $btns.css("display", "block"); | |
| 1815 | |
| 1816 // show/hide dots | |
| 1817 var dots = $dotNav.find("li").removeClass(hideDot); | |
| 1818 $table.find("thead th").each(function(i) { | |
| 1819 if ($(this).css("display") === "none") { | |
| 1820 dots.eq(i).addClass(hideDot); | |
| 1821 } | |
| 1822 }); | |
| 1823 } | |
| 1824 | |
| 1825 // run on init and resize | |
| 1826 showHideNav(); | |
| 1827 $(window).on(Tablesaw.events.resize, showHideNav); | |
| 1828 | |
| 1829 $table | |
| 1830 .on("tablesawcolumns.minimap", function() { | |
| 1831 showHideNav(); | |
| 1832 }) | |
| 1833 .on(Tablesaw.events.destroy + ".minimap", function() { | |
| 1834 var $t = $(this); | |
| 1835 | |
| 1836 tblsaw.$toolbar.find(".tablesaw-advance").remove(); | |
| 1837 $(window).off(Tablesaw.events.resize, showHideNav); | |
| 1838 | |
| 1839 $t.off(".minimap"); | |
| 1840 }); | |
| 1841 } | |
| 1842 | |
| 1843 // on tablecreate, init | |
| 1844 $(document).on(Tablesaw.events.create, function(e, tablesaw) { | |
| 1845 if ( | |
| 1846 (tablesaw.mode === "swipe" || tablesaw.mode === "columntoggle") && | |
| 1847 tablesaw.$table.is("[ " + MiniMap.attr.init + "]") | |
| 1848 ) { | |
| 1849 createMiniMap(tablesaw.$table); | |
| 1850 } | |
| 1851 }); | |
| 1852 | |
| 1853 // TODO OOP this better | |
| 1854 Tablesaw.MiniMap = MiniMap; | |
| 1855 })(); | |
| 1856 | |
| 1857 (function() { | |
| 1858 var S = { | |
| 1859 selectors: { | |
| 1860 init: "table[data-tablesaw-mode-switch]" | |
| 1861 }, | |
| 1862 attributes: { | |
| 1863 excludeMode: "data-tablesaw-mode-exclude" | |
| 1864 }, | |
| 1865 classes: { | |
| 1866 main: "tablesaw-modeswitch", | |
| 1867 toolbar: "tablesaw-bar-section" | |
| 1868 }, | |
| 1869 modes: ["stack", "swipe", "columntoggle"], | |
| 1870 init: function(table) { | |
| 1871 var $table = $(table); | |
| 1872 var tblsaw = $table.data("tablesaw"); | |
| 1873 var ignoreMode = $table.attr(S.attributes.excludeMode); | |
| 1874 var $toolbar = tblsaw.$toolbar; | |
| 1875 var $switcher = $("<div>").addClass(S.classes.main + " " + S.classes.toolbar); | |
| 1876 | |
| 1877 var html = [ | |
| 1878 '<label><span class="abbreviated">' + | |
| 1879 Tablesaw.i18n.modeSwitchColumnsAbbreviated + | |
| 1880 '</span><span class="longform">' + | |
| 1881 Tablesaw.i18n.modeSwitchColumns + | |
| 1882 "</span>:" | |
| 1883 ], | |
| 1884 dataMode = $table.attr("data-tablesaw-mode"), | |
| 1885 isSelected; | |
| 1886 | |
| 1887 // TODO next major version: remove .btn | |
| 1888 html.push('<span class="btn tablesaw-btn"><select>'); | |
| 1889 for (var j = 0, k = S.modes.length; j < k; j++) { | |
| 1890 if (ignoreMode && ignoreMode.toLowerCase() === S.modes[j]) { | |
| 1891 continue; | |
| 1892 } | |
| 1893 | |
| 1894 isSelected = dataMode === S.modes[j]; | |
| 1895 | |
| 1896 html.push( | |
| 1897 "<option" + | |
| 1898 (isSelected ? " selected" : "") + | |
| 1899 ' value="' + | |
| 1900 S.modes[j] + | |
| 1901 '">' + | |
| 1902 Tablesaw.i18n.modes[j] + | |
| 1903 "</option>" | |
| 1904 ); | |
| 1905 } | |
| 1906 html.push("</select></span></label>"); | |
| 1907 | |
| 1908 $switcher.html(html.join("")); | |
| 1909 | |
| 1910 var $otherToolbarItems = $toolbar.find(".tablesaw-advance").eq(0); | |
| 1911 if ($otherToolbarItems.length) { | |
| 1912 $switcher.insertBefore($otherToolbarItems); | |
| 1913 } else { | |
| 1914 $switcher.appendTo($toolbar); | |
| 1915 } | |
| 1916 | |
| 1917 $switcher.find(".tablesaw-btn").tablesawbtn(); | |
| 1918 $switcher.find("select").on("change", function(event) { | |
| 1919 return S.onModeChange.call(table, event, $(this).val()); | |
| 1920 }); | |
| 1921 }, | |
| 1922 onModeChange: function(event, val) { | |
| 1923 var $table = $(this); | |
| 1924 var tblsaw = $table.data("tablesaw"); | |
| 1925 var $switcher = tblsaw.$toolbar.find("." + S.classes.main); | |
| 1926 | |
| 1927 $switcher.remove(); | |
| 1928 tblsaw.destroy(); | |
| 1929 | |
| 1930 $table.attr("data-tablesaw-mode", val); | |
| 1931 $table.tablesaw(); | |
| 1932 } | |
| 1933 }; | |
| 1934 | |
| 1935 $(document).on(Tablesaw.events.create, function(e, Tablesaw) { | |
| 1936 if (Tablesaw.$table.is(S.selectors.init)) { | |
| 1937 S.init(Tablesaw.table); | |
| 1938 } | |
| 1939 }); | |
| 1940 | |
| 1941 // TODO OOP this and add to Tablesaw object | |
| 1942 })(); | |
| 1943 | |
| 1944 (function() { | |
| 1945 var pluginName = "tablesawCheckAll"; | |
| 1946 | |
| 1947 function CheckAll(tablesaw) { | |
| 1948 this.tablesaw = tablesaw; | |
| 1949 this.$table = tablesaw.$table; | |
| 1950 | |
| 1951 this.attr = "data-tablesaw-checkall"; | |
| 1952 this.checkAllSelector = "[" + this.attr + "]"; | |
| 1953 this.forceCheckedSelector = "[" + this.attr + "-checked]"; | |
| 1954 this.forceUncheckedSelector = "[" + this.attr + "-unchecked]"; | |
| 1955 this.checkboxSelector = 'input[type="checkbox"]'; | |
| 1956 | |
| 1957 this.$triggers = null; | |
| 1958 this.$checkboxes = null; | |
| 1959 | |
| 1960 if (this.$table.data(pluginName)) { | |
| 1961 return; | |
| 1962 } | |
| 1963 this.$table.data(pluginName, this); | |
| 1964 this.init(); | |
| 1965 } | |
| 1966 | |
| 1967 CheckAll.prototype._filterCells = function($checkboxes) { | |
| 1968 return $checkboxes | |
| 1969 .filter(function() { | |
| 1970 return !$(this) | |
| 1971 .closest("tr") | |
| 1972 .is("[data-tablesaw-subrow],[data-tablesaw-ignorerow]"); | |
| 1973 }) | |
| 1974 .find(this.checkboxSelector) | |
| 1975 .not(this.checkAllSelector); | |
| 1976 }; | |
| 1977 | |
| 1978 // With buttons you can use a scoping selector like: data-tablesaw-checkall="#my-scoped-id input[type='checkbox']" | |
| 1979 CheckAll.prototype.getCheckboxesForButton = function(button) { | |
| 1980 return this._filterCells($($(button).attr(this.attr))); | |
| 1981 }; | |
| 1982 | |
| 1983 CheckAll.prototype.getCheckboxesForCheckbox = function(checkbox) { | |
| 1984 return this._filterCells($($(checkbox).closest("th")[0].cells)); | |
| 1985 }; | |
| 1986 | |
| 1987 CheckAll.prototype.init = function() { | |
| 1988 var self = this; | |
| 1989 this.$table.find(this.checkAllSelector).each(function() { | |
| 1990 var $trigger = $(this); | |
| 1991 if ($trigger.is(self.checkboxSelector)) { | |
| 1992 self.addCheckboxEvents(this); | |
| 1993 } else { | |
| 1994 self.addButtonEvents(this); | |
| 1995 } | |
| 1996 }); | |
| 1997 }; | |
| 1998 | |
| 1999 CheckAll.prototype.addButtonEvents = function(trigger) { | |
| 2000 var self = this; | |
| 2001 | |
| 2002 // Update body checkboxes when header checkbox is changed | |
| 2003 $(trigger).on("click", function(event) { | |
| 2004 event.preventDefault(); | |
| 2005 | |
| 2006 var $checkboxes = self.getCheckboxesForButton(this); | |
| 2007 | |
| 2008 var allChecked = true; | |
| 2009 $checkboxes.each(function() { | |
| 2010 if (!this.checked) { | |
| 2011 allChecked = false; | |
| 2012 } | |
| 2013 }); | |
| 2014 | |
| 2015 var setChecked; | |
| 2016 if ($(this).is(self.forceCheckedSelector)) { | |
| 2017 setChecked = true; | |
| 2018 } else if ($(this).is(self.forceUncheckedSelector)) { | |
| 2019 setChecked = false; | |
| 2020 } else { | |
| 2021 setChecked = allChecked ? false : true; | |
| 2022 } | |
| 2023 | |
| 2024 $checkboxes.each(function() { | |
| 2025 this.checked = setChecked; | |
| 2026 | |
| 2027 $(this).trigger("change." + pluginName); | |
| 2028 }); | |
| 2029 }); | |
| 2030 }; | |
| 2031 | |
| 2032 CheckAll.prototype.addCheckboxEvents = function(trigger) { | |
| 2033 var self = this; | |
| 2034 | |
| 2035 // Update body checkboxes when header checkbox is changed | |
| 2036 $(trigger).on("change", function() { | |
| 2037 var setChecked = this.checked; | |
| 2038 | |
| 2039 self.getCheckboxesForCheckbox(this).each(function() { | |
| 2040 this.checked = setChecked; | |
| 2041 }); | |
| 2042 }); | |
| 2043 | |
| 2044 var $checkboxes = self.getCheckboxesForCheckbox(trigger); | |
| 2045 | |
| 2046 // Update header checkbox when body checkboxes are changed | |
| 2047 $checkboxes.on("change." + pluginName, function() { | |
| 2048 var checkedCount = 0; | |
| 2049 $checkboxes.each(function() { | |
| 2050 if (this.checked) { | |
| 2051 checkedCount++; | |
| 2052 } | |
| 2053 }); | |
| 2054 | |
| 2055 var allSelected = checkedCount === $checkboxes.length; | |
| 2056 | |
| 2057 trigger.checked = allSelected; | |
| 2058 | |
| 2059 // only indeterminate if some are selected (not all and not none) | |
| 2060 trigger.indeterminate = checkedCount !== 0 && !allSelected; | |
| 2061 }); | |
| 2062 }; | |
| 2063 | |
| 2064 // on tablecreate, init | |
| 2065 $(document).on(Tablesaw.events.create, function(e, tablesaw) { | |
| 2066 new CheckAll(tablesaw); | |
| 2067 }); | |
| 2068 | |
| 2069 Tablesaw.CheckAll = CheckAll; | |
| 2070 })(); | |
| 2071 | |
| 2072 return Tablesaw; | |
| 2073 })); |