var Familiarity = function (options) {
    this.escape_to_exit = options.escape_to_exit;
    this.f1_to_start = options.f1_to_start;
    this.show_tips_recursively = options.show_tips_recursively;
    this.mandatory_all_tips = options.mandatory_all_tips;
    this.traverse_back = options.traverse_back;

    this.familiaritiesUrl = '<%= Familiarity::Engine.routes.url_helpers.familiarities_path(format: :json) %>';
    // To retain the flag even after reset() method familiarityAllTipsVisited flag is defined here.
    this.familiarityAllTipsVisited = false;
    this.reset();
    Familiarity.setCurrentObject(this);
}
Familiarity.setCurrentObject = function (current_object) {
    return (this.currentObject = current_object);
}
Familiarity.getCurrentObject = function () {
    return this.currentObject
}
Familiarity.prototype = {
    reset: function () {
//        this.familiarityAllTipsVisited = false;
        this.familiarityRenderedFlag = false;
        this.familiarity_hash_pointer = -1;
        this.familiarity_hash = {};
        this.familiarity_bubbles = [];
    },
    familiarity_hash_keys: function () {
        return ($.map(this.familiarity_hash, function (v, k) {
            return k;
        }));
    },
    showNextBubble: function () {
        if (this.familiarity_hash_keys().length <= 0) {
            return false;
        }
        this.familiarity_hash_pointer++;
        if ((this.familiarity_hash_pointer + 1) > this.familiarity_hash_keys().length) {
            this.familiarityAllTipsVisited = true
            if (this.show_tips_recursively) {
                this.familiarity_hash_pointer = 0;
            } else {
                this.familiarityView(false);
                return true;
            }
        }
        this.showOneByOne();
    },
    showPreviousBubble: function () {
        if (this.familiarity_hash_keys().length <= 0) {
            return false;
        }
        if (!this.traverse_back) {
            return false;
        }
        this.familiarity_hash_pointer--;
        if (this.familiarity_hash_pointer < 0) {
            if (this.show_tips_recursively) {
                this.familiarity_hash_pointer = this.familiarity_hash_keys().length - 1;
            } else {
                this.familiarity_hash_pointer = 0;
            }
        }
        this.showOneByOne();
    },
    showOneByOne: function () {
//        console.log(this.familiarity_hash_pointer);
//        console.log(this.familiarity_hash);
//        console.log(this.familiarity_bubbles);
        this.hideFBubbles();
        return this.showFBubble();
    },
    showFBubble: function () {
        var current_bubble_key = this.familiarity_hash_keys()[this.familiarity_hash_pointer];
        var element = $(current_bubble_key)
        var content = this.familiarity_hash[current_bubble_key];

        if (element.length <= 0) {
            return false;
        }

        element.addClass('familiarity-bubble-parent')
                .tooltipster({
                    content: $('<span><strong>' + content.replace(/\n/g, "<br/>") + '</strong></span>'),
                    maxWidth: 400,
                    animation: 'grow', //fade, grow, swing, slide, fall
                    autoClose: true, //true, false
                    position: 'bottom-right', //right, left, top, top-right, top-left, bottom, bottom-right, bottom-left
                    delay: 700,
                    speed: 700,
                    theme: 'tooltipster-default',
                    touchDevices: false,
                    trigger: 'custom' //hover, click, custom
                });
        element.tooltipster('show');
//        console.log(element.css('background-color'));
//        if (element.css('background-color') == 'transparent') {
//            element.css('background-color', 'white')
//        }
        this.familiarity_bubbles.push(element)
        return true;
    },
    hideFBubbles: function () {
        while (this.familiarity_bubbles.length > 0) {
            this.familiarity_bubbles.pop().tooltipster('destroy').removeClass('familiarity-bubble-parent').attr('title', null);
        }
    },
    fetchFamiliarities: function (callback) {
        if (typeof(callback) != 'function') {
            callback = function (familiarity_hash) {
                console.log('familiarity_hash');
                console.log(familiarity_hash);
            }
        }
        var _this = this;
        $.get(this.familiaritiesUrl, function (data) {
            var familiarity_hash = data[$(location).attr('pathname')]
            if (familiarity_hash == null) {
                familiarity_hash = {}
            }
            _this.familiarity_hash = familiarity_hash;
            callback(familiarity_hash);
        });
    },
    familiarityView: function (enable) {
        var _this = this;
        if (typeof(enable) == 'undefined') {
            enable = true;
        }
        if (enable == true) {
            //Re-setting all values and variables (in case is there any half done state)
            this.reset();

            //Making bubble pop-out //////////////////
            this.fetchFamiliarities(function (familiarity_hash) {
                        if (_this.familiarity_hash_keys().length > 0) {
                            //Rendering overlay
                            $('body').addClass('familiarity-view').append($('<div id="familiarity_dim"></div>'));

                            //Rendering first bubble (via Next Bubble)
                            _this.showNextBubble();

                            //Marking flag that familiarity_view is rendered
                            _this.familiarityRenderedFlag = true;
                        }
                    }
            );

        } else {

            // If option 'mandatory_all_tips' is true then make sure all tips has been rendered
            // before exit of familiarity view
            if (this.mandatory_all_tips && (!this.familiarityAllTipsVisited)) {
                return false;
            }

            //Removing bubbles
            _this.hideFBubbles();

            //Removing rendered overlay
            $('#familiarity_dim').remove();
            $('body').removeClass('familiarity-view');

            //Marking flag that familiarity_view is removed from viewport
            this.familiarityRenderedFlag = false;
        }
    }

}

$(document).on("page:change", function () {
// Show and hide on F1 and ESC key respectively
    $('body').keyup(function (e) {
        var _this = Familiarity.getCurrentObject();
        if (typeof(_this) != "undefined" && e.keyCode == 27 && _this.escape_to_exit && _this.familiarityRenderedFlag) { //ESC key pressed
            _this.familiarityView(false);
        }
        if (typeof(_this) != "undefined" && e.keyCode == 112 && _this.f1_to_start && !_this.familiarityRenderedFlag) { //F1 key pressed
            _this.familiarityView(true);
        }
        if (typeof(_this) != "undefined" && e.keyCode == 37 && _this.familiarityRenderedFlag) { //LEFT arrow key pressed
            _this.showPreviousBubble();
        }
        if (typeof(_this) != "undefined" && e.keyCode == 39 && _this.familiarityRenderedFlag) { //RIGHT arrow key pressed
            _this.showNextBubble()
        }
    }).mousedown(function (e) {
        var _this = Familiarity.getCurrentObject();
        if (typeof(_this) != "undefined" && _this.familiarityRenderedFlag) { //Show next bubble on mouse down('click')
            _this.showNextBubble()
        }
    });
});