Angular 1.5x Product Detail Page

product-detail.component.js

'use strict';

(function () {
    'use strict';

    angular.module('productDetail').component('productDetail', {
        templateUrl: 'views/app/product-detail/product-detail.template.html',
        bindings: {
            item: '='
        },
        controller: ProductDetailController
    });
    ProductDetailController.$inject = ['$routeParams', 'Product', '$window', 'ngMeta'];

    function ProductDetailController($routeParams, Product, $window, ngMeta) {
        var ww = $window.innerWidth;
        var ctrl = this;

        this.$onInit = function () {
            ctrl.item = this.item;
            // /Seo
            ngMeta.setTitle(this.product.title);
            ngMeta.setTag('image', this.product.image);
            ngMeta.setTag('description', this.product.body.substring(0, 255));
        };

        ctrl.showArrows = false;
        ctrl.index = 0;
        //var imageWith = ww < 414 ? 350 : null;
        var imageWith = null;

        ctrl.product = this.item.product;
        ctrl.relatedProducts = this.item.related_products;
        ctrl.showTabs = ww >= 767;
        ctrl.type = 'product';
        ctrl.images = [];

        ctrl.prevPage = this.item.previous[0];
        ctrl.nextPage = this.item.next[0];

        if (ctrl.product.images.length) {
            ctrl.mainImage = setFirstImage();
        }

        ctrl.selectMain = function () {
            ctrl.mainImage = ctrl.images[ctrl.index].image;
        };
        ctrl.setImage = function setImage(img) {
            ctrl.index = FindIndex(img);
            ctrl.mainImage = img.image;
        };
        ctrl.setClass = function (imgUrl) {
            return imgUrl == ctrl.mainImage;
        };

        function setFirstImage() {
            var image;
            if (imageWith != null) {
                image = ctrl.product.images[0].image;
            } else {
                image = ctrl.product.images[1].image;
            }
            return image;
        }

        /**
         *
         * @param key
         * @returns {number}
         * @constructor
         */
        function FindIndex(key) {
            return ctrl.images.findIndex(function(obj) {
                Object.keys(key).every(function(name) {
                    key[name] === obj[name]
                })
            });
        }

        ctrl.next = function () {
            ctrl.index < ctrl.images.length - 1 ? ctrl.index++ : ctrl.index = 0;
            ctrl.selectMain();
        };

        ctrl.prev = function () {
            ctrl.index > 0 ? ctrl.index-- : ctrl.index = ctrl.images.length - 1;
            ctrl.selectMain();
        };

        if (imageWith == null) {
            angular.forEach(ctrl.product.images, function (value, key) {
                if (value.width > 350) {
                    this.push(value);
                }
            }, ctrl.images);
        }

        if (ctrl.images.length > 1) ctrl.showArrows = true;
    }
})();