Changeset 26725


Ignore:
Timestamp:
01/14/14 23:11:06 (5 years ago)
Author:
mistic100
Message:

use external JS with template feature

Location:
extensions/SmartAlbums
Files:
2 added
2 edited

Legend:

Unmodified
Added
Removed
  • extensions/SmartAlbums/admin.php

    r26442 r26725  
    2222} 
    2323 
    24 $template->assign('SMART_PATH', SMART_PATH); 
     24$template->assign(array( 
     25  'SMART_PATH' => SMART_PATH, 
     26  'SMART_ABS_PATH' => realpath(SMART_PATH) . '/', 
     27  )); 
    2528 
    2629$template->assign_var_from_handle('ADMIN_CONTENT', 'SmartAlbums_content'); 
  • extensions/SmartAlbums/admin/template/album.tpl

    r26442 r26725  
    1212{combine_script id='jquery.ui.slider' require='jquery.ui' load='footer' path='themes/default/js/ui/minified/jquery.ui.slider.min.js'} 
    1313 
    14 {*combine_script id='smartalbums.filters' require='common,datepicker.js,jquery.tokeninput,jquery.chosen,jquery.ui.slider' 
    15   path=$SMART_PATH|cat:'admin/template/filters.js' load='footer' template=true*} 
     14{combine_script id='smartalbums.filters' load='footer' template=true path=$SMART_PATH|cat:'admin/template/addFilters.js'} 
    1615 
     16{if isset($new_smart)} 
    1717{footer_script require='jquery'} 
    18 var addFilter = (function($){ 
    19   var count=0, 
    20       limit_count=0, 
    21       level_count=0; 
     18function doBlink(obj,start,finish) { 
     19  jQuery(obj).fadeOut(400).fadeIn(400); 
     20  if(start!=finish) { 
     21    doBlink(obj,start+1,finish); 
     22  } 
     23  else { 
     24    jQuery(obj).fadeOut(400); 
     25  } 
     26} 
    2227 
    23   // MAIN EVENT HANDLERS 
    24   $('#addFilter').change(function() { 
    25     if ($(this).val() != -1) { 
    26       add_filter($(this).val()); 
    27       $(this).val(-1); 
    28     } 
    29   }); 
    30  
    31   $('#removeFilters').click(function() { 
    32     $('#filtersList li').each(function() { 
    33       $(this).remove(); 
    34     }); 
    35  
    36     limit_level=0; 
    37     level_count=0; 
    38     return false; 
    39   }); 
    40  
    41   $('input[name="is_smart"]').change(function() { 
    42     $('#SmartAlbum_options').toggle(); 
    43     $('input[name="countImages"]').toggle(); 
    44     $('.count_images_wrapper').toggle(); 
    45   }); 
    46  
    47   $('input[name="countImages"]').click(function() { 
    48     countImages($("#smart")); 
    49     return false; 
    50   }); 
    51  
    52  
    53   // ADD FILTER FUNCTIONS 
    54   function add_filter(type, cond, value) { 
    55     count++; 
    56  
    57     var content = $("#filtersRepo #filter_"+type).html().replace(/iiii/g, count); 
    58     $block = $($.parseHTML(content)).appendTo("#filtersList"); 
    59  
    60     if (cond) { 
    61       select_cond($block, type, cond); 
    62     } 
    63  
    64     if (value) { 
    65       if (type == "tags") { 
    66         $block.find(".filter-value .tagSelect").html(value); 
    67       } 
    68       else if (type == "album") { 
    69         select_options($block, value); 
    70       } 
    71       else if (type == "level") { 
    72         select_options($block, value); 
    73       } 
    74       else if (type != "dimensions") { 
    75         $block.find(".filter-value input").val(value); 
    76       } 
    77     } 
    78  
    79     init_jquery_handlers($block); 
    80  
    81     if (type == "dimensions") { 
    82       select_dimensions($block, cond, value); 
    83     } 
    84  
    85     if (type == 'limit') { 
    86       limit_count=1; 
    87       $("#addFilter option[value='limit']").attr('disabled','disabled'); 
    88     } 
    89     else if (type == 'level') { 
    90       level_count=1; 
    91       $("#addFilter option[value='level']").attr('disabled','disabled'); 
    92     } 
    93   } 
    94  
    95   function select_cond($block, type, cond) { 
    96     $block.find(".filter-cond option").removeAttr('selected'); 
    97     $block.find(".filter-cond option[value='"+cond+"']").attr('selected', 'selected'); 
    98   } 
    99  
    100   function select_dimensions($block, cond, value) { 
    101     console.log($block, cond, value); 
    102     cond = cond || 'width'; 
    103  
    104     $block.find(">.filter-value>span").hide(); 
    105     $block.find(".dimension_"+cond).show(); 
    106  
    107     if (value) { 
    108       values = value.split(','); 
    109     } 
    110     else { 
    111       values = $block.find(".filter_dimension_"+cond+"_slider").slider("values"); 
    112     } 
    113     $block.find(".filter_dimension_"+cond+"_slider").slider("values", values); 
    114   } 
    115  
    116   function select_options($block, value) { 
    117     values = value.split(','); 
    118     for (j in values) { 
    119       $block.find(".filter-value option[value='"+ values[j] +"']").attr('selected', 'selected'); 
    120     } 
    121   } 
    122  
    123  
    124   // DECLARE JQUERY PLUGINS AND VERSATILE HANDLERS 
    125   function init_jquery_handlers($block) { 
    126     // remove filter 
    127     $block.find(".removeFilter").click(function() { 
    128       type = $(this).next("input").val(); 
    129       if (type == 'limit') { 
    130         limit_count=1; 
    131         $("#addFilter option[value='limit']").removeAttr('disabled'); 
    132       } 
    133       else if (type == 'level') { 
    134         level_count=1; 
    135         $("#addFilter option[value='level']").removeAttr('disabled'); 
    136       } 
    137  
    138       $(this).parents('li').remove(); 
    139       return false; 
    140     }); 
    141  
    142     // date filter 
    143     if ($block.hasClass('filter_date')) { 
    144       $block.find("input[type='text']").each(function() { 
    145         $(this).datepicker({ 
    146           dateFormat:'yy-mm-dd', 
    147           firstDay:1 
    148         }); 
    149       }); 
    150     } 
    151  
    152     // tags filter 
    153     if ($block.hasClass('filter_tags')) { 
    154       $block.find(".tagSelect").tokenInput( 
    155         [{foreach from=$all_tags item=tag name=tags}{ name:"{$tag.name|escape:javascript}", id:"{$tag.id}" }{if !$smarty.foreach.tags.last},{/if}{/foreach}], 
    156         { 
    157           hintText: '{'Type in a search term'|translate}', 
    158           noResultsText: '{'No results'|translate}', 
    159           searchingText: '{'Searching...'|translate}', 
    160           animateDropdown: false, 
    161           preventDuplicates: true, 
    162           allowFreeTagging: false 
    163         } 
    164       ); 
    165     } 
    166  
    167     // album filter 
    168     if ($block.hasClass('filter_album')) { 
    169       $block.find(".albumSelect").chosen(); 
    170     } 
    171  
    172     // dimension filter 
    173     if ($block.hasClass('filter_dimensions')) { 
    174       $block.find(".filter-cond select").change(function() { 
    175         select_dimensions($block, $(this).val()); 
    176       }); 
    177  
    178       $block.find(".filter_dimension_width_slider").slider({ 
    179         range: true, 
    180         min: {$dimensions.bounds.min_width}, 
    181         max: {$dimensions.bounds.max_width}, 
    182         values: [{$dimensions.bounds.min_width}, {$dimensions.bounds.max_width}], 
    183         slide: function(event, ui) { 
    184           change_dimension_info($block, ui.values, "{'between %d and %d pixels'|translate}"); 
    185         }, 
    186         change: function(event, ui) { 
    187           change_dimension_info($block, ui.values, "{'between %d and %d pixels'|translate}"); 
    188         } 
    189       }); 
    190  
    191       $block.find(".filter_dimension_height_slider").slider({ 
    192         range: true, 
    193         min: {$dimensions.bounds.min_height}, 
    194         max: {$dimensions.bounds.max_height}, 
    195         values: [{$dimensions.bounds.min_height}, {$dimensions.bounds.max_height}], 
    196         slide: function(event, ui) { 
    197           change_dimension_info($block, ui.values, "{'between %d and %d pixels'|translate}"); 
    198         }, 
    199         change: function(event, ui) { 
    200           change_dimension_info($block, ui.values, "{'between %d and %d pixels'|translate}"); 
    201         } 
    202       }); 
    203  
    204       $block.find(".filter_dimension_ratio_slider").slider({ 
    205         range: true, 
    206         step: 0.01, 
    207         min: {$dimensions.bounds.min_ratio}, 
    208         max: {$dimensions.bounds.max_ratio}, 
    209         values: [{$dimensions.bounds.min_ratio}, {$dimensions.bounds.max_ratio}], 
    210         slide: function(event, ui) { 
    211           change_dimension_info($block, ui.values, "{'between %.2f and %.2f'|translate}"); 
    212         }, 
    213         change: function(event, ui) { 
    214           change_dimension_info($block, ui.values, "{'between %.2f and %.2f'|translate}"); 
    215         } 
    216       }); 
    217  
    218       $block.find("a.dimensions-choice").click(function() { 
    219         $block.find(".filter_dimension_"+ $(this).data("type") +"_slider").slider("values", 
    220           [$(this).data("min"), $(this).data("max")] 
    221         ); 
    222       }); 
    223     } 
    224   } 
    225  
    226  
    227   // GENERAL FUNCTIONS 
    228   function change_dimension_info($block, values, text) { 
    229     $block.find("input[name$='[value][min]']").val(values[0]); 
    230     $block.find("input[name$='[value][max]']").val(values[1]); 
    231     $block.find(".filter_dimension_info").html(sprintf(text, values[0], values[1])); 
    232   } 
    233  
    234   function countImages(form) { 
    235     jQuery.post("{$COUNT_SCRIPT_URL}", 'cat_id={$CAT_ID}&'+form.serialize(), 
    236       function success(data) { 
    237         jQuery('.count_images_wrapper').html(data); 
    238       } 
    239     ); 
    240   } 
    241  
    242  
    243   {if isset($new_smart)} 
    244   function doBlink(obj,start,finish) { 
    245     jQuery(obj).fadeOut(400).fadeIn(400); 
    246     if(start!=finish) { 
    247       doBlink(obj,start+1,finish); 
    248     } 
    249     else { 
    250       jQuery(obj).fadeOut(400); 
    251     } 
    252   } 
    253  
    254   doBlink('.new_smart', 0, 3); 
    255   {/if} 
    256  
    257   return add_filter; // expose add_filter method 
    258 }(jQuery)); 
     28doBlink('.new_smart', 0, 3); 
    25929{/footer_script} 
     30{/if} 
    26031 
    26132 
     
    337108 
    338109<div id="filtersRepo" style="display:none;"> 
    339   <!-- tags --> 
    340   <div id="filter_tags"> 
    341   <li id="filter_iiii" class="filter_tags"> 
    342     <span class="filter-title"> 
    343       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    344       <input type="hidden" name="filters[iiii][type]" value="tags"/> 
    345       {$options.tags.name} 
    346     </span> 
    347  
    348     <span class="filter-cond"> 
    349       <select name="filters[iiii][cond]"> 
    350         {html_options options=$options.tags.options} 
    351       </select> 
    352     </span> 
    353  
    354     <span class="filter-value"> 
    355       <select name="filters[iiii][value]" class="tagSelect"> 
    356       </select> 
    357     </span> 
    358   </li> 
    359   </div> 
    360  
    361   <!-- date --> 
    362   <div id="filter_date"> 
    363   <li id="filter_iiii" class="filter_date"> 
    364     <span class="filter-title"> 
    365       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    366       <input type="hidden" name="filters[iiii][type]" value="date"/> 
    367       {$options.date.name} 
    368     </span> 
    369  
    370     <span class="filter-cond"> 
    371       <select name="filters[iiii][cond]"> 
    372         {html_options options=$options.date.options} 
    373       </select> 
    374     </span> 
    375  
    376     <span class="filter-value"> 
    377       <input type="text" name="filters[iiii][value]" size="30"/> 
    378     </span> 
    379   </li> 
    380   </div> 
    381  
    382   <!-- name --> 
    383   <div id="filter_name"> 
    384   <li id="filter_iiii" class="filter_name"> 
    385     <span class="filter-title"> 
    386       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    387       <input type="hidden" name="filters[iiii][type]" value="name"/> 
    388       {$options.name.name} 
    389     </span> 
    390  
    391     <span class="filter-cond"> 
    392       <select name="filters[iiii][cond]"> 
    393         {html_options options=$options.name.options} 
    394       </select> 
    395     </span> 
    396  
    397     <span class="filter-value"> 
    398       <input type="text" name="filters[iiii][value]" size="30"/> 
    399     </span> 
    400   </li> 
    401   </div> 
    402  
    403   <!-- album --> 
    404   <div id="filter_album"> 
    405   <li id="filter_iiii" class="filter_album"> 
    406     <span class="filter-title"> 
    407       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    408       <input type="hidden" name="filters[iiii][type]" value="album"/> 
    409       {$options.album.name} 
    410     </span> 
    411  
    412     <span class="filter-cond"> 
    413       <select name="filters[iiii][cond]"> 
    414         {html_options options=$options.album.options} 
    415       </select> 
    416     </span> 
    417  
    418     <span class="filter-value"> 
    419       <select name="filters[iiii][value][]" class="albumSelect" multiple="multiple" data-placeholder="{'Select albums...'|translate}"> 
    420         {html_options options=$all_albums} 
    421       </select> 
    422     </span> 
    423   </li> 
    424   </div> 
    425  
    426   <!-- dimensions --> 
    427   <div id="filter_dimensions"> 
    428   <li id="filter_iiii" class="filter_dimensions"> 
    429     <span class="filter-title"> 
    430       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    431       <input type="hidden" name="filters[iiii][type]" value="dimensions"/> 
    432       {$options.dimensions.name} 
    433     </span> 
    434  
    435     <span class="filter-cond"> 
    436       <select name="filters[iiii][cond]"> 
    437         {html_options options=$options.dimensions.options} 
    438       </select> 
    439     </span> 
    440  
    441     <span class="filter-value"> 
    442       <span class="dimension_width"> 
    443         <span class="filter_dimension_info"></span> 
    444           | <a class="dimensions-choice" data-type="width" data-min="{$dimensions.bounds.min_width}" data-max="{$dimensions.bounds.max_width}">{'Reset'|translate}</a> 
    445           <div class="filter_dimension_width_slider"></div> 
    446       </span> 
    447  
    448       <span class="dimension_height"> 
    449         <span class="filter_dimension_info"></span> 
    450           | <a class="dimensions-choice" data-type="height" data-min="{$dimensions.bounds.min_height}" data-max="{$dimensions.bounds.max_height}">{'Reset'|translate}</a> 
    451           <div class="filter_dimension_height_slider"></div> 
    452       </span> 
    453  
    454       <span class="dimension_ratio"> 
    455         <span class="filter_dimension_info"></span> 
    456         {if isset($dimensions.ratio_portrait)} 
    457           | <a class="dimensions-choice" data-type="ratio" data-min="{$dimensions.ratio_portrait.min}" data-max="{$dimensions.ratio_portrait.max}">{'Portrait'|translate}</a> 
    458         {/if} 
    459         {if isset($dimensions.ratio_square)} 
    460           | <a class="dimensions-choice" data-type="ratio" data-min="{$dimensions.ratio_square.min}" data-max="{$dimensions.ratio_square.max}">{'square'|translate}</a> 
    461         {/if} 
    462         {if isset($dimensions.ratio_landscape)} 
    463           | <a class="dimensions-choice" data-type="ratio" data-min="{$dimensions.ratio_landscape.min}" data-max="{$dimensions.ratio_landscape.max}">{'Landscape'|translate}</a> 
    464         {/if} 
    465         {if isset($dimensions.ratio_panorama)} 
    466           | <a class="dimensions-choice" data-type="ratio" data-min="{$dimensions.ratio_panorama.min}" data-max="{$dimensions.ratio_panorama.max}">{'Panorama'|translate}</a> 
    467         {/if} 
    468           | <a class="dimensions-choice" data-type="ratio" data-min="{$dimensions.bounds.min_ratio}" data-max="{$dimensions.bounds.max_ratio}">{'Reset'|translate}</a> 
    469           <div class="filter_dimension_ratio_slider"></div> 
    470       </span> 
    471     </span> 
    472  
    473     <input type="hidden" name="filters[iiii][value][min]" value=""> 
    474     <input type="hidden" name="filters[iiii][value][max]" value=""> 
    475   </li> 
    476   </div> 
    477  
    478   <!-- author --> 
    479   <div id="filter_author"> 
    480   <li id="filter_iiii" class="filter_author"> 
    481     <span class="filter-title"> 
    482       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    483       <input type="hidden" name="filters[iiii][type]" value="author"/> 
    484       {$options.author.name} 
    485     </span> 
    486  
    487     <span class="filter-cond"> 
    488       <select name="filters[iiii][cond]"> 
    489         {html_options options=$options.author.options} 
    490       </select> 
    491     </span> 
    492  
    493     <span class="filter-value"> 
    494       <input type="text" name="filters[iiii][value]" size="30"/> 
    495       <i>{'For "Is (not) in", separate each author by a comma'|translate}</i> 
    496     </span> 
    497   </li> 
    498   </div> 
    499  
    500   <!-- hit --> 
    501   <div id="filter_hit"> 
    502   <li id="filter_iiii" class="filter_hit"> 
    503     <span class="filter-title"> 
    504       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    505       <input type="hidden" name="filters[iiii][type]" value="hit"/> 
    506       {$options.hit.name} 
    507     </span> 
    508  
    509     <span class="filter-cond"> 
    510       <select name="filters[iiii][cond]"> 
    511         {html_options options=$options.hit.options} 
    512       </select> 
    513     </span> 
    514  
    515     <span class="filter-value"> 
    516       <input type="text" name="filters[iiii][value]" size="5"/> 
    517     </span> 
    518   </li> 
    519   </div> 
    520  
    521   <!-- rating_score --> 
    522   <div id="filter_rating_score"> 
    523   <li id="filter_iiii" class="filter_rating_score"> 
    524     <span class="filter-title"> 
    525       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    526       <input type="hidden" name="filters[iiii][type]" value="rating_score"/> 
    527       {$options.rating_score.name} 
    528     </span> 
    529  
    530     <span class="filter-cond"> 
    531       <select name="filters[iiii][cond]"> 
    532         {html_options options=$options.rating_score.options} 
    533       </select> 
    534     </span> 
    535  
    536     <span class="filter-value"> 
    537       <input type="text" name="filters[iiii][value]" size="5"/> 
    538     </span> 
    539   </li> 
    540   </div> 
    541  
    542   <!-- level --> 
    543   <div id="filter_level"> 
    544   <li id="filter_iiii" class="filter_level"> 
    545     <span class="filter-title"> 
    546       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    547       <input type="hidden" name="filters[iiii][type]" value="level"/> 
    548       {$options.level.name} 
    549     </span> 
    550  
    551     <input type="hidden" name="filters[iiii][cond]" value="level"/> 
    552  
    553     <span class="filter-value"> 
    554       <select name="filters[iiii][value]"> 
    555         {html_options options=$level_options} 
    556       </select> 
    557     </span> 
    558   </li> 
    559   </div> 
    560  
    561   <!-- limit --> 
    562   <div id="filter_limit"> 
    563   <li id="filter_iiii" class="filter_limit"> 
    564     <span class="filter-title"> 
    565       <a href="#" class="removeFilter" title="{'remove this filter'|translate}"><span>[x]</span></a> 
    566       <input type="hidden" name="filters[iiii][type]" value="limit"/> 
    567       {$options.limit.name} 
    568     </span> 
    569  
    570     <input type="hidden" name="filters[iiii][cond]" value="limit"/> 
    571  
    572     <span class="filter-value"> 
    573       <input type="text" name="filters[iiii][value]" size="5"/> 
    574     </span> 
    575   </li> 
    576   </div> 
     110  {include file=$SMART_ABS_PATH|cat:'admin/template/filters.inc.tpl'} 
    577111</div> 
Note: See TracChangeset for help on using the changeset viewer.