Subversion-Projekte lars-tiefland.ci

Revision

Revision 42 | Blame | Vergleich mit vorheriger | Letzte Änderung | Log anzeigen | RSS feed 

<link rel="stylesheet" href="/styles/jquery-ui.css" type="text/css" media="screen" />
<style>
    .dd-selected-image{
        height:27px;
    }
    .dd-selected-text{
        line-height:0px;
    }
    .filter_elem_range {
        border: 1px solid #ccc;
        float: left;
        margin: 5px;
        min-height: 55px;
        padding: 8px !important;
        width: 20%;
    }

    .divh{
        width: 100%;
        padding-bottom: 1px;
        float:left;

    } 
    .brandbox {
        border-right: 1px solid #a0a0a0;
        border-left: 1px solid #a0a0a0;
        border-top: 1px solid #a0a0a0;
        border-bottom: 1px solid #a0a0a0;
        float: left;
        margin: 0;
        min-height: 108px;
        padding: 6px 4px;

        width: 106px;
        margin: 10px 0 0 10px;
    }
    .brandlogo {
        min-height: 88px;
        text-align: center;
    }
    .brandlogo img {
        cursor: pointer;
        max-height: 85px;
        max-width: 100px;
    }
    .brandbox input {
        height: 14px;
        line-height: 14px;
        margin: 2px 5px 0 0;
        padding: 0;
        float:left;
    }
    .brandbox span.amount {
        width:30px;
        float:left;
    }
</style>

<input type="button" id="atoggle" value="weitere Filter" class="resetbutton ui-button ui-widget ui-state-default ui-corner-all" />
<input type="reset" value="Felder zur&uuml;cksetzen" class="resetbutton ui-button ui-widget ui-state-default ui-corner-all" /> 
<input type="hidden" value="0" name="filterstatus" id="filterstatus"/>

<div class="divh">
    {foreach $herstellercheckbox as $row}
        <div title="{$row['Name']}" class="brandbox">
            <div class="brandlogo">
                <img data-labelfor="hersteller_{$row['ID']}" src="{$row['Logo1_href']}{$row['Logo1']}">
            </div>
            <input id="hersteller_{$row['ID']}" type="checkbox" name="hersteller[]" value="{$row['ID']}"  {if $row['selected'] == 1}checked{/if}/>
            <span class="amount left fs11">({$row['anzahlItems']})</span>  
        </div>
    {/foreach}  
    <input type="hidden" name="chkboxhersteller" id="chkboxhersteller" value="1">
</div>

<div class="options_select" >
    <div style="float:none;padding-bottom:13px;">
        <label style="float:left"><b>Preis:</b></label>               
        <b style="float:left"><span id="preise"></span></b><span><b>&nbsp;€</b></span>
    </div>
     <input type="hidden" id="hpreise" name="hpreise">
    <div id="hpreise-slider-range"></div>
</div>
{if isset($preisslider) }
    {$pmax = $preisslider[1]}
    {$pmin = $preisslider[0]}
{else}
    {$pmax = $maxpreis}
    {$pmin = 1}
{/if}
<script>
    $(document).ready(function () {
        $(function () {
            $("#hpreise-slider-range").slider({
                range: true,
                min: 1,
                max: {$maxpreis},
                values: [{$pmin}, {$pmax}],
                async: false,
                slide: function (event, ui) {
                    $("#hpreise").val("preis_" + ui.values[ 0 ] + "_" + ui.values[ 1 ]);
                    $("#preise").html(ui.values[ 0 ] + " - " + ui.values[ 1 ]);
                },
                stop: function (event, ui) {
                    showSubdirFilterResult("result");
                    refreshSubdirFilterFilter("select");
                }
            });
            $("#hpreise").val("preis_" + $("#hpreise-slider-range").slider("values", 0) +
                    "_" + $("#hpreise-slider-range").slider("values", 1));
            $("#preise").html($("#hpreise-slider-range").slider("values", 0) +
                    " - " + $("#hpreise-slider-range").slider("values", 1));
        });
    });
</script>       

