WebSVN – lars-tiefland.ci – /frontend/views/templates/module/produktfinder.tpl

{include file="header.tpl"}
<!--<script type="text/javascript" language="javascript" src="/JavaScript/jquery.min.js"></script>
<script type="text/javascript" language="javascript" src="/JavaScript/jquery-ui.min.js"></script>-->
<link type="text/css" href="/styles/produktfinder.css" rel="stylesheet" />
<script type="text/javascript" language="javascript" src="/JavaScript/jquery.toChecklist.min.js?{$smarty.now}"></script>
{if $smarty.session.mobile == true}
<script type="text/javascript" language="javascript" src="/JavaScript/jquery.ui.touch-punch.min.js"></script>
<script>
    $(document).ready(function(){
        $('.ui-slider-handle').draggable();
        $('.filter_elem_radio, .filter_elem_select, .filter_elem').accordion({
          collapsible: true,
          heightStyle: "content",
          active: false
        });
    })
</script>
{/if}

{if $smarty.get.mode=="produktfinder"}    
<script>
    $(function() {
        $('select').toChecklist( {
            addScrollBar: true,
            addSearchBox: false
        } );
    } );
</script>

<script>
    /* produktfinder */
    $(document).ready(function(){
        $('#frb_dialog').dialog({
            modal: false,
            autoOpen: false,
            show: "fade",
            hide: "fade",
            draggable: false,
            resizable: false,
            closeOnEscape: false,
            position:{
                my: "center",
                at: "center",
                of: window
            },

        });
        $(".filter_elem_range").mouseup(produktfinderForm);
        $(".filter_elem_range").keyup(produktfinderForm);
        $("input").change(produktfinderForm);
        $("select").change(produktfinderForm);
        $("#frb_submit").button().click(produktfinderForm);
        $('#kill_filter').button().click(kill_filter);
        {if $smarty.session.frb && !isset($smarty.get.kill_filter)}
            $("#frb_submit").click();
        {/if}
        
        function kill_filter()
        {
            document.location.href="/index.php?mode=produktfinder&kill_filter=true";
        }
        function produktfinderForm() {
            $('#frb_dialog').dialog('open');
            var formValues = $("#produktfinder_form").serialize();
            $('#produktfinder_result').load("/module/produktfinder.php?"+formValues,function(){
                $('#frb_dialog').dialog("close");
            }); 
        }
        
    });
</script>
{/if}

<style>
.produktfinder .ui-dialog-titlebar {
    display:none;
}
</style>
<section class="produktfinder">
    <div class="inner">


<form id="produktfinder_form" method="get">
        <div class="mainnav_title"><h1>Finde dein Bike!</h1></div>

    {if $infotext}
        <div class="infotext">
            <b>{$infotext.title}</b>
            <p>{$infotext.inhalt}</p>
        </div>    
    {/if}

        <div class="filter_elem_range">
            <script>
            $(function() {
            $( "#preis" ).slider( {
                range: true,
                min: 200,
                max: 10000,
                step: 50,
                values: [ {$smarty.session["frb"]["min_preis"]|default:200}, {$smarty.session["frb"]["max_preis"]|default:10000} ],
                slide: function( event, ui ) {
                    $( "#range_preis" ).text(  ui.values[ 0 ] + " - " + ui.values[ 1 ] );
                    $( "#min_preis" ).val(  ui.values[ 0 ] );
                    $( "#max_preis" ).val(  ui.values[ 1 ] );
                    $( "#sl_preis" ).val("1");
                }
            });
            $( "#range_preis" ).val( $( "#preis" ).slider( "values", 0 ) +
                " - " + $( "#preis" ).slider( "values", 1 )  ) ;
            });
            </script>
            <label for="range_preis"><b>Preis:</b></label>
            <input type="hidden" id="min_preis" name="min_preis" value="{$smarty.session["frb"]["min_preis"]|default:''}" />
            <input type="hidden" id="max_preis" name="max_preis" value="{$smarty.session["frb"]["max_preis"]|default:''}" />
            <input type="hidden" id="sl_preis" name="sl_preis" value="{if $smarty.session["frb"]["min_preis"]>0 || $smarty.session["frb"]["max_preis"]>0}1{/if}" />
            <span style="font-weight:bold;" id="range_preis">{$smarty.session["frb"]["min_preis"]|default:''} - {$smarty.session["frb"]["max_preis"]|default:''}</span>
            <span style="font-weight:bold;"> &euro;</span>

            <div id="preis"></div>
            
        </div>
        <div class="filter">
            <b>Hersteller:</b><br />
            <select name="sel_hersteller">
            <option value="" label="Bitte wählen">Bitte wählen</option>
            {html_options options=$hersteller selected=$smarty.session["frb"]["sel_hersteller"]}            
}
            </select>
        </div>

        <div class="filter">
            <input type="hidden" name="cb_neu" value="0" />
            <input style="float:left;margin-top:3px;" id="cb_neu" type="checkbox" name="cb_neu" value="1" 
            {if $smarty.session["frb"]["cb_neu"]}checked="checked" {/if} /><label class="checkbox_label" for="cb_neu"><b>Neu im Shop</b></label>
        </div>

