Changeset 124721 in spip-zone


Ignore:
Timestamp:
May 17, 2020, 6:34:58 PM (2 weeks ago)
Author:
Maïeul Rouquette
Message:

Des fonctions séparées pour les rafraichissement post déplacement de
colonnes.
On éviter de recharger intégralement le tableau, ca ralentit tout.

Location:
_plugins_/formidable_tablesorter/branches/dev
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • _plugins_/formidable_tablesorter/branches/dev

    • Property subgit:lock:d6001bec729a4e205f885dbb45a7329e57800701 deleted
    • Property subgit:lock:8301bf4adf8f419881af8f56932e980c1bd4079e set to 2020-05-17T20:41:11.051
  • _plugins_/formidable_tablesorter/branches/dev/javascript/formidable_tablesorter.js

    r124719 r124721  
    1919                widgetOptions: {
    2020                        columnSelector_container: $('#columnSelector'),
     21                        columnSelector_layout : '<label><input type="checkbox"><span>{name}</span></label>',
    2122                        columnSelector_mediaquery: false,
    2223      print_columns: 's',
     
    5455                formidable_ts.trigger('filterReset');
    5556        });
     57        formidable_ts_add_check_all_button();
    5658        formidable_ts_init_reorder();
    57         formidable_ts_add_check_all_button();
    5859});
    5960
     
    114115}
    115116
    116 /** Reordonnnancement des colonnes **/
    117 
    118 // Après le réordonnancement, reinitialiser le column selecteur + sauver les infos sur l'état
    119 var formidable_ts_post_reorder_flag = false;
    120 function formidable_ts_post_reorder() {
    121         if (!formidable_ts_post_reorder_flag) {
    122                 $('#columnSelector label:not([id])').remove();
    123                 formidable_ts.trigger('refreshWidgets', ['columnSelector']);
    124                 formidable_ts_post_reorder_flag = true;
    125         } else {
    126                 formidable_ts_post_reorder_flag = false;
    127         }
     117/** Reordonnnancement des colonnes
     118 * Note sur le stockage en local storage :
     119 * - les filtres sont notés selon l'ordre EFFECTIF des colonnes
     120 * - les tri sont stockés selon l'attribut data-column effectif des colonnes MAIS par contre il faut les passer au triger sorton selon la position des colonnes <!>
     121 * - NE SURTOUT PAS MODIFIER data-column
     122 * **/
     123
     124function formidable_ts_post_reorder_refresh_view() {
     125        // Mettre à jour tout les widgets
     126        formidable_ts.trigger('updateAll');
     127        formidable_ts.trigger('applyWidgets');
     128        formidable_ts_post_reorder_set_columnSelector();
     129        // 2 fois car le colonne selecteur peut avoir des impacts sur les css des autres widgets, mais il faut que les autres widgets soit rafraichi pour que le le refresh du CS fonction :(
     130        formidable_ts.trigger('updateAll');
     131        formidable_ts.trigger('applyWidgets');
     132        formidable_ts_add_reorder_arrows();
     133}
     134
     135// Stockage des positions
     136function formidable_ts_post_reorder_storage() {
    128137        headers = formidable_ts.find('.tablesorter-headerRow th');
    129138        positions = [];
    130139        headers.each(function () {
     140                index = $(this).index();
    131141                positions.push({
    132142                        'original' : $(this).attr('data-column-original-position'),
    133                         'final' : $(this).attr('data-column')
     143                        'final' : index
    134144                        });// Tableau position final  => position original
    135145                }
    136146        );
    137147        $.tablesorter.storage(formidable_ts, 'tablesorter-reorder', positions, {});
    138         formidable_ts.trigger('resetToLoadState');
    139         formidable_ts_add_reorder_arrows();
    140 }
    141 
     148}
     149//Retrouver le tri
     150function formidable_ts_post_reorder_set_sorting() {
     151        // Retrouver le tri
     152        sortList = $.tablesorter.storage(formidable_ts, 'tablesorter-savesort')['sortList'];
     153        formidable_ts.trigger('sortReset');
     154        sortList = formidable_tablesorter_reorder_sortList_update_position(sortList);
     155        formidable_ts.trigger('sorton', [sortList]);
     156
     157}
     158// Prend une sortList
     159// La parcourt et la modifie de manière à donner le bon index suivant le nouvel ordre post-déplacement de colonne
     160// Pour chaque entrée, trouve la bonne position avec nouveal indexation
     161function formidable_tablesorter_reorder_sortList_update_position(sortList) {
     162        $(sortList).each(function(key, value) {
     163                console.log(value);
     164                selector = '.tablesorter-ignoreRow th[data-column='+value[0]+']';
     165                sort = value[1];
     166                new_position = $(selector, formidable_ts).index();
     167                value = [new_position, sort];
     168                sortList[key] = value;
     169        });
     170        return sortList
     171}
     172
     173// Mettre à jour le colonne selector
     174function formidable_ts_post_reorder_set_columnSelector() {
     175        th = $('.tablesorter-headerRow th', formidable_ts);
     176        th.each(function() {
     177                selector = '#columnSelector label[data-column='+$(this).attr('data-column')+'] span';
     178                $(selector).text($(this).text());
     179        });
     180        formidable_ts.trigger('refreshColumnSelector', 'selectors');
     181}
     182
     183function formidable_ts_post_reorder_set_filter(filter) {
     184        // Reinitialisation des filtres
     185        formidable_ts.trigger('filterResetSaved');
     186        formidable_ts.trigger('filterReset');
     187        console.log('Filter post reorder :');
     188        console.log(filter);
     189        $.tablesorter.setFilters(formidable_ts, filter, true);
     190}
    142191// function appelé au tout début du chargement de formidable table_sorter
    143192function formidable_ts_init_reorder() {
     193        $('[data-column]').each(function() {
     194                $(this).attr('data-column-original-position',$(this).attr('data-column'));
     195        });
     196        // Avoir directement sur le label les infos de data-column-position
     197        $('#columnSelector label:not(#columnSelectorCheckAll)').each(function() {
     198                $(this).attr('data-column',$('input', this).attr('data-column'));
     199        });
    144200        formidable_ts_restore_reorder();
    145         formidable_ts_add_reorder_arrows();
     201        formidable_ts_post_reorder_refresh_view();
     202        formidable_ts_post_reorder_storage();
    146203}
    147204
     
    172229                        );
    173230                }
    174                 // Reinitialiser tout
    175                 formidable_ts.trigger('resetToLoadState');
    176                 formidable_ts_add_reorder_arrows();
    177231        }
    178232}
     233
    179234reorder = 0
    180235// Ajout des flèches au chargement
     
    198253        }
    199254        $('.move-arrows a').click(function() {
     255                filter = [];
    200256                reorder++;
    201257                console.log('start reorder ' + reorder)
     
    227283                        });
    228284                }
     285                $('.tablesorter-filter', formidable_ts).each(function() {
     286                        filter.push($(this).val());
     287                });
    229288                var v2 = performance.now();
    230289                console.log("reorder time  taken = "+(v2-v1)+"milliseconds");
    231290                console.log('start post reorder ' + reorder)
    232                 formidable_ts_post_reorder();
     291                formidable_ts_post_reorder_set_filter(filter);
     292                formidable_ts_post_reorder_storage();
     293                formidable_ts_post_reorder_set_sorting();
     294                formidable_ts_post_reorder_refresh_view();
    233295                var v3 = performance.now();
    234296                console.log('end reorder ' + reorder)
Note: See TracChangeset for help on using the changeset viewer.