<div id="divtoggle" class="divtoggle">

    {foreach $dropdown_opts as $index => $data}

        {foreach $data["options"] as $key => $values}    
            {$val = explode("_",$key)}
            {$aus = $val[0]}  
            {$max = $val[2]}
            {$min = $val[1]}
        {/foreach}

        {if (int)$min} 
            {if (int)$max}

                {if isset($data["selected"]) }
                    {$sval = explode("_",$data["selected"])}
                    {$saus = $sval[0]}       
                    {$max = $sval[2]}
                    {$min = $sval[1]}
                {else}

                {/if}
                <div class="options_select">
                    <div style="float:none;padding-bottom:30px;">
                        <label style="float:left"><b>{$data["label"]}:</b></label>
                        {$res = str_replace(" ","",$data["label"])}
                        <b style="float:left"><span id="s{$res}"></span></b><span><b></b></span>
                    </div>
                    <input type="hidden" id="{$res}" name="{$data["label"]}">
                    <div id="{$res}-slider-range"></div>
                </div>
                <script>
                    $(document).ready(function () {
                        $(function () {
                            $("#{$res}-slider-range").slider({
                                range: true,
                                min: {0},
                                max: {50},
                                async: false,
                                values: [{$min}, {$max}],
                                slide: function (event, ui) {
                                    $("#{$res}").val({$aus} + "_" + +ui.values[ 0 ] + "_" + ui.values[ 1 ]);
                                    $("#s{$res}").html("" + ui.values[ 0 ] + " - " + ui.values[ 1 ]);
                                },
                                stop: function (event, ui) {

                                    showSubdirFilterResult("result");
                                    refreshSubdirFilterFilter("select");
                                }
                            });
                            $("#{$res}").val({$aus} + "_" + $("#{$res}-slider-range").slider("values", 0) +
                                    "_" + $("#{$res}-slider-range").slider("values", 1));
                            $("#s{$res}").html("" + $("#{$res}-slider-range").slider("values", 0) +
                                    " - " + $("#{$res}-slider-range").slider("values", 1));
                        });
                    });
                </script>         
            {else}
                {if isset($data["selected"]) }
                    {$sval = explode("_",$data["selected"])}
                    {$saus = $sval[0]}       
                    {$max = $sval[2]}
                    {$amin = $sval[1]}
                    {$amax = $sval[1]}
                {else}
                    {$amin = $min}
                    {$amax = $data['maxval']}
                {/if}
                {if $max == 'g'}
                    <div class="options_select">
                        <div style="float:none;padding-bottom:30px;">
                            <label style="float:left"><b>{$data["label"]}:</b></label>
                            {$res = str_replace(" ","",$data["label"])}
                            <b><span style="float:left" id="s{$res}"></span></b><span><b></b></span>
                        </div>
                        <input type="hidden" id="{$res}" name="{$data["label"]}">
                        <div id="{$res}-slider-range-min"></div>
                    </div>
                    <script>
                        $(function () {
                            $("#{$res}-slider-range-min").slider({
                                range: "min",
                                min: 0,
                                max: {$data['maxval']},
                                value: {$amax},
                                slide: function (event, ui) {
                                    $("#{$res}").val({$aus} + '_' + ui.value + '_g');
                                    $("#s{$res}").html(ui.value);
                                },
                                stop: function (event, ui) {

                                    showSubdirFilterResult("result");
                                    refreshSubdirFilterFilter("select");
                                }
                            });
                            $("#{$res}").val({$aus} + '_' + $("#{$res}-slider-range-min").slider("value") + '_g');
                            $("#s{$res}").html($("#{$res}-slider-range-min").slider("value"));
                        });
                    </script>
                {else}
                    <div class="options_select">
                        <div style="float:none;padding-bottom:30px;">
                            <label style="float:left"><b>{$data["label"]}:</b></label>
                            {$res = str_replace(" ","",$data["label"])}
                            <b><span style="float:left" id="s{$res}"></span></b><span><b></b></span>
                        </div>
                        <input type="hidden" id="{$res}" name="{$data["label"]}">
                        <div id="{$res}-slider-range-max"></div>
                    </div>
                    <script>
                        $(function () {
                            $("#{$res}-slider-range-max").slider({
                                range: "max",
                                min: {$min},
                                max: 140,
                                value: {$amin},
                                slide: function (event, ui) {
                                    $("#{$res}").val({$aus} + '_' + ui.value + '_l');
                                    $("#s{$res}").html(ui.value);
                                },
                                stop: function (event, ui) {

                                    showSubdirFilterResult("result");
                                    refreshSubdirFilterFilter("select");
                                }
                            });
                            $("#{$res}").val({$aus} + '_' + $("#{$res}-slider-range-max").slider("value") + '_l');
                            $("#s{$res}").html($("#{$res}-slider-range-max").slider("value"));
                        });
                    </script>
                {/if}
            {/if}
        {else}
        {/if}
    {/foreach}
    {foreach $checkboxlist as $label => $value}
        <div class="options_select">
            <b>{$label}</b>
            <div>
                <div class="mehrFilter" style="display: block;">
                    {foreach $value as $row}
                        <div class="auspraegungsfilter">
                            <input id="{$row[0]}" type="checkbox" name="{$row[0]}" value="{$row[0]}"  {if $row[2] == 1}checked{/if}/>
                            <label data-labelfor="{$row[0]}">{$row[1]}</label>    
                        </div>
                    {/foreach}
                </div>
            </div>
        </div>
    {/foreach} 


    <script>
        $(document).ready(function () {
            var wWidth = $(window).width();
            var dWidth = wWidth * 0.1;
            var wHeight = $(window).height();
            var dHeight = wHeight * 0.17;
            $("#loading").dialog({
                autoOpen: false,
                width: 150,
                height: 150
            });
            $(".ui-dialog-titlebar").hide();
            var maxH = 0;
            $('.optionsReload .options_select').each(function () {
                var h = $(this).height();
                if (h > maxH) {
                    maxH = h;
                }
            });
          
            $('.optionsReload .options_select').css("min-height", "73px");
            $('.optionsReload .options_select').css("height", maxH + "px");
            /*    $('#hersteller_dr').ddslick({
             width: 200,
             imagePosition: "right",
             imageHeight: 20,
             onSelected: function (selectedData) {
             var al = $(".dd-selected-value").val();
             $("#hersteller").val(al);
             var mode = "result";
             daten = $('#modellForm').serializeArray();
             $.ajax({
             type: "POST",
             url: "/module/artikelmodell.php?mode=" + mode,
             data: daten,
             async: false,
             success: function (html) {
             if (mode == "result") {
             $(".pagination_container").css("display", "none");
             $('.subdir_artikel').html(html);
             $(".subdir_artikel").css("background-color", "transparent");
             $(".loader").hide();
             $(".newsorting").css("display", "block");
             }
             }
             })
             }
             });*/
            $("#atoggle").click(function () {
                $("#divtoggle").toggle();
                if (!$("#divtoggle").is(':visible')) {
                    $(this).val("weitere Filter");
                    $("#filterstatus").val(0);
                } else {
                    $(this).val("weniger Filter");
                    $("#filterstatus").val(1);
                }
                return false;
            })

        {if isset($filterstatus) && $filterstatus == 1}
            $("#divtoggle").show();
            $("#filterstatus").val(1);
            $("#atoggle").val("weniger Filter");

        {else}

            $("#divtoggle").hide();
            $("#filterstatus").val(0);
            $("#atoggle").val("weitere Filter");
        {/if}

            $("[data-labelfor]").click(function () {
                $('#' + $(this).attr("data-labelfor")).prop('checked',
                        function (i, oldVal) {
                            return !oldVal;
                        });
                showSubdirFilterResult("result");
                refreshSubdirFilterFilter("select");
            });


        });
        function showSubdirFilterResult(mode)
        {
            $("#loading").dialog('open');
            daten = $('#modellForm').serializeArray();
            setTimeout(function () {
                $.ajax({
                    type: "POST",
                    url: "/module/artikelmodell.php?mode=" + mode,
                    data: daten,
                    async: false,
                    success: function (html) {
                        if (mode == "result") {
                            $(".pagination_container").css("display", "none");
                            $('.subdir_artikel').html(html);
                            $(".subdir_artikel").css("background-color", "transparent");

                            $(".newsorting").css("display", "block");
                        }
                    }
                })
            }, 1);
        }

        function refreshSubdirFilterFilter(mode) {

            daten = $('#modellForm').serializeArray();
            $.ajax({
                type: "POST",
                url: "/module/updateSearchFilterSubdir.php?mode=" + mode,
                data: daten,
                async: false,
                beforeSend: function () {
                    $(".box_2").css("background-color", "transparent");
                    $(".subdir_artikel").css("background-color", "#ccc");

                },
                success: function (html) {

                    setTimeout(function () {
                        $('#loading').dialog('close');
                    }, 1);

                }
            })
            return true;
        }
    </script>
    <div id="loading" title=""> 
        <img src="/images/webelemente/loading.gif" /> 
    </div>