antadis/chocolatdemariage
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

simulator

Browse Source
This commit is contained in:
Preprod mutu 2017-08-24 12:40:55 +02:00
parent 5896becac2
commit 4c57b48b7d
6 changed files with 145 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
www/modules/antadissimulator/views/css/simulate.css
View File

@ -251,10 +251,10 @@ border-top: 1px solid #C7AC9F; }
.pochette-eve .image-holder{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important; position:absolute; width:300px; height:200px; background:#FFF;} .pochette-eve .image-holder{background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important; position:absolute; width:300px; height:200px; background:#FFF;}
.pochette-eve .face-custom-img{ z-index:2; position:absolute;background-size:cover!important;background-position:center!important;} .pochette-eve .face-custom-img{ z-index:2; position:absolute;background-size:cover!important;background-position:center!important;}
#image-block .customform { margin-top: 50px; }
/* Chocos Faces Bottom /* Chocos Faces Bottom
========================================================================== */ ========================================================================== */
#simu-chocos { min-height:180px; position:relative; padding-top: 50px; background-color: transparent; } #simu-chocos { position:relative; padding-top: 50px; background-color: #eaeaea;}
#simu-chocos:before { #simu-chocos:before {
content: ''; content: '';
display: block; display: block;
@ -264,7 +264,8 @@ border-top: 1px solid #C7AC9F; }
background-color: #fff; background-color: #fff;
left: 0; right: -15px; left: 0; right: -15px;
} }
.chocos-holder{padding:10px;padding-right:0; margin-top:45px; } .chocos-holder{padding: 10px; padding-right:0; margin-top:45px; }
.chocos-holder:after { content: ''; display: block; clear: both; }
.flip-container { perspective:1000;transform:perspective(1000px);transform-style:preserve-3d;float:left;margin-right:10px;width:100px;height:110px;} .flip-container { perspective:1000;transform:perspective(1000px);transform-style:preserve-3d;float:left;margin-right:10px;width:100px;height:110px;}
.flipper { transition:.6s;position:relative;width:100px;height:110px; } .flipper { transition:.6s;position:relative;width:100px;height:110px; }
@ -466,7 +467,7 @@ position:absolute;top:0;left:0; border:5px solid #000; border-left:none; border-
.imgface{background-size:cover;background-repeat:no-repeat;} .imgface{background-size:cover;background-repeat:no-repeat;}
.numberface{ line-height:200px; font-size:80px; opacity:.1;} .numberface{ line-height:200px; font-size:80px; opacity:.1;}
.imgface.actif{border:3px solid #e2007a; background-size:cover;background-repeat:no-repeat;} .imgface.actif{border:3px solid #e2007a; background-size:cover;background-repeat:no-repeat;}
.simu-container .imgface.actif{width:194px; height:194px;} .simu-container .imgface.actif{width:194px; height:194px; }
.chocos-holder .imgface.actif{width:94px; height:94px;} .chocos-holder .imgface.actif{width:94px; height:94px; min-width: 100%; }
.txtface{ color:#000; font-weight:normal;} .txtface{ color:#000; font-weight:normal;}

177
www/modules/antadissimulator/views/templates/hook/productbloc/vrac-exclusif.tpl
View File

@ -74,105 +74,106 @@
</div> </div>
<br/><br/><br/><br/><br/><br/>
<!-- SIMULATION --> <!-- SIMULATION -->
<div id="simu-chocos" class="mgin-t-20"> <div id="simu-chocos" class="mgin-t-20">
<h2>Simulation chocolats</h2> <h2>Simulation chocolats</h2>
<div class="chocos-holder exclu"></div> <div class="chocos-holder exclu"></div>
</div> </div>
<div id="facecustomform"> <div id="facecustomform" class="customform">
<p>Cliquez sur une face pour la personnaliser</p> <p>Cliquez sur une face pour la personnaliser</p>
<input type="hidden" name="item" value="1"/>
<input type="hidden" name="item" value="1"/> <div class="clearfix form-group">
<label class="label">Personnalisation Face</label>
<div> <div class="ctn-input">
<label class="label">Personnalisation Face</label> <select class="form-control custom-input" name="select-custom">
<div class="ctn-input"> <option value="TEXT">Texte</option>
<div class="form-control-ctn custom-select"> <option value="INITIALE">Initiales</option>
<select class="form-control" name="select-custom"> <option value="IMAGE">Image</option>
<option value="TEXT">Texte</option> </select>
<option value="INITIALE">Initiales</option> </div>
<option value="IMAGE">Image</option>
</select>
</div>
</div>
</div> </div>
<div class="form-group type-file"> <div class="form-group type-file">
<label class="label DOUBLECUBEIMAGE">Télécharger votre image (max 2Mo)</label> <label class="label DOUBLECUBEIMAGE">Télécharger votre image (max 2Mo)</label>
<div class="ctn-input"> <div class="ctn-input">
<div class="custom-file"> <div class="custom-file">
<input id="DOUBLECUBEIMAGE" class="configurator-opt-file" name="files" data-field="optgroup-9-19" data-url="/configurator/upload/16/DOUBLECUBEIMAGE" type="file"> <input id="DOUBLECUBEIMAGE" class="configurator-opt-file" name="files" data-field="optgroup-9-19" data-url="/configurator/upload/16/DOUBLECUBEIMAGE" type="file">
<span class="filename">No file selected</span> <span class="filename">No file selected</span>
<span class="action">Choose File</span></div></div> <span class="action">Choose File</span>
<span id="response-optgroup-9-19"></span> </div>
<input name="optgroup-9-19" value="" type="hidden"> </div>
<span id="response-optgroup-9-19"></span>
<input name="optgroup-9-19" value="" type="hidden">
</div> </div>
<div> <div class="clearfix form-group">
<h2>Choix de la couleur de fond</h2> <h2>Choix de la couleur de fond</h2>
<div class="pdin-lr-10"> <div class="pdin-lr-10">
<div class="mgin-b-5"> <div class="mgin-b-5">
<span class="c-maroon" style="padding-right:8px">Couleur 1 :</span> <span class="c-maroon" style="padding-right:8px">Couleur 1 :</span>
<select name="colorpicker" id="colorpicker1" style="display: none;"> <select name="colorpicker" id="colorpicker1" style="display: none;">
<option value="#B5DC10" data-id="anis">Anis</option> <option value="#B5DC10" data-id="anis">Anis</option>
<option value="#F0037F" data-id="fuschia">Fuchsia</option> <option value="#F0037F" data-id="fuschia">Fuchsia</option>
<option value="#FFC211" data-id="or">Or/Jaune</option> <option value="#FFC211" data-id="or">Or/Jaune</option>
<option value="#7FCDD0" data-id="turquoise">Turquoise</option> <option value="#7FCDD0" data-id="turquoise">Turquoise</option>
<option value="#766546" data-id="grisf">Gris foncé</option> <option value="#766546" data-id="grisf">Gris foncé</option>
<option value="#159033" data-id="vert">Vert</option> <option value="#159033" data-id="vert">Vert</option>
<option value="#6B1687" data-id="violet">Violet</option> <option value="#6B1687" data-id="violet">Violet</option>
<option value="#E37222" data-id="orange">Orange</option> <option value="#E37222" data-id="orange">Orange</option>
<option value="#10147E" data-id="bleuf">Bleu foncé</option> <option value="#10147E" data-id="bleuf">Bleu foncé</option>
<option value="#7F0700" data-id="bordeaux">Bordeaux</option> <option value="#7F0700" data-id="bordeaux">Bordeaux</option>
<option value="#F88CC4" data-id="rose">Rose</option> <option value="#F88CC4" data-id="rose">Rose</option>
<option value="#D198CA" data-id="parme">Parme</option> <option value="#D198CA" data-id="parme">Parme</option>
<option value="#F50003" data-id="rouge">Rouge</option> <option value="#F50003" data-id="rouge">Rouge</option>
<option value="#C42B68" data-id="framboise">Framboise</option> <option value="#C42B68" data-id="framboise">Framboise</option>
<option value="#3C1503" data-id="marron">Marron</option> <option value="#3C1503" data-id="marron">Marron</option>
<option value="#FFFFFF" data-id="blanc">Blanc</option> <option value="#FFFFFF" data-id="blanc">Blanc</option>
<option value="#FFFAD7" data-id="ivoire">Ivoire</option> <option value="#FFFAD7" data-id="ivoire">Ivoire</option>
<option value="#CCC6AB" data-id="taupe">Taupe</option> <option value="#CCC6AB" data-id="taupe">Taupe</option>
<option value="#C2C2C2" data-id="argent">Argent/Gris clair</option> <option value="#C2C2C2" data-id="argent">Argent/Gris clair</option>
<option value="#000000" data-id="noir">Noir</option> <option value="#000000" data-id="noir">Noir</option>
</select> </select>
<span style="font-size:18px; padding-right:8px;">￬</span> <span style="font-size:18px; padding-right:8px;">￬</span>
<span class="color1text">Bleu foncé</span> <span class="color1text">Bleu foncé</span>
</div> </div>
</div> </div>
</div> </div>
<div> <div class="clearfix form-group">
<label>Police de caractère</label> <label>Police de caractère</label>
<select name="select-font" id="select-font"> <div class="ctn-input">
<option value="Aladdin">Aladdin</option> <div>
<option value="Annifont">Annifont</option> <select class="custom-input form-control" name="select-font" id="select-font">
<option value="Garamond">Garamond itc</option> <option value="Aladdin">Aladdin</option>
<option value="Harrington">Harrington</option> <option value="Annifont">Annifont</option>
<option value="Kunstler">Kunstler</option> <option value="Garamond">Garamond itc</option>
<option value="Liberate">Liberate</option> <option value="Harrington">Harrington</option>
<option value="Lucy">Lucy</option> <option value="Kunstler">Kunstler</option>
<option value="Xpressive">Xpressive</option> <option value="Liberate">Liberate</option>
<option value="Edwardian">Edwardian script</option> <option value="Lucy">Lucy</option>
<option value="Didot">Didot</option> <option value="Xpressive">Xpressive</option>
<option value="Creampuf">Creampuf</option> <option value="Edwardian">Edwardian script</option>
<option value="Bocklin">Bocklin</option> <option value="Didot">Didot</option>
<option value="ScriptMTBold">ScriptMTBold</option> <option value="Creampuf">Creampuf</option>
<option value="Graverplate">Graverplate</option> <option value="Bocklin">Bocklin</option>
</select> <option value="ScriptMTBold">ScriptMTBold</option>
</div> <option value="Graverplate">Graverplate</option>
</select>
</div>
</div>
</div>
<div class="form-group type-textarea ref-PERSOTXT"> <div class="form-group type-textarea ref-PERSOTXT">
<label class="label PERSOTXT">Ou écrivez un texte (140 caractères max.) :</label> <label class="label PERSOTXT">Ou écrivez un texte (140 caractères max.) :</label>
<div class="ctn-input"> <div class="ctn-input">
<div class="form-control-ctn"> <textarea class="configurator-opt form-control" name="select-txt" rows="3" cols="50"></textarea>
<textarea class="configurator-opt form-control" name="select-txt" rows="3" cols="50"></textarea> </div>
</div> </div>
</div>
</div>
</div> </div>

25
www/themes/chocolatdemariage/css/global.css
View File

@ -3866,6 +3866,7 @@ body.content_only { margin: 0; }
.product-main.configurator #main-info .form-group { .product-main.configurator #main-info .form-group {
margin-bottom: 10px; margin-bottom: 10px;
} }
.product-main.configurator #main-info .form-group.type-hidden { margin-bottom: 0; }
.product-main.configurator #quantity_wanted_p .custom-select > span { .product-main.configurator #quantity_wanted_p .custom-select > span {
background-color: transparent; background-color: transparent;
text-align: left; text-align: left;
@ -4190,8 +4191,7 @@ body.content_only { margin: 0; }
@media (max-width: 991px) { @media (max-width: 991px) {
.product-main .price { font-size: 30px; } .product-main .price { font-size: 30px; }
.product-main #image-block { padding-right: 0; } .product-main #simu-box, .product-main #simu-chocos { padding-right: 0; display: none; }
.product-main.configurator #image-block { display: none; }
.product-main .page-heading h1 { padding-right: 0; padding-top: 30px; } .product-main .page-heading h1 { padding-right: 0; padding-top: 30px; }
.product-main .product-actions { margin-top: 40px; } .product-main .product-actions { margin-top: 40px; }
.product-main h1 { margin-bottom: 30px; } .product-main h1 { margin-bottom: 30px; }
@ -7155,7 +7155,15 @@ body[id^='module'][id$='payment'] .order-paiement.ctn {
font-size: 14px; font-size: 14px;
} }
.product-main #image-block.noSimulator #view_full_size {
height: 300px;
}
.product-main.configurator #image-block.noSimulator img {
/* max-width: 400px!important;
position: static;
margin: 0;
height: auto;*/
}
.product-main.configurator .product-main .price { .product-main.configurator .product-main .price {
padding-top: 40px; padding-top: 40px;
} }
@ -7188,11 +7196,14 @@ body[id^='module'][id$='payment'] .order-paiement.ctn {
.product-main.configurator .custom-checkbox:after { color: #4f3528; } .product-main.configurator .custom-checkbox:after { color: #4f3528; }
.product-main.configurator .custom-checkbox input { top: 10px; } .product-main.configurator .custom-checkbox input { top: 10px; }
.product-main.configurator .custom-select > span:after { color: #4f3528; } .product-main.configurator .custom-select > span:after { color: #4f3528; }
.product-main.configurator .custom-select > span { color: #4f3528; background-color: #f9f8f9; } .product-main.configurator .custom-select > span { color: #4f3528; background-color: #f9f8f9; border: 1px solid #efefef; }
.product-main.configurator .custom-select > span.open { z-index: 0; }
.product-main.configurator .custom-radio:before { .product-main.configurator .custom-radio:before {
background-color: #f9f8f9; background-color: #f9f8f9;
border-color: #d8d8d8; border-color: #d8d8d8;
}
.product-main.configurator .form-group > span {
z-index: initial;
} }
.page-product-title-group { .page-product-title-group {
text-transform: uppercase; text-transform: uppercase;
@ -7207,7 +7218,8 @@ body[id^='module'][id$='payment'] .order-paiement.ctn {
text-transform: none; text-transform: none;
} }
.product-main.configurator .form-group .form-control { color: #4f3528; font-family: 'Lato'; background-color: #f9f8f9; } .product-main.configurator .form-group .form-control { color: #4f3528; font-family: 'Lato'; background-color: #f9f8f9; border: 1px solid #efefef; }
/* cas spécifiques */ /* cas spécifiques */
.product-main.configurator .ref-NOM2 .label { .product-main.configurator .ref-NOM2 .label {
@ -7299,7 +7311,6 @@ body[id^='module'][id$='payment'] .order-paiement.ctn {
.product-main.configurator .form-group .form-control-ctn, .product-main.configurator .form-group .form-control-ctn input { border: none!important; } .product-main.configurator .form-group .form-control-ctn, .product-main.configurator .form-group .form-control-ctn input { border: none!important; }
} }
@media (max-width: 991px) { @media (max-width: 991px) {
.product-main.configurator #image-block { background-color: #f5f5f5; }
.product-main.configurator #quantity_wanted_p .form-control-ctn { max-width: none; } .product-main.configurator #quantity_wanted_p .form-control-ctn { max-width: none; }
.product-main.configurator .bg-pink-dark { padding: 30px 20px; } .product-main.configurator .bg-pink-dark { padding: 30px 20px; }

11
www/themes/chocolatdemariage/css/k2000.css
View File

@ -583,7 +583,7 @@ input[disabled].btn { background: #fff; border-color: #fff; color: #363842; curs
.auth .form-group .form-control-ctn { background-color: #fff; } .auth .form-group .form-control-ctn { background-color: #fff; }
.form-group .form-control-ctn > * { .product-main:not(.configurator).form-group .form-control-ctn > * {
position: relative; position: relative;
z-index: 1; z-index: 1;
} }
@ -609,9 +609,12 @@ input[disabled].btn { background: #fff; border-color: #fff; color: #363842; curs
background-position: left top; background-position: left top;
} }
.product-main.configurator .form-group .form-control-ctn, .product-main.configurator .form-group .form-control-ctn,
.product-main.configurator .form-group .form-control-ctn input { background-color: #f9f8f9; } .product-main.configurator .form-group .form-control-ctn input { }
.product-main.configurator .form-group .form-control-ctn:before { background-image: url(../img/frame-btn-top-grey.png); } /* .product-main.configurator .form-group .form-control-ctn:before { background-image: url(../img/frame-btn-top-grey.png); }
.product-main.configurator .form-group .form-control-ctn:after { background-image: url(../img/frame-btn-bottom-grey.png); } .product-main.configurator .form-group .form-control-ctn:after { background-image: url(../img/frame-btn-bottom-grey.png); }*/
.product-main.configurator .form-group .form-control-ctn:after,
.product-main.configurator .form-group .form-control-ctn:before
{ display: none; }
.product-main.configurator .label { margin-bottom: 5px; display: block; } .product-main.configurator .label { margin-bottom: 5px; display: block; }

1
www/themes/chocolatdemariage/lang/fr.php
View File

@ -527,6 +527,7 @@ $_LANG['product-list_216adaf4e98dc62ec3abeab51b9fc57f'] = 'Veuillez choisir au m
$_LANG['product-list_2d0f6b8300be19cf35e89e66f0677f95'] = 'Ajouter au panier'; $_LANG['product-list_2d0f6b8300be19cf35e89e66f0677f95'] = 'Ajouter au panier';
$_LANG['product-list_3480e5e94074ed8737ba6c65a1fd8012'] = 'Acheter'; $_LANG['product-list_3480e5e94074ed8737ba6c65a1fd8012'] = 'Acheter';
$_LANG['product-list_90723749917a82bf3ff8a73247d32ffb'] = 'Vous ne pouvez pas ajouter plus de %d produit(s) dans le comparateur.'; $_LANG['product-list_90723749917a82bf3ff8a73247d32ffb'] = 'Vous ne pouvez pas ajouter plus de %d produit(s) dans le comparateur.';
$_LANG['product-main-config_04325f5c10c9818bc464d660daa2b030'] = 'Minimum de commande : ';
$_LANG['product-main-config_2d0f6b8300be19cf35e89e66f0677f95'] = 'Commander'; $_LANG['product-main-config_2d0f6b8300be19cf35e89e66f0677f95'] = 'Commander';
$_LANG['product-main-standard_2d0f6b8300be19cf35e89e66f0677f95'] = 'Ajouter au panier'; $_LANG['product-main-standard_2d0f6b8300be19cf35e89e66f0677f95'] = 'Ajouter au panier';
$_LANG['product-sort_03590cca8220917788b5a6c25fa39a15'] = 'Le plus cher'; $_LANG['product-sort_03590cca8220917788b5a6c25fa39a15'] = 'Le plus cher';

29
www/themes/chocolatdemariage/product-main-config.tpl
View File

@ -1,3 +1,9 @@
{assign var=noSimulator value=false}
{assign var='arrNoSimulator' value=","|explode:'8,9,10,11,12,13'}
{if in_array($product->id_simulator, $arrNoSimulator)}
{assign var=noSimulator value=true}
{/if}
<main class="product-main configurator"> <main class="product-main configurator">
<section itemscope itemtype="http://schema.org/Product" {if $content_only}class="frame"{else}class="container-big bg-green"{/if}> <section itemscope itemtype="http://schema.org/Product" {if $content_only}class="frame"{else}class="container-big bg-green"{/if}>
<header class="page-heading"> <header class="page-heading">
@ -19,13 +25,26 @@
<div class="content container"> <div class="content container">
<div class="bg"> <div class="bg">
<div class="row"> <div class="row">
<!-- Images--> <!-- Images-->
<div id="image-block" class="md6 xxs6"> <div id="image-block" class="md6 xxs12 {if $noSimulator}noSimulator{/if}">
{assign var='arrNoSimulator' value='8,9,10,11,12,13'}
{assign var='arrNoSimulator2' value=","|explode:$arrNoSimulator}
{if in_array($product->id_simulator, $arrNoSimulator2)} {if $noSimulator}
test {if $have_image}
<span id="view_full_size">
{if $jqZoomEnabled && $have_image && !$content_only}
<a class="jqzoom" title="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}" rel="gal1" href="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'thickbox_default')|escape:'html':'UTF-8'}">
<img itemprop="image" src="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'large_default')|escape:'html':'UTF-8'}" title="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}" alt="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}"/>
</a>
{else}
<img id="bigpic" itemprop="image" src="{$link->getImageLink($product->link_rewrite, $cover.id_image, 'large_default')|escape:'html':'UTF-8'}" title="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}" alt="{if !empty($cover.legend)}{$cover.legend|escape:'html':'UTF-8'}{else}{$product->name|escape:'html':'UTF-8'}{/if}" width="{$largeSize.width}" height="{$largeSize.height}"/>
{/if}
</span>
{else}
<span id="view_full_size">
<img itemprop="image" src="{$img_prod_dir}{$lang_iso}-default-large_default.jpg" id="bigpic" alt="" title="{$product->name|escape:'html':'UTF-8'}" width="{$largeSize.width}" height="{$largeSize.height}"/>
</span>
{/if}
{/if} {/if}
{hook h='displayProductBloc' mod='antadissimulator'} {hook h='displayProductBloc' mod='antadissimulator'}