From b4e5d12f746cbfa09433a4a7d5c5216227439cfb Mon Sep 17 00:00:00 2001 From: Serafeim Papastefanos Date: Thu, 6 Apr 2023 14:39:27 +0300 Subject: [PATCH] Add js init api (fixes #27) --- CHANGELOG.rst | 6 +++ README.rst | 5 +++ django_tables2_column_shifter/__init__.py | 2 +- .../js/django_tables2_column_shifter.js | 39 +++++++++++-------- .../js/django_tables2_column_shifter.min.js | 2 +- 5 files changed, 35 insertions(+), 19 deletions(-) diff --git a/CHANGELOG.rst b/CHANGELOG.rst index 9a48755..f3a24b3 100644 --- a/CHANGELOG.rst +++ b/CHANGELOG.rst @@ -1,6 +1,12 @@ CHANGELOG =========== +v. 2.0.4 +-------- + + * Add the ``$.django_tables2_column_shifter_init`` api to initialize the column shifter + for tables that are added to the DOM after the page has loaded (@spapas) + v. 2.0.3 -------- diff --git a/README.rst b/README.rst index b0b36a3..807f880 100644 --- a/README.rst +++ b/README.rst @@ -183,6 +183,11 @@ To use app, you must inherit your table class from ``django_tables2_column_shift JS API: ------- + +This library is initialized automatically on the page ready event. In case you are using a framework +like htmx, unpoly or turbo that does not trigger the ready event, you can initialize it manually by calling +``$.django_tables2_column_shifter_init()`` on your framework's initialize callback. + To retrieve the invisible columns you can use the ``$.django_tables2_column_shifter_hidden()`` js API. You can either pass the 0-based index of the table in the page (i.e use ``$.django_tables2_column_shifter_hidden(1)`` to get the hidden columns for the 2nd table in the page) or just use it without parameters to retrieve the hidden columns diff --git a/django_tables2_column_shifter/__init__.py b/django_tables2_column_shifter/__init__.py index 38a33bf..50e8b4d 100644 --- a/django_tables2_column_shifter/__init__.py +++ b/django_tables2_column_shifter/__init__.py @@ -1,2 +1,2 @@ -VERSION = (2, 0, 3) +VERSION = (2, 0, 4) __version__ = ".".join(str(i) for i in VERSION) diff --git a/django_tables2_column_shifter/static/django_tables2_column_shifter/js/django_tables2_column_shifter.js b/django_tables2_column_shifter/static/django_tables2_column_shifter/js/django_tables2_column_shifter.js index 7d7b8ed..4a61df5 100644 --- a/django_tables2_column_shifter/static/django_tables2_column_shifter/js/django_tables2_column_shifter.js +++ b/django_tables2_column_shifter/static/django_tables2_column_shifter/js/django_tables2_column_shifter.js @@ -1,6 +1,8 @@ // Author: Grzegorz Tężycki -$(document).ready(function(){ + +// API function for initializing column shifter tables +$.django_tables2_column_shifter_init = function() { // In web storage is saved structure like that: // localStorage['django_tables2_column_shifter'] = { @@ -185,19 +187,22 @@ $(document).ready(function(){ // show or hide columns based on data from web storage shift_columns(); - - // Add API method for retrieving non-visible cols for table - // Pass the 0-based index of the table or leave the parameter - // empty to return the hidden cols for the 1st table found - $.django_tables2_column_shifter_hidden = function(idx) { - if(idx==undefined) { - idx = 0; - } - return $('.table-container').eq(idx).find('.btn-shift-column').filter(function(z) { - return $(this).data('state')=='off' - }).map(function(z) { - return $(this).data('td-class') - }).toArray(); - } - -}); +} + + +// Add API method for retrieving non-visible cols for table +// Pass the 0-based index of the table or leave the parameter +// empty to return the hidden cols for the 1st table found +$.django_tables2_column_shifter_hidden = function(idx) { + if(idx==undefined) { + idx = 0; + } + return $('.table-container').eq(idx).find('.btn-shift-column').filter(function(z) { + return $(this).data('state')=='off' + }).map(function(z) { + return $(this).data('td-class') + }).toArray(); +} + +// Initialize column shifter on page ready event +$(document).ready($.django_tables2_column_shifter_init); diff --git a/django_tables2_column_shifter/static/django_tables2_column_shifter/js/django_tables2_column_shifter.min.js b/django_tables2_column_shifter/static/django_tables2_column_shifter/js/django_tables2_column_shifter.min.js index f2f91b0..d762b17 100644 --- a/django_tables2_column_shifter/static/django_tables2_column_shifter/js/django_tables2_column_shifter.min.js +++ b/django_tables2_column_shifter/static/django_tables2_column_shifter/js/django_tables2_column_shifter.min.js @@ -1 +1 @@ -$(document).ready(function(){var t="django_tables2_column_shifter",n=function(){var n=localStorage.getItem(t);return n=null===n?{}:JSON.parse(n)},a=function(n){var a=JSON.stringify(n);localStorage.setItem(t,a)},i=function(t){var i=t.data("table-class-container"),o=$("#"+i),c=t.data("state"),e=t.data("td-class"),s=n(),f=o.attr("id");f in s?data=s[f]:(data={},s[f]=data),data[e]=c,a(s)},o=function(t){var a=n(),i=t.attr("id"),o={};i in a&&(o=a[i],t.find(".btn-shift-column").each(function(){var t=$(this),n=t.data("td-class");if(n in o){var a=o[n];f(t,a)}}))},c=function(t){t.find(".loader").hide(),t.find(".table-wrapper").show()},e=function(){$(".column-shifter-container").each(function(){$table_class_container=$(this),o($table_class_container),c($table_class_container)})};shift_column=function(t){var n=t.data("state"),a=t.data("td-class"),i=t.data("table-class-container"),o=$("#"+i),c=o.find("table"),e=c.find("."+a);"on"===n?e.show():e.hide()},shift_columns=function(){var t,n=$(".btn-shift-column"),a=n.length;for(t=0;a>t;t++)shift_column($(n[t]))};var s=function(t,n){"on"===n?(t.find("img.uncheck").hide(),t.find("img.check").show()):(t.find("img.check").hide(),t.find("img.uncheck").show())},f=function(t,n){t.data("state",n),s(t,n)},r=function(t){var n=t.data("state");n="on"===n?"off":"on",f(t,n)};$(".btn-shift-column").on("click",function(t){var n=$(this);t.stopPropagation(),r(n),shift_column(n),i(n)}),e(),shift_columns(),$.django_tables2_column_shifter_hidden=function(t){return void 0==t&&(t=0),$(".table-container").eq(t).find(".btn-shift-column").filter(function(){return"off"==$(this).data("state")}).map(function(){return $(this).data("td-class")}).toArray()}}); \ No newline at end of file +$.django_tables2_column_shifter_init=function(){function o(){var t=localStorage.getItem(c);return t=null===t?{}:JSON.parse(t)}function i(t){var n=t.data("table-class-container"),a=$("#"+n),i=t.data("state"),n=t.data("td-class"),t=o();(a=a.attr("id"))in t?data=t[a]:(data={},t[a]=data),data[n]=i,function(t){t=JSON.stringify(t);localStorage.setItem(c,t)}(t)}var c="django_tables2_column_shifter";shift_column=function(t){var n=t.data("state"),a=t.data("td-class"),t=t.data("table-class-container"),a=$("#"+t).find("table").find("."+a);"on"===n?a.show():a.hide()},shift_columns=function(){for(var t=$(".btn-shift-column"),n=t.length,a=0;a