From 78d95a8a144f24e420933820e55004d44ecff81e Mon Sep 17 00:00:00 2001 From: mistic100 Date: Sat, 23 Aug 2014 10:24:55 +0000 Subject: create a mini jquery plugin for sliders on batch manager + async load git-svn-id: http://piwigo.org/svn/trunk@29249 68402e56-0260-453c-a942-63ccdbb3a9ee --- .../default/template/batch_manager_global.tpl | 250 +++++++-------------- 1 file changed, 83 insertions(+), 167 deletions(-) (limited to 'admin/themes/default/template') diff --git a/admin/themes/default/template/batch_manager_global.tpl b/admin/themes/default/template/batch_manager_global.tpl index 575929674..9223b4094 100644 --- a/admin/themes/default/template/batch_manager_global.tpl +++ b/admin/themes/default/template/batch_manager_global.tpl @@ -4,8 +4,9 @@ {combine_script id='common' load='footer' path='admin/themes/default/js/common.js'} -{combine_script id='jquery.ui.slider' require='jquery.ui' load='footer' path='themes/default/js/ui/minified/jquery.ui.slider.min.js'} +{combine_script id='jquery.ui.slider' require='jquery.ui' load='async' path='themes/default/js/ui/minified/jquery.ui.slider.min.js'} {combine_css path="themes/default/js/ui/theme/jquery.ui.slider.css"} +{combine_script id='doubleSlider' load='async' require='jquery.ui.slider' path='admin/themes/default/js/doubleSlider.js'} {combine_script id='LocalStorageCache' load='footer' path='admin/themes/default/js/LocalStorageCache.js'} @@ -16,7 +17,7 @@ {combine_script id='jquery.progressBar' load='async' path='themes/default/js/plugins/jquery.progressbar.min.js'} {combine_script id='jquery.ajaxmanager' load='async' path='themes/default/js/plugins/jquery.ajaxmanager.js'} -{combine_script id='batchManagerGlobal' load='async' require='jquery,datepicker,jquery.colorbox,addAlbum' path='admin/themes/default/js/batchManagerGlobal.js'} +{combine_script id='batchManagerGlobal' load='async' require='jquery,datepicker,jquery.colorbox,addAlbum,doubleSlider' path='admin/themes/default/js/batchManagerGlobal.js'} {footer_script} var lang = { @@ -264,138 +265,51 @@ $(document).ready(function() { checkPermitAction(); - {* /* dimensions sliders */ - /** - * find the key from a value in the startStopValues array - */ *} - function getSliderKeyFromValue(value, values) { - for (var key in values) { - if (values[key] == value) { - return key; - } - } - - return 0; - } - - var dimension_values = { - width:[{$dimensions.widths}], - height:[{$dimensions.heights}], - ratio:[{$dimensions.ratios}] - }; - - function onSliderChange(type, ui, pattern) { - $("input[name='filter_dimension_min_"+type+"']").val(dimension_values[type][ui.values[0]]); - $("input[name='filter_dimension_max_"+type+"']").val(dimension_values[type][ui.values[1]]); - - $("#filter_dimension_"+type+"_info").html(sprintf( - pattern, - dimension_values[type][ui.values[0]], - dimension_values[type][ui.values[1]] - )); - } - - $("#filter_dimension_width_slider").slider({ - range: true, - min: 0, - max: dimension_values['width'].length - 1, - values: [ - getSliderKeyFromValue({$dimensions.selected.min_width}, dimension_values['width']), - getSliderKeyFromValue({$dimensions.selected.max_width}, dimension_values['width']) - ], - slide: function(event, ui) { - onSliderChange('width', ui, "{'between %d and %d pixels'|translate|escape:'javascript'}"); - }, - change: function(event, ui) { - onSliderChange('width', ui, "{'between %d and %d pixels'|translate|escape:'javascript'}"); - } - }); - - $("#filter_dimension_height_slider").slider({ - range: true, - min: 0, - max: dimension_values['height'].length - 1, - values: [ - getSliderKeyFromValue({$dimensions.selected.min_height}, dimension_values['height']), - getSliderKeyFromValue({$dimensions.selected.max_height}, dimension_values['height']) - ], - slide: function(event, ui) { - onSliderChange('height', ui, "{'between %d and %d pixels'|translate|escape:'javascript'}"); - }, - change: function(event, ui) { - onSliderChange('height', ui, "{'between %d and %d pixels'|translate|escape:'javascript'}"); - } - }); - - $("#filter_dimension_ratio_slider").slider({ - range: true, - min: 0, - max: dimension_values['ratio'].length - 1, - values: [ - getSliderKeyFromValue({$dimensions.selected.min_ratio}, dimension_values['ratio']), - getSliderKeyFromValue({$dimensions.selected.max_ratio}, dimension_values['ratio']) - ], - slide: function(event, ui) { - onSliderChange('ratio', ui, "{'between %.2f and %.2f'|translate|escape:'javascript'}"); - }, - change: function(event, ui) { - onSliderChange('ratio', ui, "{'between %.2f and %.2f'|translate|escape:'javascript'}"); - } - }); - - $("a.dimensions-choice").click(function() { - var type = jQuery(this).data("type"); - var min = jQuery(this).data("min"); - var max = jQuery(this).data("max"); - - $("#filter_dimension_"+ type +"_slider") - .slider("values", 0, getSliderKeyFromValue(min, dimension_values[type]) ) - .slider("values", 1, getSliderKeyFromValue(max, dimension_values[type]) ); - }); - - {* filesize, copied from dimensions filter and modified, to be moved in a plugin later *} - var filesize_values = [{$filesize.list}]; - - function filesize_onSliderChange(ui, pattern) { - $("input[name='filter_filesize_min']").val(filesize_values[ui.values[0]]); - $("input[name='filter_filesize_max']").val(filesize_values[ui.values[1]]); - - $("#filter_filesize_info").html(sprintf( - pattern, - filesize_values[ui.values[0]], - filesize_values[ui.values[1]] - )); - } - - $("#filter_filesize_slider").slider({ - range: true, - min: 0, - max: filesize_values.length - 1, - values: [ - getSliderKeyFromValue({$filesize.selected.min}, filesize_values), - getSliderKeyFromValue({$filesize.selected.max}, filesize_values) - ], - slide: function(event, ui) { - filesize_onSliderChange(ui, "{'between %s and %s MB'|translate|escape:'javascript'}"); - }, - change: function(event, ui) { - filesize_onSliderChange(ui, "{'between %s and %s MB'|translate|escape:'javascript'}"); - } - }); - - $("a.filesize-choice").click(function() { - $("#filter_filesize_slider") - .slider("values", 0, 0) - .slider("values", 1, filesize_values.length - 1); - }); - - jQuery("select[name=filter_prefilter]").change(function() { jQuery("#empty_caddie").toggle(jQuery(this).val() == "caddie"); jQuery("#duplicates_options").toggle(jQuery(this).val() == "duplicates"); }); }); +{**} +var sliders = { + widths: { + values: [{$dimensions.widths}], + selected: { + min: {$dimensions.selected.min_width}, + max: {$dimensions.selected.max_width}, + }, + text: '{'between %d and %d pixels'|translate|escape:'javascript'}' + }, + + heights: { + values: [{$dimensions.heights}], + selected: { + min: {$dimensions.selected.min_height}, + max: {$dimensions.selected.max_height}, + }, + text: '{'between %d and %d pixels'|translate|escape:'javascript'}' + }, + + ratios: { + values: [{$dimensions.ratios}], + selected: { + min: {$dimensions.selected.min_ratio}, + max: {$dimensions.selected.max_ratio}, + }, + text: '{'between %.2f and %.2f'|translate|escape:'javascript'}' + }, + + filesizes: { + values: [{$filesize.list}], + selected: { + min: {$filesize.selected.min}, + max: {$filesize.selected.max}, + }, + text: '{'between %s and %s MB'|translate|escape:'javascript'}' + } +}; + {/footer_script}
@@ -403,7 +317,7 @@ $(document).ready(function() {

{'Batch Manager'|@translate}

- +
{'Filter'|@translate} @@ -461,40 +375,40 @@ $(document).ready(function() {
  • [x] - {'Dimensions'|@translate} + {'Dimensions'|translate}
    - {'Width'|@translate} {'between %d and %d pixels'|@translate:$dimensions.selected.min_width:$dimensions.selected.max_width} - | {'Reset'|@translate} -
    - - {'Height'|@translate} {'between %d and %d pixels'|@translate:$dimensions.selected.min_height:$dimensions.selected.max_height} - | {'Reset'|@translate} -
    - - {'Ratio'|@translate} ({'Width'|@translate}/{'Height'|@translate}) {'between %.2f and %.2f'|@translate:$dimensions.selected.min_ratio:$dimensions.selected.max_ratio} -{if isset($dimensions.ratio_portrait)} - | {'Portrait'|@translate} -{/if} -{if isset($dimensions.ratio_square)} - | {'square'|@translate} -{/if} -{if isset($dimensions.ratio_landscape)} - | {'Landscape'|@translate} -{/if} -{if isset($dimensions.ratio_panorama)} - | {'Panorama'|@translate} -{/if} - | {'Reset'|@translate} -
    +
    + {'Width'|translate} {'between %d and %d pixels'|translate:$dimensions.selected.min_width:$dimensions.selected.max_width} + | {'Reset'|translate} +
    + + + +
    + +
    + {'Height'|translate} {'between %d and %d pixels'|translate:$dimensions.selected.min_height:$dimensions.selected.max_height} + | {'Reset'|translate} +
    + + + +
    + +
    + {'Ratio'|translate} ({'Width'|@translate}/{'Height'|@translate}) {'between %.2f and %.2f'|translate:$dimensions.selected.min_ratio:$dimensions.selected.max_ratio} + {if isset($dimensions.ratio_portrait)}| {'Portrait'|translate}{/if} + {if isset($dimensions.ratio_square)}| {'square'|translate}{/if} + {if isset($dimensions.ratio_landscape)}| {'Landscape'|translate}{/if} + {if isset($dimensions.ratio_panorama)}| {'Panorama'|translate}{/if} + | {'Reset'|translate} +
    + + + +
    - - - - - - -
  • [x] - {'Filesize'|@translate} + {'Filesize'|translate}
    - {'between %s and %s MB'|@translate:$filesize.selected.min:$filesize.selected.max} - | {'Reset'|@translate} -
    +
    + {'between %s and %s MB'|translate:$filesize.selected.min:$filesize.selected.max} + | {'Reset'|translate} +
    + + + +
    - - -
    • -- cgit v1.2.3