增加评论模块

app/code/Joshine/Review/Block/Components/Pager.php

+<?php
+
+namespace Joshine\Review\Block\Components;
+
+use Magento\Framework\Serialize\Serializer\Json;
+use Magento\Framework\View\Element\Template;
+
+class Pager extends \Magento\Theme\Block\Html\Pager
+{
+
+    const DEFAULT_PAGE_SIZE = 3;
+    /**
+     * @var string
+     */
+    protected $_template = 'Joshine_Review::components/pager.phtml';
+
+    /**
+     * @var Json
+     */
+    private $json;
+
+    public function __construct(
+        Template\Context $context,
+        Json $json,
+        array $data = []
+    ) {
+        parent::__construct($context, $data);
+        $this->json = $json;
+    }
+
+    /**
+     * @return string
+     */
+    public function getJsonData()
+    {
+        return $this->json->serialize($this->getData());
+    }
+}

app/code/Joshine/Review/Block/Images.php

+<?php
+
+namespace Joshine\Review\Block;
+
+use Joshine\Review\Model\ResourceModel\Images\Collection;
+use Joshine\Review\Helper\ImageHelper;
+use Magento\Framework\View\Element\Template;
+use Joshine\Review\Model\ResourceModel\Images\CollectionFactory;
+
+/**
+ * Class Images
+ * @package Amasty\AdvancedReview\Block
+ */
+class Images extends \Magento\Framework\View\Element\Template
+{
+    //评论缩略图宽度
+    const REVIEW_COVER_WIDTH = 200;
+
+    /**
+     * @var string
+     */
+    protected $_template = 'Joshine_Review::images.phtml';
+
+    private $reviewId;
+
+    private $productId;
+
+    /**
+     * @var int
+     */
+
+    /**
+     * @var \Magento\Framework\Json\EncoderInterface
+     */
+    private $jsonEncoder;
+    /**
+     * @var CollectionFactory
+     */
+    private $collectionFactory;
+
+    /**
+     * @var ImageHelper
+     */
+    private $imageHelper;
+
+    public function __construct(
+        Template\Context $context,
+        CollectionFactory $collectionFactory,
+        \Magento\Framework\Json\EncoderInterface $jsonEncoder,
+        ImageHelper $imageHelper,
+        array $data = []
+    ) {
+        parent::__construct($context, $data);
+        $this->jsonEncoder       = $jsonEncoder;
+        $this->collectionFactory = $collectionFactory;
+        $this->imageHelper       = $imageHelper;
+    }
+
+    /**
+     * @return int
+     */
+    public function getReviewId(): int
+    {
+        return $this->reviewId;
+    }
+
+    /**
+     * @param $reviewId
+     *
+     * @return $this
+     */
+    public function setReviewId($reviewId): Images
+    {
+        $this->reviewId = $reviewId;
+        return $this;
+    }
+
+    public function setProductId($productId): Images
+    {
+        $this->productId = $productId;
+        return $this;
+    }
+
+    public function getProductId()
+    {
+        return $this->productId;
+    }
+
+    public function getCollection() {
+        /** @var Collection $collection */
+        $collection = $this->collectionFactory->create()
+            ->addFieldToSelect('*')
+            ->addFieldToFilter('review_id', $this->getReviewId());
+
+        return $collection;
+    }
+
+
+    public function getFullImagePath($item): string
+    {
+        return $this->imageHelper->getFullPath($item->getPath());
+    }
+
+    /**
+     * @param $item
+     * @return string
+     * @throws \Magento\Framework\Exception\NoSuchEntityException
+     */
+    public function getResizedImagePath($item): string
+    {
+        return $this->imageHelper->resize($item->getPath(), self::REVIEW_COVER_WIDTH * 2);
+    }
+
+    /**
+     * @param $item
+     * @return string
+     * @throws \Magento\Framework\Exception\NoSuchEntityException
+     */
+    public function getResizedImagePathByLimit($item, $width): string
+    {
+        return $this->imageHelper->resize($item->getPath(), $width);
+    }
+
+}

app/code/Joshine/Review/Block/JsInit.php

+<?php
+namespace Joshine\Review\Block;
+
+class JsInit extends  \Magento\Framework\View\Element\Template {
+    protected $_template = 'Joshine_Review::review-js.phtml';
+
+}
\ No newline at end of file

app/code/Joshine/Review/Block/Review/Product/View/ListView.php

+<?php
+namespace Joshine\Review\Block\Review\Product\View;
+
+use Magento\Catalog\Api\ProductRepositoryInterface;
+use Magento\Framework\DataObjectFactory;
+use Magento\Review\Model\ResourceModel\Review\Collection as ReviewCollection;
+
+use Magento\Review\Model\Review\SummaryFactory;
+
+use Joshine\Review\Block\Components\Pager;
+
+class ListView extends \Magento\Review\Block\Product\View\ListView
+{
+    const VOTED_CLASS_NAME = 'active';
+
+    /**
+     * @var \Magento\Review\Model\Review\SummaryFactory
+     */
+    private $summaryModFactory;
+
+    private $dataObjectFactory;
+
+    /**
+     * @var ReviewCollection
+     */
+    private $reviewsCollection;
+
+    private $reviewsColFactory;
+
+    private $voteRepository;
+
+    private $vote;
+
+    private $formKey;
+
+    /**
+     * @var \Magento\Framework\HTTP\PhpEnvironment\RemoteAddress
+     */
+    private $remoteAddress;
+
+    public function __construct(
+        DataObjectFactory $dataObjectFactory,
+        SummaryFactory $summaryModFactory,
+        \Magento\Framework\Data\Form\FormKey $formKey,
+        \Magento\Framework\HTTP\PhpEnvironment\RemoteAddress $remoteAddress,
+        \Joshine\Review\Model\Repository\VoteRepository $voteRepository,
+        \Magento\Review\Model\ResourceModel\Review\CollectionFactory  $reviewsColFactory,
+        \Magento\Catalog\Block\Product\Context $context, \Magento\Framework\Url\EncoderInterface $urlEncoder, \Magento\Framework\Json\EncoderInterface $jsonEncoder, \Magento\Framework\Stdlib\StringUtils $string, \Magento\Catalog\Helper\Product $productHelper, \Magento\Catalog\Model\ProductTypes\ConfigInterface $productTypeConfig, \Magento\Framework\Locale\FormatInterface $localeFormat, \Magento\Customer\Model\Session $customerSession, ProductRepositoryInterface $productRepository, \Magento\Framework\Pricing\PriceCurrencyInterface $priceCurrency, \Magento\Review\Model\ResourceModel\Review\CollectionFactory $collectionFactory, array $data = [])
+    {
+        $this->summaryModFactory = $summaryModFactory;
+        $this->dataObjectFactory = $dataObjectFactory;
+        $this->reviewsColFactory = $reviewsColFactory;
+        $this->voteRepository    = $voteRepository;
+        $this->formKey           = $formKey;
+        $this->remoteAddress     = $remoteAddress;
+        parent::__construct($context, $urlEncoder, $jsonEncoder, $string, $productHelper, $productTypeConfig, $localeFormat, $customerSession, $productRepository, $priceCurrency, $collectionFactory, $data);
+    }
+    
+    protected function _prepareLayout()
+    {
+        parent::_prepareLayout();
+        if ($this->getReviewsCollection()) {
+            $pager = $this->getLayout()->createBlock(
+                Pager::class
+            )->setCollection(
+                $this->getLimitedReviewsCollection()
+            )->setData($this->getData())
+            ->setProductId($this->getProductId());
+            $this->setChild('pager', $pager);
+            $this->getLimitedReviewsCollection()->load();
+        }
+        return $this;
+    }
+
+    public function setSummary($product, $displayedCollection)
+    {
+        $storeId = $this->_storeManager->getStore()->getId();
+
+        $summaryData = $this->summaryModFactory->create()
+            ->setStoreId($storeId)
+            ->load($product->getId());
+
+        $summary = $this->dataObjectFactory->create();
+        $summary->setData($summaryData->getData());
+        $product->setRatingSummary($summary);
+    }
+
+    public function getRatingSummary()
+    {
+        $result = null;
+        $summary = $this->getProduct()->getRatingSummary();
+        if ($summary) {
+            $result = $summary->getRatingSummary();
+        }
+        return $result;
+    }
+
+    function getRatingSummaryValue(): float
+    {
+        $value = $this->getRatingSummary();
+        $value = $value / 100 * 5;
+        return round($value, 1);
+    }
+
+    public function getDetailedSummary(): array
+    {
+        $result = [
+            '3' => 0,
+            '2' => 0,
+            '1' => 0
+        ];
+        $reviews = $this->reviewsColFactory->create()->addStoreFilter(
+            $this->_storeManager->getStore()->getId()
+        )->addStatusFilter(
+            \Magento\Review\Model\Review::STATUS_APPROVED
+        )->addEntityFilter(
+            'product',
+            $this->getProduct()->getId()
+        );
+        foreach ($reviews as $item) {
+            if($item->getSizeFits() != 0 ){
+                $key = $item->getSizeFits();
+                $result[$key] = $result[$key] + 1;
+            }
+        }
+
+        return $result;
+    }
+
+    /**
+     * Get collection of reviews
+     *
+     * @return ReviewCollection
+     */
+    public function getReviewsCollection()
+    {
+        if (null === $this->reviewsCollection) {
+            $this->reviewsCollection = $this->reviewsColFactory->create()->addStoreFilter(
+                $this->_storeManager->getStore()->getId()
+            )->addStatusFilter(
+                \Magento\Review\Model\Review::STATUS_APPROVED
+            )->addEntityFilter(
+                'product',
+                $this->getProduct()->getId()
+            )->setDateOrder();
+        }
+        return $this->reviewsCollection;
+    }
+
+    public function getReviewsCount() : int
+    {
+        return $this->getReviewsCollection()->getSize();
+    }
+
+    public function getLimitedReviewsCollection(): ReviewCollection
+    {
+        $page = $this->getRequest()->getParam('p') ?? 1;
+        return $this->getReviewsCollection()->clear()
+            ->setPageSize(Pager::DEFAULT_PAGE_SIZE)
+            ->setCurPage((int)$page)
+            ->load()->addRateVotes();
+    }
+
+    public function getPagerHtml()
+    {
+        return $this->getChildHtml('pager');
+    }
+
+    private function getVote($reviewId)
+    {
+        return $this->voteRepository->getVotesCount($reviewId);
+    }
+
+    public function getPlusReview($reviewId)
+    {
+        $vote = $this->getVote($reviewId);
+
+        return $vote['plus'];
+    }
+
+    /**
+     * @return string
+     * @throws \Magento\Framework\Exception\LocalizedException
+     */
+    public function getFormKey(): string
+    {
+        return $this->formKey->getFormKey();
+    }
+
+    /**
+     * @return string
+     */
+    public function getPlusVotedClass($reviewId)
+    {
+        $result = '';
+        if ($this->isPlusVoted($reviewId)) {
+            $result = self::VOTED_CLASS_NAME;
+        }
+        return $result;
+    }
+
+    private function getVotedByIp($reviewId)
+    {
+        return $this->voteRepository->getVotesCount(
+            $reviewId,
+            $this->remoteAddress->getRemoteAddress()
+        );
+    }
+    public function isPlusVoted($reviewId)
+    {
+        $voted = $this->getVotedByIp($reviewId);
+
+        return $voted['plus'] > 0;
+    }
+
+}

app/code/Joshine/Review/Block/Review/ToolBar.php

+<?php
+namespace Joshine\Review\Block\Review;
+
+
+use Amasty\AdvancedReview\Model\Toolbar\Applier;
+use Amasty\AdvancedReview\Model\Toolbar\UrlBuilder;
+use Magento\Framework\View\Element\Template;
+
+class ToolBar extends Template {
+
+    protected $request;
+
+    protected $_template = 'Joshine_Review::toolbar.phtml';
+
+    public function __construct(
+        Template\Context $context,
+        \Magento\Framework\App\Request\Http $request,
+        array $data = []
+    ) {
+        parent::__construct($context, $data);
+        $this->request = $request;
+    }
+
+
+}

app/code/Joshine/Review/Contract/ImagesInterface.php

+<?php
+
+
+namespace Joshine\Review\Contract;
+
+interface ImagesInterface
+{
+    const IMAGE_ID = 'image_id';
+
+    const REVIEW_ID = 'review_id';
+
+    const PATH = 'path';
+
+    /**
+     * Returns image id field
+     *
+     * @return int|null
+     */
+    public function getImageId();
+
+    /**
+     * @param int $imageId
+     *
+     * @return $this
+     */
+    public function setImageId($imageId);
+
+    /**
+     * Returns review id field
+     *
+     * @return int|null
+     */
+    public function getReviewId();
+
+    /**
+     * @param int $reviewId
+     *
+     * @return $this
+     */
+    public function setReviewId($reviewId);
+
+    /**
+     * Returns image path
+     *
+     * @return string|null
+     */
+    public function getPath();
+
+    /**
+     * @param string $path
+     *
+     * @return $this
+     */
+    public function setPath($path);
+}

app/code/Joshine/Review/Controller/Ajax/Helpful.php

+<?php
+namespace Joshine\Review\Controller\Ajax;
+
+use Magento\Framework\App\Action\Context;
+use Magento\Framework\Exception\LocalizedException;
+use Magento\Framework\Controller\Result\JsonFactory;
+
+class Helpful extends \Magento\Framework\App\Action\Action
+{
+    /**
+     * @var \Magento\Framework\Data\Form\FormKey\Validator
+     */
+    private $formKeyValidator;
+
+    /**
+     * @var \Psr\Log\LoggerInterface
+     */
+    private $logger;
+
+    /**
+     * @var \Magento\Framework\Json\EncoderInterface
+     */
+    private $jsonEncoder;
+
+    /**
+     * @var \Magento\Framework\HTTP\PhpEnvironment\RemoteAddress
+     */
+    private $remoteAddress;
+
+
+    private $voteRepository;
+
+
+    private $voteFactory;
+
+    /**
+     * @var JsonFactory
+     */
+    private $resultJsonFactory;
+
+    public function __construct(
+        Context $context,
+        \Magento\Framework\Data\Form\FormKey\Validator $formKeyValidator,
+        \Psr\Log\LoggerInterface $logger,
+        \Magento\Framework\Json\EncoderInterface $jsonEncoder,
+        \Magento\Framework\HTTP\PhpEnvironment\RemoteAddress $remoteAddress,
+        \Joshine\Review\Model\VoteFactory $voteFactory,
+        \Joshine\Review\Model\Repository\VoteRepository $voteRepository,
+        JsonFactory $resultJsonFactory
+    ) {
+        parent::__construct($context);
+        $this->formKeyValidator = $formKeyValidator;
+        $this->logger = $logger;
+        $this->jsonEncoder = $jsonEncoder;
+        $this->remoteAddress = $remoteAddress;
+        $this->voteRepository = $voteRepository;
+        $this->voteFactory = $voteFactory;
+        $this->resultJsonFactory = $resultJsonFactory;
+    }
+
+    /**
+     * @return \Magento\Framework\App\ResponseInterface|\Magento\Framework\Controller\Result\Json|\Magento\Framework\Controller\ResultInterface
+     */
+    public function execute()
+    {
+        $message = [
+            'error' => __('Sorry. There is a problem with your Vote Request.')
+        ];
+
+        if ($this->getRequest()->isAjax()) {
+            try {
+                if (!$this->formKeyValidator->validate($this->getRequest())) {
+                    throw new LocalizedException(
+                        __('Form key is not valid. Please try to reload the page.')
+                    );
+                }
+
+
+
+                $type = $this->getRequest()->getParam('type');
+                $reviewId = (int)$this->getRequest()->getParam('review');
+                if ($reviewId > 0 && in_array($type, ['plus', 'minus', 'update'])) {
+                    $ip = $this->remoteAddress->getRemoteAddress();
+
+                    if ($type != 'update') {
+                        $type = ($type == 'plus') ? '1' : '0';
+
+                        $model = $this->voteRepository->getByIdAndIp($reviewId, $ip);
+                        $modelType = $model->getType();
+                        if ($model->getVoteId()) {
+                            $this->voteRepository->delete($model);
+                        }
+
+                        if ($modelType === null || $modelType != $type) {
+                            $model = $this->voteFactory->create();
+                            $model->setIp($ip);
+                            $model->setReviewId($reviewId);
+                            $model->setType($type);
+                            $this->voteRepository->save($model);
+                        }
+                    }
+
+                    $votesForReview = $this->voteRepository->getVotesCount($reviewId);
+                    $voted = $this->voteRepository->getVotesCount($reviewId, $ip);
+                    $message = [
+                        'success' => __('Success.'),
+                        'data' => $votesForReview,
+                        'voted' => $voted
+                    ];
+                }
+            } catch (LocalizedException $e) {
+                $message = ['error' => $e->getMessage()];
+            } catch (\Exception $e) {
+                $this->logger->error($e->getMessage());
+            }
+        }
+
+        $resultPage = $this->resultJsonFactory->create();
+        $resultPage->setHttpResponseCode(200);
+        $resultPage->setData($message);
+        return $resultPage;
+    }
+}

app/code/Joshine/Review/Controller/Ajax/ReviewInfo.php

+<?php
+namespace Joshine\Review\Controller\Ajax;
+
+use Amasty\AdvancedReview\Model\ResourceModel\Images as ImagesModel;
+use Joshine\Review\Helper\BlockHelper;
+use Joshine\Review\Helper\ImageHelper;
+use Magento\Catalog\Model\ProductFactory;
+use Magento\Framework\App\Action\Context;
+use Magento\Framework\Exception\LocalizedException;
+use Magento\Framework\Controller\Result\JsonFactory;
+use Magento\Review\Model\ResourceModel\Review\Collection;
+use Magento\Review\Model\Review;
+
+class ReviewInfo extends \Magento\Framework\App\Action\Action {
+
+
+    /**
+     * @var \Magento\Framework\Data\Form\FormKey\Validator
+     */
+    private $formKeyValidator;
+
+    /**
+     * @var \Psr\Log\LoggerInterface
+     */
+    private $logger;
+
+    /**
+     * @var \Magento\Framework\Json\EncoderInterface
+     */
+    private $jsonEncoder;
+
+    /**
+     * @var JsonFactory
+     */
+    private $resultJsonFactory;
+
+
+    private $reviewFactory;
+
+    /**
+     * @var ProductFactory
+     */
+    private $productFactory;
+
+    /**
+     * @var \Magento\Review\Model\ResourceModel\Review\CollectionFactory
+     */
+    private $reviewsColFactory;
+    /**
+     * @var \Magento\Framework\HTTP\PhpEnvironment\RemoteAddress
+     */
+    private $remoteAddress;
+
+    public function __construct(
+        Context $context,
+        \Psr\Log\LoggerInterface $logger,
+        \Magento\Framework\Json\EncoderInterface $jsonEncoder,
+        JsonFactory $resultJsonFactory,
+        \Magento\Review\Model\ReviewFactory $reviewFactory,
+        ProductFactory $productFactory,
+        \Magento\Review\Model\ResourceModel\Review\CollectionFactory  $reviewsColFactory,
+        \Magento\Framework\Data\Form\FormKey\Validator $formKeyValidator,
+        \Magento\Framework\HTTP\PhpEnvironment\RemoteAddress $remoteAddress
+    ) {
+        parent::__construct($context);
+        $this->logger = $logger;
+        $this->jsonEncoder = $jsonEncoder;
+        $this->resultJsonFactory  = $resultJsonFactory;
+        $this->reviewFactory      = $reviewFactory;
+        $this->productFactory     = $productFactory;
+        $this->reviewsColFactory  = $reviewsColFactory;
+        $this->formKeyValidator   = $formKeyValidator;
+        $this->remoteAddress      = $remoteAddress;
+    }
+
+    /**
+     * @return \Magento\Framework\App\ResponseInterface|\Magento\Framework\Controller\Result\Json|\Magento\Framework\Controller\ResultInterface
+     */
+    public function execute()
+    {
+        $message = [
+            'error' => __('Sorry. There is a problem with your Request.')
+        ];
+
+
+        if ($this->getRequest()->isAjax()) {
+            try {
+                if (!$this->formKeyValidator->validate($this->getRequest())) {
+                    throw new LocalizedException(
+                        __('Form key is not valid. Please try to reload the page.')
+                    );
+                }
+                $reviewId    = $this->getRequest()->getParam('review_id');
+                $productId   = $this->getRequest()->getParam('product_id');
+                if (empty($reviewId) || empty($productId) ) {
+                    throw new LocalizedException(
+                        __('request is valid.')
+                    );
+                }
+                $reviewInfo = $this->getReviewInfo($reviewId, $productId);
+                $reviews    = $this->getAllReview($productId);
+                $message = [
+                    'success' => __('Success.'),
+                    'data'    => $reviews,
+                    'review'  => $reviewInfo,
+                    'total'   => count($reviews),
+                    'offset'  => $this->getOffset($reviews, $reviewInfo)
+                ];
+
+            } catch (LocalizedException $e) {
+                $message = ['error' => $e->getMessage()];
+            } catch (\Exception $e) {
+                $this->logger->error($e->getMessage());
+            }
+        }
+
+        $resultPage = $this->resultJsonFactory->create();
+        $resultPage->setHttpResponseCode(200);
+        $resultPage->setData($message);
+        return $resultPage;
+    }
+
+    /**
+     * @param $productId
+     * @return \Magento\Review\Model\ResourceModel\Review\Collection
+     */
+    public function getCollection($productId) : Collection
+    {
+        return $this->reviewsColFactory->create()->addStatusFilter(
+            \Magento\Review\Model\Review::STATUS_APPROVED
+        )->addEntityFilter(
+            'product',
+            $productId
+        );
+    }
+
+    private function getStoreId()
+    {
+        $storeManager = $this->_objectManager->get('\Magento\Store\Model\StoreManagerInterface');
+        return $storeManager->getStore()->getId();
+    }
+
+    public function getRatingPercent($reviewId)
+    {
+        $ratingCollection = $this->_objectManager->create('Magento\Review\Model\ResourceModel\Rating\Option\Vote\Collection')
+            ->addFieldToFilter('review_id',$reviewId);
+        $data = $ratingCollection->getData();
+        return $data[0]['percent'] ?? 100;
+    }
+
+    public function getAllReview($productId)
+    {
+        $objectManager = \Magento\Framework\App\ObjectManager::getInstance();
+        $db = $objectManager->get( 'Magento\Framework\App\ResourceConnection' )->getConnection();
+        $tblReview  = $db->getTableName( 'review' );
+        $tblImages  = $db->getTableName( 'joshine_review_images' );
+        $tblDetail  = $db->getTableName( 'review_detail' );
+        $select = $db->select()
+            ->distinct()
+            ->from( [ 'review' => $tblReview ], ['*'] )
+            ->join( [ 'images' => $tblImages ], 'review.review_id = images.review_id' )
+            ->join( [ 'review_detail' => $tblDetail ], 'review.review_id = review_detail.review_id' )
+            ->where( 'review.entity_pk_value = ?', $productId )
+            ->where('review.status_id = ? ', Review::STATUS_APPROVED)
+            ->group('review.review_id')->limit(50)->order('review.created_at DESC',);
+
+        $data = $db->fetchAll($select);
+        $res = [];
+        foreach ($data as $item) {
+            $_item['review_id']    = $item['review_id'];
+            $_item['size_fits']    = $item['size_fits'];
+            $_item['nickname']     = $item['nickname'];
+            $_item['title']        = $item['title'];
+            $_item['detail']       = $item['detail'];
+            $_item['created_at']   = $item['created_at'];
+            $_item['images']       = $this->getImages($item['review_id'], $productId);
+            $_item['rating']       = $this->getRatingPercent($item['review_id']);
+            $_item['helpful']         = $this->getVoteCount($item['review_id'])['plus'];
+            $_item['helpful_clicked'] = $this->getVoteCount($item['review_id'], $this->remoteAddress->getRemoteAddress())['plus'] > 0;
+            $res[] = $_item;
+        }
+       return $res;
+    }
+
+    public function getReviewInfo($reviewId, $productId)
+    {
+        $model = $this->reviewFactory->create()->load($reviewId);
+        $_item = [];
+        $_item['review_id']    = $reviewId;
+        $_item['size_fits']    = $model->getSize_fits();
+        $_item['nickname']     = $model->getNickname();
+        $_item['title']        = $model->getTitle();
+        $_item['detail']       = $model->getDetail();
+        $_item['created_at']   = $model->getCreatedAt();
+        $_item['images']       = $this->getImages($reviewId, $productId);
+        $_item['rating']       = $this->getRatingPercent($reviewId);
+        $_item['helpful']         = $this->getVoteCount($reviewId)['plus'];
+        $_item['helpful_clicked'] = $this->getVoteCount($reviewId, $this->remoteAddress->getRemoteAddress())['plus'] > 0;
+        return $_item;
+    }
+
+    public function getVoteCount($reviewId, $ip=null)
+    {
+        $repo = $this->_objectManager->get('Joshine\Review\Model\Repository\VoteRepository');
+        return $repo->getVotesCount($reviewId);
+    }
+
+    public function getImages($reviewId, $productId)
+    {
+        $collect = $this->_objectManager->create('Joshine\Review\Model\ResourceModel\Images\Collection')
+            ->addFieldToSelect('*')
+            ->addFieldToFilter('review_id', $reviewId);
+
+        /** @var  $helper BlockHelper */
+        $helper = $this->_objectManager->get('Joshine\Review\Helper\BlockHelper');
+        $block  = $helper->getReviewImagesBlock($reviewId, $productId);
+
+        $res = [];
+        foreach ($collect->getItems() as $item) {
+            $res['full'][]   = ['url'=>$block->getFullImagePath($item), 'image_id'=>$item->getId()] ;
+            $res['thumb'][]  = ['url'=>$block->getResizedImagePathByLimit($item, 100), 'image_id'=>$item->getId()] ;   ;
+        }
+        return $res;
+    }
+
+    public function getOffset($allArr, $arr)
+    {
+        $offset = 0;
+        foreach ($allArr as $key => $value) {
+            $offset++;
+            if ($value['review_id'] == $arr['review_id']) {
+                break;
+            }
+        }
+        return $offset;
+    }
+}
\ No newline at end of file

