src/assetbundles/imageoptimize/src/js/OptimizedImagesField.js - Code Metrics - Inspection of "Version 1.6.22" - nystudio107/craft-imageoptimize - Measure and Improve Code Quality continuously with Scrutinizer

Passed

Push — develop ( 4bb918...3adc5d )

by Andrew

created 2021-02-10 21:10 UTC

src/assetbundles/imageoptimize/src/js/OptimizedImagesField.js A

↳ Parent: Project

Complexity

Total Complexity	42
Complexity/F	1.45

Size

Lines of Code	286
Function Count	29

Duplication

Duplicated Lines	0
Ratio	0 %

Importance

Changes

Metric	Value
eloc	190
c	0
b	0
f	0
dl	0
loc	286
rs	9.0399
wmc	42
mnd	13
bc	13
fnc	29
bpm	0.4482
cpm	1.4482
noi	112

1 Function

Rating	Name	Duplication	Size	Complexity
A	OptimizedImagesField.js ➔ Plugin	0	10	2

How to fix Complexity

/**
 * Image Optimize plugin for Craft CMS
 *
 * OptimizedImages Field JS
 *
 * @author    nystudio107
 * @copyright Copyright (c) 2017 nystudio107
 * @link      https://nystudio107.com
 * @package   ImageOptimize
 * @since     1.2.0
 */

 ;(function ( $, window, document, undefined ) {


    var pluginName = "ImageOptimizeOptimizedImages",
        defaults = {
        };

    // Plugin constructor

    function Plugin( element, options ) {

        this.element = element;


        this.options = $.extend( {}, defaults, options) ;


        this._defaults = defaults;

        this._name = pluginName;


        this.init();

    }


    Plugin.prototype = {


        init: function(id) {

            var _this = this;


            $(function () {


/* -- _this.options gives us access to the $jsonVars that our FieldType passed down to us */


            });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
        }

    };


    // A really lightweight plugin wrapper around the constructor,

    // preventing against multiple instantiations

    $.fn[pluginName] = function ( options ) {

        return this.each(function () {

            if (!$.data(this, "plugin_" + pluginName)) {

                $.data(this, "plugin_" + pluginName,

                new Plugin( this, options ));
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
            }

        });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
    };


})( jQuery, window, document );


