funschilder

{assign var=group value=$_order_addon_fields.0.f_group}

{if !$smarty.session.order_addon_ok.$group}
<div class="highlightbox">
    {$message}
    {form type=form name=itl_order_addons_box action='itl_order_addons' link_params=getParams method=GET}
    {form type=hidden name=info value=$products_id}
    {form type=hidden name=products_id value=$products_id}
    {form type=hidden name=group value=$_order_addon_fields.0.f_group}
    {form type=hidden name=page value='itl_order_addons'}
    {form type=hidden name=page_action value='add_tag'}

    {assign var=link value=''}
    {assign var=desc value=''}
    <span style="margin-left: 12px; font-weight: bold">Bitte gew&uuml;nschten Text eingeben:</span>
    <span>{form type=text name=$_order_addon_fields.2.f_model value=$_order_addon_fields.2.f_value id="funtext" maxlength="10" size=$_order_addon_fields.2.f_size}</span>
    <div class="eingabe" style="height: 550px">
    <div id="preview" style="float: left; border: 3px solid black;"></div>
    <div style="float: left; width: 140px; margin: 15px 0">
        <ul id="symboles2">
            <li style="font-weight: bold; text-align: center;">Hintergrund</li>
            <li id="bgblaur" class="bg-motiv bg-blau_reflex small" onclick="addBg('bg-motiv bg-blau_reflex')" data-val="blau_reflex" ></li>
            <li id="bggold" class="bg-motiv bg-gold small" onclick="addBg('bg-motiv bg-gold')" data-val="gold"></li>
            <li id="bggoldr" class="bg-motiv bg-gold_reflex small" onclick="addBg('bg-motiv bg-gold_reflex')" data-val="gold_reflex"></li>
            <li id="bgrotr" class="bg-motiv bg-rot_reflex small" onclick="addBg('bg-motiv bg-rot_reflex')" data-val="rot_reflex"></li>
            <li id="bgsilber" class="bg-motiv bg-silber small" onclick="addBg('bg-motiv bg-silber')" data-val="silber"></li>
            <li id="bgsilberr" class="bg-motiv bg-silber_reflex small" onclick="addBg('bg-motiv bg-silber_reflex')" data-val="silber_reflex"></li>
            <li id="bgviolett" class="bg-motiv bg-violett_special small" onclick="addBg('bg-motiv bg-violett_special')" data-val="violett_special"></li>
        </ul>
    </div>
    <div style="clear: both"></div>
    <div style="margin-top: -200px; position: absolute; height: 400px;">
    <div style="float:left; font-weight: bold; margin-left: 25px;">Schriftfarbe: &nbsp;</div><div class="red" data-val="red"></div><div class="green" data-val="green"></div><div class="silber" data-val="silver"></div><div class="white" data-val="white"></div>


            <div style="clear: both"></div>

            <div style="float: left; width: 540px; margin: 0 25px;">
                <ul id="symboles">
                    <li class="sprite-motiv sprite-motiv_03" onclick="addSymbol(':03:')"></li>
                    <li class="sprite-motiv sprite-motiv_05" onclick="addSymbol(':05:')"></li>
                    <li class="sprite-motiv sprite-motiv_08" onclick="addSymbol(':08:')"></li>
                    <li class="sprite-motiv sprite-motiv_10" onclick="addSymbol(':10:')"></li>
                    <li class="sprite-motiv sprite-motiv_13" onclick="addSymbol(':13:')"></li>
                    <li class="sprite-motiv sprite-motiv_16" onclick="addSymbol(':16:')"></li>
                    <li class="sprite-motiv sprite-motiv_18" onclick="addSymbol(':18:')"></li>
                    <li class="sprite-motiv sprite-motiv_20" onclick="addSymbol(':20:')"></li>
                    <li class="sprite-motiv sprite-motiv_30" onclick="addSymbol(':30:')"></li>
                    <li class="sprite-motiv sprite-motiv_32" onclick="addSymbol(':32:')"></li>
                    <li class="sprite-motiv sprite-motiv_34" onclick="addSymbol(':34:')"></li>
                    <li class="sprite-motiv sprite-motiv_36" onclick="addSymbol(':36:')"></li>
                    <li class="sprite-motiv sprite-motiv_37" onclick="addSymbol(':37:')"></li>
                    <li class="sprite-motiv sprite-motiv_39" onclick="addSymbol(':39:')"></li>
                    <li class="sprite-motiv sprite-motiv_41" onclick="addSymbol(':41:')"></li>
                    <li class="sprite-motiv sprite-motiv_49" onclick="addSymbol(':49:')"></li>
                    <li class="sprite-motiv sprite-motiv_50" onclick="addSymbol(':50:')"></li>
                    <li class="sprite-motiv sprite-motiv_51" onclick="addSymbol(':51:')"></li>
                    <li class="sprite-motiv sprite-motiv_53" onclick="addSymbol(':53:')"></li>
                    <li class="sprite-motiv sprite-motiv_56" onclick="addSymbol(':56:')"></li>
                    <li class="sprite-motiv sprite-motiv_58" onclick="addSymbol(':58:')"></li>
                    <li class="sprite-motiv sprite-motiv_59" onclick="addSymbol(':59:')"></li>
                    <li class="sprite-motiv sprite-motiv_60" onclick="addSymbol(':60:')"></li>
                    <li class="sprite-motiv sprite-motiv_70" onclick="addSymbol(':70:')"></li>
                    <li class="sprite-motiv sprite-motiv_72" onclick="addSymbol(':72:')"></li>
                    <li class="sprite-motiv sprite-motiv_73" onclick="addSymbol(':73:')"></li>
                    <li class="sprite-motiv sprite-motiv_74" onclick="addSymbol(':74:')"></li>
                    <li class="sprite-motiv sprite-motiv_75" onclick="addSymbol(':75:')"></li>
                    <li class="sprite-motiv sprite-motiv_81" onclick="addSymbol(':81:')"></li>
                    <li class="sprite-motiv sprite-motiv_82" onclick="addSymbol(':82:')"></li>
                    <li class="sprite-motiv sprite-motiv_84" onclick="addSymbol(':84:')"></li>
                    <li class="sprite-motiv sprite-motiv_87" onclick="addSymbol(':87:')"></li>
                    <li class="sprite-motiv sprite-motiv_89" onclick="addSymbol(':89:')"></li>
                    <li class="sprite-motiv sprite-motiv_91" onclick="addSymbol(':91:')"></li>
                    <li class="sprite-motiv sprite-motiv_93" onclick="addSymbol(':93:')"></li>
                    <li class="sprite-motiv sprite-motiv_94" onclick="addSymbol(':94:')"></li>
                    <li class="sprite-motiv sprite-motiv_95" onclick="addSymbol(':95:')"></li>
                    <li class="sprite-motiv sprite-motiv_96" onclick="addSymbol(':96:')"></li>
                </ul>
            </div>

        </div>