app/code/Joshine/Review/Helper/BlockHelper.php

+<?php
+namespace Joshine\Review\Helper;
+
+use Joshine\Review\Block\Images;
+use Joshine\Review\Block\Review\ToolBar;
+
+class BlockHelper implements \Magento\Framework\Data\CollectionDataSourceInterface
+{
+
+    /**
+     * @var \Magento\Framework\View\Element\BlockFactory
+     */
+    private $blockFactory;
+
+
+    /**
+     * @var \Magento\Framework\Stdlib\StringUtils
+     */
+    private $stringUtils;
+
+    /**
+     * @var \Magento\Customer\Model\SessionFactory
+     */
+    private $sessionFactory;
+
+    /**
+     * @var \Magento\Framework\Escaper
+     */
+    private $escaper;
+
+    /**
+     * @var \Magento\Framework\UrlInterface
+     */
+    private $urlBuilder;
+
+    /**
+     * @var \Magento\Framework\App\RequestInterface
+     */
+    private $request;
+
+    public function __construct(
+        \Magento\Framework\View\Element\BlockFactory $blockFactory,
+        \Magento\Framework\Stdlib\StringUtils $stringUtils,
+        \Magento\Customer\Model\SessionFactory $sessionFactory,
+        \Magento\Framework\Escaper $escaper,
+        \Magento\Framework\UrlInterface $urlBuilder,
+        \Magento\Framework\App\RequestInterface $request
+    ) {
+        $this->blockFactory = $blockFactory;
+        $this->stringUtils = $stringUtils;
+        $this->sessionFactory = $sessionFactory;
+        $this->escaper = $escaper;
+        $this->urlBuilder = $urlBuilder;
+        $this->request = $request;
+    }
+    public function getReviewImagesHtml($reviewId, $productId)
+    {
+        $html = '';
+        $block = $this->blockFactory
+            ->createBlock(Images::class)
+            ->setProductId($productId)
+            ->setReviewId($reviewId);
+        if ($block) {
+            $html = $block->toHtml();
+        }
+        return $html;
+    }
+
+    public function getToolBarHtML()
+    {
+        return $this->blockFactory
+            ->createBlock(ToolBar::class)
+            ->toHtml();
+    }
+
+
+    public function getReviewImagesBlock($reviewId, $productId) : Images
+    {
+        return $this->blockFactory
+            ->createBlock(Images::class)
+            ->setProductId($productId)
+            ->setReviewId($reviewId);
+    }
+
+}

app/code/Joshine/Review/Helper/ImageHelper.php

+<?php
+
+namespace Joshine\Review\Helper;
+
+use Magento\Framework\App\Filesystem\DirectoryList;
+use Magento\Framework\UrlInterface;
+
+class ImageHelper
+{
+    const IMAGE_PATH = '/joshine/review/';
+    const IMAGE_TMP_PATH = '/joshine/review/tmp/';
+
+    /**
+     * @var \Magento\Store\Model\StoreManagerInterface
+     */
+    private $storeManager;
+
+    /**
+     * @var \Magento\Framework\Filesystem
+     */
+    private $filesystem;
+
+    /**
+     * @var \Magento\Framework\Image\AdapterFactory
+     */
+    private $imageFactory;
+
+    /**
+     * @var \Magento\Framework\Filesystem\Io\File
+     */
+    private $fileManager;
+
+    public function __construct(
+        \Magento\Store\Model\StoreManagerInterface $storeManager,
+        \Magento\Framework\Filesystem $filesystem,
+        \Magento\Framework\Image\AdapterFactory $imageFactory,
+        \Magento\Framework\Filesystem\Io\File $fileManager
+    ) {
+        $this->storeManager = $storeManager;
+        $this->filesystem = $filesystem;
+        $this->imageFactory = $imageFactory;
+        $this->fileManager = $fileManager;
+    }
+
+    /**
+     * @param $name
+     * @return string
+     * @throws \Magento\Framework\Exception\NoSuchEntityException
+     */
+    public function getFullPath($name)
+    {
+        $path = $this->storeManager->getStore()->getBaseUrl(UrlInterface::URL_TYPE_MEDIA);
+        $path = trim($path, '/');
+        $name = trim($name, '/');
+        $path .= '/joshine/review/';
+
+        return $path . $name;
+    }
+
+    /**
+     * @param $image
+     * @param int $width
+     * @param int $height
+     * @return string
+     * @throws \Exception
+     * @throws \Magento\Framework\Exception\NoSuchEntityException
+     */
+    public function resize($image, $width = null, $height = null)
+    {
+        $mediaUrl = $this->storeManager->getStore()->getBaseUrl(
+            UrlInterface::URL_TYPE_MEDIA
+        );
+        $mediaUrl = trim($mediaUrl, '/');
+        $resizedURL = $mediaUrl . self::IMAGE_PATH . 'resized/' . $width . '/' . $image;
+
+        $absolutePath = $this->filesystem->getDirectoryRead(DirectoryList::MEDIA)
+                ->getAbsolutePath(self::IMAGE_PATH)
+            . $image;
+
+        $imageResized = $this->filesystem->getDirectoryRead(DirectoryList::MEDIA)
+                ->getAbsolutePath(self::IMAGE_PATH . 'resized/' . $width . '/')
+            . $image;
+
+        if ($this->fileManager->fileExists($imageResized)) {
+            return $resizedURL;
+        }
+
+        if (!$this->fileManager->fileExists($absolutePath)) {
+            return '';
+        }
+
+        //create image factory...
+        $imageResize = $this->imageFactory->create();
+        $imageResize->open($absolutePath);
+        $imageResize->constrainOnly(true);
+        $imageResize->keepTransparency(true);
+        $imageResize->keepFrame(false);
+        $imageResize->backgroundColor([255, 255, 255]);
+        $imageResize->keepAspectRatio(true);
+        $imageResize->resize($width, $height);
+
+        $destination = $imageResized;
+        $imageResize->save($destination);
+        return $resizedURL;
+    }
+}

app/code/Joshine/Review/Model/ImageUploader.php

+<?php
+
+namespace Joshine\Review\Model;
+
+use Joshine\Review\Helper\ImageHelper;
+use Magento\Framework\App\Filesystem\DirectoryList;
+use Magento\MediaStorage\Model\File\Uploader;
+
+class ImageUploader
+{
+    /**
+     * @var \Magento\Framework\Filesystem
+     */
+    private $filesystem;
+
+    /**
+     * @var \Magento\MediaStorage\Model\File\UploaderFactory
+     */
+    private $fileUploaderFactory;
+
+    /**
+     * @var \Magento\Framework\Image\AdapterFactory
+     */
+    private $adapterFactory;
+
+    /**
+     * @var \Magento\Framework\Filesystem\Io\File
+     */
+    private $ioFile;
+
+    public function __construct(
+        \Magento\Framework\Filesystem $filesystem,
+        \Magento\MediaStorage\Model\File\UploaderFactory $fileUploaderFactory,
+        \Magento\Framework\Image\AdapterFactory $adapterFactory,
+        \Magento\Framework\Filesystem\Io\File $ioFile
+    ) {
+        $this->filesystem = $filesystem;
+        $this->fileUploaderFactory = $fileUploaderFactory;
+        $this->adapterFactory = $adapterFactory;
+        $this->ioFile = $ioFile;
+    }
+
+    public function execute(array $file, $isTmp = false)
+    {
+        $path = $this->filesystem->getDirectoryRead(
+            DirectoryList::MEDIA
+        )->getAbsolutePath(
+            $isTmp ? ImageHelper::IMAGE_TMP_PATH : ImageHelper::IMAGE_PATH
+        );
+        $this->ioFile->checkAndCreateFolder($path);
+
+        /** @var $uploader Uploader */
+        $uploader = $this->fileUploaderFactory->create(
+            ['fileId' => $file]
+        );
+        $imageAdapter = $this->adapterFactory->create();
+        $uploader->addValidateCallback('catalog_product_image', $imageAdapter, 'validateUploadFile');
+        $uploader->setAllowedExtensions(['jpg', 'jpeg', 'gif', 'png']);
+        $uploader->setAllowRenameFiles(true);
+        $uploader->setFilesDispersion(true);
+        $result = $uploader->save($path);
+        $this->trim($result);
+
+        return $result;
+    }
+
+    public function copy(string $imagePath)
+    {
+        $path = $this->filesystem->getDirectoryRead(
+            DirectoryList::MEDIA
+        )->getAbsolutePath(
+            ImageHelper::IMAGE_TMP_PATH
+        );
+
+        $from = $path . $imagePath;
+        if ($this->ioFile->fileExists($from)) {
+            $realPath = $this->filesystem->getDirectoryRead(
+                DirectoryList::MEDIA
+            )->getAbsolutePath(
+                ImageHelper::IMAGE_PATH
+            );
+
+            $counter = 0;
+            while ($this->ioFile->fileExists($realPath . $imagePath)) {
+                $imagePathArray = explode('.', $imagePath);
+                $imagePathArray[0] .= $counter++;
+                $imagePath = implode('.', $imagePathArray);
+            }
+
+            $this->ioFile->checkAndCreateFolder($this->ioFile->dirname($realPath . $imagePath));
+            if ($this->ioFile->mv($from, $realPath . $imagePath)) {
+                return $imagePath;
+            }
+        }
+
+        return false;
+    }
+
+    /**
+     * Fix for magento 2114 - setup upgrade
+     * @param $result
+     */
+    private function trim($result)
+    {
+        if (isset($result['path']) && $result['file']) {
+            $path = rtrim($result['path'], '/') . $result['file'];
+            $this->ioFile->chmod($path, 0777);
+        }
+    }
+}

app/code/Joshine/Review/Model/Images.php

+<?php
+
+
+namespace Joshine\Review\Model;
+
+use Joshine\Review\Contract\ImagesInterface;
+use Magento\Framework\Model\AbstractModel;
+
+/**
+ * Class Images
+ * @package Amasty\AdvancedReview\Model
+ */
+class Images extends AbstractModel implements ImagesInterface
+{
+    public function _construct()
+    {
+        $this->_init(\Joshine\Review\Model\ResourceModel\Images::class);
+    }
+
+    /**
+     * Returns image id field
+     *
+     * @return int|null
+     */
+    public function getImageId()
+    {
+        return $this->getData(self::IMAGE_ID);
+    }
+
+    /**
+     * @param int $imageId
+     *
+     * @return $this
+     */
+    public function setImageId($imageId)
+    {
+        $this->setData(self::IMAGE_ID, $imageId);
+        return $this;
+    }
+
+    /**
+     * Returns review id field
+     *
+     * @return int|null
+     */
+    public function getReviewId()
+    {
+        return $this->getData(self::REVIEW_ID);
+    }
+
+    /**
+     * @param int $reviewId
+     *
+     * @return $this
+     */
+    public function setReviewId($reviewId)
+    {
+        $this->setData(self::REVIEW_ID, $reviewId);
+        return $this;
+    }
+
+    /**
+     * Returns image path
+     *
+     * @return string|null
+     */
+    public function getPath()
+    {
+        return $this->getData(self::PATH);
+    }
+
+    /**
+     * @param string $path
+     *
+     * @return $this
+     */
+    public function setPath($path)
+    {
+        $this->setData(self::PATH, $path);
+        return $this;
+    }
+}

app/code/Joshine/Review/Model/Repository/VoteRepository.php

+<?php
+
+namespace Joshine\Review\Model\Repository;
+
+use Magento\Framework\Exception\NoSuchEntityException;
+use Magento\Framework\Exception\CouldNotDeleteException;
+use Magento\Framework\Exception\CouldNotSaveException;
+use Joshine\Review\Model\ResourceModel;
+use Joshine\Review\Model\VoteFactory;
+
+class VoteRepository
+{
+    /**
+     * @var array
+     */
+    private $vote = [];
+    
+    /**
+     * @var ResourceModel\Vote
+     */
+    private $voteResource;
+
+    /**
+     * @var VoteFactory
+     */
+    private $voteFactory;
+
+    /**
+     * @var ResourceModel\Vote\CollectionFactory
+     */
+    private $collectionFactory;
+
+    public function __construct(
+        \Joshine\Review\Model\ResourceModel\Vote $voteResource,
+        \Joshine\Review\Model\VoteFactory $voteFactory,
+        \Joshine\Review\Model\ResourceModel\Vote\CollectionFactory $collectionFactory
+    ) {
+        $this->voteResource = $voteResource;
+        $this->voteFactory = $voteFactory;
+        $this->collectionFactory = $collectionFactory;
+    }
+
+    /**
+     * {@inheritdoc}
+     */
+    public function save($vote)
+    {
+        if ($vote->getVoteId()) {
+            $vote = $this->get($vote->getVoteId())->addData($vote->getData());
+        }
+
+        try {
+            $this->voteResource->save($vote);
+            $this->vote[$vote->getVoteId()] = $vote;
+        } catch (\Exception $e) {
+            if ($vote->getVoteId()) {
+                throw new CouldNotSaveException(
+                    __('Unable to save vote with ID %1. Error: %2', [$vote->getVoteId(), $e->getMessage()])
+                );
+            }
+            throw new CouldNotSaveException(__('Unable to save new vote. Error: %1', $e->getMessage()));
+        }
+        
+        return $vote;
+    }
+
+    /**
+     * {@inheritdoc}
+     */
+    public function get($voteId)
+    {
+        if (!isset($this->vote[$voteId])) {
+            $vote = $this->voteFactory->create();
+            $this->voteResource->load($vote, $voteId);
+            if (!$vote->getVoteId()) {
+                throw new NoSuchEntityException(__('Vote with specified ID "%1" not found.', $voteId));
+            }
+            $this->vote[$voteId] = $vote;
+        }
+
+        return $this->vote[$voteId];
+    }
+
+    public function getByIdAndIp($reviewId, $ip)
+    {
+        $vote = $this->voteFactory->create();
+
+        $collection = $this->collectionFactory->create()
+                ->addFieldToFilter('review_id', $reviewId)
+                ->addFieldToFilter('ip', $ip);
+        $collection->getSelect()->limit(1);
+
+        if ($collection->getSize() > 0) {
+            $vote = $collection->getFirstItem();
+        }
+
+        return $vote;
+    }
+
+    /**
+     * {@inheritdoc}
+     */
+    public function delete($vote)
+    {
+        try {
+            $this->voteResource->delete($vote);
+            unset($this->vote[$vote->getId()]);
+        } catch (\Exception $e) {
+            if ($vote->getVoteId()) {
+                throw new CouldNotDeleteException(
+                    __('Unable to remove vote with ID %1. Error: %2', [$vote->getVoteId(), $e->getMessage()])
+                );
+            }
+            throw new CouldNotDeleteException(__('Unable to remove vote. Error: %1', $e->getMessage()));
+        }
+        return true;
+    }
+
+    /**
+     * {@inheritdoc}
+     */
+    public function deleteById($voteId)
+    {
+        $model = $this->get($voteId);
+        $this->delete($model);
+        return true;
+    }
+
+    /**
+     * @param $reviewId
+     * @param null $ip
+     * @return array
+     */
+    public function getVotesCount($reviewId, $ip = null)
+    {
+        $result = [
+            'plus' => 0,
+            'minus' => 0
+        ];
+
+        $collection = $this->collectionFactory->create()
+            ->addFieldToFilter('review_id', $reviewId);
+        if ($ip) {
+            $collection->addFieldToFilter('ip', $ip);
+        }
+
+        foreach ($collection as $vote) {
+            if ($vote->getType() == '1') {
+                $result['plus'] = ++$result['plus'];
+            } else {
+                $result['minus'] = ++$result['minus'];
+            }
+        }
+
+        return $result;
+    }
+
+    public function getVoteModel()
+    {
+        return $this->voteFactory->create();
+    }
+
+    /**
+     * @return array
+     */
+    public function getVoteIpKeys()
+    {
+        return $this->collectionFactory->create()->getVoteIpKeys();
+    }
+}

app/code/Joshine/Review/Model/ResourceModel/Images.php

+<?php
+
+namespace Joshine\Review\Model\ResourceModel;
+
+
+class Images extends \Magento\Framework\Model\ResourceModel\Db\AbstractDb
+{
+    const TABLE_NAME = 'joshine_review_images';
+
+    /**
+     * Model Initialization
+     *
+     * @return void
+     */
+    protected function _construct()
+    {
+        $this->_init(self::TABLE_NAME, 'image_id');
+    }
+}

app/code/Joshine/Review/Model/ResourceModel/Images/Collection.php

+<?php
+
+namespace Joshine\Review\Model\ResourceModel\Images;
+
+use Magento\Framework\Model\ResourceModel\Db\Collection\AbstractCollection;
+
+/**
+ * Class Collection
+ * @package Amasty\AdvancedReview\Model\ResourceModel\Images
+ */
+class Collection extends AbstractCollection
+{
+    public function _construct()
+    {
+        $this->_init(
+            \Joshine\Review\Model\Images::class,
+            \Joshine\Review\Model\ResourceModel\Images::class
+        );
+    }
+
+    /**
+     * @return array
+     */
+    public function getImageKeys(): array
+    {
+        $this->getSelect()->columns('CONCAT(review_id,path) as image_key');
+
+        return $this->getColumnValues('image_key');
+    }
+}

app/code/Joshine/Review/Model/ResourceModel/Vote.php

+<?php
+
+namespace Joshine\Review\Model\ResourceModel;
+
+
+class Vote extends \Magento\Framework\Model\ResourceModel\Db\AbstractDb
+{
+    const TABLE_NAME = 'joshine_review_vote';
+
+    protected function _construct()
+    {
+        $this->_init(self::TABLE_NAME, 'vote_id');
+    }
+}

app/code/Joshine/Review/Model/ResourceModel/Vote/Collection.php

+<?php
+
+namespace Joshine\Review\Model\ResourceModel\Vote;
+
+use Magento\Framework\Model\ResourceModel\Db\Collection\AbstractCollection;
+
+
+class Collection extends AbstractCollection
+{
+    public function _construct()
+    {
+        $this->_init(
+            \Joshine\Review\Model\Vote::class,
+            \Joshine\Review\Model\ResourceModel\Vote::class
+        );
+    }
+
+    /**
+     * @return array
+     */
+    public function getVoteIpKeys(): array
+    {
+        $this->getSelect()->columns('CONCAT(review_id,ip) as vote_key');
+
+        return $this->getColumnValues('vote_key');
+    }
+}

app/code/Joshine/Review/Model/Vote.php

+<?php
+
+namespace Joshine\Review\Model;
+
+use Magento\Framework\Model\AbstractModel;
+
+class Vote extends AbstractModel
+{
+    const VOTE_ID = 'vote_id';
+    const REVIEW_ID = 'review_id';
+    const TYPE = 'type';
+    const IP = 'ip';
+
+    public function _construct()
+    {
+        $this->_init(\Joshine\Review\Model\ResourceModel\Vote::class);
+    }
+
+    /**
+     * Returns vote id field
+     *
+     * @return int|null
+     */
+    public function getVoteId()
+    {
+        return $this->getData(self::VOTE_ID);
+    }
+
+    /**
+     * @param int $voteId
+     *
+     * @return $this
+     */
+    public function setVoteId($voteId)
+    {
+        $this->setData(self::VOTE_ID, $voteId);
+        return $this;
+    }
+
+    /**
+     * Returns review id field
+     *
+     * @return int|null
+     */
+    public function getReviewId()
+    {
+        return $this->getData(self::REVIEW_ID);
+    }
+
+    /**
+     * @param int $reviewId
+     *
+     * @return $this
+     */
+    public function setReviewId($reviewId)
+    {
+        $this->setData(self::REVIEW_ID, $reviewId);
+        return $this;
+    }
+
+    /**
+     * Returns vote type
+     *
+     * @return int|null
+     */
+    public function getType()
+    {
+        return $this->getData(self::TYPE);
+    }
+
+    /**
+     * @param int $type
+     *
+     * @return $this
+     */
+    public function setType($type)
+    {
+        $this->setData(self::TYPE, $type);
+        return $this;
+    }
+
+    /**
+     * Returns vote type
+     *
+     * @return string|null
+     */
+    public function getIp()
+    {
+        return $this->getData(self::IP);
+    }
+
+    /**
+     * @param string $ip
+     *
+     * @return $this
+     */
+    public function setIp($ip)
+    {
+        $this->setData(self::IP, $ip);
+        return $this;
+    }
+}

app/code/Joshine/Review/Plugin/Review/Block/Form.php

+<?php
+
+namespace Joshine\Review\Plugin\Review\Block;
+
+use Magento\Review\Block\Form as MagentoForm;
+
+class Form
+{
+
+    /**
+     * @var \Joshine\Review\Helper\BlockHelper
+     */
+    private $blockHelper;
+
+    public function __construct(
+        \Joshine\Review\Helper\BlockHelper $blockHelper
+    ) {
+        $this->blockHelper = $blockHelper;
+    }
+
+    public function afterToHtml(
+        MagentoForm $subject,
+        $result
+    ) {
+        $search = '</fieldset>';
+        $replace = $this->getImageUploadHtml() . $search;
+        $result = substr_replace($result, $replace, strrpos($result, $search), strlen($search));
+
+        $searchForm = 'data-role="product-review-form"';
+        return str_replace($searchForm, $searchForm . ' enctype="multipart/form-data" ', $result);
+    }
+
+    protected function getImageUploadHtml(): string
+    {
+        return sprintf(
+            '<div class="field review-field-image %s">
+                <label class="label">%s</label><div class="control">
+                <input class="joshine-input" name="review_images[]" accept="image/*" multiple %s type="file" title="%s">
+                </div></div>',
+            '',
+            __('Add your photo'),
+            '',
+            __('Add your photo')
+        );
+    }
+}
\ No newline at end of file

app/code/Joshine/Review/Plugin/Review/Model/Review.php