Craft.OptimizedImagesInput = Garnish.Base.extend(

    {
        id: null,
        inputNamePrefix: null,
        inputIdPrefix: null,

        $container: null,
        $blockContainer: null,
        $addBlockBtnContainer: null,
        $addBlockBtnGroup: null,
        $addBlockBtnGroupBtns: null,

        blockSort: null,
        blockSelect: null,

        init: function(id, inputNamePrefix, sizesWrapperId) {


            this.id = id;
            this.inputNamePrefix = inputNamePrefix;
            this.inputIdPrefix = Craft.formatInputId(this.inputNamePrefix);


            this.$container = $('#' + this.id);
            this.$blockContainer = this.$container.children('.variant-blocks');
            this.$addBlockBtnContainer = this.$container.children('.buttons');
            this.$addBlockBtnGroup = this.$addBlockBtnContainer.children('.btngroup');
            this.$addBlockBtnGroupBtns = this.$addBlockBtnGroup.children('.btn');

            // Create our action button menus
            var _this = this;
            this.$blockContainer.find('> > .actions > .settings').each(function (index, value) {

                var $value = $(value);
                var menuBtn;
                if ($value.data('menubtn')) {
                    menuBtn = $value.data('menubtn');
                } else {
                    menuBtn = new Garnish.MenuBtn(value);

                }
                menuBtn.menu.settings.onOptionSelect = $.proxy(function(option) {

                    this.onMenuOptionSelect(option, menuBtn);
                }, _this);
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
            });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.

            var $blocks = this.$blockContainer.children();

            this.blockSort = new Garnish.DragSort($blocks, {

                handle: '> .actions > .move',
                axis: 'y',
                collapseDraggees: true,
                magnetStrength: 4,
                helperLagBase: 1.5,
                helperOpacity: 0.9,
                onSortChange: $.proxy(function() {

                    this.resetVariantBlockOrder();
                }, this)
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
            });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.

            this.addListener(this.$addBlockBtnGroupBtns, 'click', function(ev) {

                var type = $(ev.target).data('type');

                this.addVariantBlock(null);
            });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.

            this.addAspectRatioHandlers();
            this.reIndexVariants();
        },

        onMenuOptionSelect: function(option, menuBtn) {

            var $option = $(option);
            var container = menuBtn.$btn.closest('.matrixblock');

            switch ($option.data('action')) {
                case 'add': {

                    this.addVariantBlock(container);
                    break;
                }
                case 'delete': {
                    if (!$option.hasClass('disabled')) {
                        this.deleteVariantBlock(container);
                    }
                    break;
                }
            }
        },

        getHiddenBlockCss: function($block) {

            return {
                opacity: 0,
                marginBottom: -($block.outerHeight())
            };
        },

        // Re-index all of the variant blocks
        reIndexVariants: function() {

            this.$blockContainer = this.$container.children('.variant-blocks');
            var $blocks = this.$blockContainer.children();
            $blocks.each(function (index, value) {

                var variantIndex = index;
                var $value = $(value);
                var elements = $value.find('div .field, label, input, select');

                // Re-index all of the element attributes
                $(elements).each(function (index, value) {

                    // id attributes
                    var str = $(value).attr('id');
                    if (str) {
                        str = str.replace(/\-([0-9]+)\-/g, "-" + variantIndex +"-");
                        $(value).attr('id', str);
                    }
                    // for attributes
                    str = $(value).attr('for');
                    if (str) {
                        str = str.replace(/\-([0-9]+)\-/g, "-" + variantIndex +"-");
                        $(value).attr('for', str);
                    }
                    // Name attributes
                    str = $(value).attr('name');
                    if (str) {
                        str = str.replace(/\[([0-9]+)\]/g, "[" + variantIndex +"]");
                        $(value).attr('name', str);
                    }
                });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
            });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
            var disabledDeleteItem = false;
            // If we only have one block, don't allow it to be deleted
            if ($blocks.length == 1) {

                disabledDeleteItem = true;
            }
            $blocks.find('> .actions > .settings').each(function (index, value) {

                var $value = $(value);
                var menuBtn;
                if ($value.data('menubtn')) {
                    menuBtn = $value.data('menubtn');
                    $menuItem = $(menuBtn.menu.$menuList[1]);

                    if (disabledDeleteItem) {
                        $menuItem.find("> li > a").addClass('disabled').disable();
                    } else {
                        $menuItem.find("> li > a").removeClass('disabled').enable();
                    }
                }
            });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.

        },

        addAspectRatioHandlers: function () {
            this.addListener($('.lightswitch'), 'click', function(ev) {

                var $target = $(ev.target);
                var $block = $target.closest('.matrixblock');
                $block.find('.io-aspect-ratio-wrapper').slideToggle();
            });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
            this.addListener($('.io-select-ar-box'), 'click', function(ev) {

                var $target = $(ev.target);
                var x = $(ev.target).data('x'),
                    y = $(ev.target).data('y'),
                    custom = $(ev.target).data('custom'),
                    field, $block;
                // Select the appropriate aspect ratio
                $block = $target.closest('.matrixblock');
                $block.find('.io-select-ar-box').each(function (index, value) {

                    $(value).removeClass('io-selected-ar-box');
                });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
                $target.addClass('io-selected-ar-box');

                // Handle setting the actual field values
                if (custom) {
                    $block.find('.io-custom-ar-wrapper').slideDown();
                } else {
                    $block.find('.io-custom-ar-wrapper').slideUp();
                    field = $block.find('input')[2];
                    $(field).val(x);
                    field = $block.find('input')[3];
                    $(field).val(y);
                }
            });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
        },

        addVariantBlock: function(container) {

            var _this = this;
            $block = $(this.$blockContainer.children()[0]).clone();

            // Reset to default values
            $block.find('.io-select-ar-box').each(function (index, value) {

                if (index === 0) {
                    $(value).addClass('io-selected-ar-box');
                } else {
                    $(value).removeClass('io-selected-ar-box');
                }
            });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
            $block.find('.io-custom-ar-wrapper').hide();
            field = $block.find('input')[0];

            $(field).val(1200);
            field = $block.find('input')[1];
            $(field).val(1);
            field = $block.find('input')[2];
            $(field).val(16);
            field = $block.find('input')[3];
            $(field).val(9);
            field = $block.find('select')[0];
            $(field).val(82);
            field = $block.find('select')[1];
            $(field).val('jpg');
            $block.css(this.getHiddenBlockCss($block)).velocity({

                opacity: 1,
                'margin-bottom': 10
            }, 'fast', $.proxy(function() {


                // Insert the block in the right place
                if (container) {
                    $block.insertBefore(container);
                } else {
                    $block.appendTo(this.$blockContainer);
                }
                // Update the Garnish UI controls
                this.blockSort.addItems($block);
                this.addAspectRatioHandlers();
                $block.find('.settings').each(function (index, value) {

                    var $value = $(value),
                        menuBtn,
                        menu;

                    menu = _this.$container.find('.io-menu-clone > .menu').clone();
                    $(menu).insertAfter($value);
                    menuBtn = new Garnish.MenuBtn(value);


                    menuBtn.menu.settings.onOptionSelect = $.proxy(function(option) {

                        _this.onMenuOptionSelect(option, menuBtn);
                    }, this);
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
                });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
                this.reIndexVariants();
            }, this));
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
        },

        deleteVariantBlock: function(container) {

            var _this = this;
            container.velocity(this.getHiddenBlockCss(container), 'fast', $.proxy(function() {

                container.remove();
                _this.reIndexVariants();
            }, this));
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.
        },

        resetVariantBlockOrder: function() {

            this.reIndexVariants();
        }

    });