</div>
    <select id="hintergrund" name="{$_order_addon_fields.1.f_model}">
                    {foreach key=key_data item=item_data from=$_order_addon_fields.1.f_options}
                        <option  value="{$item_data.id}"
                            {if $item_data.selected} selected="selected" {/if}>{$item_data.text}
                        </option>
                    {/foreach}
        </select>

        <select id="schriftfarbe" name="{$_order_addon_fields.3.f_model}">
                    {foreach key=key_data item=item_data from=$_order_addon_fields.3.f_options}
                        <option  value="{$item_data.id}"
                            {if $item_data.selected} selected="selected" {/if}>{$item_data.text}
                        </option>
                    {/foreach}
        </select>

    <div class="clear"></div>
    <input onsubmit="updatePreviewAfter()"style="float: left; margin-top: 10px" name="submit" id="submit" value="submit" type="image" src="{$tpl_url_path}img/eingabe-bestaetigen.png" />

    {form type=formend}

</div>
{else}
    {form type=form name=itl_order_addons_box action='itl_order_addons' link_params=getParams method=GET}
    {form type=hidden name=info value=$products_id}
    {form type=hidden name=products_id value=$products_id}
    {form type=hidden name=group value=$_order_addon_fields.0.f_group}
    {form type=hidden name=page value='itl_order_addons'}
    {form type=hidden name=page_action value='add_tag'}

    <div id="previewAfter" class="bg-motiv bg-{$_order_addon_fields.1.f_value}" style="color: {$_order_addon_fields.3.f_value}">{$_order_addon_fields.2.f_value}</div>

    <button class="button" onclick="updatePreviewAfter();">click me</button>

    <div style="float: left; margin: 20px 20px; font-weight: bold"> {$_order_addon_fields.2.f_name}: </div>
    <div id="textAfter" style="float: left; margin: 20px 20px;"> {$_order_addon_fields.2.f_value} </div>

    <div class="clear"></div>

    <div style="float: left; margin: 20px 20px; font-weight: bold"> {$_order_addon_fields.1.f_name}: </div>
    <div style="float: left; margin: 20px 20px;"> {$_order_addon_fields.1.f_value} </div>

    <div class="clear"></div>

    <div style="float: left; margin: 20px 20px; font-weight: bold"> {$_order_addon_fields.3.f_name}: </div>
    <div style="float: left; margin: 20px 20px;"> {$_order_addon_fields.3.f_value} </div>

    <div class="clear"></div>

    <input name="reset" id="reset" value="reset" type="image" src="{$tpl_url_path}img/reset.gif" />
    {form type=formend}
{/if}