+<?php
+namespace Joshine\Review\Plugin\Review\Model;
+
+use Joshine\Review\Model\ImageUploader;
+use Magento\Framework\Exception\CouldNotSaveException;
+use Magento\Framework\Exception\NoSuchEntityException;
+use Magento\Review\Block\Form as MagentoForm;
+use Magento\Framework\Exception\LocalizedException;
+use Magento\Review\Model\Review as MagentoReview;
+
+class Review {
+
+
+    /**
+     * @var \Magento\Framework\App\RequestInterface
+     */
+    private $request;
+
+    /**
+     * @var ImageUploader
+     */
+    private $imageUploader;
+
+    /**
+     * @var \Joshine\Review\Model\ImagesFactory
+     */
+    private $imagesFactory;
+
+    private $imagesResource;
+
+    private $messageManager;
+
+    public function __construct(
+        \Magento\Framework\App\RequestInterface $request,
+        ImageUploader $imageUploader,
+        \Joshine\Review\Model\ImagesFactory $imagesFactory,
+        \Magento\Framework\Message\ManagerInterface $messageManager,
+        \Joshine\Review\Model\ResourceModel\Images $imagesResource
+    )
+    {
+        $this->messageManager = $messageManager;
+        $this->imagesFactory = $imagesFactory;
+        $this->imageUploader = $imageUploader;
+        $this->request = $request;
+        $this->imagesResource = $imagesResource;
+    }
+
+    public function afterAggregate(
+        MagentoReview $subject,
+                      $result
+    ) {
+
+        $this->uploadReviewImages($subject);
+
+        return $result;
+    }
+
+    public function uploadReviewImages(MagentoReview $subject) {
+        $files = $this->request->getFiles('review_images');
+        $reviewId = $subject->getReviewId();
+
+        //todo:: 用helper方法做是否允许上传图片的判断
+        if ($files && $reviewId) {
+            foreach ($files as $fileId => $file) {
+                if (UPLOAD_ERR_OK == $file['error']) {
+                    $this->uploadImage($file, $reviewId);
+                }
+            }
+        }
+    }
+
+    public function uploadImage($file, $reviewId) {
+
+        try {
+            $result = $this->imageUploader->execute($file);
+            $this->saveImage($result, $reviewId);
+        } catch (\Exception $e) {
+            $this->messageManager->addErrorMessage(__('An error occurred while uploading the image.'));
+            throw new LocalizedException(__($e->getMessage()));
+        }
+
+
+        return $this;
+    }
+
+    /**
+     * @throws NoSuchEntityException
+     * @throws CouldNotSaveException
+     */
+    private function saveImage($result, $reviewId)
+    {
+        /** @var \Joshine\Review\Model\Images $model */
+        $model = $this->imagesFactory->create();
+        $model->setReviewId($reviewId);
+        $model->setPath($result['file']);
+
+        if ($model->getImageId()) {
+            $model = $this->getFullImage($model->getImageId())->addData($model->getData());
+        }
+
+        try {
+            $this->imagesResource->save($model);
+        } catch (\Exception $e) {
+            if ($model->getImageId()) {
+                throw new CouldNotSaveException(
+                    __('Unable to save image with ID %1. Error: %2', [$model->getImageId(), $e->getMessage()])
+                );
+            }
+            throw new CouldNotSaveException(__('Unable to save new image. Error: %1', $e->getMessage()));
+        }
+    }
+
+    private function getFullImage($imageId) {
+        $image = $this->imagesFactory->create();
+        $this->imagesResource->load($image, $imageId);
+        if (!$image->getImageId()) {
+            throw new NoSuchEntityException(__('Rule with specified ID "%1" not found.', $imageId));
+        }
+        return $image;
+    }
+
+}

app/code/Joshine/Review/Setup/InstallSchema.php

+<?php
+/**
+ * @author Amasty Team
+ * @copyright Copyright (c) 2021 Amasty (https://www.amasty.com)
+ * @package Amasty_AdvancedReview
+ */
+
+
+namespace Joshine\Review\Setup;
+
+use Magento\Framework\Setup\InstallSchemaInterface;
+use Magento\Framework\Setup\ModuleContextInterface;
+use Magento\Framework\Setup\SchemaSetupInterface;
+use Magento\Framework\DB\Ddl\Table;
+
+/**
+ * Class InstallSchema
+ * @package Amasty\AdvancedReview\Setup
+ */
+class InstallSchema implements InstallSchemaInterface
+{
+    /**
+     * @param SchemaSetupInterface $setup
+     * @param ModuleContextInterface $context
+     * @throws \Zend_Db_Exception
+     */
+    public function install(SchemaSetupInterface $setup, ModuleContextInterface $context)
+    {
+        $setup->startSetup();
+
+        /** 建新表 */
+        $this->createModuleTables($setup);
+        $this->addReviewColumns($setup);
+
+        $setup->endSetup();
+    }
+
+    /**
+     * @param SchemaSetupInterface $installer
+     * @throws \Zend_Db_Exception
+     */
+    private function createModuleTables(SchemaSetupInterface $installer)
+    {
+        $table = $installer->getConnection()
+            ->newTable($installer->getTable('joshine_review_images'))
+            ->addColumn(
+                'image_id',
+                Table::TYPE_BIGINT,
+                null,
+                ['identity' => true, 'unsigned' => true, 'nullable' => false, 'primary' => true],
+                'Review Id'
+            )
+            ->addColumn(
+                'review_id',
+                Table::TYPE_BIGINT,
+                null,
+                ['default' => 0, 'nullable' => false],
+                'Review table id'
+            )
+            ->addColumn(
+                'path',
+                Table::TYPE_TEXT,
+                '2M',
+                [],
+                'Image path'
+            )
+            ->setComment('用户评价图片地址保存表');
+        $installer->getConnection()->createTable($table);
+
+        $tableVote = $installer->getConnection()
+            ->newTable($installer->getTable('joshine_review_vote'))
+            ->addColumn(
+                'vote_id',
+                Table::TYPE_INTEGER,
+                null,
+                ['identity' => true, 'unsigned' => true, 'nullable' => false, 'primary' => true],
+                'Vote Id'
+            )
+            ->addColumn(
+                'review_id',
+                Table::TYPE_INTEGER,
+                null,
+                ['default' => 0, 'nullable' => false],
+                'Review table id'
+            )
+            ->addColumn(
+                'type',
+                Table::TYPE_SMALLINT,
+                null,
+                [],
+                'type'
+            )
+            ->addColumn(
+                'ip',
+                Table::TYPE_TEXT,
+                256,
+                [],
+                'ip'
+            )
+            ->setComment('用户评价点赞记录表');
+        $installer->getConnection()->createTable($tableVote);
+    }
+
+    /**
+     * review表添加字段
+     * @param SchemaSetupInterface $installer
+     */
+    private function addReviewColumns(SchemaSetupInterface $installer)
+    {
+        /**
+         * 添加verified_buyer字段，用于后续搜索
+         */
+        $installer->getConnection()->addColumn(
+            $installer->getTable('review'),
+            'verified_buyer',
+            [
+                'type' => \Magento\Framework\DB\Ddl\Table::TYPE_SMALLINT,
+                'nullable' => true,
+                'default' => 0,
+                'comment' => 'Verified Buyer'
+            ]
+        );
+    }
+}

app/code/Joshine/Review/etc/di.xml

+<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
+
+    <type name="Magento\Review\Model\Review">
+        <plugin name="Joshine_Review::save-images" type="Joshine\Review\Plugin\Review\Model\Review" />
+    </type>
+
+</config>

app/code/Joshine/Review/etc/frontend/di.xml

+<?xml version="1.0"?>
+<!--
+/**
+ * @author Amasty Team
+ * @copyright Copyright (c) 2021 Amasty (https://www.amasty.com)
+ * @package Amasty_AdvancedReview
+ */
+-->
+
+<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+        xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
+    <type name="Magento\Review\Block\Form">
+        <plugin name="Joshine_Review::add-file-upload-control" type="Joshine\Review\Plugin\Review\Block\Form" />
+    </type>
+</config>

app/code/Joshine/Review/etc/frontend/routes.xml

+<?xml version="1.0"?>
+
+<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+        xsi:noNamespaceSchemaLocation="urn:magento:framework:App/etc/routes.xsd">
+    <router id="standard">
+        <route id="joshine_review" frontName="joshine_review">
+            <module name="Joshine_Review" />
+        </route>
+    </router>
+</config>

app/code/Joshine/Review/etc/module.xml

+<?xml version="1.0"?>
+<!--
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+-->
+<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
+    <module name="Joshine_Review" setup_version="0.0.4">
+        <sequence>
+            <module name="Magento_Review"/>
+        </sequence>
+    </module>
+</config>

app/code/Joshine/Review/view/frontend/layout/amasty_advancedreview_ajax_comment_update.xml

+<?xml version="1.0"?>
+<!--
+/**
+ * @author Amasty Team
+ * @copyright Copyright (c) 2021 Amasty (https://www.amasty.com)
+ * @package Amasty_AdvancedReview
+ */
+-->
+
+<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
+    <body>
+        <block name="joshine.review.comments" class="Joshine\Review\Block\Comment\Container">
+            <block name="joshine.review.comments.messages" as="messages" class="Joshine\Review\Block\Comment\CommentsList">
+                <block name="joshine.review.comments.message" as="message" class="Joshine\Review\Block\Comment\Comment" />
+            </block>
+            <block name="joshine.review.comments.form" as="form" class="Amasty\AdvancedReview\Block\Comment\Form" />
+        </block>
+    </body>
+</page>

app/code/Joshine/Review/view/frontend/layout/catalog_product_view.xml

+<?xml version="1.0"?>
+<!--
+/**
+ * @author Amasty Team
+ * @copyright Copyright (c) 2021 Amasty (https://www.amasty.com)
+ * @package Amasty_AdvancedReview
+ */
+-->
+
+<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
+    <body>
+        <referenceContainer name="content">
+            <block class="Magento\Framework\View\Element\Template"
+                   template="Joshine_Review::review-js.phtml"
+                   name="joshine.review.toolbar.js"
+                   after="-"/>
+        </referenceContainer>
+    </body>
+</page>

app/code/Joshine/Review/view/frontend/layout/default.xml

+<?xml version="1.0"?>
+<!--
+/**
+ * @author Amasty Team
+ * @copyright Copyright (c) 2021 Amasty (https://www.amasty.com)
+ * @package Amasty_AdvancedReview
+ */
+-->
+
+<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
+    <head>
+        <css src="Joshine_Review::css/_review.css"/>
+    </head>
+</page>
\ No newline at end of file

app/code/Joshine/Review/view/frontend/layout/review_product_listajax.xml

+<?xml version="1.0"?>
+
+<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
+    <body>
+        <referenceBlock name="product.info.product_additional_data" remove="true" />
+        <referenceBlock class="Magento\Theme\Block\Html\Pager" name="product_review_list.toolbar" remove="true"/>
+        <referenceContainer name="root">
+            <block class="Joshine\Review\Block\Review\Product\View\ListView"
+                   name="Joshine.product.info.product_additional_data"
+                   template="Joshine_Review::product/view/list.phtml"
+                   before="product_review_list.toolbar">
+                <arguments>
+                    <argument name="joshine-review-helper" xsi:type="object">Joshine\Review\Helper\BlockHelper</argument>
+                </arguments>
+            </block>
+            <block name="joshine.review.js" class="Joshine\Review\Block\JsInit" ifconfig="joshine_review/comments/enabled" />
+        </referenceContainer>
+    </body>
+</page>

app/code/Joshine/Review/view/frontend/requirejs-config.js

+var config = {
+    paths: {
+        "joshineReviewHandler": "Joshine_Review/js/review/handler",
+    },
+};
\ No newline at end of file

app/code/Joshine/Review/view/frontend/templates/components/pager.phtml

+<?php
+/**
+ * @var $block \Joshine\Review\Block\Components\Pager
+ */
+?>
+<?php if ($block->getCollection()->getSize() && $block->getLastPageNum() > 1): ?>
+    <div class="joshine-reviews-page">
+        <div class="joshine-pagination joshine-pagination-left" joshine-review-js="reviews-pages-<?= $block->escapeHtml($block->getProductId()); ?>" >
+            <?php if (!$block->isFirstPage()): ?>
+                <span class="joshine-pagination-btn joshine-pagination-prev"
+                    data-href="<?= $block->escapeUrl($block->getPreviousPageUrl()); ?>"
+                >
+                    <
+                </span>
+            <?php endif; ?>
+
+            <?php if ($block->canShowFirst()): ?>
+                <span class="joshine-pagination-btn joshine-pagination-hover"
+                      data-href="<?= $block->escapeUrl($block->getFirstPageUrl()); ?>"
+                >
+                    1
+                </span>
+            <?php endif; ?>
+
+            <?php if ($block->canShowPreviousJump()): ?>
+                <span class="joshine-pagination-btn joshine-pagination-hover"
+                      data-href="<?= $block->escapeUrl($block->getPreviousJumpUrl()); ?>"
+                >
+                    ...
+                </span>
+            <?php endif; ?>
+
+            <?php foreach ($block->getFramePages() as $page): ?>
+                <?php if ($block->isPageCurrent($page)): ?>
+                    <span class="joshine-pagination-btn joshine-pagination-hover active">
+                        <?= $block->escapeHtml($page); ?>
+                    </span>
+                <?php else: ?>
+                    <span class="joshine-pagination-btn joshine-pagination-hover"
+                        data-href="<?= $block->escapeUrl($block->getPageUrl($page)); ?>"
+                    >
+                        <?= $block->escapeHtml($page) ?>
+                    </span>
+                <?php endif; ?>
+            <?php endforeach; ?>
+
+            <?php if ($block->canShowNextJump()): ?>
+                <span class="joshine-pagination-btn joshine-pagination-hover"
+                    data-href="<?= $block->escapeUrl($block->getNextJumpUrl()) ?>"
+                >
+                    ...
+                </span>
+            <?php endif; ?>
+
+            <?php if ($block->canShowLast()): ?>
+                <span class="joshine-pagination-btn joshine-pagination-hover"
+                    data-href="<?= $block->escapeUrl($block->getLastPageUrl()) ?>"
+                >
+                    <?= $block->escapeHtml($block->getLastPageNum()) ?>
+                </span>
+            <?php endif; ?>
+
+            <?php if (!$block->isLastPage()): ?>
+                <span class="joshine-pagination-btn joshine-pagination-next joshine-pagination-hover"
+                      data-href="<?= $block->escapeUrl($block->getNextPageUrl()) ?>">
+                    >
+                </span>
+            <?php endif; ?>
+        </div>
+    </div>
+<?php endif ?>
\ No newline at end of file

app/code/Joshine/Review/view/frontend/templates/images.phtml

+<?php
+/** @var \Joshine\Review\Block\Images $block */
+$collection = $block->getCollection();
+?>
+<?php if ($collection->getSize()): ?>
+    <?php foreach ($collection as $item): ?>
+        <div class="joshine-review-pic-item joshine-col-xs-4" data-img-src="<?= $block->getFullImagePath($item) ?>"
+             data-image-id="<?= $item->getId(); ?>"
+             data-product-id="<?= $block->getProductId() ?>"
+             data-reviews-id="<?= $block->getReviewId() ?>">
+            <img class="review-image rounded" src="<?= $block->getResizedImagePath($item) ?>"/>
+        </div>
+    <?php endforeach; ?>
+<?php endif;?>
+
+
+

app/code/Joshine/Review/view/frontend/templates/modal.phtml

+
+
+

app/code/Joshine/Review/view/frontend/templates/product/view/list.phtml