someFunctionCall(
    $firstArgument,
    $secondArgument,
    $thirdArgument
); // Closing parenthesis on a new line.


1			/**
2			* Image Optimize plugin for Craft CMS
3			*
4			* OptimizedImages Field JS
5			*
6			* @author nystudio107
7			* @copyright Copyright (c) 2017 nystudio107
8			* @link https://nystudio107.com
9			* @package ImageOptimize
10			* @since 1.2.0
11			*/
12
13			;(function ( $, window, document, undefined ) {
			0 ignored issues – show Unused Code introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report The parameter `document` is not used and could be removed. This check looks for parameters in functions that are not used in the function body and are not followed by other parameters which are used inside the function. Loading history... Unused Code introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report The parameter `window` is not used and could be removed. This check looks for parameters in functions that are not used in the function body and are not followed by other parameters which are used inside the function. Loading history... Unused Code introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report The parameter `undefined` is not used and could be removed. This check looks for parameters in functions that are not used in the function body and are not followed by other parameters which are used inside the function. Loading history...
14
15			var pluginName = "ImageOptimizeOptimizedImages",
16			defaults = {
17			};
18
19			// Plugin constructor
			0 ignored issues – show Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Line indented incorrectly; expected at least 8 spaces, found 4 Loading history...
20			function Plugin( element, options ) {
			0 ignored issues – show Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Line indented incorrectly; expected 8 spaces, found 4 Loading history... Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Opening brace should be on a new line Loading history...
21			this.element = element;
			0 ignored issues – show Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Line indented incorrectly; expected at least 12 spaces, found 8 Loading history...
22
23			this.options = $.extend( {}, defaults, options) ;
			0 ignored issues – show Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Line indented incorrectly; expected at least 12 spaces, found 8 Loading history... Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Space after opening parenthesis of function call prohibited Loading history... Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Space after closing parenthesis of function call prohibited Loading history...
24
25			this._defaults = defaults;
			0 ignored issues – show Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Line indented incorrectly; expected at least 12 spaces, found 8 Loading history...
26			this._name = pluginName;
			0 ignored issues – show Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Line indented incorrectly; expected at least 12 spaces, found 8 Loading history...
27
28			this.init();
			0 ignored issues – show Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Line indented incorrectly; expected at least 12 spaces, found 8 Loading history...
29			}
			0 ignored issues – show Coding Style introduced 2021-01-16 04:00 UTC by Report Bug Copy Issue Report Line indented incorrectly; expected 8 spaces, found 4 Loading history...
30
31			Plugin.prototype = {

nystudio107 / craft-imageoptimize

Push — develop ( 4bb918...3adc5d )

src/assetbundles/imageoptimize/src/js/OptimizedImagesField.js A

Complexity

Size

Duplication

Importance

1 Function

How to fix Complexity

Complexity

Duplication Side-by-Side

Filter issues like