source: branches/version-2_11-dev/data/Smarty/templates/sphone/products/detail.tpl @ 21147

Revision 21147, 17.9 KB checked in by nanasess, 13 years ago (diff)

#1413 アニメーションのスピード修正

  • Property svn:eol-style set to LF
  • Property svn:keywords set to Id
  • Property svn:mime-type set to text/x-smarty-template; charset=UTF-8
RevLine 
[19661]1<!--{*
2 * This file is part of EC-CUBE
3 *
[20764]4 * Copyright(c) 2000-2011 LOCKON CO.,LTD. All Rights Reserved.
[19661]5 *
6 * http://www.lockon.co.jp/
7 *
8 * This program is free software; you can redistribute it and/or
9 * modify it under the terms of the GNU General Public License
10 * as published by the Free Software Foundation; either version 2
11 * of the License, or (at your option) any later version.
12 *
13 * This program is distributed in the hope that it will be useful,
14 * but WITHOUT ANY WARRANTY; without even the implied warranty of
15 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
16 * GNU General Public License for more details.
17 *
18 * You should have received a copy of the GNU General Public License
19 * along with this program; if not, write to the Free Software
20 * Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA  02111-1307, USA.
21 *}-->
[21132]22<script src="<!--{$smarty.const.ROOT_URLPATH}-->js/products.js"></script>
23<script src="<!--{$TPL_URLPATH}-->js/jquery.facebox/facebox.js"></script>
24<script>//<![CDATA[
[19661]25// 規格2に選択肢を割り当てる。
26function fnSetClassCategories(form, classcat_id2_selected) {
[20366]27    var $form = $(form);
28    var product_id = $form.find('input[name=product_id]').val();
29    var $sele1 = $form.find('select[name=classcategory_id1]');
30    var $sele2 = $form.find('select[name=classcategory_id2]');
31    setClassCategories($form, product_id, $sele1, $sele2, classcat_id2_selected);
[19661]32}
[21050]33$(function(){
[21073]34    $('#detailphotoblock ul li').flickSlide({target:'#detailphotoblock>ul', duration:5000, parentArea:'#detailphotoblock'});
35    $('#whobought_area ul li').flickSlide({target:'#whobought_area>ul', duration:5000, parentArea:'#whobought_area'});
[21146]36
[21073]37    //お勧め商品のリンクを張り直し(フリックスライドによるエレメント生成後)
38    $('#whobought_area li').biggerlink();
[21085]39    //商品画像の拡大
40    $('a.expansion').facebox({
[21094]41        loadingImage : '<!--{$TPL_URLPATH}-->js/jquery.facebox/loading.gif',
42        closeImage   : '<!--{$TPL_URLPATH}-->js/jquery.facebox/closelabel.png'
[21085]43    });
[21050]44});
45//サブエリアの表示/非表示
[21147]46var speed = 500;
[21146]47var stateSub = 0;
[21050]48function fnSubToggle(areaEl, imgEl) {
[21147]49    areaEl.slideToggle(speed);
[21050]50    if (stateSub == 0) {
51        $(imgEl).attr("src", "<!--{$TPL_URLPATH}-->img/common/btn_plus.png");
52        stateSub = 1;
53    } else {
54        $(imgEl).attr("src", "<!--{$TPL_URLPATH}-->img/common/btn_minus.png");
55        stateSub = 0
56    }
57}
58//お勧めエリアの表示/非表示
[21073]59var statewhobought = 0;
[21050]60function fnWhoboughtToggle(areaEl, imgEl) {
[21147]61    areaEl.slideToggle(speed);
[21050]62    if (statewhobought == 0) {
63        $(imgEl).attr("src", "<!--{$TPL_URLPATH}-->img/common/btn_plus.png");
64        statewhobought = 1;
65    } else {
66        $(imgEl).attr("src", "<!--{$TPL_URLPATH}-->img/common/btn_minus.png");
67        statewhobought = 0
68    }
69}
[19661]70//]]>
71</script>
72
73<!--▼CONTENTS-->
[21050]74<section id="product_detail">
[19661]75
[21050]76<!--★タイトル★-->
77<h2 class="title"><!--{$tpl_subtitle|h}--></h2>
78<!--★画像★-->
79<div id="detailphotoblock" class="mainImageInit">
80    <ul>
81        <!--{assign var=key value="main_image"}-->
82        <li id="mainImage0">
83        <!--{if $arrProduct.main_large_image|strlen >= 1}-->
[21085]84            <a rel="external" class="expansion" href="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct.main_large_image|h}-->" target="_blank">
[21050]85                <img src="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct.main_large_image|h}-->" alt="<!--{$arrProduct.name|h}-->" width="200" height="200" /></a>
86        <!--{else}-->
87            <img src="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct.main_large_image|h}-->" alt="<!--{$arrProduct.name|h}-->" width="200" height="200" />
88        <!--{/if}-->
89        </li>
90        <!--★サブ画像★-->
91        <!--{section name=cnt loop=$smarty.const.PRODUCTSUB_MAX}-->
92        <!--{assign var=key value="sub_title`$smarty.section.cnt.index+1`"}-->
93        <!--{if $arrProduct[$key] != ""}-->
94            <!--{assign var=key value="sub_image`$smarty.section.cnt.index+1`"}-->
95            <!--{assign var=lkey value="sub_large_image`$smarty.section.cnt.index+1`"}-->
96            <li id="mainImage<!--{$smarty.section.cnt.index+1}-->">
[21085]97              <a rel="external" class="expansion" href="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct[$lkey]|h}-->" target="_blank">
[21050]98              <img src="<!--{$arrFile[$key].filepath}-->" alt="<!--{$arrProduct.name|h}-->" width="200" height="200" /></a>
99              </li>
100        <!--{/if}-->
101        <!--{/section}-->
102    </ul>
103</div>
[19661]104
[21050]105<section id="detailarea">
[19661]106
[21050]107<!--★詳細メインコメント★-->
108<p class="main_comment"><!--{$arrProduct.main_comment|nl2br_html}--></p>
[19661]109
[21050]110<div id="detailrightblock">
111    <!--▼商品ステータス-->
112    <!--{assign var=ps value=$productStatus[$smarty.get.product_id]}-->
113    <!--{if count($ps) > 0}-->
114        <ul class="status_icon">
115        <!--{foreach from=$ps item=status}-->
116            <li><!--{$arrSTATUS[$status]}--></li>
117        <!--{/foreach}-->
118        </ul>
119    <!--{/if}-->
120    <!--▲商品ステータス-->
[19661]121
[21050]122    <div class="product_detail">
[19661]123
[21050]124        <!--★ダウンロード販売★-->
125        <!--{if $arrProduct.down == 2}-->
126            <div><font color="red">本商品はダウンロード販売となります。<br /> 購入後はMYページの購入履歴からダウンロード可能です。</font></div><br />
127        <!--{/if}-->
128                   
129        <!--★商品名★-->
130        <h3 class="product_name"><!--{$arrProduct.name|h}--></h3>
[19661]131
[21050]132        <p class="product_code"><span class="mini">商品コード:</span>
[19661]133
[21050]134        <span id="product_code_default">
135        <!--{if $arrProduct.product_code_min == $arrProduct.product_code_max}-->
136            <!--{$arrProduct.product_code_min|h}-->
137        <!--{else}-->
138            <!--{$arrProduct.product_code_min|h}-->~<!--{$arrProduct.product_code_max|h}-->
139        <!--{/if}-->
140        </span><span id="product_code_dynamic"></span></p>
[20540]141
[21050]142        <!--★関連カテゴリ★-->
143        <p class="relative_cat"><span class="mini">関連カテゴリ:</span>
144        <!--{section name=r loop=$arrRelativeCat}-->
145            <!--{section name=s loop=$arrRelativeCat[r]}-->
146            <a rel="external" href="<!--{$smarty.const.ROOT_URLPATH}-->products/list.php?category_id=<!--{$arrRelativeCat[r][s].category_id}-->"><!--{$arrRelativeCat[r][s].category_name}--></a>
147            <!--{if !$smarty.section.s.last}--><!--{$smarty.const.SEPA_CATNAVI}--><!--{/if}-->
148            <!--{/section}--><br />
149        <!--{/section}-->
150        </p>
[19661]151
[21050]152        <!--★通常価格★-->
153        <!--{if $arrProduct.price01_max > 0}-->
154        <p class="normal_price">
155        <span class="mini"><!--{$smarty.const.NORMAL_PRICE_TITLE}-->(税込):</span>
156        <span id="price01_default">
157               <!--{if $arrProduct.price01_min == $arrProduct.price01_max}-->
158               <!--{$arrProduct.price01_min|sfCalcIncTax:$arrSiteInfo.tax:$arrSiteInfo.tax_rule|number_format}-->
159                 <!--{else}-->
160                   <!--{$arrProduct.price01_min|sfCalcIncTax:$arrSiteInfo.tax:$arrSiteInfo.tax_rule|number_format}-->~<!--{$arrProduct.price01_max|sfCalcIncTax:$arrSiteInfo.tax:$arrSiteInfo.tax_rule|number_format}-->
161                    <!--{/if}-->
[21085]162        <span id="price01_dynamic"></span>円</span></p>
[21050]163        <!--{/if}-->
[19661]164
[21050]165        <!--★販売価格★-->
166        <p class="sale_price"><span class="mini"><!--{$smarty.const.SALE_PRICE_TITLE}-->(税込):</span>
167        <span class="price"><span id="price02_default">
168                <!--{if $arrProduct.price02_min == $arrProduct.price02_max}-->
169                 <!--{$arrProduct.price02_min|sfCalcIncTax:$arrSiteInfo.tax:$arrSiteInfo.tax_rule|number_format}-->
170                   <!--{else}-->
171                     <!--{$arrProduct.price02_min|sfCalcIncTax:$arrSiteInfo.tax:$arrSiteInfo.tax_rule|number_format}-->~<!--{$arrProduct.price02_max|sfCalcIncTax:$arrSiteInfo.tax:$arrSiteInfo.tax_rule|number_format}-->
172                       <!--{/if}-->
173        </span><span id="price02_dynamic"></span>円</span></p>
[19661]174
175
[21050]176        <!--★ポイント★-->
177        <!--{if $smarty.const.USE_POINT !== false}-->
178            <p class="sale_price"><span class="mini">ポイント:</span><span id="point_default">
179                   <!--{if $arrProduct.price02_min == $arrProduct.price02_max}-->
180                     <!--{$arrProduct.price02_min|sfPrePoint:$arrProduct.point_rate:$smarty.const.POINT_RULE:$arrProduct.product_id|number_format}-->
181                       <!--{else}-->
182                        <!--{if $arrProduct.price02_min|sfPrePoint:$arrProduct.point_rate:$smarty.const.POINT_RULE:$arrProduct.product_id == $arrProduct.price02_max|sfPrePoint:$arrProduct.point_rate:$smarty.const.POINT_RULE:$arrProduct.product_id}-->
183                          <!--{$arrProduct.price02_min|sfPrePoint:$arrProduct.point_rate:$smarty.const.POINT_RULE:$arrProduct.product_id|number_format}-->
184                            <!--{else}-->
185                              <!--{$arrProduct.price02_min|sfPrePoint:$arrProduct.point_rate:$smarty.const.POINT_RULE:$arrProduct.product_id|number_format}-->~<!--{$arrProduct.price02_max|sfPrePoint:$arrProduct.point_rate:$smarty.const.POINT_RULE:$arrProduct.product_id|number_format}-->
[19661]186                                <!--{/if}-->
[21050]187                                  <!--{/if}-->
188            </span><span id="point_dynamic">Pt</span></p>
189        <!--{/if}-->
[19661]190
[21050]191        <!--▼メーカーURL-->
192        <!--{if $arrProduct.comment1|strlen >= 1}-->
193        <p class="sale_price"><span class="mini">メーカーURL:</span><span>
194            <a rel="external" href="<!--{$arrProduct.comment1|h}-->">
195                <!--{$arrProduct.comment1|h}--></a>
196        </span></p>
197        <!--{/if}-->
198        <!--▲メーカーURL-->
199     </div>
200
201    <form name="form1" id="form1" method="post" action="<!--{$smarty.const.ROOT_URLPATH}-->products/detail.php">
202        <input type="hidden" name="<!--{$smarty.const.TRANSACTION_ID_NAME}-->" value="<!--{$transactionid}-->" />
203        <input type="hidden" name="mode" value="cart" />
204        <input type="hidden" name="product_id" value="<!--{$tpl_product_id}-->" />
205        <input type="hidden" name="product_class_id" value="<!--{$tpl_product_class_id}-->" id="product_class_id" />
206        <input type="hidden" name="favorite_product_id" value="" />
207       
208        <!--▼買い物かご-->
209        <!--{if $tpl_stock_find}-->
210   
211            <!--{if $tpl_classcat_find1}-->
212                <div class="cart_area">
213                     <dl>
214                        <!--▼規格1-->
215                        <dt><!--{$tpl_class_name1|h}--></dt>
216                        <dd>
217                        <select name="classcategory_id1"
218                            style="<!--{$arrErr.classcategory_id1|sfGetErrorColor}-->"
219                            onchange="fnSetClassCategories(this.form);"
220                            class="data-role-none">
221                            <!--{html_options options=$arrClassCat1 selected=$arrForm.classcategory_id1.value}-->
222                        </select>
223                        <!--{if $arrErr.classcategory_id1 != ""}-->
224                            <br /><span class="attention">※ <!--{$tpl_class_name1}-->を入力して下さい。</span>
[19661]225                        <!--{/if}-->
[21050]226                        </dd>
227                        <!--▲規格1-->
228            <!--{/if}-->
[19661]229
[21050]230            <!--{if $tpl_classcat_find2}-->
231                        <!--▼規格2-->
232                        <dt><!--{$tpl_class_name2|h}--></dt>
[19661]233                        <dd>
[21050]234                        <select name="classcategory_id2"
235                            style="<!--{$arrErr.classcategory_id2|sfGetErrorColor}-->"
236                            onchange="fnCheckStock(this.form);"
237                            class="data-role-none">
238                        </select>
239                        <!--{if $arrErr.classcategory_id2 != ""}-->
240                            <br /><span class="attention">※ <!--{$tpl_class_name2}-->を入力して下さい。</span>
241                        <!--{/if}-->
[19661]242                        </dd>
[21050]243                        <!--▲規格2-->
244                     </dl>
245                  </div>
246            <!--{/if}-->
247               
248            <div class="cartin_btn">
249                <dl class="">
250                    <dt>数量</dt>
251                    <dd>
[21132]252                        <input type="number" name="quantity" class="quantitybox" value="<!--{$arrForm.quantity.value|default:1|h}-->" max="<!--{$smarty.const.INT_LEN}-->" style="<!--{$arrErr.quantity|sfGetErrorColor}-->" />
[21050]253                        <!--{if $arrErr.quantity != ""}-->
254                            <br /><span class="attention"><!--{$arrErr.quantity}--></span>
255                        <!--{/if}-->
256                    </dd>
257                </dl>
258        <!--{else}-->
259            <div class="cartin_btn">
260        <!--{/if}-->
[19661]261
[21050]262        <!--★カートに入れる★-->
263        <!--{if $tpl_stock_find}-->
264            <a rel="external" href="javascript:void(document.form1.submit());" class="btn cartbtn_default">カートに入れる</a>
265        <!--{else}-->
266            <div class="attention">申し訳ございませんが、只今品切れ中です。</div>
267        <!--{/if}-->
268        </div>
269        <!--▲買い物かご-->
[20540]270
[21050]271        <!--{if $tpl_login}-->
272            <!--{if !$is_favorite}-->
273                <div class="btn_favorite">
274                    <p><a rel="external" href="javascript:void(0);" onclick="fnAddFavoriteSphone(<!--{$arrProduct.product_id|h}-->); return false;" class="btn_sub">お気に入りに追加</a></p>
[19661]275                </div>
[21050]276            <!--{else}-->
277                <div class="btn_favorite">
[21146]278                    <p>お気に入り登録済み</p>
[21050]279                </div>
280            <!--{/if}-->
281        <!--{/if}-->
[20540]282
[21050]283    </form>
284</div>
285</section>
286<!--詳細ここまで-->
[19661]287
[21050]288<!--▼サブエリアここから-->
[21073]289<!--{if $arrProduct.sub_title1 != ""}-->
[21050]290  <div class="title_box_sub clearfix">
291    <h2>商品情報</h2>
292     <!--{assign var=ckey value="sub_comment`$smarty.section.cnt.index+1`"}-->
[21146]293      <span class="b_expand"><img src="<!--{$TPL_URLPATH}-->img/common/btn_minus.png" onclick="fnSubToggle($('#sub_area'), this);" alt=""></span>
[21050]294       </div>
295    <div id="sub_area">
296        <!--{section name=cnt loop=$smarty.const.PRODUCTSUB_MAX}-->
297            <!--{assign var=key value="sub_title`$smarty.section.cnt.index+1`"}-->
[21073]298            <!--{if $arrProduct[$key] != ""}-->
[21050]299            <!--▼サブ情報-->
300           <div class="subarea clearfix">
301            <!--★サブタイトル★-->
302            <h3><!--{$arrProduct[$key]|h}--></h3>
[19661]303
[21050]304            <!--★サブ画像★-->
305            <!--{assign var=key value="sub_image`$smarty.section.cnt.index+1`"}-->
306            <!--{assign var=lkey value="sub_large_image`$smarty.section.cnt.index+1`"}-->
307            <!--{assign var=ckey value="sub_comment`$smarty.section.cnt.index+1`"}-->
308            <!--{if $arrProduct[$key]|strlen >= 1}-->
309                <p class="subphotoimg">
310                <!--{if $arrProduct[$lkey]|strlen >= 1}-->
311                    <a rel="external" href="<!--{$smarty.const.IMAGE_SAVE_URLPATH}--><!--{$arrProduct[$lkey]|h}-->" target="_blank">
312                    <img src="<!--{$arrFile[$key].filepath}-->" alt="<!--{$arrProduct.name|h}-->" width="80" height="80" />
313                    </a>
314                <!--{else}-->
315                    <img src="<!--{$arrFile[$key].filepath}-->" alt="<!--{$arrProduct.name|h}-->" width="80" height="80" />
[19661]316                <!--{/if}-->
[21050]317                </p>
318            <!--{/if}-->
319            <!--★サブテキスト★-->
320            <p class="subtext"><!--★サブテキスト★--><!--{$arrProduct[$ckey]|nl2br_html}--></p>
[19661]321            </div>
[21073]322            <!--{/if}-->
[21050]323        <!--{/section}-->
324    </div>
325<!--{/if}-->
326<!--サブエリアここまで-->
[19661]327
328
[21050]329<!--▼その他おすすめ商品-->
330<!--{if $arrRecommend}-->
331<div class="title_box_sub clearfix">
332  <h2>その他のオススメ商品</h2>
[21132]333     <span class="b_expand"><img src="<!--{$TPL_URLPATH}-->img/common/btn_minus.png" onclick="fnWhoboughtToggle($('#whobought_area'), this);" alt=""></span>
[21050]334      </div>
335 
336  <div id="whobought_area" class="mainImageInit">
[19661]337
[21050]338    <ul>
339    <!--{section name=cnt loop=$arrRecommend}-->
340        <!--{if $arrRecommend[cnt].product_id}-->
[21073]341          <li id="mainImage1<!--{$smarty.section.cnt.index}-->">
[21132]342          <img src="<!--{$smarty.const.ROOT_URLPATH}-->resize_image.php?image=<!--{$arrRecommend[cnt].main_list_image|sfNoImageMainList|h}-->&amp;width=65&amp;height=65" width="80" height="80" alt="<!--{$arrRecommend[cnt].name|h}-->" />
[21050]343             <!--{assign var=price02_min value=`$arrRecommend[cnt].price02_min`}-->
344             <!--{assign var=price02_max value=`$arrRecommend[cnt].price02_max`}-->
345             <h3><a rel="external" href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrRecommend[cnt].product_id|u}-->"><!--{$arrRecommend[cnt].name|h}--></a></h3>
346              <p class="sale_price"><span class="price">
347              <!--{if $price02_min == $price02_max}-->
348                   <!--{$price02_min|sfCalcIncTax:$arrSiteInfo.tax:$arrSiteInfo.tax_rule|number_format}-->
349              <!--{else}-->
350                   <!--{$price02_min|sfCalcIncTax:$arrSiteInfo.tax:$arrSiteInfo.tax_rule|number_format}-->~<!--{$price02_max|sfCalcIncTax:$arrSiteInfo.tax:$arrSiteInfo.tax_rule|number_format}-->
351              <!--{/if}-->
[21073]352               円</span></p>
353          </li>
354        <!--{/if}-->
[21050]355    <!--{/section}-->
356               
357    </ul>
358</div>
359<!--{/if}-->
[19661]360
[21050]361<!--▲その他おすすめ商品-->
[21107]362<div class="btn_area">
[21050]363<p><a href="javascript:void(0);" class="btn_more" data-rel="back">商品一覧に戻る</a></p>
[21107]364</div>
[21050]365</section>
[21107]366<!--▼検索バー -->
367<section id="search_area">
368<form method="get" action="<!--{$smarty.const.ROOT_URLPATH}-->products/list.php">
369<input type="hidden" name="<!--{$smarty.const.TRANSACTION_ID_NAME}-->" value="<!--{$transactionid}-->" />
370<input type="search" name="name" id="search" value="" placeholder="キーワードを入力" class="searchbox" >
371</form>
372</section>
373<!--▲検索バー -->
[19661]374<!--▲CONTENTS-->
Note: See TracBrowser for help on using the repository browser.