+<?php
+
+//rewrite file Magento_Review::product/view/list.phtml
+// phpcs:ignoreFile
+
+/** @var Joshine\Review\Block\Review\Product\View\ListView $block */
+$displayedCollection = $block->getLimitedReviewsCollection();
+$_items = $displayedCollection->getItems();
+
+$format = $block->getDateFormat() ?: \IntlDateFormatter::MEDIUM;
+
+$block->setSummary($block->getProduct(), $displayedCollection);
+
+/** @var Joshine\Review\Helper\BlockHelper $helper */
+$helper = $block->getData('joshine-review-helper');
+$rating = $block->getRatingSummary();
+
+$count = $block->getReviewsCount();
+
+$t =  [ 1 => __('Small') , 2 => __('True to Size') ,3 => __('Large')];
+
+
+
+$imagesBlock = $helper->getReviewImagesBlock(15, $block->getProductId());
+
+?>
+
+<style>
+
+    .joshine-review-container-mobile .joshine-review .ave-rate {
+        display: flex;
+        align-items: center;
+    }
+
+    .joshine-review-container-mobile .joshine-review .fit-item {
+        display: flex;
+        align-items: center;
+    }
+
+    .joshine-review-container-mobile .joshine-review .fit-name {
+        width: 30%;
+    }
+    .joshine-review-container-mobile .joshine-review .joshine-process {
+        width: 60%;
+    }
+    .joshine-review-container-mobile .joshine-review .joshine-review-averate {
+        padding: .5em;
+    }
+
+    .joshine-review-container-mobile .joshine-review .add-new-box {
+        margin: .5em 0 .5em 0;
+    }
+
+</style>
+<div class="block review-list joshine-clearfix" id="customer-reviews">
+
+<div class="joshine-review-container joshine-clearfix joshine-hidden-md joshine-hidden-sm joshine-hidden-xs">
+    <h1 class="joshine-review-title">
+        Customer Reviews
+    </h1>
+    <div class="joshine-review">
+        <div class="joshine-review-averate joshine-bg-silver">
+            <div class="joshine-review-item joshine-review-rating-box">
+                <div class="name">
+                    Average Rating
+                </div>
+                <div class="ave-rate">
+                    <div class="joshine-rating-container">
+                        <div class="joshine-rating-starts" style="width: <?= $rating ?>%;"></div>
+                    </div>
+                    <div class="ave-rate-total"><?= $block->getRatingSummaryValue() ?></div>
+                </div>
+            </div>
+            <div class="joshine-review-item">
+                <div class="name">
+                    Did the item fit  well?
+                </div>
+
+                <?php foreach ($block->getDetailedSummary() as $key => $detail) : ?>
+                    <div class="fit-item">
+                        <div class="fit-name joshine-font-mini">
+                            <?= $t[$key] ?>
+                        </div>
+                        <div class="joshine-process">
+                            <div class="joshine-process-active" style="width: <?= /* @noEscape */ $count ? round($detail / $count * 100) : 0 ?>%;"></div>
+                        </div>
+                    </div>
+                <?php endforeach; ?>
+            </div>
+            <div class="joshine-review-item add-new-box">
+                <a href="#review-form" title="Write a review"  class="add-new-button joshine-btn joshine-btn-dark joshine-review-add-btn">
+                    Write a review
+                </a>
+            </div>
+        </div>
+
+        <!-- 筛选框 -->
+        <?= $helper->getToolBarHtML() ?>
+
+        <div class="joshine-review-list joshine-clearfix">
+            <?php if (count($_items) > 0): ?>
+                <?php foreach ($_items as $review) : ?>
+                <div class="joshine-review-list-item ">
+                    <div class="joshine-review-list-item-left">
+                        <div class="joshine-review-nickname joshine-font-c-deepin joshine-font-size-default joshine-font-w-bolder ">
+                            <?= $block->escapeHtml($review->getNickname()) ?>
+                        </div>
+                        <input type="hidden" id="modal-current-review-id">
+                        <div class="joshine-review-date joshine-font-c-darkgray joshine-font-mini-plus">
+                            <?= $block->escapeHtml($block->formatDate($review->getCreatedAt(), $format)) ?>
+                        </div>
+                    </div>
+                    <div class="joshine-review-list-item-mid joshine-pull-left">
+                        <div class="joshine-review-detail">
+                            <div class="joshine-review-des-title joshine-font-size-default joshine-font-c-deepin">
+                                <?= $block->escapeHtml($review->getTitle()) ?>
+                            </div>
+                            <div class="joshine-rating-container joshine-rating-small">
+                                <?php if (count($review->getRatingVotes())) : ?>
+                                    <?php foreach ($review->getRatingVotes() as $_vote) : ?>
+                                        <div class="joshine-rating-starts" style="width: <?= $block->escapeHtml($_vote->getPercent()) ?>%;"></div>
+                                    <?php endforeach; ?>
+                                <?php endif; ?>
+                            </div>
+
+                            <div class="joshine-review-des">
+                                <?= $block->escapeHtml($review->getDetail()); ?>
+                            </div>
+                            <div class="joshine-foot-mark rate-fit">
+                                <div class="rate-fit-item">
+                                    <?php $fitsValue = $review->getSizeFits(); ?>
+                                    <span><strong class="joshine-font-w-bolder">Size Fits:</strong> <?= $t[$fitsValue] ?></span>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="joshine-review-pics">
+                            <?= /* @noEscape */ $helper->getReviewImagesHtml($review->getId(), $block->getProductId()) ?>
+                        </div>
+                    </div>
+                    <div class="joshine-review-list-item-right">
+                        <div class="joshine-review-helpful joshine-font-c-darkgray joshine-font-text">
+                            <span>helpful</span>
+                            <span class="joshine-like  <?=  $block->getPlusVotedClass($review->getId()); ?>" data-review-id="<?= $review->getId(); ?>">
+                                <input name="form_key" type="hidden" value="<?= /* @noEscape */ $block->getFormKey(); ?>" />
+                            </span>
+                            <span class="joshine-review-likes-count"><?= $block->getPlusReview($review->getId()); ?></span>
+                        </div>
+                    </div>
+                </div>
+                <?php endforeach; ?>
+            <?php endif; ?>
+        </div>
+
+        <?php if ($block->getPagerHtml()) : ?>
+            <div class=" toolbar toolbar-customized "><?= $block->getPagerHtml() ?></div>
+        <?php endif ?>
+
+    </div>
+</div>
+
+<div class="joshine-review-container-mobile joshine-hidden-lg">
+    <h4 class="joshine-review-title joshine-font-w-bolder">
+        Customer Reviews
+    </h4>
+    <div class="joshine-review">
+        <div class="joshine-review-averate joshine-bg-silver joshine-clearfix">
+            <div class="joshine-review-item joshine-review-rating-box">
+                <div class="name">
+                    Average Rating
+                </div>
+                <div class="ave-rate row">
+                    <div class="joshine-rating-container joshine-col-xs-8">
+                        <div class="joshine-rating-starts" style="width: <?= $rating ?>%;"></div>
+                    </div>
+                    <h2 class="ave-rate-total" style="margin-top: 0; margin-bottom: .35em;"><?= $block->getRatingSummaryValue() ?></h2>
+                </div>
+            </div>
+            <div class="joshine-review-item">
+                <div class="name">
+                    Did the item fit well?
+                </div>
+                <?php foreach ($block->getDetailedSummary() as $key => $detail) : ?>
+                    <div class="fit-item">
+                        <span class="fit-name joshine-font-mini">
+                            <?= $t[$key] ?>
+                        </span>
+                        <div class="joshine-process">
+                            <div class="joshine-process-active" style="width: <?= /* @noEscape */ $count ? round($detail / $count * 100) : 0 ?>%;"></div>
+                        </div>
+                    </div>
+                <?php endforeach; ?>
+            </div>
+        </div>
+
+        <div class="joshine-review-item add-new-box">
+            <a href="#review-form" title="Write a review"  class="add-new-button joshine-btn joshine-btn-dark joshine-review-add-btn">
+                Write a review
+            </a>
+        </div>
+
+        <div class="joshine-review-list joshine-clearfix">
+        <?php if (count($_items) > 0): ?>
+            <?php foreach ($_items as $review) : ?>
+                <div class="joshine-review-list-item row joshine-clearfix">
+                    <div class="row">
+                        <span class="joshine-review-nickname" style="font-size: .9em;">
+                            <?= $block->escapeHtml($review->getNickname()) ?>
+                        </span>
+                        &nbsp;
+                        <span class="joshine-review-date joshine-font-c-darkgray joshine-font-mini-plus">
+                            <?= $block->escapeHtml($block->formatDate($review->getCreatedAt(), $format)) ?>
+                        </span>
+                    </div>
+                    <div class="row">
+                        <div class="joshine-rating-container joshine-rating-small joshine-col-xs-8">
+                            <?php if (count($review->getRatingVotes())) : ?>
+                                <?php foreach ($review->getRatingVotes() as $_vote) : ?>
+                                    <div class="joshine-rating-starts" style="width: <?= $block->escapeHtml($_vote->getPercent()) ?>%;"></div>
+                                <?php endforeach; ?>
+                            <?php endif; ?>
+                        </div>
+                        <div class="joshine-pull-right">
+                            <div class="joshine-review-helpful joshine-font-c-darkgray joshine-font-text">
+                                <span class="joshine-like  <?=  $block->getPlusVotedClass($review->getId()); ?>" data-review-id="<?= $review->getId(); ?>">
+                                    <input name="form_key" type="hidden" value="<?= /* @noEscape */ $block->getFormKey(); ?>" />
+                                </span>
+                                <span class="joshine-review-likes-count" data-review-id="<?= $review->getId(); ?>"><?= $block->getPlusReview($review->getId()); ?></span>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="row joshine-foot-mark">
+                        <?php $fitsValue = $review->getSizeFits(); ?>
+                        <span><strong class="joshine-font-w-bolder">Size Fits:</strong> <?=  $t[$fitsValue] ?></span>
+                    </div>
+
+                    <div class="row joshine-font-w-bolder"  style="font-size: .9em;">
+                        <?= $block->escapeHtml($review->getTitle()); ?>
+                    </div>
+
+                    <div class="row joshine-font-c-darkgray"  style="font-size: .8em;">
+                        <?= $block->escapeHtml($review->getDetail()); ?>
+                    </div>
+
+                    <div class="row joshine-review-pics">
+                        <?= /* @noEscape */ $helper->getReviewImagesHtml($review->getId(), $block->getProductId()) ?>
+                    </div>
+                </div>
+                <hr>
+            <?php endforeach; ?>
+            <?= $block->getPagerHtml() ?>
+        <?php endif; ?>
+    </div>
+</div>
+</div>
+</div>
+<style>
+
+    .joshine-model-warp {
+        z-index: 1000;
+        position: fixed;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+    }
+
+    .joshine-model-warp .joshine-mask {
+        z-index: 1000;
+        position: fixed;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        background: rgba(0,0,0,.8);
+    }
+
+    .joshine-model-warp .j-modal {
+        overflow: hidden;
+        position: fixed;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        z-index: 2000;
+        -webkit-overflow-scrolling: touch;
+        outline: 0;
+    }
+
+
+    .j-modal .j-modal-dialog {
+        position: relative;
+        width: 530px;
+        margin: 30px auto;
+    }
+
+    .j-modal .j-modal-content {
+        position: relative;
+        padding: 40px 50px 30px;
+        background: #fff;
+        background-clip: padding-box;
+        background-position: center;
+        background-size: 100% 100%;
+        background-repeat: no-repeat;
+    }
+    .j-modal .j-modal-header {
+        text-align: center;
+        max-height: 60em;
+        overflow-y: auto;
+    }
+
+    .joshine-model-warp .j-modal .j-modal-dialog {
+        width: 1050px;
+    }
+    
+    .joshine-close {
+        position: absolute;
+        top: 8px;
+        right: 8px;
+        width: 24px;
+        height: 24px;
+        line-height: 24px;
+        font-size: 14px;
+        cursor: pointer;
+    }
+
+    .j-modal .j-modal-body {
+        position: relative;
+        line-height: 1.2;
+    }
+
+    .joshine-review-des-head {
+        display: flex;
+        align-items: center;
+        justify-content:space-between;
+    }
+
+    .modal-reviews-details__des-wrap {
+        margin-left: 24px;
+    }
+
+    .modal-reviews-details__des-wrap  div {
+        margin-bottom: 24px;
+    }
+
+    .modal-reviews-details__image-wrap .modal-reviews-details__image-swiper {
+        padding: 10px;
+        height: 600px;
+    }
+
+    .modal-reviews-details__image-thumbs {
+        margin-top: 14px;
+        overflow: hidden;
+    }
+
+    .image-thumbs-list {
+        position: relative;
+        width: 100%;
+        height: 100%;
+        z-index: 1;
+        display: -webkit-box;
+        display: flex;
+        -webkit-transition-property: -webkit-transform;
+        transition-property: -webkit-transform;
+        transition-property: transform;
+        transition-property: transform,-webkit-transform;
+        -webkit-box-sizing: content-box;
+        box-sizing: content-box;
+    }
+
+    .swiper-item {
+        position: relative;
+        margin-right: 2px;
+    }
+
+    .swiper-item img {
+        left: 50%;
+        -webkit-transform: translate3d(-50%,-50%,0);
+        transform: translate3d(-50%,-50%,0);
+        display: block;
+        position: absolute;
+        top: 50%;
+        max-width: 100%;
+        max-height: 100%;
+    }
+
+    .image-thumbs-list-item {
+        margin-right: 4px;
+        height: 50px;
+        width: 45px;
+        overflow: hidden;
+        -webkit-flex-shrink: 0;
+        -ms-flex: 0 0 auto;
+        flex-shrink: 0;
+        position: relative;
+        cursor: pointer;
+    }
+    .image-thumbs-list-item.active {
+        border: 1px solid #000;
+    }
+    .image-thumbs-list-item .modal-reviews-details__image-thumbs-image img {
+        width: 100%;
+        display: block;
+        position: absolute;
+        top: 50%;
+        left: 50%;
+        -webkit-transform: translate3d(-50%,-50%,0);
+        transform: translate3d(-50%,-50%,0);
+    }
+    .swiper-wrapper {
+        display: flex;
+        position: relative;
+        width: 100%;
+        height: 100%;
+        z-index: 1;
+        display: -webkit-box;
+        display: flex;
+        -webkit-transition-property: -webkit-transform;
+        transition-property: -webkit-transform;
+        -webkit-box-sizing: content-box;
+        box-sizing: content-box;
+        transform: translate3d(0,0,0);
+    }
+
+    .swiper-wrapper .swiper-item {
+        -webkit-flex-shrink: 0;
+        -ms-flex: 0 0 auto;
+        flex-shrink: 0;
+        width: 100%;
+        height: 100%;
+        position: relative;
+    }
+
+    .swiper-container {
+        margin-left: auto;
+        margin-right: auto;
+        position: relative;
+        overflow: hidden;
+        z-index: 1;
+        height: 100%;
+        width: 100%;
+    }
+
+    .modal-reviews-details__image-swiper .swiper-button-prev {
+        height: 100%;
+        width: 50%;
+        position: absolute;
+        top: 0;
+        margin-top: 0;
+        left: 0;
+        right: auto;
+        z-index: 12;
+        cursor: url(static/frontend/Joshine/breeze/en_US/Joshine_Review/img/favicon-pre.ico), auto;
+    }
+
+    .modal-reviews-details__image-swiper .swiper-button-next {
+        height: 100%;
+        width: 50%;
+        position: absolute;
+        top: 0;
+        margin-top: 0;
+        right: 0;
+        left: auto;
+        z-index: 12;
+        cursor: url(static/frontend/Joshine/breeze/en_US/Joshine_Review/img/favicon-next.ico), auto;
+    }
+
+    .modal-reviews-details__image-thumbs-image{
+        position: relative;
+        height: 100%;
+        overflow: hidden;
+        border: 1px solid #efefef;
+    }
+</style>
+
+<div class="joshine-model-warp joshine-hidden">
+    <div class="joshine-mask"></div>
+    <div class="j-modal">
+        <div class="j-modal-dialog">
+            <div class="j-modal-content">
+                <div class="j-modal-header">
+                    <span class="joshine-close">x</span>
+                </div>
+                <div class="j-modal-body">
+                    <div class="modal-reviews-details row">
+                        <div class="modal-reviews-details__image-wrap joshine-col-xs-7 joshine-text-center">
+                            <div class="modal-reviews-details__image-swiper joshine-bg-silver">
+                                <div class="swiper-container">
+                                    <div class="swiper-button-prev"></div>
+                                    <div class="swiper-wrapper image-full-wrapper" data-review-js="image-full-wrapper">
+                                    </div>
+                                    <div class="swiper-button-next"></div>
+                                </div>
+                            </div>
+                            <div class="modal-reviews-details__image-thumbs">
+                                <div class="image-thumbs-list" data-review-js="image-thumbs-wrapper">
+                                </div>
+                            </div>
+                        </div>
+                        <div class="modal-reviews-details__des-wrap joshine-col-xs-4">
+                            <div class="joshine-review-des-head">
+                                <span class="joshine-review-nickname" data-review-js="nickname" style="font-size: .9em;">
+
+                                </span>
+                                <div class="joshine-rating-container joshine-rating-small" style="margin-bottom: 3px;">
+                                    <div class="joshine-rating-starts" style="width: 100%;" data-review-js="rating"></div>
+                                </div>
+                                <span class="joshine-review-date joshine-font-c-darkgray joshine-font-mini-plus joshine-pull-right" data-review-js="date">
+                                </span>
+                            </div>
+
+                            <div class="joshine-review-des-title joshine-font-w-bolder joshine-font-text joshine-font-c-deepin" data-review-js="title">
+                            </div>
+
+                            <div class="joshine-review-des-text joshine-font-c-darkgray joshine-font-mini-plus" data-review-js="detail">
+                            </div>
+
+                            <div class="joshine-foot-mark rate-fit">
+                                <div class="rate-fit-item">
+                                    <span><strong class="joshine-font-w-bolder">Size Fits:</strong> <span data-review-js="fits"></span></span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script type="text/javascript">
+    require([
+        'jquery','ko'
+    ], function ($) {
+
+        $(".joshine-review-add-btn").on('click',function () {
+            $(".block.review-add").removeClass('joshine-hidden');
+        });
+
+        $(".joshine-like").on('click', function() {
+            var element = $(this);
+            var formKey = $.mage.cookies.get('form_key');
+            if (formKey) {
+                element.find('input[name="form_key"]').val(formKey);
+            }
+            var type     = element.hasClass('active') ? 'minus' : 'plus';
+            var reviewId = element.data('review-id');
+            var data     = 'type='+ type +'&form_key=' + formKey + '&review=' + reviewId;
+
+            function refreshReviewVote(response)
+            {
+                if (!response.hasOwnProperty('success')) {
+                    return;
+                }
+                if (type === 'plus') {
+                    element.addClass('active')
+                }
+                if (type === 'minus') {
+                    element.removeClass('active')
+                }
+                element.siblings('.joshine-review-likes-count').html(response.data.plus);
+            }
+
+            $.ajax({
+                url: '/joshine_review/ajax/helpful',
+                data: data,
+                type: 'GET',
+                dataType: 'json',
+                success: function (response) {
+                    refreshReviewVote(response);
+                }
+            });
+
+        });
+
+        var img_idx = 0;
+        // 节流锁
+        var lock = true;
+        var swiper_wrapper = $('.swiper-wrapper');
+        var swiper_thumbs  = $('.image-thumbs-list');
+        var reviewList;
+
+        function processReview(review) {
+            $('[data-review-js="nickname"]').html(review.nickname);
+            $('[data-review-js="title"]').html(review.title);
+            $('[data-review-js="detail"]').html(review.detail);
+            $('[data-review-js="date"]').html(review.created_at);
+            let fits_text = fitsTranslate(review.size_fits);
+            $('[data-review-js="fits"]').html(fits_text);
+            $('[data-review-js="rating"]').width(review.rating + '%');
+            $('#modal-current-review-id').val(review.review_id);
+        }
+
+        function fitsTranslate(fits) {
+            var fits_words = 'default';
+            if (fits === '1') {
+                fits_words = 'Small';
+            }
+            if (fits === '2') {
+                fits_words = 'Ture Size';
+            }
+            if (fits === '3') {
+                fits_words = 'Large';
+            }
+            return fits_words;
+        }
+
+        function pullIdx(id)
+        {
+            img_idx = findIdxByImgId(id);
+            swiper_wrapper.css({"transform" : 'translateX(' + -536 * img_idx + 'px)'});
+            dealIndex(img_idx);
+        }
+
+        function findIdxByImgId(imgId)
+        {
+            let res = 0;
+            $(".image-thumbs-list-item").each(function (index, ele) {
+                if ($(ele).data('image-id') == imgId) {
+                    res = $(ele).data('img-index');
+                }
+            });
+            return res;
+        }
+        
+        $(".joshine-review-container .joshine-review-pic-item").on('click', function () {
+            var reviewId  = $(this).data('reviews-id');
+            var productId = $(this).data('product-id');
+            var image_id  = $(this).data('image-id');
+            var formKey   = $.mage.cookies.get('form_key');
+            var data      = 'review_id='+ reviewId +'&form_key=' + formKey + '&product_id=' + productId;
+            $.ajax({
+                url: '/joshine_review/ajax/reviewinfo',
+                data: data,
+                type: 'GET',
+                dataType: 'json',
+                success: function (response) {
+                    reviewList = response.data;
+                    processModal(response);
+                    pullIdx(image_id);
+                }
+            });
+
+            function processModal(response)
+            {
+                processReview(response.review);
+                processThumbs(response);
+                processFullImage(response);
+                $(".joshine-model-warp").removeClass('joshine-hidden')
+            }
+
+            function processThumbs(response) {
+                var html = '';
+                var image_index = 0;
+                var data = response.data;
+                for (let i = 0; i < data.length; i++) {
+                    for (let j = 0; j < data[i].images.thumb.length; j++) {
+                        html += `
+                            <div class="image-thumbs-list-item" data-review-id="${data[i].review_id}" data-img-index="${image_index}" data-image-id="${data[i].images.thumb[j].image_id}">
+                                <div class="modal-reviews-details__image-thumbs-image">
+                                    <img src="${data[i].images.thumb[j].url}" alt="">
+                                </div>
+                            </div>
+                        `;
+                        image_index++;
+                    }
+                }
+                $('.image-thumbs-list').html(html);
+            }
+
+            function processFullImage(response)
+            {
+                var html = '';
+                var image_index = 0;
+                var data = response.data;
+                for (let i = 0; i < data.length; i++) {
+                    for (let j = 0; j < data[i].images.full.length; j++) {
+                        html += `
+                            <div class="swiper-item" data-review-id="${data[i].review_id}" data-img-index="${image_index}" data-image-id="${data[i].images.full[j].image_id}">
+                                <img src="${data[i].images.full[j].url}" alt="">
+                            </div>
+                        `;
+                        image_index++;
+                    }
+                }
+                $('.image-full-wrapper').html(html);
+            }
+
+
+        });
+
+        $(".joshine-close").on('click', function () {
+            $(".joshine-model-warp").addClass('joshine-hidden')
+        });
+
+        function dealIndex(img_idx)
+        {
+            $('.image-thumbs-list-item').each(function (index, element) {
+                if ($(element).data('img-index') == img_idx && !$(this).hasClass('active')) {
+                    $(element).addClass('active');
+                    return;
+                }
+                $(element).removeClass('active');
+            });
+
+            let thumbPage = parseInt(img_idx / 11);
+            swiper_thumbs.css({"transition" : 'transform .2s ease 0s'});
+            swiper_thumbs.css({"transform" : 'translateX(' + -490 * thumbPage + 'px)'});
+        }
+
+        $(".swiper-button-next").on('click', function () {
+            let img_idx_pre = img_idx + 1;
+            let has_pre = false;
+            $('.image-thumbs-list-item').each(function (index, element) {
+                if ($(element).data('img-index') == img_idx_pre) {
+                    has_pre = true;
+                    return;
+                }
+            });
+            if (!has_pre) {
+                return;
+            }
+            if (!lock) return;
+            lock = false;
+            swiper_wrapper.css({"transition" : 'transform .5s ease 0s'});
+            img_idx++;
+            swiper_wrapper.css({"transform" : 'translateX(' + -536 * img_idx + 'px)'});
+            // 开锁，动画结束之后开锁
+
+            dealIndex(img_idx);
+            processReviewDetail(img_idx);
+            setTimeout(function () {
+                lock = true;
+            }, 500);
+        });
+
+        $(".swiper-button-prev").on('click', function () {
+            if (!lock) return;
+            lock = false;
+            if (img_idx == 0) {
+                setTimeout(function () {
+                    lock = true;
+                }, 500);
+                return;
+            }
+            swiper_wrapper.css({"transition" : 'transform .5s ease 0s'});
+            img_idx--;
+            swiper_wrapper.css({"transform" : 'translateX(' + -536 * img_idx  + 'px)'});
+            dealIndex(img_idx);
+            processReviewDetail(img_idx);
+            setTimeout(function () {
+                lock = true;
+            }, 500);
+        });
+
+        function processReviewDetail(img_idx)
+        {
+            var shouldReviewId;
+            $(".image-thumbs-list-item").each(function (index, ele) {
+                if ($(ele).data('img-index') == img_idx) {
+                    shouldReviewId = $(ele).data('review-id');
+                }
+            });
+            let curReviewId = $('#modal-current-review-id').val();
+
+            if (shouldReviewId != curReviewId) {
+                let review = findReviewById(shouldReviewId);
+                processReview(review);
+            }
+        }
+
+        function findReviewById(reviewId)
+        {
+            let review = '';
+            for(let i = 0; i < reviewList.length; i++) {
+                if (reviewList[i].review_id == reviewId) {
+                    review = reviewList[i];
+                    break;
+                }
+            }
+            return review;
+        }
+
+    });
+</script>
\ No newline at end of file

app/code/Joshine/Review/view/frontend/templates/review-js.phtml

+<?php
+    /** @var $block */
+
+?>
+<script type="text/x-magento-init">
+        {
+            "*": {
+                "Joshine_Review/js/review/js-loader": {  }
+            }
+        }
+</script>

app/code/Joshine/Review/view/frontend/templates/toolbar.phtml

+<div class="joshine-review-filter joshine-clearfix">
+    <div class="joshine-review-tab joshine-review-tab-container">
+        <span class="tab  active joshine-inline-block joshine-font-c-deepin review-js-with-image">All Reviews</span>
+        <span class="tab review-with-image joshine-inline-block review-js-with-image joshine-hidden">With Image</span>
+    </div>
+    <div class="joshine-review-select-wrap joshine-hidden">
+        <div class="joshine-review-select-item">
+            <label>Rating</label>
+            <select data-review-js="filter" name="rating" class="review-js-filter">
+                <option value="1">1 Star</option>
+                <option value="2">2 Star</option>
+                <option value="3">3 Star</option>
+                <option value="4">4 Star</option>
+                <option value="5">5 Star</option>
+            </select>
+        </div>
+        <div class="joshine-review-select-item">
+            <label>Verified Buyers</label>
+            <input type="checkbox" name="verified_buyers" class="checkbox review-js-filter">
+        </div>
+        <div class="joshine-review-select-item"><span>Sort by</span>
+            <label><?= /* @noEscape */ __('Sort By') ?></label>
+            <select  name="sorter" class="review-js-sorter">
+                <option value="date">Date</option>
+                <option value="helpfulness">Helpfulness</option>
+                <option value="rating">Rating</option>
+            </select>
+        </div>
+    </div>
+</div>

app/code/Joshine/Review/view/frontend/web/css/_review.css

+.joshine-review-container {
+    padding: 0;
+}
+
+.joshine-review-container .joshine-review-title {
+    font-size: 24px;
+    font-weight: 1000;
+    text-transform: capitalize;
+}
+
+.joshine-review-container .joshine-review-averate {
+    display: flex;
+}
+.joshine-review-container .joshine-review-item {
+    padding: 24px;
+    display: -webkit-box;
+    display: flex;
+    -webkit-box-orient: vertical;
+    -webkit-box-direction: normal;
+    flex-direction: column;
+    -webkit-box-pack: center;
+    justify-content: center;
+    width: 33.33%;
+}
+
+.joshine-review-container .joshine-review-container .joshine-review-averate .add-new-box {
+    flex-grow:0;
+    flex-basis:auto;
+    font-size: 1.2em;
+    padding: .2em;
+}
+.joshine-review-container .joshine-review-container .joshine-review-averate  .name {
+    margin-bottom: 15px;
+}
+.joshine-review-container .ave-rate {
+    align-items: center;
+    display: flex;
+}
+.joshine-review-container .ave-rate-total {
+    font-size: 22px;
+    font-weight: 700;
+    padding-left: 10px;
+}
+.joshine-review-container  .joshine-review-item .fit-item .joshine-process {
+    background-color: #e4e4e4;
+    border-radius: 4px;
+    width: 190px;
+}
+.joshine-review-container  .joshine-review-item .fit-item .joshine-process .joshine-process-active{
+    background-color: #222;
+    border-radius: 4px;
+}
+.joshine-review-container .joshine-review-item .fit-item {
+    display: flex;
+    align-items: center;
+}
+.joshine-review-container .joshine-review-item .fit-item .fit-name {
+    width: 80px;
+}
+.joshine-review-container .joshine-review-item.add-new-box .add-new-button {
+    font-weight: 400;
+    font-size: 22px;
+}
+
+.joshine-review-container .joshine-review-list {
+    padding: 20px 0;
+}
+.joshine-review-container .joshine-review-list-item {
+    display: flex;
+    position: relative;
+    width: 100%;
+    border-bottom: 1px dashed #e5e5e5;
+    padding: 25px 0;
+}
+.joshine-review-container .joshine-review-list-item-left {
+    width: 200px;
+}
+.joshine-review-container .joshine-review-list-item .joshine-review-nickname {
+    width: 100%;
+    white-space: nowrap;
+    margin-bottom: 15px;
+}
+
+.joshine-review-container .joshine-review-list-item-mid {
+    width: calc(100% - 288px);
+    display: -webkit-box;
+    display: flex;
+    padding-right: 150px;
+}
+.joshine-review-container .joshine-review-list-item .joshine-review-detail {
+    padding-right: 40px;
+    width: 50%;
+}
+.joshine-review-container .joshine-review-list-item .joshine-review-pics {
+    width: 50%;
+    display: flex;
+}
+.joshine-review-container .joshine-review-list-item .joshine-review-pic-item {
+    position: relative;
+    flex-shrink: 0;
+    width: 108px;
+    height: 108px;
+    line-height: 108px;
+    overflow: hidden;
+    margin-right: 5px;
+}
+
+.joshine-review-container .joshine-review-list-item .joshine-review-des-title {
+    font-weight: 400;
+    margin-bottom: 5px;
+}
+
+.joshine-review-container .joshine-review-list-item .joshine-review-des {
+    font-size: 14px;
+    line-height: 1.4em;
+    color: #5b5b5b;
+}
+
+.joshine-review-container .joshine-review-list-item .joshine-review-date {
+    position: absolute;
+    bottom: 28px;
+}
+.joshine-review-container .joshine-review-list-item .rate-fit {
+    display: inline-flex;
+    -webkit-box-align: center;
+    align-items: center;
+    flex-wrap: wrap;
+    padding-top: 10px;
+}
+
+.joshine-review-container .joshine-review-list-item .rate-fit .rate-fit-item{
+    margin-bottom: 5px;
+    margin-right: 14px;
+}
+.joshine-review-container .joshine-review-helpful {
+    display: inline-block;
+    position: absolute;
+    right: 0;
+}
+.joshine-review-container .joshine-review-helpful .joshine-like{
+    display: inline-block;
+}
+
+/*遮罩蒙层*/
+.joshine-mask {
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    position: fixed;
+    background: rgba(0, 0, 0, .8);
+}
+
+.joshine-review-container .joshine-review-tab-container {
+    margin-right: auto;
+}
+
+.joshine-review-container .joshine-review-tab {
+    font-size: 14px;
+    color: #666;
+    font-weight: 700;
+    position: relative;
+    display: inline-block;
+}
+
+.joshine-review-container .joshine-review-tab .tab {
+    padding: 25px 0;
+    cursor: pointer;
+}
+.joshine-review-container .joshine-review-tab .tab + .tab {
+    margin-left: 25px;
+}
+
+.joshine-review-container .joshine-review-filter {
+    border-bottom: 1px solid #e5e5e5;
+    display: flex;
+    align-items: center;
+}
+
+.joshine-review-container  .joshine-review-select-wrap {
+    padding: 10px;
+    font-size: .9em;
+}
+
+.joshine-review-container  .joshine-review-filter .joshine-review-select-item {
+    display: inline-block;
+}
+.joshine-review-container  .joshine-review-filter .joshine-review-select-item + .joshine-review-select-item {
+    margin-left: 25px;
+}
+
+.joshine-review-container  .joshine-review-select-wrap .joshine-review-select-box {
+    padding: 5px 0;
+    position: relative;
+    display: inline-block;
+}
+
+.joshine-review-container  .joshine-review-select-wrap .joshine-review-select-box-input {
+    height: 34px;
+    line-height: 32px;
+    display: inline-block;
+}
+.joshine-review-container  .joshine-review-tab .tab.active {
+    border-bottom: #222 solid 2px;
+}
+.joshine-review-container  .joshine-reviews-page {
+    margin-top: 15px;
+    margin-bottom: 15px;
+}
+
+.joshine-review-container  .joshine-review-select-wrap select {
+    width: auto;
+    padding: .5em 2.2em .5em .5em;
+    height: auto;
+    line-height: normal;
+}
+
+.joshine-review-pic-item img {
+    width:      100%;
+    height:     7.5em ;
+    object-fit: cover;
+}
+.joshine-review-container-mobile .joshine-review-pics {
+    display: flex;
+    flex-wrap: wrap;
+}
+.joshine-review-container-mobile .joshine-review-pic-item{
+    padding: .1em;
+}
+
+.joshine-review-container-mobile .joshine-review-item .fit-item .joshine-process {
+    background-color: #e4e4e4;
+    border-radius: 4px;
+    width: 190px;
+}
+.joshine-review-container-mobile .joshine-review-item .fit-item .joshine-process .joshine-process-active{
+    background-color: #222;
+    border-radius: 4px;
+}
+
+
+.modal-reviews-details__image-swiper .swiper-button-next {
+    cursor : url(static/frontend/Joshine/breeze/en_US/Joshine_Review/img/favicon-next.ico), auto;
+}
+
+.modal-reviews-details__image-swiper .swiper-button-prev {
+    cursor : url(static/frontend/Joshine/breeze/en_US/Joshine_Review/img/favicon-pre.ico), auto;
+}
\ No newline at end of file

app/code/Joshine/Review/view/frontend/web/js/components/review-slider.js

+define([
+    'jquery',
+    'ko'
+], function ($) {
+    'use strict';
+    $.widget('mage.joshineReviewSlider', {
+
+        _create: function () {
+
+        },
+
+        _binding : function () {
+
+        },
+    });
+    return $.mage.joshineReviewSlider
+});
\ No newline at end of file

app/code/Joshine/Review/view/frontend/web/js/review/handler.js

