Решено: Virt 2.6.10+ reel js - вращение товара 360 градусов из серии снимков - [VM2&3] Дизайн, оформление

Ранее публиковал пост о вращении товара на основе swf. Для ознакомления - опыт по внедрению вращения товара 360 градусов в последнюю версию VirtueMart. Итак - в качестве основы выбрал темплейт VISTE. Начало работы - стандартное - введение дополнительного поля в админке VirtueMart в карточку редактирования товара. Поставил задачу сохранят стандартное фото file_ur, если нет серии снимков для этого товара. Через это же поле выводятся бейджи 1 Хит, 2-Новинка и под цифру 3 заточил активацию просмотра в 360 град в карточке товара с лицевой части сайта. Фото товара залил в папку product, которую создал в папке шаблона VISTE. Название папки товара с серией снимков совпадает с артикулом этого товара. Таким образом выдается одно фото file_url если нет снимков для вращения.

Далее - пациент файл default_images в папке productdetails. Прилагаю фрагмент кода - который собственно и подключает скрипт вращения и отвечает за логику работы с фото в карточке товара:

// Product Main Image
if (!empty($this->product->images[0])) {
   $imagesrcmain = YTTemplateUtils::resize($this->product->images[0]->file_url, '350', '360', 'stretch');
?>
   
<div >
            <script type="text/javascript" src="<?php echo $templateDir.'/js/jquery.reel.js' ?>"></script>
         
<div >
            <?php if ($this->product->product_beige==3) {?>
            <div style="float: center;">
   <div style="float: center;">
   <img src="<?php echo $templateDir.'/product/' ?><?php echo $this->product->product_sku;?>/001.jpg" width="610" height="387"
      class="reel"  
   id="activeImage"
      data-images="<?php echo $templateDir.'/product/' ?><?php echo $this->product->product_sku;?>/###.jpg|001..050"
     data-clickfree="true"
     data-draggable="true"
     data-wheelable="true"
      data-frame="1"
      data-speed="0.3"
     data-timeout="3">   </div>

     </div>

            <?php }
            else {?>
      <a id="yt_cloudzoom" href="<?php echo JURI::base().$this->product->images[0]->file_url;?>" class ="cloud-zoom" rel="zoomWidth:'200',zoomHeight:'150',position:'right', adjustX:20, adjustY:-3, tint:'#FFFFFF', softFocus:1, smoothMove:5, tintOpacity:0.8"  >
         <img class="img-large" src="<?php echo $imagesrcmain;?>" title="" alt="" />
      </a>
      <div class="popup-btn">
            <a id="yt_popup" data-rel="prettyPhoto" href="<?php echo JURI::base().$this->product->images[0]->file_url; ?>"><i class="icon-search"></i></a>
        </div>         
            
            <?php } ?>
</div>
         <div class="clear"></div>
</div>
   
   
<?php }
// Product Main Image END ?>

Все. Буду признателен за объективную критику и предложения.
Знакомтесь
P/S. Для ознакомления целый раздел http://www.626240.ru/index.php/poleznye-stati
Конкретный товар - http://www.626240.ru/index.php/poleznye-stati/lazernyj-printer-hp-laserjet-p1102-ce651a-detail

Здравствуйте

Большое спасибо, что пролили немного света на эту тему.

Есть вопросы и пожелания.

Пожелания - вставить рабочие ссылки на пример реализации

Вопросы:
1. Что лучше swf или поворот картинок, если смотреть со всесторонней позиции(индексация, совокупный размер графических файлов, время загрузки страницы,...)? Такое ощущение что поворот кучи картинок скриптом более подходящее решение
2. Почему картинки вы здесь решили сохранять в папку шаблона вместо обычной папки картинок VirtueMart?
3. Код:
Выводит изображение при наведении на которое возникает приближенный участок изображения?
4. Код:
для чего служит?