(function( $ ) {
    'use strict';

    /**
     *  Global doc.ready function
     */
    $(document).ready(function(){
        $('.amp-settings-form').submit(function(e){
            e.preventDefault();

            $.post(amp_data.wp_post, $(this).serialize(), function(d){
                UIkit.notify("<i class='uk-icon-check'></i> Your settings have been saved.", {pos:'bottom-right', status:"success"});
            });
        });

        // Set the selected option of selects
        $('select').each(function(){
            var attr = $(this).attr('data-value');
            if (typeof attr !== typeof undefined && attr !== false && attr !== '') {
                $(this).val(attr);
            }
        });

        // Header Color Picker
        $('.spectrum').each(function(){
            var element = $(this);
            var value = element.val();
            element.spectrum({
                color: value,
                change: function(color) {
                    element.val(color.toHexString());
                }
            });
        });

        // Select Images
        $('.imageSelect').click(function(){
            var target = $(this).data('target');
            tb_show( '', 'media-upload.php?type=image&amp;TB_iframe=true' );
            window.send_to_editor = function(html) {
                var img = $(html).attr('src');
                $('#' + target).val(img);
                tb_remove();
            }
        });

        $('#yes_handle_non_secure').click(function(){
            $('.yes-options').fadeIn();
            $('.options_to_deal_with_non_secure_content').prop('disabled', false);
        });
        
        $('#no_handle_non_secure').click(function(){
            $('.yes-options').hide();
            $('.options_to_deal_with_non_secure_content').prop('disabled', true);
        });
        
        // Run Mobile Test
        $('.uk-button-run-test').click(function(){
            var button = $(this);
            button.attr('disabled', 'disabled');
            button.find('i').removeClass('fa-play').addClass('fa-spin').addClass('fa-refresh');

            var website = $('#mobile-test-url').val();
            if (website == "") {
                UIkit.notify("<i class='fa fa-warning'></i> URL cannot be empty!", {pos:'bottom-right', status:"error"});
                button.removeAttr('disabled');
                button.find('i').addClass('fa-play').removeClass('fa-spin').removeClass('fa-refresh');
                return null;
            }

            var data = [{
                    name: 'action',
                    value: 'amp_mobile_test'
                }, {
                    name: 'website',
                    value: website
                }];

            $.post(amp_data.wp_post, data, function(d){
                button.removeAttr('disabled');
                button.find('i').addClass('fa-play').removeClass('fa-spin').removeClass('fa-refresh');

                if (d.hasOwnProperty('status')) {
                    if (d.status == 'ERROR') {
                        UIkit.notify("<i class='fa fa-warning'></i> " + d.message, {
                            pos: 'bottom-right',
                            status: "error"
                        });
                    }
                } else {
                    d = JSON.parse(d);
                    if (d.hasOwnProperty('responseCode')) {
                        if (d.responseCode == 200) {
                            // Give the link to screenshot button
                            $('.mobile-screenshot-button').attr('href', website);

                            // Apply the logic here
                            var container = $('.mobile-results');

                            // Apply the Passed/Not Passed Status
                            container.find('.mobile-status').removeClass('uk-text-danger').removeClass('uk-text-success');
                            if (d.ruleGroups.USABILITY.pass == true) {
                                container.find('.mobile-status').addClass('uk-text-success').html('<i class="fa fa-check"></i> Your URL has passed the Mobile Friendly Test!');
                            } else {
                                container.find('.mobile-status').addClass('uk-text-danger').html('<i class="fa fa-warning"></i> Your URL did not pass the Mobile Friendly Test!');
                            }

                            // Apply the progress bar changes
                            container.find('.uk-progress-bar').css('width', d.ruleGroups.USABILITY.score+'%').html('Score: <b>'+d.ruleGroups.USABILITY.score+'</b> of <b>100</b>');

                            // Show the problems if any
                            var problems = $('.mobile-problems');
                            var problem_list = $('.mobile-problems-list');
                            if (d.ruleGroups.USABILITY.score < 100) {
                                problems.slideDown();

                                problem_list.empty();
                                problem_list.append('<dt class="uk-text-danger"><i class="fa fa-warning"></i> Failed Tests:</dt>');

                                for(var key in d.formattedResults.ruleResults) {
                                    var result = d.formattedResults.ruleResults[key];
                                    if (result.ruleImpact > 0) {
                                        problem_list.append('<dd><i class="fa fa-close"></i> '+result.localizedRuleName+' (-'+parseInt(result.ruleImpact)+')</dd>');
                                    }
                                }

                            } else {
                                problems.slideUp();
                            }

                            // Show the things that are okay
                            var success_list = $('.mobile-success-list');
                            success_list.empty();
                            success_list.append('<dt class="uk-text-success"><i class="fa fa-check"></i> Verified Tests:</dt>');

                            for(var key in d.formattedResults.ruleResults) {
                                var result = d.formattedResults.ruleResults[key];
                                if (result.ruleImpact == 0) {
                                    success_list.append('<dd><i class="fa fa-check"></i> '+result.localizedRuleName+'</dd>');
                                }
                            }

                            // Display the screenshot
                            var screenshot = $('.mobile-screenshot');
                            screenshot.attr('src', 'data:image/jpeg;charset=utf-8;base64,' + d.screenshot.data.replace(/\_/g, '/').replace(/\-/g, '+'));

                            container.slideDown();
                        } else {
                            UIkit.notify("<i class='fa fa-warning'></i> An unknown problem occurred. Please try again later.", {pos:'bottom-right', status:"error"});
                        }
                    }
                }
            });
        });
    });


})( jQuery );