+define(['jquery', 'Magento_Ui/js/modal/modal'], function ($) {
+    'use strict';
+
+    return {
+
+        handleReviewsImgClick : function (element, event) {
+            $('.joshine-model-warp').removeClass('joshine-hidden');
+        },
+
+        handlePage : function (element, event) {
+            let self = $(this);
+            if (element.hasClass('pagination-btn-disabled')) {
+                return;
+            }
+            element.siblings().removeClass('active');
+            element.addClass('active');
+
+            let pageLoad = {
+                loaderContext: $('#product-review-container'),
+            };
+            event.preventDefault();
+            $.ajax({
+                url: element.data('href'),
+                cache: true,
+            }).done(function (data) {
+                pageLoad.loaderContext.html(data);
+            });
+        },
+    }
+});
\ No newline at end of file

app/code/Joshine/Review/view/frontend/web/js/review/js-loader.js

+define([
+    'jquery',
+    'ko',
+    'joshineReviewHandler'
+], function ($, ko, handler) {
+    'use strict';
+    $.widget('mage.joshineReview', {
+        _create: function () {
+            var self = this;
+            self._binding();
+        },
+        _binding : function () {
+            $(document).on('click', '.joshine-pagination-btn', function(event){
+                handler.handlePage($(this), event);
+            });
+
+        },
+    });
+    return $.mage.joshineReview
+});

app/code/Joshine/Review/view/frontend/web/js/review/utils.js

+define([
+    'jquery',
+    'ko',
+    'joshineReviewConfig'
+], function ($, ko, config) {
+    'use strict';
+
+    return {
+        isApi : function (url) {
+            var apisArr = config.apis;
+            return apisArr.indexOf(url);
+        }
+    }
+});
\ No newline at end of file

app/code/Magento/Checkout/view/frontend/templates/cart/we_accept.phtml

+<style>
+    #we-accept{
+        text-align: center;
+        background: #ffffff;
+        padding: 10px 20px;
+    }
+    #we-accept .title{
+        font-size: 24px;
+        font-weight: bold;
+        margin-bottom: 10px;
+    }
+</style>
+<div id="we-accept">
+    <div class="title">We Accept</div>
+    <img src="/media/wysiwyg/we_accept.png" alt="">
+</div>
\ No newline at end of file

app/code/Magento/Checkout/view/frontend/web/js/view/part.js

+define([
+        'jquery',
+        'uiComponent',
+        'Magento_Checkout/js/model/checkout-data-resolver'
+    ], function ($, Component,checkoutDataResolver) {
+        'use strict';
+        var input_city = $('#co-shipping-form input[name="city"]');
+        if (input_city.is(':visible') && !input_city.closest('.field').hasClass('_required')) {
+            input_city.attr('required',true);
+            input_city.attr('_required',true);
+        }
+        return Component.extend({
+            initialize: function () {
+                this.initStep();
+                this._super();
+                return this;
+            },
+            initStep: function () {
+                $(document).on('click', '#next-shipping>span', function () {
+                    var loginForm = $('.form.form-login');
+                    var addressForm = $('#checkout-step-shipping>#co-shipping-form');
+                    if (loginForm.length > 0 && !loginForm.validate().form()) {
+                        return false;
+                    }
+                    if (addressForm.length > 0) {
+                        if (!$('#co-shipping-form input[name="region"]').closest('.field').hasClass('_required')) {
+                            $('#co-shipping-form input[name="region"]').removeAttr('required');
+                        }
+                        if (!$('#co-shipping-form input[name="street[1]"]').closest('.field').hasClass('_required')) {
+                            $('#co-shipping-form input[name="street[1]"]').removeAttr('required');
+                        }
+                        if (!$('#co-shipping-form input[name="company"]').closest('.field').hasClass('_required')) {
+                            $('#co-shipping-form input[name="company"]').removeAttr('required');
+                        }
+                        var region_select = $('#co-shipping-form select[name="region_id"]');
+                        if (region_select.is(':visible') && region_select.closest('.field').hasClass('_required')) {
+                            region_select.attr('required',true);
+                        }
+                        if (!addressForm.validate().form()) {
+                            return false;
+                        }
+                        var email = $('#customer-email').val() || '';
+                        var firstname = $('#co-shipping-form input[name="firstname"]').val();
+                        var lastname = $('#co-shipping-form input[name="lastname"]').val();
+                        var street = $('#co-shipping-form input[name="street[0]"]').val();
+                        var city = $('#co-shipping-form input[name="city"]').val();
+                        var postcode = $('#co-shipping-form input[name="postcode"]').val();
+                        var telephone = $('#co-shipping-form input[name="telephone"]').val();
+                        var country = $('#co-shipping-form select[name="country_id"]').find(":selected").text();
+                        var regin;
+                        if ($('#co-shipping-form input[name="region"]').is(':visible')) {
+                            regin = $('#co-shipping-form input[name="region"]').val();
+                        } else {
+                            regin = region_select.find(":selected").text();
+                        }
+                        $('#checkout-step-shipping').hide();
+                        $('#shipping-text').show();
+                        $('#shipping-text .main-address.shipping-address').html(firstname + ' ' + lastname + '<br>' + street + '<br>' + city + ', ' + regin + ', ' + country + '<br>' + postcode + ', ' + telephone + '<br>' + email);
+                    }
+                    $('#next-shipping').hide();
+                    $('#checkout-step-shipping_method').show();
+                    $('#checkout-payment-method-load').show();
+                    $('#checkout-step-payment,#opc-shipping_method').find('.step-title').removeClass('no-border');
+                    if ($(window).width() < 768) {
+                        var scrollTop = $('#opc-shipping_method').offset().top - 100;
+                        $('html,body').animate({scrollTop: scrollTop}, 'fast');
+                    }
+                    checkoutDataResolver.resolveEstimationAddress();
+                });
+
+                $(document).on('click', '#shipping-text .address-edit', function () {
+                    $('#shipping-text .main-address.shipping-address').html('');
+                    $('#shipping-text').hide();
+                    $('#checkout-step-shipping').show();
+                    $('#next-shipping').show();
+                    $('#checkout-step-shipping_method').hide();
+                    $('#checkout-payment-method-load').hide();
+                    $('#checkout-step-payment,#opc-shipping_method').find('.step-title').addClass('no-border');
+                });
+            }
+        });
+    }
+);

app/code/Magento/Checkout/view/frontend/web/template/new-billing-address.html

+<style>
+
+    .billing-box{
+        width: 50%;
+        padding: 20px 22px;
+        border: 1px solid #d6d6d6;
+        font-size: 14px;
+        min-height: 200px;
+        position: relative;
+        box-sizing: border-box;
+    }
+
+    .billing-address-box{
+        padding-bottom: 1rem;
+        border-bottom: 1px dashed #ddd;
+    }
+    .billing-handle .action-edit-address {
+        border: none;
+        background: 0 0;
+        position: absolute;
+        bottom: 0;
+        right: 10px;
+        outline: none;
+        text-align: center;
+        box-sizing: border-box;
+    }
+    .billing-handle .action-edit-address svg {
+        width: 12px;
+        height: 12px;
+        fill: #666;
+    }
+    .billing-address-details {
+        padding: 0.5rem 0px 0.5rem 1.5rem;
+    }
+    @media (max-width: 1023px){
+        .action-update-cancel{
+            height: 120px;
+        }
+
+        .action-update,.action-cancel{
+            margin-bottom: 13%;
+            margin-right: 20%;
+        }
+    }
+    @media (min-width: 768px) {
+        .billing-box:before {
+            width: 5px;
+            height: 100%;
+            display: block;
+            content: "";
+            position: absolute;
+            left: 0;
+            top: 0;
+            background-size: contain;
+            background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAACECAYAAABVnZHfAAAA+0lEQVQ4je3UsUrDUBTG8X9s6yZOeYMOLejgS7iIUDCrS0uH0oI+QUGdHZSsjnZw6dB3ENK1U8eCQqBjoWvkaE/4SpHgYjv0bj9yc5J7v3tukN5GGT9jcICMreFDEQFLRwK0gCyIXtLvKfGkd5aDwr+uKkbAsaMGvAElf+cc6GuB6m7szo4hU9w5ysA9UNdpTWDsS7BMn3U9mZ3EtdIlxZOiC3T8O6yeTr1axU7JPp8iJIor7zvDJ9CwjLTNwj+02aEiVrSBGyS5R03OEr/e51OEd4UFNXPMgUtgkTdT7zQONzrrd1woXoETh92UQyD0AnaXPmi1o3/ZA+ALpYA1JaK/rAEAAAAASUVORK5CYII=) repeat-y;
+        }
+    }
+    @media (max-width: 768px){
+        .billing-box{
+            width: 100%;
+        }
+        .billing-address-details {
+            padding: 0;
+        }
+        .billing-box:before{
+            width: 100%;
+            height: 5px;
+            bottom: 0;
+            left:0;
+            display: block;
+            content: "";
+            position: absolute;
+            background-size: contain;
+            background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAu4AAAAGCAYAAACclRsMAAABWklEQVR4nO3aMUrEQBiG4VfxAnoHwWZ7e1GsrAQ9gkIKDxPQI2hrJSvb29sIXsBKLyAoWbbLDCZuZvlD3qfaIgn59vsnTDFbHzfnP5TxBVxWs3re8em7wD1wUuh9SlnmBOb1azWJnD3uGXVWZ7dlKrM7+pzVrO56j7Mb26Rm129ui/uF+DY+uzuF/pJ34Kya1W8dr98HHoGDQu9TyjInYM62UWd1dlvMGdvk1qidtvjNjc25zXN2e9geMsHKAjjsUdoR8DLCwsyZZ6exmTPNNRqfnaaZMzZz5tlpT0Nv3O+AU+Cz4/VXwBOwN/B7lGbOPDuNzZxprtH47DTNnLGZM89O/2Gojfs30BzYul79/ktzRKc5hHlb8LhOCebMs9PYzJnmGo3PTtPMGZs58+x0DUM8qDmYfwE8d7y+OZj/ABwPFWJDzJlnp7GZM801Gp+dppkzNnPm2ek6gF8O5wurSKfLHQAAAABJRU5ErkJggg==) repeat-x;
+        }
+    }
+</style>
+<div class="checkout-billing-address cclt">
+
+    <div class="billing-address-same-as-shipping-block field choice" data-bind="visible: canUseShippingAddress()">
+        <input type="checkbox" name="billing-address-same-as-shipping"
+               data-bind="checked: isAddressSameAsShipping, click: useShippingAddress, attr: {id: 'billing-address-same-as-shipping-' + getCode($parent)}"/>
+        <label data-bind="attr: {for: 'billing-address-same-as-shipping-' + getCode($parent)}"><span
+                data-bind="i18n: 'My billing and shipping address are the same'"></span></label>
+    </div>
+    <!-- ko ifnot: isAddressSameAsShipping -->
+    <!-- ko template: 'Magento_Checkout/billing-address/details' --><!-- /ko -->
+    <!-- /ko -->
+    <fieldset class="fieldset" data-bind="visible: !isAddressDetailsVisible()">
+        <!-- ko template: 'Magento_Checkout/billing-address/list' --><!-- /ko -->
+        <!-- ko template: 'Magento_Checkout/billing-address/form' --><!-- /ko -->
+        <div class="actions-toolbar action-update-cancel"  style="margin-left: 0%;">
+            <div class="primary">
+                <button class="action action-update" type="button" data-bind="click: updateAddress">
+                    <span data-bind="i18n: 'Update'"></span>
+                </button>
+                <button class="action action-cancel" type="button" data-bind="click: cancelAddressEdit">
+                    <span data-bind="i18n: 'Cancel'"></span>
+                </button>
+            </div>
+        </div>
+    </fieldset>
+
+</div>

app/design/frontend/Joshine/breeze/Magento_Catalog/templates/product/view/form.phtml

+<?php
+/**
+ * Copyright © Magento, Inc. All rights reserved.
+ * See COPYING.txt for license details.
+ */
+
+// phpcs:disable Magento2.Templates.ThisInTemplate.FoundThis
+
+/**
+ * Product view template
+ *
+ * @var $block \Magento\Catalog\Block\Product\View
+ */
+?>
+<?php $_helper = $this->helper(Magento\Catalog\Helper\Output::class); ?>
+<?php $_product = $block->getProduct(); ?>
+<?php echo $block->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('product_info_addtocar_top_slogan')->toHtml();?>
+<div class="product-add-form">
+    <form data-product-sku="<?= $block->escapeHtml($_product->getSku()) ?>"
+          action="<?= $block->escapeUrl($block->getSubmitUrl($_product)) ?>" method="post"
+          id="product_addtocart_form"<?php if ($_product->getOptions()) :?> enctype="multipart/form-data"<?php endif; ?>>
+        <input type="hidden" name="product" value="<?= (int)$_product->getId() ?>" />
+        <input type="hidden" name="selected_configurable_option" value="" />
+        <input type="hidden" name="related_product" id="related-products-field" value="" />
+        <input type="hidden" name="item"  value="<?= (int)$block->getRequest()->getParam('id') ?>" />
+        <?= $block->getBlockHtml('formkey') ?>
+        <?= $block->getChildHtml('form_top') ?>
+        <?php if (!$block->hasOptions()) :?>
+            <?= $block->getChildHtml('product_info_form_content') ?>
+        <?php else :?>
+            <?php if ($_product->isSaleable() && $block->getOptionsContainer() == 'container1') :?>
+                <?= $block->getChildChildHtml('options_container') ?>
+            <?php endif;?>
+        <?php endif; ?>
+
+        <?php if ($_product->isSaleable() && $block->hasOptions() && $block->getOptionsContainer() == 'container2') :?>
+            <?= $block->getChildChildHtml('options_container') ?>
+        <?php endif;?>
+        <?= $block->getChildHtml('form_bottom') ?>
+    </form>
+</div>
+
+
+<script type="text/x-magento-init">
+    {
+        "[data-role=priceBox][data-price-box=product-id-<?= $block->escapeHtml($_product->getId()) ?>]": {
+            "priceBox": {
+                "priceConfig":  <?= /* @noEscape */ $block->getJsonConfig() ?>
+            }
+        }
+    }
+</script>

app/design/frontend/Joshine/breeze/Magento_Theme/requirejs-config.js

+/**
+ * Created by Renk on 2017/4/19.
+ */
+var config = {
+    deps: [
+        "jquery"
+    ],
+    paths: {
+        'jquery.owlCarousel': "OwlCarousel2/dist/owl.carousel.min",
+    },
+    shim: {
+
+        'jquery.owlCarousel': {
+            deps: ["jquery"],
+            exports: 'jQuery.fn.owlCarousel'
+        }
+    }
+};
\ No newline at end of file

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/LICENSE

+Copyright (c) 2014 Owl
+Modified work Copyright 2016 David Deutsch
+
+Permission is hereby granted, free of charge, to any person
+obtaining a copy of this software and associated documentation
+files (the "Software"), to deal in the Software without
+restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the
+Software is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/README.md