{foreach $filter as $key => $elem}
     <!-- 0 Text -->
     <!-- 1 Wertebreich REGLER -->
     {if $elem.type==1}
        <div class="filter_elem_range">
            {assign var='werte' value=$elem.wertebereich|unserialize}
            <script>
            $(function() {
            {if $elem.richtung=="maximal"}
                $( "#{$elem.ID}" ).slider( {
                    range: "max",
                    max: {$werte[1]},
                    min: {$werte[0]},
                    value: {$smarty.session["frb"]["max_{$elem.ID}"]|default:$werte[0]},
                    slide: function( event, ui ) {
                        $( "#range_{$elem.ID}" ).text(  ui.value );
                        $( "#max_{$elem.ID}" ).val(  ui.value );
                        $("#sl_{$elem.ID}").val("1");
                    }
                });
                $( "#range_{$elem.ID}" ).val( $( "#{$elem.ID}" ).slider( "value" ));
            {elseif $elem.richtung=="minimal"}
                $( "#{$elem.ID}" ).slider( {
                    range: "min",
                    max: {$werte[1]},
                    min:{$werte[0]},
                    value: {$smarty.session["frb"]["min_{$elem.ID}"]|default:$werte[1]},
                    slide: function( event, ui ) {
                        $( "#range_{$elem.ID}" ).text(  ui.value );
                        $( "#min_{$elem.ID}" ).val(  ui.value );
                        $( "#sl_{$elem.ID}" ).val("1");
                    }
                });
                $( "#range_{$elem.ID}" ).val( $( "#{$elem.ID}" ).slider( "value" ));                   
            {else}                                        
                $( "#{$elem.ID}" ).slider( {
                    range: true,
                    min: {$werte.0},
                    max: {$werte.1},
                    values: [ {$smarty.session["frb"]["min_{$elem.ID}"]|default:$werte[0]}, {$smarty.session["frb"]["max_{$elem.ID}"]|default:$werte[1]} ],
                    slide: function( event, ui ) {
                        $( "#range_{$elem.ID}" ).text(  ui.values[ 0 ] + " - " + ui.values[ 1 ]);
                        $( "#min_{$elem.ID}" ).val(  ui.values[ 0 ] );
                        $( "#max_{$elem.ID}" ).val(  ui.values[ 1 ] );
                        $( "#sl_{$elem.ID}" ).val("1");
                    }
                });
                $( "#range_{$elem.ID}" ).val( $( "#{$elem.ID}" ).slider( "values", 0 ) +
                    " - " + $( "#{$elem.ID}" ).slider( "values", 1 ) ) ;
            {/if}            
            });
            </script>
            
            <label for="range_{$elem.ID}"><b>{$elem.name}: </b></label>
            <input type="hidden" id="min_{$elem.ID}" name="min_{$elem.ID}" value="{$smarty.session["frb"]["min_{$elem.ID}"]|default:''}" />
            <input type="hidden" id="max_{$elem.ID}" name="max_{$elem.ID}" value="{$smarty.session["frb"]["max_{$elem.ID}"]|default:''}" />
            
            <input type="hidden" name="richtung_{$elem.ID}" value="{$elem.richtung}" />
            <input type="hidden" id="sl_{$elem.ID}" name="sl_{$elem.ID}" value="{if $smarty.session["frb"]["min_{$elem.ID}"]>0 || $smarty.session["frb"]["max_{$elem.ID}"]>0}1{/if}" />
            <span style="font-weight:bold;" id="range_{$elem.ID}">{$smarty.session["frb"]["min_{$elem.ID}"]|default:''}{if $elem.richtung==""} - {/if}{$smarty.session["frb"]["max_{$elem.ID}"]|default:''}</span>
            <span style="font-weight:bold;">{$elem.einheit}</span>

            <div id="{$elem.ID}"></div>
            
        </div>
     {/if}
         <!-- 2 Ja/nein RADIO -->       
     {if $elem.type==2 && $elem.suchkriterium==1}
        <div class="filter_elem_radio">
            <b>{$elem.name}</b>
            
            <div>
                <input type="hidden" name="radio_{$elem.ID}" value="2" />
                <!--<input style="float:left;" id="{$elem.ID}" type="checkbox" name="cb_{$elem.ID}" value="1" {if $smarty.session["frb"]["cb_{$elem.ID}"]} checked="checked"{/if}/>-->
                {html_radios name="radio_{$elem.ID}" selected=$smarty.session["frb"]["radio_{$elem.ID}"] options=$elem.options separator="&nbsp;"}
            </div>
        </div>
     {/if}
         <!-- 3 Preisspanne --> 
         <!-- 4 Überschrift -->        
         <!-- 5 Auswahl  -->
     {if $elem.type==5}
        <div class="filter_elem_select">
            {assign var='options' value=$elem.wertebereich|unserialize}
            <b>{$elem.name}</b>
            <div>
                <select name="sel_{$elem.ID}">
                    <option value="" label="Bitte wählen">Bitte wählen</option>
                    {html_options values=array_values($options) output=array_values($options) selected=$smarty.session.frb["sel_{$elem.ID}"]}
                </select>
            </div>
        </div>
     {/if}
         <!-- 6 Mehrfachauswahl MULTISELECTBOX -->      
     {if $elem.type==6}
        {assign var='options' value=$elem.wertebereich|unserialize}
        {assign var='cnt' value=$options|count}
        {assign var="height" value=$cnt*25}
        <div class="filter_elem">
            <b>{$elem.name}</b>
            <div>
                {html_options id="ms_{$elem.ID}" name="ms_{$elem.ID}" values=array_values($options) output=array_values($options) multiple="multiple" selected=$elem.checked}
            </div>
        </div>
     {/if}
         <!-- 7 EU-Energielabel  -->
         <!-- 10 EU-Energieauswahl -->
{/foreach}
    <div style="float:left;text-align:right;width:50%;">
       <input id="frb_submit" type="button" value=" Filter aktualisieren " />
    
</form>
    
       <input id="kill_filter" type="button" value=" alle Filter zurücksetzen " />
    </div>

<div id="frb_dialog">
    <p style='text-align:center;padding:0px 0 0 0px;'>
        <img src='/images/webelemente/loading.gif' /><br /> Bitte warten Sie..<br /><br />
    </p>
</div>
<div id="produktfinder_result"></div>


    </div>
        
</section>
{include file="footer.tpl"}
Subversion-Projekte lars-tiefland.ci

(root)/frontend/views/templates/module/produktfinder.tpl – Revision 756