+# OwlCarousel2 is currently being transferred to a new owner
+
+Stay tuned while the new owner sorts through some stuff. (Oh, hi, I'm [David](https://github.com/daviddeutsch)!)
+
+## Owl Carousel 2
+
+Touch enabled [jQuery](https://jquery.com/) plugin that lets you create a beautiful, responsive carousel slider. **To get started, check out https://owlcarousel2.github.io/OwlCarousel2/.**
+
+## Quick start
+
+### Install
+
+This package can be installed with:
+
+- [npm](https://www.npmjs.com/package/owl.carousel): `npm install --save owl.carousel`
+- [bower](http://bower.io/search/?q=owl.carousel): `bower install --save owl.carousel`
+
+Or download the [latest release](https://github.com/OwlCarousel2/OwlCarousel2/releases).
+
+### Load
+
+#### Webpack
+
+Load the required stylesheet and JS:
+
+```js
+import 'owl.carousel/dist/assets/owl.carousel.css';
+import $ from 'jquery';
+import 'imports?jQuery=jquery!owl.carousel';
+```
+
+#### Static HTML
+
+Put the required stylesheet at the [top](https://developer.yahoo.com/performance/rules.html#css_top) of your markup:
+
+```html
+<link rel="stylesheet" href="/node_modules/owl.carousel/dist/assets/owl.carousel.min.css" />
+```
+
+```html
+<link rel="stylesheet" href="/bower_components/owl.carousel/dist/assets/owl.carousel.min.css" />
+```
+
+**NOTE:** If you want to use the default navigation styles, you will also need to include `owl.theme.default.css`.
+
+
+Put the script at the [bottom](https://developer.yahoo.com/performance/rules.html#js_bottom) of your markup right after jQuery:
+
+```html
+<script src="/node_modules/jquery/dist/jquery.js"></script>
+<script src="/node_modules/owl.carousel/dist/owl.carousel.min.js"></script>
+```
+
+```html
+<script src="/bower_components/jquery/dist/jquery.js"></script>
+<script src="/bower_components/owl.carousel/dist/owl.carousel.min.js"></script>
+```
+
+### Usage
+
+Wrap your items (`div`, `a`, `img`, `span`, `li` etc.) with a container element (`div`, `ul` etc.). Only the class `owl-carousel` is mandatory to apply proper styles:
+
+```html
+<div class="owl-carousel owl-theme">
+  <div> Your Content </div>
+  <div> Your Content </div>
+  <div> Your Content </div>
+  <div> Your Content </div>
+  <div> Your Content </div>
+  <div> Your Content </div>
+  <div> Your Content </div>
+</div>
+```
+**NOTE:** The `owl-theme` class is optional, but without it, you will need to style navigation features on your own.
+
+
+Call the [plugin](https://learn.jquery.com/plugins/) function and your carousel is ready.
+
+```javascript
+$(document).ready(function(){
+  $('.owl-carousel').owlCarousel();
+});
+```
+
+## Documentation
+
+The documentation, included in this repo in the root directory, is built with [Assemble](http://assemble.io/) and publicly available at https://owlcarousel2.github.io/OwlCarousel2/. The documentation may also be run locally.
+
+## Building
+
+This package comes with [Grunt](http://gruntjs.com/) and [Bower](http://bower.io/). The following tasks are available:
+
+  * `default` compiles the CSS and JS into `/dist` and builds the doc.
+  * `dist` compiles the CSS and JS into `/dist` only.
+  * `watch` watches source files and builds them automatically whenever you save.
+  * `test` runs [JSHint](http://www.jshint.com/) and [QUnit](http://qunitjs.com/) tests headlessly in [PhantomJS](http://phantomjs.org/).
+
+To define which plugins are build into the distribution just edit `/_config.json` to fit your needs.
+
+## Contributing
+
+Please read [CONTRIBUTING.md](CONTRIBUTING.md).
+
+## License
+
+The code and the documentation are released under the [MIT License](LICENSE).

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/assets/owl.carousel.css

+/**
+ * Owl Carousel v2.2.1
+ * Copyright 2013-2017 David Deutsch
+ * Licensed under  ()
+ */
+/*
+ *  Owl Carousel - Core
+ */
+.owl-carousel {
+  display: none;
+  width: 100%;
+  -webkit-tap-highlight-color: transparent;
+  /* position relative and z-index fix webkit rendering fonts issue */
+  position: relative;
+  z-index: 1; }
+  .owl-carousel .owl-stage {
+    position: relative;
+    -ms-touch-action: pan-Y;
+    -moz-backface-visibility: hidden;
+    /* fix firefox animation glitch */ }
+  .owl-carousel .owl-stage:after {
+    content: ".";
+    display: block;
+    clear: both;
+    visibility: hidden;
+    line-height: 0;
+    height: 0; }
+  .owl-carousel .owl-stage-outer {
+    position: relative;
+    overflow: hidden;
+    /* fix for flashing background */
+    -webkit-transform: translate3d(0px, 0px, 0px); }
+  .owl-carousel .owl-wrapper,
+  .owl-carousel .owl-item {
+    -webkit-backface-visibility: hidden;
+    -moz-backface-visibility: hidden;
+    -ms-backface-visibility: hidden;
+    -webkit-transform: translate3d(0, 0, 0);
+    -moz-transform: translate3d(0, 0, 0);
+    -ms-transform: translate3d(0, 0, 0); }
+  .owl-carousel .owl-item {
+    position: relative;
+    min-height: 1px;
+    float: left;
+    -webkit-backface-visibility: hidden;
+    -webkit-tap-highlight-color: transparent;
+    -webkit-touch-callout: none; }
+  .owl-carousel .owl-item img {
+    display: block;
+    width: 100%; }
+  .owl-carousel .owl-nav.disabled,
+  .owl-carousel .owl-dots.disabled {
+    display: none; }
+  .owl-carousel .owl-nav .owl-prev,
+  .owl-carousel .owl-nav .owl-next,
+  .owl-carousel .owl-dot {
+    cursor: pointer;
+    cursor: hand;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none; }
+  .owl-carousel.owl-loaded {
+    display: block; }
+  .owl-carousel.owl-loading {
+    opacity: 0;
+    display: block; }
+  .owl-carousel.owl-hidden {
+    opacity: 0; }
+  .owl-carousel.owl-refresh .owl-item {
+    visibility: hidden; }
+  .owl-carousel.owl-drag .owl-item {
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none; }
+  .owl-carousel.owl-grab {
+    cursor: move;
+    cursor: grab; }
+  .owl-carousel.owl-rtl {
+    direction: rtl; }
+  .owl-carousel.owl-rtl .owl-item {
+    float: right; }
+
+/* No Js */
+.no-js .owl-carousel {
+  display: block; }
+
+/*
+ *  Owl Carousel - Animate Plugin
+ */
+.owl-carousel .animated {
+  animation-duration: 1000ms;
+  animation-fill-mode: both; }
+
+.owl-carousel .owl-animated-in {
+  z-index: 0; }
+
+.owl-carousel .owl-animated-out {
+  z-index: 1; }
+
+.owl-carousel .fadeOut {
+  animation-name: fadeOut; }
+
+@keyframes fadeOut {
+  0% {
+    opacity: 1; }
+  100% {
+    opacity: 0; } }
+
+/*
+ * 	Owl Carousel - Auto Height Plugin
+ */
+.owl-height {
+  transition: height 500ms ease-in-out; }
+
+/*
+ * 	Owl Carousel - Lazy Load Plugin
+ */
+.owl-carousel .owl-item .owl-lazy {
+  opacity: 0;
+  transition: opacity 400ms ease; }
+
+.owl-carousel .owl-item img.owl-lazy {
+  transform-style: preserve-3d; }
+
+/*
+ * 	Owl Carousel - Video Plugin
+ */
+.owl-carousel .owl-video-wrapper {
+  position: relative;
+  height: 100%;
+  background: #000; }
+
+.owl-carousel .owl-video-play-icon {
+  position: absolute;
+  height: 80px;
+  width: 80px;
+  left: 50%;
+  top: 50%;
+  margin-left: -40px;
+  margin-top: -40px;
+  background: url("owl.video.play.png") no-repeat;
+  cursor: pointer;
+  z-index: 1;
+  -webkit-backface-visibility: hidden;
+  transition: transform 100ms ease; }
+
+.owl-carousel .owl-video-play-icon:hover {
+  -ms-transform: scale(1.3, 1.3);
+      transform: scale(1.3, 1.3); }
+
+.owl-carousel .owl-video-playing .owl-video-tn,
+.owl-carousel .owl-video-playing .owl-video-play-icon {
+  display: none; }
+
+.owl-carousel .owl-video-tn {
+  opacity: 0;
+  height: 100%;
+  background-position: center center;
+  background-repeat: no-repeat;
+  background-size: contain;
+  transition: opacity 400ms ease; }
+
+.owl-carousel .owl-video-frame {
+  position: relative;
+  z-index: 1;
+  height: 100%;
+  width: 100%; }

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/assets/owl.carousel.min.css

+/**
+ * Owl Carousel v2.2.1
+ * Copyright 2013-2017 David Deutsch
+ * Licensed under  ()
+ */
+.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url(owl.video.play.png) no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}
\ No newline at end of file

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/assets/owl.carousel_local.css

+/*
+ *
+ */
+.owl-carousel.owl-theme.owl-loaded .item {
+  width: auto!important;
+}
+.owl-carousel.owl-theme .owl-prev.disabled svg,.owl-carousel.owl-theme .owl-next.disabled svg{
+  fill: #999999;
+}
+
+.owl-carousel.owl-theme .owl-nav .owl-prev{
+  padding: 10px;
+  box-sizing: content-box;
+  position: absolute;
+  z-index: 10;
+  cursor: pointer;
+  position: absolute;
+  left: 0;
+}
+.owl-carousel.owl-theme .owl-nav .owl-next{
+  padding: 10px;
+  box-sizing: content-box;
+  position: absolute;
+  z-index: 10;
+  cursor: pointer;
+  position: absolute;
+  right:0;
+}
+@media (min-width: 768px) {
+
+  .owl-carousel.owl-theme {
+    margin:0 auto;
+    padding:0px 50px;
+  }
+  .owl-carousel.owl-theme .item-action{
+    line-height: 33px;
+    width: 50%;
+    margin: 0 auto 20px;
+    background: #fff;
+    border: 1px solid #000;
+    border-radius: 3px;
+  }
+  .owl-carousel.owl-theme .item {
+    width: 196px;
+    margin-bottom: 20px;
+    text-align: center;
+    box-sizing: border-box;
+    border: 1px solid #fff;
+  }
+  .owl-carousel.owl-theme .item .product-item-photo {
+    display: block;
+    position: relative;
+  }
+  .owl-carousel.owl-theme .owl-nav *{
+    top: 30%;
+  }
+
+}
+@media (max-width: 768px) {
+  .owl-carousel.owl-theme .owl-nav *{
+    top: 25%;
+  }
+  .owl-carousel.owl-theme .owl-nav .owl-prev{
+    padding:10px 10px 10px 0px;
+  }
+  .owl-carousel.owl-theme .owl-nav .owl-next{
+    padding:10px 0px 10px 10px;
+  }
+  .owl-carousel.owl-theme .owl-prev svg,.owl-carousel.owl-theme .owl-next svg{
+    width:16px;
+    height: 16px;
+    fill: #666666;
+  }
+}
\ No newline at end of file

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/assets/owl.theme.default.css

+/**
+ * Owl Carousel v2.2.1
+ * Copyright 2013-2017 David Deutsch
+ * Licensed under  ()
+ */
+/*
+ * 	Default theme - Owl Carousel CSS File
+ */
+.owl-theme .owl-nav {
+  margin-top: 10px;
+  text-align: center;
+  -webkit-tap-highlight-color: transparent; }
+  .owl-theme .owl-nav [class*='owl-'] {
+    color: #FFF;
+    font-size: 14px;
+    margin: 5px;
+    padding: 4px 7px;
+    background: #D6D6D6;
+    display: inline-block;
+    cursor: pointer;
+    border-radius: 3px; }
+    .owl-theme .owl-nav [class*='owl-']:hover {
+      background: #869791;
+      color: #FFF;
+      text-decoration: none; }
+  .owl-theme .owl-nav .disabled {
+    opacity: 0.5;
+    cursor: default; }
+
+.owl-theme .owl-nav.disabled + .owl-dots {
+  margin-top: 10px; }
+
+.owl-theme .owl-dots {
+  text-align: center;
+  -webkit-tap-highlight-color: transparent; }
+  .owl-theme .owl-dots .owl-dot {
+    display: inline-block;
+    zoom: 1;
+    *display: inline; }
+    .owl-theme .owl-dots .owl-dot span {
+      width: 10px;
+      height: 10px;
+      margin: 5px 7px;
+      background: #D6D6D6;
+      display: block;
+      -webkit-backface-visibility: visible;
+      transition: opacity 200ms ease;
+      border-radius: 30px; }
+    .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
+      background: #869791; }

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/assets/owl.theme.default.min.css

+/**
+ * Owl Carousel v2.2.1
+ * Copyright 2013-2017 David Deutsch
+ * Licensed under  ()
+ */
+.owl-theme .owl-dots,.owl-theme .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-nav{margin-top:10px}.owl-theme .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px}.owl-theme .owl-nav [class*=owl-]:hover{background:#869791;color:#FFF;text-decoration:none}.owl-theme .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-nav.disabled+.owl-dots{margin-top:10px}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791}
\ No newline at end of file

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/assets/owl.theme.green.css

+/**
+ * Owl Carousel v2.2.1
+ * Copyright 2013-2017 David Deutsch
+ * Licensed under  ()
+ */
+/*
+ * 	Green theme - Owl Carousel CSS File
+ */
+.owl-theme .owl-nav {
+  margin-top: 10px;
+  text-align: center;
+  -webkit-tap-highlight-color: transparent; }
+  .owl-theme .owl-nav [class*='owl-'] {
+    color: #FFF;
+    font-size: 14px;
+    margin: 5px;
+    padding: 4px 7px;
+    background: #D6D6D6;
+    display: inline-block;
+    cursor: pointer;
+    border-radius: 3px; }
+    .owl-theme .owl-nav [class*='owl-']:hover {
+      background: #4DC7A0;
+      color: #FFF;
+      text-decoration: none; }
+  .owl-theme .owl-nav .disabled {
+    opacity: 0.5;
+    cursor: default; }
+
+.owl-theme .owl-nav.disabled + .owl-dots {
+  margin-top: 10px; }
+
+.owl-theme .owl-dots {
+  text-align: center;
+  -webkit-tap-highlight-color: transparent; }
+  .owl-theme .owl-dots .owl-dot {
+    display: inline-block;
+    zoom: 1;
+    *display: inline; }
+    .owl-theme .owl-dots .owl-dot span {
+      width: 10px;
+      height: 10px;
+      margin: 5px 7px;
+      background: #D6D6D6;
+      display: block;
+      -webkit-backface-visibility: visible;
+      transition: opacity 200ms ease;
+      border-radius: 30px; }
+    .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
+      background: #4DC7A0; }

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/assets/owl.theme.green.min.css

+/**
+ * Owl Carousel v2.2.1
+ * Copyright 2013-2017 David Deutsch
+ * Licensed under  ()
+ */
+.owl-theme .owl-dots,.owl-theme .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-nav{margin-top:10px}.owl-theme .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px}.owl-theme .owl-nav [class*=owl-]:hover{background:#4DC7A0;color:#FFF;text-decoration:none}.owl-theme .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-nav.disabled+.owl-dots{margin-top:10px}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#4DC7A0}
\ No newline at end of file

app/design/frontend/Joshine/breeze/web/OwlCarousel2/dist/owl.carousel.min.js

+/**
+ * Owl Carousel v2.2.1
+ * Copyright 2013-2017 David Deutsch
+ * Licensed under  ()
+ */
+!function(a,b,c,d){function e(b,c){this.settings=null,this.options=a.extend({},e.Defaults,c),this.$element=a(b),this._handlers={},this._plugins={},this._supress={},this._current=null,this._speed=null,this._coordinates=[],this._breakpoint=null,this._width=null,this._items=[],this._clones=[],this._mergers=[],this._widths=[],this._invalidated={},this._pipe=[],this._drag={time:null,target:null,pointer:null,stage:{start:null,current:null},direction:null},this._states={current:{},tags:{initializing:["busy"],animating:["busy"],dragging:["interacting"]}},a.each(["onResize","onThrottledResize"],a.proxy(function(b,c){this._handlers[c]=a.proxy(this[c],this)},this)),a.each(e.Plugins,a.proxy(function(a,b){this._plugins[a.charAt(0).toLowerCase()+a.slice(1)]=new b(this)},this)),a.each(e.Workers,a.proxy(function(b,c){this._pipe.push({filter:c.filter,run:a.proxy(c.run,this)})},this)),this.setup(),this.initialize()}e.Defaults={items:3,loop:!1,center:!1,rewind:!1,mouseDrag:!0,touchDrag:!0,pullDrag:!0,freeDrag:!1,margin:0,stagePadding:0,merge:!1,mergeFit:!0,autoWidth:!1,startPosition:0,rtl:!1,smartSpeed:250,fluidSpeed:!1,dragEndSpeed:!1,responsive:{},responsiveRefreshRate:200,responsiveBaseElement:b,fallbackEasing:"swing",info:!1,nestedItemSelector:!1,itemElement:"div",stageElement:"div",refreshClass:"owl-refresh",loadedClass:"owl-loaded",loadingClass:"owl-loading",rtlClass:"owl-rtl",responsiveClass:"owl-responsive",dragClass:"owl-drag",itemClass:"owl-item",stageClass:"owl-stage",stageOuterClass:"owl-stage-outer",grabClass:"owl-grab"},e.Width={Default:"default",Inner:"inner",Outer:"outer"},e.Type={Event:"event",State:"state"},e.Plugins={},e.Workers=[{filter:["width","settings"],run:function(){this._width=this.$element.width()}},{filter:["width","items","settings"],run:function(a){a.current=this._items&&this._items[this.relative(this._current)]}},{filter:["items","settings"],run:function(){this.$stage.children(".cloned").remove()}},{filter:["width","items","settings"],run:function(a){var b=this.settings.margin||"",c=!this.settings.autoWidth,d=this.settings.rtl,e={width:"auto","margin-left":d?b:"","margin-right":d?"":b};!c&&this.$stage.children().css(e),a.css=e}},{filter:["width","items","settings"],run:function(a){var b=(this.width()/this.settings.items).toFixed(3)-this.settings.margin,c=null,d=this._items.length,e=!this.settings.autoWidth,f=[];for(a.items={merge:!1,width:b};d--;)c=this._mergers[d],c=this.settings.mergeFit&&Math.min(c,this.settings.items)||c,a.items.merge=c>1||a.items.merge,f[d]=e?b*c:this._items[d].width();this._widths=f}},{filter:["items","settings"],run:function(){var b=[],c=this._items,d=this.settings,e=Math.max(2*d.items,4),f=2*Math.ceil(c.length/2),g=d.loop&&c.length?d.rewind?e:Math.max(e,f):0,h="",i="";for(g/=2;g--;)b.push(this.normalize(b.length/2,!0)),h+=c[b[b.length-1]][0].outerHTML,b.push(this.normalize(c.length-1-(b.length-1)/2,!0)),i=c[b[b.length-1]][0].outerHTML+i;this._clones=b,a(h).addClass("cloned").appendTo(this.$stage),a(i).addClass("cloned").prependTo(this.$stage)}},{filter:["width","items","settings"],run:function(){for(var a=this.settings.rtl?1:-1,b=this._clones.length+this._items.length,c=-1,d=0,e=0,f=[];++c<b;)d=f[c-1]||0,e=this._widths[this.relative(c)]+this.settings.margin,f.push(d+e*a);this._coordinates=f}},{filter:["width","items","settings"],run:function(){var a=this.settings.stagePadding,b=this._coordinates,c={width:Math.ceil(Math.abs(b[b.length-1]))+2*a,"padding-left":a||"","padding-right":a||""};this.$stage.css(c)}},{filter:["width","items","settings"],run:function(a){var b=this._coordinates.length,c=!this.settings.autoWidth,d=this.$stage.children();if(c&&a.items.merge)for(;b--;)a.css.width=this._widths[this.relative(b)],d.eq(b).css(a.css);else c&&(a.css.width=a.items.width,d.css(a.css))}},{filter:["items"],run:function(){this._coordinates.length<1&&this.$stage.removeAttr("style")}},{filter:["width","items","settings"],run:function(a){a.current=a.current?this.$stage.children().index(a.current):0,a.current=Math.max(this.minimum(),Math.min(this.maximum(),a.current)),this.reset(a.current)}},{filter:["position"],run:function(){this.animate(this.coordinates(this._current))}},{filter:["width","position","items","settings"],run:function(){var a,b,c,d,e=this.settings.rtl?1:-1,f=2*this.settings.stagePadding,g=this.coordinates(this.current())+f,h=g+this.width()*e,i=[];for(c=0,d=this._coordinates.length;c<d;c++)a=this._coordinates[c-1]||0,b=Math.abs(this._coordinates[c])+f*e,(this.op(a,"<=",g)&&this.op(a,">",h)||this.op(b,"<",g)&&this.op(b,">",h))&&i.push(c);this.$stage.children(".active").removeClass("active"),this.$stage.children(":eq("+i.join("), :eq(")+")").addClass("active"),this.settings.center&&(this.$stage.children(".center").removeClass("center"),this.$stage.children().eq(this.current()).addClass("center"))}}],e.prototype.initialize=function(){if(this.enter("initializing"),this.trigger("initialize"),this.$element.toggleClass(this.settings.rtlClass,this.settings.rtl),this.settings.autoWidth&&!this.is("pre-loading")){var b,c,e;b=this.$element.find("img"),c=this.settings.nestedItemSelector?"."+this.settings.nestedItemSelector:d,e=this.$element.children(c).width(),b.length&&e<=0&&this.preloadAutoWidthImages(b)}this.$element.addClass(this.options.loadingClass),this.$stage=a("<"+this.settings.stageElement+' class="'+this.settings.stageClass+'"/>').wrap('<div class="'+this.settings.stageOuterClass+'"/>'),this.$element.append(this.$stage.parent()),this.replace(this.$element.children().not(this.$stage.parent())),this.$element.is(":visible")?this.refresh():this.invalidate("width"),this.$element.removeClass(this.options.loadingClass).addClass(this.options.loadedClass),this.registerEventHandlers(),this.leave("initializing"),this.trigger("initialized")},e.prototype.setup=function(){var b=this.viewport(),c=this.options.responsive,d=-1,e=null;c?(a.each(c,function(a){a<=b&&a>d&&(d=Number(a))}),e=a.extend({},this.options,c[d]),"function"==typeof e.stagePadding&&(e.stagePadding=e.stagePadding()),delete e.responsive,e.responsiveClass&&this.$element.attr("class",this.$element.attr("class").replace(new RegExp("("+this.options.responsiveClass+"-)\\S+\\s","g"),"$1"+d))):e=a.extend({},this.options),this.trigger("change",{property:{name:"settings",value:e}}),this._breakpoint=d,this.settings=e,this.invalidate("settings"),this.trigger("changed",{property:{name:"settings",value:this.settings}})},e.prototype.optionsLogic=function(){this.settings.autoWidth&&(this.settings.stagePadding=!1,this.settings.merge=!1)},e.prototype.prepare=function(b){var c=this.trigger("prepare",{content:b});return c.data||(c.data=a("<"+this.settings.itemElement+"/>").addClass(this.options.itemClass).append(b)),this.trigger("prepared",{content:c.data}),c.data},e.prototype.update=function(){for(var b=0,c=this._pipe.length,d=a.proxy(function(a){return this[a]},this._invalidated),e={};b<c;)(this._invalidated.all||a.grep(this._pipe[b].filter,d).length>0)&&this._pipe[b].run(e),b++;this._invalidated={},!this.is("valid")&&this.enter("valid")},e.prototype.width=function(a){switch(a=a||e.Width.Default){case e.Width.Inner:case e.Width.Outer:return this._width;default:return this._width-2*this.settings.stagePadding+this.settings.margin}},e.prototype.refresh=function(){this.enter("refreshing"),this.trigger("refresh"),this.setup(),this.optionsLogic(),this.$element.addClass(this.options.refreshClass),this.update(),this.$element.removeClass(this.options.refreshClass),this.leave("refreshing"),this.trigger("refreshed")},e.prototype.onThrottledResize=function(){b.clearTimeout(this.resizeTimer),this.resizeTimer=b.setTimeout(this._handlers.onResize,this.settings.responsiveRefreshRate)},e.prototype.onResize=function(){return!!this._items.length&&(this._width!==this.$element.width()&&(!!this.$element.is(":visible")&&(this.enter("resizing"),this.trigger("resize").isDefaultPrevented()?(this.leave("resizing"),!1):(this.invalidate("width"),this.refresh(),this.leave("resizing"),void this.trigger("resized")))))},e.prototype.registerEventHandlers=function(){a.support.transition&&this.$stage.on(a.support.transition.end+".owl.core",a.proxy(this.onTransitionEnd,this)),this.settings.responsive!==!1&&this.on(b,"resize",this._handlers.onThrottledResize),this.settings.mouseDrag&&(this.$element.addClass(this.options.dragClass),this.$stage.on("mousedown.owl.core",a.proxy(this.onDragStart,this)),this.$stage.on("dragstart.owl.core selectstart.owl.core",function(){return!1})),this.settings.touchDrag&&(this.$stage.on("touchstart.owl.core",a.proxy(this.onDragStart,this)),this.$stage.on("touchcancel.owl.core",a.proxy(this.onDragEnd,this)))},e.prototype.onDragStart=function(b){var d=null;3!==b.which&&(a.support.transform?(d=this.$stage.css("transform").replace(/.*\(|\)| /g,"").split(","),d={x:d[16===d.length?12:4],y:d[16===d.length?13:5]}):(d=this.$stage.position(),d={x:this.settings.rtl?d.left+this.$stage.width()-this.width()+this.settings.margin:d.left,y:d.top}),this.is("animating")&&(a.support.transform?this.animate(d.x):this.$stage.stop(),this.invalidate("position")),this.$element.toggleClass(this.options.grabClass,"mousedown"===b.type),this.speed(0),this._drag.time=(new Date).getTime(),this._drag.target=a(b.target),this._drag.stage.start=d,this._drag.stage.current=d,this._drag.pointer=this.pointer(b),a(c).on("mouseup.owl.core touchend.owl.core",a.proxy(this.onDragEnd,this)),a(c).one("mousemove.owl.core touchmove.owl.core",a.proxy(function(b){var d=this.difference(this._drag.pointer,this.pointer(b));a(c).on("mousemove.owl.core touchmove.owl.core",a.proxy(this.onDragMove,this)),Math.abs(d.x)<Math.abs(d.y)&&this.is("valid")||(b.preventDefault(),this.enter("dragging"),this.trigger("drag"))},this)))},e.prototype.onDragMove=function(a){var b=null,c=null,d=null,e=this.difference(this._drag.pointer,this.pointer(a)),f=this.difference(this._drag.stage.start,e);this.is("dragging")&&(a.preventDefault(),this.settings.loop?(b=this.coordinates(this.minimum()),c=this.coordinates(this.maximum()+1)-b,f.x=((f.x-b)%c+c)%c+b):(b=this.settings.rtl?this.coordinates(this.maximum()):this.coordinates(this.minimum()),c=this.settings.rtl?this.coordinates(this.minimum()):this.coordinates(this.maximum()),d=this.settings.pullDrag?-1*e.x/5:0,f.x=Math.max(Math.min(f.x,b+d),c+d)),this._drag.stage.current=f,this.animate(f.x))},e.prototype.onDragEnd=function(b){var d=this.difference(this._drag.pointer,this.pointer(b)),e=this._drag.stage.current,f=d.x>0^this.settings.rtl?"left":"right";a(c).off(".owl.core"),this.$element.removeClass(this.options.grabClass),(0!==d.x&&this.is("dragging")||!this.is("valid"))&&(this.speed(this.settings.dragEndSpeed||this.settings.smartSpeed),this.current(this.closest(e.x,0!==d.x?f:this._drag.direction)),this.invalidate("position"),this.update(),this._drag.direction=f,(Math.abs(d.x)>3||(new Date).getTime()-this._drag.time>300)&&this._drag.target.one("click.owl.core",function(){return!1})),this.is("dragging")&&(this.leave("dragging"),this.trigger("dragged"))},e.prototype.closest=function(b,c){var d=-1,e=30,f=this.width(),g=this.coordinates();return this.settings.freeDrag||a.each(g,a.proxy(function(a,h){return"left"===c&&b>h-e&&b<h+e?d=a:"right"===c&&b>h-f-e&&b<h-f+e?d=a+1:this.op(b,"<",h)&&this.op(b,">",g[a+1]||h-f)&&(d="left"===c?a+1:a),d===-1},this)),this.settings.loop||(this.op(b,">",g[this.minimum()])?d=b=this.minimum():this.op(b,"<",g[this.maximum()])&&(d=b=this.maximum())),d},e.prototype.animate=function(b){var c=this.speed()>0;this.is("animating")&&this.onTransitionEnd(),c&&(this.enter("animating"),this.trigger("translate")),a.support.transform3d&&a.support.transition?this.$stage.css({transform:"translate3d("+b+"px,0px,0px)",transition:this.speed()/1e3+"s"}):c?this.$stage.animate({left:b+"px"},this.speed(),this.settings.fallbackEasing,a.proxy(this.onTransitionEnd,this)):this.$stage.css({left:b+"px"})},e.prototype.is=function(a){return this._states.current[a]&&this._states.current[a]>0},e.prototype.current=function(a){if(a===d)return this._current;if(0===this._items.length)return d;if(a=this.normalize(a),this._current!==a){var b=this.trigger("change",{property:{name:"position",value:a}});b.data!==d&&(a=this.normalize(b.data)),this._current=a,this.invalidate("position"),this.trigger("changed",{property:{name:"position",value:this._current}})}return this._current},e.prototype.invalidate=function(b){return"string"===a.type(b)&&(this._invalidated[b]=!0,this.is("valid")&&this.leave("valid")),a.map(this._invalidated,function(a,b){return b})},e.prototype.reset=function(a){a=this.normalize(a),a!==d&&(this._speed=0,this._current=a,this.suppress(["translate","translated"]),this.animate(this.coordinates(a)),this.release(["translate","translated"]))},e.prototype.normalize=function(a,b){var c=this._items.length,e=b?0:this._clones.length;return!this.isNumeric(a)||c<1?a=d:(a<0||a>=c+e)&&(a=((a-e/2)%c+c)%c+e/2),a},e.prototype.relative=function(a){return a-=this._clones.length/2,this.normalize(a,!0)},e.prototype.maximum=function(a){var b,c,d,e=this.settings,f=this._coordinates.length;if(e.loop)f=this._clones.length/2+this._items.length-1;else if(e.autoWidth||e.merge){for(b=this._items.length,c=this._items[--b].width(),d=this.$element.width();b--&&(c+=this._items[b].width()+this.settings.margin,!(c>d)););f=b+1}else f=e.center?this._items.length-1:this._items.length-e.items;return a&&(f-=this._clones.length/2),Math.max(f,0)},e.prototype.minimum=function(a){return a?0:this._clones.length/2},e.prototype.items=function(a){return a===d?this._items.slice():(a=this.normalize(a,!0),this._items[a])},e.prototype.mergers=function(a){return a===d?this._mergers.slice():(a=this.normalize(a,!0),this._mergers[a])},e.prototype.clones=function(b){var c=this._clones.length/2,e=c+this._items.length,f=function(a){return a%2===0?e+a/2:c-(a+1)/2};return b===d?a.map(this._clones,function(a,b){return f(b)}):a.map(this._clones,function(a,c){return a===b?f(c):null})},e.prototype.speed=function(a){return a!==d&&(this._speed=a),this._speed},e.prototype.coordinates=function(b){var c,e=1,f=b-1;return b===d?a.map(this._coordinates,a.proxy(function(a,b){return this.coordinates(b)},this)):(this.settings.center?(this.settings.rtl&&(e=-1,f=b+1),c=this._coordinates[b],c+=(this.width()-c+(this._coordinates[f]||0))/2*e):c=this._coordinates[f]||0,c=Math.ceil(c))},e.prototype.duration=function(a,b,c){return 0===c?0:Math.min(Math.max(Math.abs(b-a),1),6)*Math.abs(c||this.settings.smartSpeed)},e.prototype.to=function(a,b){var c=this.current(),d=null,e=a-this.relative(c),f=(e>0)-(e<0),g=this._items.length,h=this.minimum(),i=this.maximum();this.settings.loop?(!this.settings.rewind&&Math.abs(e)>g/2&&(e+=f*-1*g),a=c+e,d=((a-h)%g+g)%g+h,d!==a&&d-e<=i&&d-e>0&&(c=d-e,a=d,this.reset(c))):this.settings.rewind?(i+=1,a=(a%i+i)%i):a=Math.max(h,Math.min(i,a)),this.speed(this.duration(c,a,b)),this.current(a),this.$element.is(":visible")&&this.update()},e.prototype.next=function(a){a=a||!1,this.to(this.relative(this.current())+1,a)},e.prototype.prev=function(a){a=a||!1,this.to(this.relative(this.current())-1,a)},e.prototype.onTransitionEnd=function(a){if(a!==d&&(a.stopPropagation(),(a.target||a.srcElement||a.originalTarget)!==this.$stage.get(0)))return!1;this.leave("animating"),this.trigger("translated")},e.prototype.viewport=function(){var d;return this.options.responsiveBaseElement!==b?d=a(this.options.responsiveBaseElement).width():b.innerWidth?d=b.innerWidth:c.documentElement&&c.documentElement.clientWidth?d=c.documentElement.clientWidth:console.warn("Can not detect viewport width."),d},e.prototype.replace=function(b){this.$stage.empty(),this._items=[],b&&(b=b instanceof jQuery?b:a(b)),this.settings.nestedItemSelector&&(b=b.find("."+this.settings.nestedItemSelector)),b.filter(function(){return 1===this.nodeType}).each(a.proxy(function(a,b){b=this.prepare(b),this.$stage.append(b),this._items.push(b),this._mergers.push(1*b.find("[data-merge]").addBack("[data-merge]").attr("data-merge")||1)},this)),this.reset(this.isNumeric(this.settings.startPosition)?this.settings.startPosition:0),this.invalidate("items")},e.prototype.add=function(b,c){var e=this.relative(this._current);c=c===d?this._items.length:this.normalize(c,!0),b=b instanceof jQuery?b:a(b),this.trigger("add",{content:b,position:c}),b=this.prepare(b),0===this._items.length||c===this._items.length?(0===this._items.length&&this.$stage.append(b),0!==this._items.length&&this._items[c-1].after(b),this._items.push(b),this._mergers.push(1*b.find("[data-merge]").addBack("[data-merge]").attr("data-merge")||1)):(this._items[c].before(b),this._items.splice(c,0,b),this._mergers.splice(c,0,1*b.find("[data-merge]").addBack("[data-merge]").attr("data-merge")||1)),this._items[e]&&this.reset(this._items[e].index()),this.invalidate("items"),this.trigger("added",{content:b,position:c})},e.prototype.remove=function(a){a=this.normalize(a,!0),a!==d&&(this.trigger("remove",{content:this._items[a],position:a}),this._items[a].remove(),this._items.splice(a,1),this._mergers.splice(a,1),this.invalidate("items"),this.trigger("removed",{content:null,position:a}))},e.prototype.preloadAutoWidthImages=function(b){b.each(a.proxy(function(b,c){this.enter("pre-loading"),c=a(c),a(new Image).one("load",a.proxy(function(a){c.attr("src",a.target.src),c.css("opacity",1),this.leave("pre-loading"),!this.is("pre-loading")&&!this.is("initializing")&&this.refresh()},this)).attr("src",c.attr("src")||c.attr("data-src")||c.attr("data-src-retina"))},this))},e.prototype.destroy=function(){this.$element.off(".owl.core"),this.$stage.off(".owl.core"),a(c).off(".owl.core"),this.settings.responsive!==!1&&(b.clearTimeout(this.resizeTimer),this.off(b,"resize",this._handlers.onThrottledResize));for(var d in this._plugins)this._plugins[d].destroy();this.$stage.children(".cloned").remove(),this.$stage.unwrap(),this.$stage.children().contents().unwrap(),this.$stage.children().unwrap(),this.$element.removeClass(this.options.refreshClass).removeClass(this.options.loadingClass).removeClass(this.options.loadedClass).removeClass(this.options.rtlClass).removeClass(this.options.dragClass).removeClass(this.options.grabClass).attr("class",this.$element.attr("class").replace(new RegExp(this.options.responsiveClass+"-\\S+\\s","g"),"")).removeData("owl.carousel")},e.prototype.op=function(a,b,c){var d=this.settings.rtl;switch(b){case"<":return d?a>c:a<c;case">":return d?a<c:a>c;case">=":return d?a<=c:a>=c;case"<=":return d?a>=c:a<=c}},e.prototype.on=function(a,b,c,d){a.addEventListener?a.addEventListener(b,c,d):a.attachEvent&&a.attachEvent("on"+b,c)},e.prototype.off=function(a,b,c,d){a.removeEventListener?a.removeEventListener(b,c,d):a.detachEvent&&a.detachEvent("on"+b,c)},e.prototype.trigger=function(b,c,d,f,g){var h={item:{count:this._items.length,index:this.current()}},i=a.camelCase(a.grep(["on",b,d],function(a){return a}).join("-").toLowerCase()),j=a.Event([b,"owl",d||"carousel"].join(".").toLowerCase(),a.extend({relatedTarget:this},h,c));return this._supress[b]||(a.each(this._plugins,function(a,b){b.onTrigger&&b.onTrigger(j)}),this.register({type:e.Type.Event,name:b}),this.$element.trigger(j),this.settings&&"function"==typeof this.settings[i]&&this.settings[i].call(this,j)),j},e.prototype.enter=function(b){a.each([b].concat(this._states.tags[b]||[]),a.proxy(function(a,b){this._states.current[b]===d&&(this._states.current[b]=0),this._states.current[b]++},this))},e.prototype.leave=function(b){a.each([b].concat(this._states.tags[b]||[]),a.proxy(function(a,b){this._states.current[b]--},this))},e.prototype.register=function(b){if(b.type===e.Type.Event){if(a.event.special[b.name]||(a.event.special[b.name]={}),!a.event.special[b.name].owl){var c=a.event.special[b.name]._default;a.event.special[b.name]._default=function(a){return!c||!c.apply||a.namespace&&a.namespace.indexOf("owl")!==-1?a.namespace&&a.namespace.indexOf("owl")>-1:c.apply(this,arguments)},a.event.special[b.name].owl=!0}}else b.type===e.Type.State&&(this._states.tags[b.name]?this._states.tags[b.name]=this._states.tags[b.name].concat(b.tags):this._states.tags[b.name]=b.tags,this._states.tags[b.name]=a.grep(this._states.tags[b.name],a.proxy(function(c,d){return a.inArray(c,this._states.tags[b.name])===d},this)))},e.prototype.suppress=function(b){a.each(b,a.proxy(function(a,b){this._supress[b]=!0},this))},e.prototype.release=function(b){a.each(b,a.proxy(function(a,b){delete this._supress[b]},this))},e.prototype.pointer=function(a){var c={x:null,y:null};return a=a.originalEvent||a||b.event,a=a.touches&&a.touches.length?a.touches[0]:a.changedTouches&&a.changedTouches.length?a.changedTouches[0]:a,a.pageX?(c.x=a.pageX,c.y=a.pageY):(c.x=a.clientX,c.y=a.clientY),c},e.prototype.isNumeric=function(a){return!isNaN(parseFloat(a))},e.prototype.difference=function(a,b){return{x:a.x-b.x,y:a.y-b.y}},a.fn.owlCarousel=function(b){var c=Array.prototype.slice.call(arguments,1);return this.each(function(){var d=a(this),f=d.data("owl.carousel");f||(f=new e(this,"object"==typeof b&&b),d.data("owl.carousel",f),a.each(["next","prev","to","destroy","refresh","replace","add","remove"],function(b,c){f.register({type:e.Type.Event,name:c}),f.$element.on(c+".owl.carousel.core",a.proxy(function(a){a.namespace&&a.relatedTarget!==this&&(this.suppress([c]),f[c].apply(this,[].slice.call(arguments,1)),this.release([c]))},f))})),"string"==typeof b&&"_"!==b.charAt(0)&&f[b].apply(f,c)})},a.fn.owlCarousel.Constructor=e}(window.Zepto||window.jQuery,window,document),function(a,b,c,d){var e=function(b){this._core=b,this._interval=null,this._visible=null,this._handlers={"initialized.owl.carousel":a.proxy(function(a){a.namespace&&this._core.settings.autoRefresh&&this.watch()},this)},this._core.options=a.extend({},e.Defaults,this._core.options),this._core.$element.on(this._handlers)};e.Defaults={autoRefresh:!0,autoRefreshInterval:500},e.prototype.watch=function(){this._interval||(this._visible=this._core.$element.is(":visible"),this._interval=b.setInterval(a.proxy(this.refresh,this),this._core.settings.autoRefreshInterval))},e.prototype.refresh=function(){this._core.$element.is(":visible")!==this._visible&&(this._visible=!this._visible,this._core.$element.toggleClass("owl-hidden",!this._visible),this._visible&&this._core.invalidate("width")&&this._core.refresh())},e.prototype.destroy=function(){var a,c;b.clearInterval(this._interval);for(a in this._handlers)this._core.$element.off(a,this._handlers[a]);for(c in Object.getOwnPropertyNames(this))"function"!=typeof this[c]&&(this[c]=null)},a.fn.owlCarousel.Constructor.Plugins.AutoRefresh=e}(window.Zepto||window.jQuery,window,document),function(a,b,c,d){var e=function(b){this._core=b,this._loaded=[],this._handlers={"initialized.owl.carousel change.owl.carousel resized.owl.carousel":a.proxy(function(b){if(b.namespace&&this._core.settings&&this._core.settings.lazyLoad&&(b.property&&"position"==b.property.name||"initialized"==b.type))for(var c=this._core.settings,e=c.center&&Math.ceil(c.items/2)||c.items,f=c.center&&e*-1||0,g=(b.property&&b.property.value!==d?b.property.value:this._core.current())+f,h=this._core.clones().length,i=a.proxy(function(a,b){this.load(b)},this);f++<e;)this.load(h/2+this._core.relative(g)),h&&a.each(this._core.clones(this._core.relative(g)),i),g++},this)},this._core.options=a.extend({},e.Defaults,this._core.options),this._core.$element.on(this._handlers)};e.Defaults={lazyLoad:!1},e.prototype.load=function(c){var d=this._core.$stage.children().eq(c),e=d&&d.find(".owl-lazy");!e||a.inArray(d.get(0),this._loaded)>-1||(e.each(a.proxy(function(c,d){var e,f=a(d),g=b.devicePixelRatio>1&&f.attr("data-src-retina")||f.attr("data-src");this._core.trigger("load",{element:f,url:g},"lazy"),f.is("img")?f.one("load.owl.lazy",a.proxy(function(){f.css("opacity",1),this._core.trigger("loaded",{element:f,url:g},"lazy")},this)).attr("src",g):(e=new Image,e.onload=a.proxy(function(){f.css({"background-image":'url("'+g+'")',opacity:"1"}),this._core.trigger("loaded",{element:f,url:g},"lazy")},this),e.src=g)},this)),this._loaded.push(d.get(0)))},e.prototype.destroy=function(){var a,b;for(a in this.handlers)this._core.$element.off(a,this.handlers[a]);for(b in Object.getOwnPropertyNames(this))"function"!=typeof this[b]&&(this[b]=null)},a.fn.owlCarousel.Constructor.Plugins.Lazy=e}(window.Zepto||window.jQuery,window,document),function(a,b,c,d){var e=function(b){this._core=b,this._handlers={"initialized.owl.carousel refreshed.owl.carousel":a.proxy(function(a){a.namespace&&this._core.settings.autoHeight&&this.update()},this),"changed.owl.carousel":a.proxy(function(a){a.namespace&&this._core.settings.autoHeight&&"position"==a.property.name&&this.update()},this),"loaded.owl.lazy":a.proxy(function(a){a.namespace&&this._core.settings.autoHeight&&a.element.closest("."+this._core.settings.itemClass).index()===this._core.current()&&this.update()},this)},this._core.options=a.extend({},e.Defaults,this._core.options),this._core.$element.on(this._handlers)};e.Defaults={autoHeight:!1,autoHeightClass:"owl-height"},e.prototype.update=function(){var b=this._core._current,c=b+this._core.settings.items,d=this._core.$stage.children().toArray().slice(b,c),e=[],f=0;a.each(d,function(b,c){e.push(a(c).height())}),f=Math.max.apply(null,e),this._core.$stage.parent().height(f).addClass(this._core.settings.autoHeightClass)},e.prototype.destroy=function(){var a,b;for(a in this._handlers)this._core.$element.off(a,this._handlers[a]);for(b in Object.getOwnPropertyNames(this))"function"!=typeof this[b]&&(this[b]=null)},a.fn.owlCarousel.Constructor.Plugins.AutoHeight=e}(window.Zepto||window.jQuery,window,document),function(a,b,c,d){var e=function(b){this._core=b,this._videos={},this._playing=null,this._handlers={"initialized.owl.carousel":a.proxy(function(a){a.namespace&&this._core.register({type:"state",name:"playing",tags:["interacting"]})},this),"resize.owl.carousel":a.proxy(function(a){a.namespace&&this._core.settings.video&&this.isInFullScreen()&&a.preventDefault()},this),"refreshed.owl.carousel":a.proxy(function(a){a.namespace&&this._core.is("resizing")&&this._core.$stage.find(".cloned .owl-video-frame").remove()},this),"changed.owl.carousel":a.proxy(function(a){a.namespace&&"position"===a.property.name&&this._playing&&this.stop()},this),"prepared.owl.carousel":a.proxy(function(b){if(b.namespace){var c=a(b.content).find(".owl-video");c.length&&(c.css("display","none"),this.fetch(c,a(b.content)))}},this)},this._core.options=a.extend({},e.Defaults,this._core.options),this._core.$element.on(this._handlers),this._core.$element.on("click.owl.video",".owl-video-play-icon",a.proxy(function(a){this.play(a)},this))};e.Defaults={video:!1,videoHeight:!1,videoWidth:!1},e.prototype.fetch=function(a,b){var c=function(){return a.attr("data-vimeo-id")?"vimeo":a.attr("data-vzaar-id")?"vzaar":"youtube"}(),d=a.attr("data-vimeo-id")||a.attr("data-youtube-id")||a.attr("data-vzaar-id"),e=a.attr("data-width")||this._core.settings.videoWidth,f=a.attr("data-height")||this._core.settings.videoHeight,g=a.attr("href");if(!g)throw new Error("Missing video URL.");if(d=g.match(/(http:|https:|)\/\/(player.|www.|app.)?(vimeo\.com|youtu(be\.com|\.be|be\.googleapis\.com)|vzaar\.com)\/(video\/|videos\/|embed\/|channels\/.+\/|groups\/.+\/|watch\?v=|v\/)?([A-Za-z0-9._%-]*)(\&\S+)?/),d[3].indexOf("youtu")>-1)c="youtube";else if(d[3].indexOf("vimeo")>-1)c="vimeo";else{if(!(d[3].indexOf("vzaar")>-1))throw new Error("Video URL not supported.");c="vzaar"}d=d[6],this._videos[g]={type:c,id:d,width:e,height:f},b.attr("data-video",g),this.thumbnail(a,this._videos[g])},e.prototype.thumbnail=function(b,c){var d,e,f,g=c.width&&c.height?'style="width:'+c.width+"px;height:"+c.height+'px;"':"",h=b.find("img"),i="src",j="",k=this._core.settings,l=function(a){e='<div class="owl-video-play-icon"></div>',d=k.lazyLoad?'<div class="owl-video-tn '+j+'" '+i+'="'+a+'"></div>':'<div class="owl-video-tn" style="opacity:1;background-image:url('+a+')"></div>',b.after(d),b.after(e)};if(b.wrap('<div class="owl-video-wrapper"'+g+"></div>"),this._core.settings.lazyLoad&&(i="data-src",j="owl-lazy"),h.length)return l(h.attr(i)),h.remove(),!1;"youtube"===c.type?(f="//img.youtube.com/vi/"+c.id+"/hqdefault.jpg",l(f)):"vimeo"===c.type?a.ajax({type:"GET",url:"//vimeo.com/api/v2/video/"+c.id+".json",jsonp:"callback",dataType:"jsonp",success:function(a){f=a[0].thumbnail_large,l(f)}}):"vzaar"===c.type&&a.ajax({type:"GET",url:"//vzaar.com/api/videos/"+c.id+".json",jsonp:"callback",dataType:"jsonp",success:function(a){f=a.framegrab_url,l(f)}})},e.prototype.stop=function(){this._core.trigger("stop",null,"video"),this._playing.find(".owl-video-frame").remove(),this._playing.removeClass("owl-video-playing"),this._playing=null,this._core.leave("playing"),this._core.trigger("stopped",null,"video")},e.prototype.play=function(b){var c,d=a(b.target),e=d.closest("."+this._core.settings.itemClass),f=this._videos[e.attr("data-video")],g=f.width||"100%",h=f.height||this._core.$stage.height();this._playing||(this._core.enter("playing"),this._core.trigger("play",null,"video"),e=this._core.items(this._core.relative(e.index())),this._core.reset(e.index()),"youtube"===f.type?c='<iframe width="'+g+'" height="'+h+'" src="//www.youtube.com/embed/'+f.id+"?autoplay=1&rel=0&v="+f.id+'" frameborder="0" allowfullscreen></iframe>':"vimeo"===f.type?c='<iframe src="//player.vimeo.com/video/'+f.id+'?autoplay=1" width="'+g+'" height="'+h+'" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>':"vzaar"===f.type&&(c='<iframe frameborder="0"height="'+h+'"width="'+g+'" allowfullscreen mozallowfullscreen webkitAllowFullScreen src="//view.vzaar.com/'+f.id+'/player?autoplay=true"></iframe>'),a('<div class="owl-video-frame">'+c+"</div>").insertAfter(e.find(".owl-video")),this._playing=e.addClass("owl-video-playing"))},e.prototype.isInFullScreen=function(){var b=c.fullscreenElement||c.mozFullScreenElement||c.webkitFullscreenElement;return b&&a(b).parent().hasClass("owl-video-frame")},e.prototype.destroy=function(){var a,b;this._core.$element.off("click.owl.video");for(a in this._handlers)this._core.$element.off(a,this._handlers[a]);for(b in Object.getOwnPropertyNames(this))"function"!=typeof this[b]&&(this[b]=null)},a.fn.owlCarousel.Constructor.Plugins.Video=e}(window.Zepto||window.jQuery,window,document),function(a,b,c,d){var e=function(b){this.core=b,this.core.options=a.extend({},e.Defaults,this.core.options),this.swapping=!0,this.previous=d,this.next=d,this.handlers={"change.owl.carousel":a.proxy(function(a){a.namespace&&"position"==a.property.name&&(this.previous=this.core.current(),this.next=a.property.value)},this),"drag.owl.carousel dragged.owl.carousel translated.owl.carousel":a.proxy(function(a){a.namespace&&(this.swapping="translated"==a.type)},this),"translate.owl.carousel":a.proxy(function(a){a.namespace&&this.swapping&&(this.core.options.animateOut||this.core.options.animateIn)&&this.swap()},this)},this.core.$element.on(this.handlers)};e.Defaults={animateOut:!1,animateIn:!1},e.prototype.swap=function(){if(1===this.core.settings.items&&a.support.animation&&a.support.transition){this.core.speed(0);var b,c=a.proxy(this.clear,this),d=this.core.$stage.children().eq(this.previous),e=this.core.$stage.children().eq(this.next),f=this.core.settings.animateIn,g=this.core.settings.animateOut;this.core.current()!==this.previous&&(g&&(b=this.core.coordinates(this.previous)-this.core.coordinates(this.next),d.one(a.support.animation.end,c).css({left:b+"px"}).addClass("animated owl-animated-out").addClass(g)),f&&e.one(a.support.animation.end,c).addClass("animated owl-animated-in").addClass(f))}},e.prototype.clear=function(b){a(b.target).css({left:""}).removeClass("animated owl-animated-out owl-animated-in").removeClass(this.core.settings.animateIn).removeClass(this.core.settings.animateOut),this.core.onTransitionEnd()},e.prototype.destroy=function(){var a,b;for(a in this.handlers)this.core.$element.off(a,this.handlers[a]);for(b in Object.getOwnPropertyNames(this))"function"!=typeof this[b]&&(this[b]=null)},
+a.fn.owlCarousel.Constructor.Plugins.Animate=e}(window.Zepto||window.jQuery,window,document),function(a,b,c,d){var e=function(b){this._core=b,this._timeout=null,this._paused=!1,this._handlers={"changed.owl.carousel":a.proxy(function(a){a.namespace&&"settings"===a.property.name?this._core.settings.autoplay?this.play():this.stop():a.namespace&&"position"===a.property.name&&this._core.settings.autoplay&&this._setAutoPlayInterval()},this),"initialized.owl.carousel":a.proxy(function(a){a.namespace&&this._core.settings.autoplay&&this.play()},this),"play.owl.autoplay":a.proxy(function(a,b,c){a.namespace&&this.play(b,c)},this),"stop.owl.autoplay":a.proxy(function(a){a.namespace&&this.stop()},this),"mouseover.owl.autoplay":a.proxy(function(){this._core.settings.autoplayHoverPause&&this._core.is("rotating")&&this.pause()},this),"mouseleave.owl.autoplay":a.proxy(function(){this._core.settings.autoplayHoverPause&&this._core.is("rotating")&&this.play()},this),"touchstart.owl.core":a.proxy(function(){this._core.settings.autoplayHoverPause&&this._core.is("rotating")&&this.pause()},this),"touchend.owl.core":a.proxy(function(){this._core.settings.autoplayHoverPause&&this.play()},this)},this._core.$element.on(this._handlers),this._core.options=a.extend({},e.Defaults,this._core.options)};e.Defaults={autoplay:!1,autoplayTimeout:5e3,autoplayHoverPause:!1,autoplaySpeed:!1},e.prototype.play=function(a,b){this._paused=!1,this._core.is("rotating")||(this._core.enter("rotating"),this._setAutoPlayInterval())},e.prototype._getNextTimeout=function(d,e){return this._timeout&&b.clearTimeout(this._timeout),b.setTimeout(a.proxy(function(){this._paused||this._core.is("busy")||this._core.is("interacting")||c.hidden||this._core.next(e||this._core.settings.autoplaySpeed)},this),d||this._core.settings.autoplayTimeout)},e.prototype._setAutoPlayInterval=function(){this._timeout=this._getNextTimeout()},e.prototype.stop=function(){this._core.is("rotating")&&(b.clearTimeout(this._timeout),this._core.leave("rotating"))},e.prototype.pause=function(){this._core.is("rotating")&&(this._paused=!0)},e.prototype.destroy=function(){var a,b;this.stop();for(a in this._handlers)this._core.$element.off(a,this._handlers[a]);for(b in Object.getOwnPropertyNames(this))"function"!=typeof this[b]&&(this[b]=null)},a.fn.owlCarousel.Constructor.Plugins.autoplay=e}(window.Zepto||window.jQuery,window,document),function(a,b,c,d){"use strict";var e=function(b){this._core=b,this._initialized=!1,this._pages=[],this._controls={},this._templates=[],this.$element=this._core.$element,this._overrides={next:this._core.next,prev:this._core.prev,to:this._core.to},this._handlers={"prepared.owl.carousel":a.proxy(function(b){b.namespace&&this._core.settings.dotsData&&this._templates.push('<div class="'+this._core.settings.dotClass+'">'+a(b.content).find("[data-dot]").addBack("[data-dot]").attr("data-dot")+"</div>")},this),"added.owl.carousel":a.proxy(function(a){a.namespace&&this._core.settings.dotsData&&this._templates.splice(a.position,0,this._templates.pop())},this),"remove.owl.carousel":a.proxy(function(a){a.namespace&&this._core.settings.dotsData&&this._templates.splice(a.position,1)},this),"changed.owl.carousel":a.proxy(function(a){a.namespace&&"position"==a.property.name&&this.draw()},this),"initialized.owl.carousel":a.proxy(function(a){a.namespace&&!this._initialized&&(this._core.trigger("initialize",null,"navigation"),this.initialize(),this.update(),this.draw(),this._initialized=!0,this._core.trigger("initialized",null,"navigation"))},this),"refreshed.owl.carousel":a.proxy(function(a){a.namespace&&this._initialized&&(this._core.trigger("refresh",null,"navigation"),this.update(),this.draw(),this._core.trigger("refreshed",null,"navigation"))},this)},this._core.options=a.extend({},e.Defaults,this._core.options),this.$element.on(this._handlers)};e.Defaults={nav:!1,navText:["prev","next"],navSpeed:!1,navElement:"div",navContainer:!1,navContainerClass:"owl-nav",navClass:["owl-prev","owl-next"],slideBy:1,dotClass:"owl-dot",dotsClass:"owl-dots",dots:!0,dotsEach:!1,dotsData:!1,dotsSpeed:!1,dotsContainer:!1},e.prototype.initialize=function(){var b,c=this._core.settings;this._controls.$relative=(c.navContainer?a(c.navContainer):a("<div>").addClass(c.navContainerClass).appendTo(this.$element)).addClass("disabled"),this._controls.$previous=a("<"+c.navElement+">").addClass(c.navClass[0]).html(c.navText[0]).prependTo(this._controls.$relative).on("click",a.proxy(function(a){this.prev(c.navSpeed)},this)),this._controls.$next=a("<"+c.navElement+">").addClass(c.navClass[1]).html(c.navText[1]).appendTo(this._controls.$relative).on("click",a.proxy(function(a){this.next(c.navSpeed)},this)),c.dotsData||(this._templates=[a("<div>").addClass(c.dotClass).append(a("<span>")).prop("outerHTML")]),this._controls.$absolute=(c.dotsContainer?a(c.dotsContainer):a("<div>").addClass(c.dotsClass).appendTo(this.$element)).addClass("disabled"),this._controls.$absolute.on("click","div",a.proxy(function(b){var d=a(b.target).parent().is(this._controls.$absolute)?a(b.target).index():a(b.target).parent().index();b.preventDefault(),this.to(d,c.dotsSpeed)},this));for(b in this._overrides)this._core[b]=a.proxy(this[b],this)},e.prototype.destroy=function(){var a,b,c,d;for(a in this._handlers)this.$element.off(a,this._handlers[a]);for(b in this._controls)this._controls[b].remove();for(d in this.overides)this._core[d]=this._overrides[d];for(c in Object.getOwnPropertyNames(this))"function"!=typeof this[c]&&(this[c]=null)},e.prototype.update=function(){var a,b,c,d=this._core.clones().length/2,e=d+this._core.items().length,f=this._core.maximum(!0),g=this._core.settings,h=g.center||g.autoWidth||g.dotsData?1:g.dotsEach||g.items;if("page"!==g.slideBy&&(g.slideBy=Math.min(g.slideBy,g.items)),g.dots||"page"==g.slideBy)for(this._pages=[],a=d,b=0,c=0;a<e;a++){if(b>=h||0===b){if(this._pages.push({start:Math.min(f,a-d),end:a-d+h-1}),Math.min(f,a-d)===f)break;b=0,++c}b+=this._core.mergers(this._core.relative(a))}},e.prototype.draw=function(){var b,c=this._core.settings,d=this._core.items().length<=c.items,e=this._core.relative(this._core.current()),f=c.loop||c.rewind;this._controls.$relative.toggleClass("disabled",!c.nav||d),c.nav&&(this._controls.$previous.toggleClass("disabled",!f&&e<=this._core.minimum(!0)),this._controls.$next.toggleClass("disabled",!f&&e>=this._core.maximum(!0))),this._controls.$absolute.toggleClass("disabled",!c.dots||d),c.dots&&(b=this._pages.length-this._controls.$absolute.children().length,c.dotsData&&0!==b?this._controls.$absolute.html(this._templates.join("")):b>0?this._controls.$absolute.append(new Array(b+1).join(this._templates[0])):b<0&&this._controls.$absolute.children().slice(b).remove(),this._controls.$absolute.find(".active").removeClass("active"),this._controls.$absolute.children().eq(a.inArray(this.current(),this._pages)).addClass("active"))},e.prototype.onTrigger=function(b){var c=this._core.settings;b.page={index:a.inArray(this.current(),this._pages),count:this._pages.length,size:c&&(c.center||c.autoWidth||c.dotsData?1:c.dotsEach||c.items)}},e.prototype.current=function(){var b=this._core.relative(this._core.current());return a.grep(this._pages,a.proxy(function(a,c){return a.start<=b&&a.end>=b},this)).pop()},e.prototype.getPosition=function(b){var c,d,e=this._core.settings;return"page"==e.slideBy?(c=a.inArray(this.current(),this._pages),d=this._pages.length,b?++c:--c,c=this._pages[(c%d+d)%d].start):(c=this._core.relative(this._core.current()),d=this._core.items().length,b?c+=e.slideBy:c-=e.slideBy),c},e.prototype.next=function(b){a.proxy(this._overrides.to,this._core)(this.getPosition(!0),b)},e.prototype.prev=function(b){a.proxy(this._overrides.to,this._core)(this.getPosition(!1),b)},e.prototype.to=function(b,c,d){var e;!d&&this._pages.length?(e=this._pages.length,a.proxy(this._overrides.to,this._core)(this._pages[(b%e+e)%e].start,c)):a.proxy(this._overrides.to,this._core)(b,c)},a.fn.owlCarousel.Constructor.Plugins.Navigation=e}(window.Zepto||window.jQuery,window,document),function(a,b,c,d){"use strict";var e=function(c){this._core=c,this._hashes={},this.$element=this._core.$element,this._handlers={"initialized.owl.carousel":a.proxy(function(c){c.namespace&&"URLHash"===this._core.settings.startPosition&&a(b).trigger("hashchange.owl.navigation")},this),"prepared.owl.carousel":a.proxy(function(b){if(b.namespace){var c=a(b.content).find("[data-hash]").addBack("[data-hash]").attr("data-hash");if(!c)return;this._hashes[c]=b.content}},this),"changed.owl.carousel":a.proxy(function(c){if(c.namespace&&"position"===c.property.name){var d=this._core.items(this._core.relative(this._core.current())),e=a.map(this._hashes,function(a,b){return a===d?b:null}).join();if(!e||b.location.hash.slice(1)===e)return;b.location.hash=e}},this)},this._core.options=a.extend({},e.Defaults,this._core.options),this.$element.on(this._handlers),a(b).on("hashchange.owl.navigation",a.proxy(function(a){var c=b.location.hash.substring(1),e=this._core.$stage.children(),f=this._hashes[c]&&e.index(this._hashes[c]);f!==d&&f!==this._core.current()&&this._core.to(this._core.relative(f),!1,!0)},this))};e.Defaults={URLhashListener:!1},e.prototype.destroy=function(){var c,d;a(b).off("hashchange.owl.navigation");for(c in this._handlers)this._core.$element.off(c,this._handlers[c]);for(d in Object.getOwnPropertyNames(this))"function"!=typeof this[d]&&(this[d]=null)},a.fn.owlCarousel.Constructor.Plugins.Hash=e}(window.Zepto||window.jQuery,window,document),function(a,b,c,d){function e(b,c){var e=!1,f=b.charAt(0).toUpperCase()+b.slice(1);return a.each((b+" "+h.join(f+" ")+f).split(" "),function(a,b){if(g[b]!==d)return e=!c||b,!1}),e}function f(a){return e(a,!0)}var g=a("<support>").get(0).style,h="Webkit Moz O ms".split(" "),i={transition:{end:{WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd",transition:"transitionend"}},animation:{end:{WebkitAnimation:"webkitAnimationEnd",MozAnimation:"animationend",OAnimation:"oAnimationEnd",animation:"animationend"}}},j={csstransforms:function(){return!!e("transform")},csstransforms3d:function(){return!!e("perspective")},csstransitions:function(){return!!e("transition")},cssanimations:function(){return!!e("animation")}};j.csstransitions()&&(a.support.transition=new String(f("transition")),a.support.transition.end=i.transition.end[a.support.transition]),j.cssanimations()&&(a.support.animation=new String(f("animation")),a.support.animation.end=i.animation.end[a.support.animation]),j.csstransforms()&&(a.support.transform=new String(f("transform")),a.support.transform3d=j.csstransforms3d())}(window.Zepto||window.jQuery,window,document);
\ No newline at end of file

app/design/frontend/Joshine/breeze/web/css/_joshine_utils.less

+/*正常大小*/
+.joshine-rating-container {
+  overflow: hidden;
+  margin: 0 0 10px;
+  width: 160px;
+  height: 27px;
+  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMjciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgzM3YyN0gweiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTcuMzA1IDEwLjMxM0wxNCAwbC0zLjMwNSAxMC4zMTNIMGw4LjY1MiA2LjM3NEw1LjM0OCAyNyAxNCAyMC42MjYgMjIuNjUyIDI3bC0zLjMwNS0xMC4zMTNMMjggMTAuMzEzSDE3LjMwNXptNC42NTQgMS45OWgtNi4wOEwxNCA2LjQ0bC0xLjg3OSA1Ljg2M2gtNi4wOGw0LjkxOSAzLjYyNC0xLjg4IDUuODYzTDE0IDE4LjE2Nmw0LjkyIDMuNjI0LTEuODgtNS44NjMgNC45Mi0zLjYyNHoiIGZpbGw9IiNCMUFFQUUiLz48L3N2Zz4=);
+}
+.joshine-rating-container .joshine-rating-starts {
+  height: 100%;
+  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzMiIGhlaWdodD0iMjciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgzM3YyN0gweiIvPjxwYXRoIGQ9Ik0xNCAwbDMuMzA1IDEwLjMxM0gyOGwtOC42NTIgNi4zNzRMMjIuNjUyIDI3IDE0IDIwLjYyNiA1LjM0OCAyN2wzLjMwNC0xMC4zMTNMMCAxMC4zMTNoMTAuNjk1TDE0IDB6IiBmaWxsPSIjRUQ5RDAwIi8+PC9zdmc+);
+}
+
+/*小号评分容器*/
+.joshine-rating-container.joshine-rating-small {
+  width: 107px;
+  height: 18px;
+  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgyMnYxOEgweiIvPjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTEuNzQzIDYuODc1TDkuNSAwIDcuMjU3IDYuODc1SDBsNS44NzEgNC4yNUwzLjYzIDE4IDkuNSAxMy43NSAxNS4zNzEgMThsLTIuMjQyLTYuODc1TDE5IDYuODc1aC03LjI1N3pNMTQuOSA4LjIwMmgtNC4xMjZMOS41IDQuMjkzbC0xLjI3NSAzLjkxSDQuMDk5bDMuMzM4IDIuNDE1LTEuMjc1IDMuOTA5TDkuNSAxMi4xMWwzLjMzOCAyLjQxNi0xLjI3NS0zLjkxIDMuMzM4LTIuNDE1eiIgZmlsbD0iI0IxQUVBRSIvPjwvc3ZnPg==);
+}
+/*小号评分图标*/
+.joshine-rating-container.joshine-rating-small .joshine-rating-starts {
+  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjIiIGhlaWdodD0iMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgyMnYxOEgweiIvPjxwYXRoIGQ9Ik05LjUgMGwyLjI0MyA2Ljg3NUgxOWwtNS44NzEgNC4yNUwxNS4zNyAxOCA5LjUgMTMuNzUgMy42MjkgMThsMi4yNDItNi44NzVMMCA2Ljg3NWg3LjI1N0w5LjUgMHoiIGZpbGw9IiNFRDlEMDAiLz48L3N2Zz4=);
+}
+
+/*点赞图标*/
+.joshine-like {
+  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgyMHYxOEgweiIvPjxwYXRoIGQ9Ik0zLjg5NiA3LjI4NkguNTU2QS41NTQuNTU0IDAgMCAwIDAgNy44NDh2OC45ODVjMCAuMzE0LjI0NS41NjEuNTU3LjU2MWgzLjM0YS41NTMuNTUzIDAgMCAwIC41NTYtLjU2MVY3Ljg0OGEuNTUzLjU1MyAwIDAgMC0uNTU3LS41NjJ6TTIwIDguMzVjMC0uOTE1LS42MjMtMS44NC0xLjgxMy0xLjg0aC01LjM5MmMuNzctMS4zOTEuOTk3LTMuMzQ3LjQ2Mi00Ljc3OEMxMi44NjMuNjggMTIuMTEuMDY2IDExLjEzOS4wMDRsLS4wMTYtLjAwMkExLjE3IDEuMTcgMCAwIDAgOS44ODkgMS4wOEM5Ljc1MSAyLjUgOS4xMzQgNS4wMSA4LjI1MSA1LjljLS43NDQuNzUtMS4zOCAxLjA2NS0yLjQzNiAxLjU4Ni0uMTUyLjA3NS0uMzIuMTU3LS40OTYuMjQ2YTEuNCAxLjQgMCAwIDEgLjAwNS4xMTd2OC44OTNsLjM3Ny4xM0M3LjQ0MyAxNy40NzggOC45NDggMTggMTEuMjQ4IDE4aDQuMzZjMS4xOSAwIDEuODEyLS45MjYgMS44MTItMS44NDFhMiAyIDAgMCAwLS4xNjMtLjc5MyAxLjcxOCAxLjcxOCAwIDAgMCAxLS41NTljLjI5Mi0uMzM0LjQ1My0uNzc5LjQ1My0xLjI1MSAwLS4yNy0uMDU1LS41NDMtLjE2My0uNzkyLjk1Ni0uMTY2IDEuNDUzLS45OTMgMS40NTMtMS44MSAwLS40NzUtLjE2OC0uOTUzLS40OTQtMS4zMDIuMzI2LS4zNS40OTQtLjgyNy40OTQtMS4zMDJ6IiBmaWxsPSIjQzRDNEM0Ii8+PC9zdmc+);
+  margin: 0 0 0 10px;
+  width: 20px;
+  height: 18px;
+  display: inline-block;
+  cursor: pointer;
+  transition: .3s;
+}
+.joshine-like.active {
+  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgyMHYxOEgweiIvPjxwYXRoIGQ9Ik0zLjg5NiA3LjI4NkguNTU2QS41NTQuNTU0IDAgMCAwIDAgNy44NDh2OC45ODVjMCAuMzE0LjI0NS41NjEuNTU3LjU2MWgzLjM0YS41NTMuNTUzIDAgMCAwIC41NTYtLjU2MVY3Ljg0OGEuNTUzLjU1MyAwIDAgMC0uNTU3LS41NjJ6TTIwIDguMzVjMC0uOTE1LS42MjMtMS44NC0xLjgxMy0xLjg0aC01LjM5MmMuNzctMS4zOTEuOTk3LTMuMzQ3LjQ2Mi00Ljc3OEMxMi44NjMuNjggMTIuMTEuMDY2IDExLjEzOS4wMDRsLS4wMTYtLjAwMkExLjE3IDEuMTcgMCAwIDAgOS44ODkgMS4wOEM5Ljc1MSAyLjUgOS4xMzQgNS4wMSA4LjI1MSA1LjljLS43NDQuNzUtMS4zOCAxLjA2NS0yLjQzNiAxLjU4Ni0uMTUyLjA3NS0uMzIuMTU3LS40OTYuMjQ2YTEuNCAxLjQgMCAwIDEgLjAwNS4xMTd2OC44OTNsLjM3Ny4xM0M3LjQ0MyAxNy40NzggOC45NDggMTggMTEuMjQ4IDE4aDQuMzZjMS4xOSAwIDEuODEyLS45MjYgMS44MTItMS44NDFhMiAyIDAgMCAwLS4xNjMtLjc5MyAxLjcxOCAxLjcxOCAwIDAgMCAxLS41NTljLjI5Mi0uMzM0LjQ1My0uNzc5LjQ1My0xLjI1MSAwLS4yNy0uMDU1LS41NDMtLjE2My0uNzkyLjk1Ni0uMTY2IDEuNDUzLS45OTMgMS40NTMtMS44MSAwLS40NzUtLjE2OC0uOTUzLS40OTQtMS4zMDIuMzI2LS4zNS40OTQtLjgyNy40OTQtMS4zMDJ6IiBmaWxsPSIjMUFCOTAwIi8+PC9zdmc+);
+}
+.joshine-diss {
+  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMThoMjBWMEgweiIvPjxwYXRoIGQ9Ik0zLjg5NiAxMC43MTRILjU1NkEuNTU0LjU1NCAwIDAgMSAwIDEwLjE1MlYxLjE2N0MwIC44NTMuMjQ1LjYwNi41NTcuNjA2aDMuMzRjLjMxMSAwIC41NTYuMjQ3LjU1Ni41NjF2OC45ODVhLjU1My41NTMgMCAwIDEtLjU1Ny41NjJ6TTIwIDkuNjVjMCAuOTE1LS42MjMgMS44NC0xLjgxMyAxLjg0aC01LjM5MmMuNzcgMS4zOTEuOTk3IDMuMzQ3LjQ2MiA0Ljc3Ny0uMzk0IDEuMDUzLTEuMTQ2IDEuNjY3LTIuMTE4IDEuNzNoLS4wMTZhMS4xNyAxLjE3IDAgMCAxLTEuMjM0LTEuMDc2Yy0uMTM4LTEuNDItLjc1NS0zLjkzLTEuNjM4LTQuODItLjc0NC0uNzUtMS4zOC0xLjA2NS0yLjQzNi0xLjU4Ni0uMTUyLS4wNzUtLjMyLS4xNTctLjQ5Ni0uMjQ2YTEuNCAxLjQgMCAwIDAgLjAwNS0uMTE3VjEuMjZsLjM3Ny0uMTNDNy40NDMuNTIyIDguOTQ4IDAgMTEuMjQ4IDBoNC4zNmMxLjE5IDAgMS44MTIuOTI2IDEuODEyIDEuODQxYTIgMiAwIDAgMS0uMTYzLjc5M2MuMzk3LjA3Mi43NDMuMjY0IDEgLjU1OS4yOTIuMzM0LjQ1My43NzkuNDUzIDEuMjUxIDAgLjI3LS4wNTUuNTQzLS4xNjMuNzkyLjk1Ni4xNjYgMS40NTMuOTkzIDEuNDUzIDEuODEgMCAuNDc1LS4xNjguOTUyLS40OTQgMS4zMDIuMzI2LjM1LjQ5NC44MjcuNDk0IDEuMzAyeiIgZmlsbD0iI0M0QzRDNCIvPjwvc3ZnPg==);
+}
+.joshine-diss.active {
+  background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMTgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMThoMjBWMEgweiIvPjxwYXRoIGQ9Ik0zLjg5NiAxMC43MTRILjU1NkEuNTU0LjU1NCAwIDAgMSAwIDEwLjE1MlYxLjE2N0MwIC44NTMuMjQ1LjYwNi41NTcuNjA2aDMuMzRjLjMxMSAwIC41NTYuMjQ3LjU1Ni41NjF2OC45ODVhLjU1My41NTMgMCAwIDEtLjU1Ny41NjJ6TTIwIDkuNjVjMCAuOTE1LS42MjMgMS44NC0xLjgxMyAxLjg0aC01LjM5MmMuNzcgMS4zOTEuOTk3IDMuMzQ3LjQ2MiA0Ljc3Ny0uMzk0IDEuMDUzLTEuMTQ2IDEuNjY3LTIuMTE4IDEuNzNoLS4wMTZhMS4xNyAxLjE3IDAgMCAxLTEuMjM0LTEuMDc2Yy0uMTM4LTEuNDItLjc1NS0zLjkzLTEuNjM4LTQuODItLjc0NC0uNzUtMS4zOC0xLjA2NS0yLjQzNi0xLjU4Ni0uMTUyLS4wNzUtLjMyLS4xNTctLjQ5Ni0uMjQ2YTEuNCAxLjQgMCAwIDAgLjAwNS0uMTE3VjEuMjZsLjM3Ny0uMTNDNy40NDMuNTIyIDguOTQ4IDAgMTEuMjQ4IDBoNC4zNmMxLjE5IDAgMS44MTIuOTI2IDEuODEyIDEuODQxYTIgMiAwIDAgMS0uMTYzLjc5M2MuMzk3LjA3Mi43NDMuMjY0IDEgLjU1OS4yOTIuMzM0LjQ1My43NzkuNDUzIDEuMjUxIDAgLjI3LS4wNTUuNTQzLS4xNjMuNzkyLjk1Ni4xNjYgMS40NTMuOTkzIDEuNDUzIDEuODEgMCAuNDc1LS4xNjguOTUyLS40OTQgMS4zMDIuMzI2LjM1LjQ5NC44MjcuNDk0IDEuMzAyeiIgZmlsbD0iI0QyMzczNyIvPjwvc3ZnPg==);
+}
+
+/**进度条*/
+.joshine-process {
+  width: 80px;
+  height: 6px;
+  background: #dfdfdf;
+  vertical-align: middle;
+  display: inline-block;
+  line-height: 14px;
+}
+.joshine-process .joshine-process-active {
+  height: 100%;
+  margin: 0;
+  background: #ed9d00;
+}
+
+/*背景色组*/
+.joshine-bg-default {
+  background-color: #f7f8fa !important;
+}
+.joshine-bg-darkgray {
+  background-color: #767676 !important;
+}
+.joshine-bg-gray {
+  background-color: #999 !important;
+}
+.joshine-bg-silver {
+  background-color: #f7f8fa;
+}
+.joshine-bg-img-default {
+  cursor: pointer;
+  background-image: url(../images/placeholders_small.jpg);
+  background-size: cover;
+  background-repeat: no-repeat;
+  background-position: center center;
+}
+
+/*玄铁灰*/
+.joshine-font-c-darkgray {
+  color: #767676 !important;
+}
+/*沉稳灰*/
+.joshine-font-c-gray {
+  color: #999 !important;
+}
+/*神秘银*/
+.joshine-font-c-silver {
+  color: #f7f8fa;
+}
+/*深邃黑*/
+.joshine-font-c-deepin {
+  color: #222222 !important;
+}
+
+/*字重组*/
+.joshine-font-w-bolder{
+  font-weight: bolder;
+}
+
+/*字号组*/
+.joshine-font-size-default {
+  font-size: 16px;
+}
+.joshine-font-mini {
+  font-size: 12px;
+}
+.joshine-font-mini-plus {
+  font-size:13px;
+}
+.joshine-font-text {
+  font-size:14px;
+}
+
+.joshine-foot-mark {
+  font-size: 13px;
+  line-height: 13px;
+  color: #999;
+}
+
+/*按钮*/
+.joshine-btn {
+  display: inline-block;
+  padding: 6px 12px;
+  margin-bottom: 0;
+  font-size: 14px;
+  font-weight: normal;
+  line-height: 1.42857143;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: middle;
+  -ms-touch-action: manipulation;
+  touch-action: manipulation;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  background-image: none;
+  border: 1px solid transparent;
+}
+.joshine-btn:focus,
+.joshine-btn:active:focus,
+.joshine-btn.active:focus,
+.joshine-btn.focus,
+.joshine-btn:active.focus,
+.joshine-btn.active.focus {
+  outline: 5px auto -webkit-focus-ring-color;
+  outline-offset: -2px;
+}
+
+.joshine-btn:active,
+.joshine-btn.active {
+  background-image: none;
+  outline: 0;
+  -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+  box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125);
+}
+.joshine-btn.disabled,
+.joshine-btn[disabled],
+fieldset[disabled] .joshine-btn {
+  cursor: not-allowed;
+  filter: alpha(opacity=65);
+  -webkit-box-shadow: none;
+  box-shadow: none;
+  opacity: .65;
+}
+a.joshine-btn.disabled,
+fieldset[disabled] a.joshine-btn {
+  pointer-events: none;
+}
+.joshine-btn-dark {
+  color: #fff;
+  background-color: #000;
+  border-color: #000;
+}
+
+.joshine-inline-block {
+  display: inline-block;
+}
+
+.joshine-pagination {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 24px;
+  height: 24px;
+  user-select: none;
+  color: #222;
+  font-size: 14px;
+}
+.joshine-pagination .joshine-pagination-btn {
+  margin-left: 12px;
+  padding:  0 4px;
+  border-radius: 12px;
+  text-align: center;
+  color: #222;
+  font-weight: 700;
+  min-width: 24px;
+  height: 24px;
+  line-height: normal;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.joshine-pagination .joshine-pagination-btn.active {
+  color: #fff;
+  background: #222;
+}
+
+.joshine-pagination-hover:not(.active) {
+  cursor: pointer;
+}
+
+.joshine-pagination-hover:not(.active):hover {
+  background: #e0e0e0;
+}
+.joshine-pagination .joshine-pagination-next {
+  margin-left: 12px;
+}
+.joshine-pagination .joshine-pagination-btn.pagination-btn-disabled {
+  cursor: not-allowed;
+  color: #c2c2c2;
+}
+
+.joshine-pagination-right {
+  justify-content: flex-end;
+}
+.joshine-pagination-left {
+  justify-content: flex-start;
+}
+
+
+
+

vendor/magento/module-aws-s3-page-builder/Test/Mftf/Suite/RemoteStorageAwsS3EnabledPageBuilderSuite.xml

+<?xml version="1.0" encoding="UTF-8"?>
+<!--
+ /**
+  * Copyright © Magento, Inc. All rights reserved.
+  * See COPYING.txt for license details.
+  */
+-->
+<suites xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:mftf:Suite/etc/suiteSchema.xsd">
+    <suite name="RemoteStorageAwsS3EnabledPageBuilderSuite">
+        <before>
+            <magentoCLI command="setup:config:set {{RemoteStorageAwsS3ConfigData.enable_options}}" stepKey="enableRemoteStorage"/>
+            <magentoCLI command="config:set cms/pagebuilder/enabled 1" stepKey="enablePageBuilder"/>
+            <magentoCLI command="config:set cms/wysiwyg/enabled enabled" stepKey="enableWYSIWYG"/>
+            <actionGroup ref="CliEnableTinyMCEActionGroup" stepKey="enableTinyMCE" >
+                <argument name="TinyMCEValue" value="{{EnableTinyMCE.value}}"/>
+            </actionGroup>
+            <magentoCLI command="config:set cms/pagebuilder/google_maps_api_key ''" stepKey="setEmptyGoogleMapsAPIKey"/>
+            <magentoCLI command="config:set web/default_layouts/default_cms_layout cms-full-width" stepKey="setPageBuilderDefaultCmsLayout"/>
+            <magentoCLI command="config:set web/default_layouts/default_category_layout category-full-width" stepKey="setPageBuilderDefaultCategoryLayout"/>
+            <magentoCLI command="config:set web/default_layouts/default_product_layout product-full-width" stepKey="setPageBuilderDefaultProductLayout"/>
+            <magentoCLI command="cache:clean config" stepKey="flushCache"/>
+        </before>
+        <after>
+            <magentoCLI command="setup:config:set {{RemoteStorageAwsS3ConfigData.disable_options}}" stepKey="disableRemoteStorage"/>
+            <magentoCLI command="config:set cms/pagebuilder/enabled 1" stepKey="enablePageBuilder"/>
+            <actionGroup ref="CliEnableTinyMCEActionGroup" stepKey="enableTinyMCE" >
+                <argument name="TinyMCEValue" value="{{EnableTinyMCE.value}}"/>
+            </actionGroup>
+            <magentoCLI command="config:set cms/wysiwyg/enabled disabled" stepKey="disableWYSIWYG"/>
+            <magentoCLI command="config:set cms/pagebuilder/google_maps_api_key ''" stepKey="setEmptyGoogleMapsAPIKey"/>
+            <magentoCLI command="cache:clean config" stepKey="flushCache"/>
+        </after>
+        <include>
+            <group name="remote_storage_aws_s3_pagebuilder"/>
+        </include>
+    </suite>
+</suites>