// "use strict";
var generateVideoCall = function (options) {
    var defaults = {
        roofKey: '',
        VCUser: '',
        bottomPosition: 0,
        rightPostion: 0,

        VCButtonOn: 0,
        VCMaximizedImg: 'https://media.flickfusion.net/videocall/images/button_lg.png',
        VCMinimizedImg: 'https://media.flickfusion.net/videocall/images/button_sm.png',
        VCImgWidth: '360'
    };

    this.vidCallURL = 'https://media.flickfusion.net/videocall/external_vidcallV3.php';
    this.options = extend(defaults, options);
    this.generateButtons();
};

generateVideoCall.prototype.generateButtons = function () {

    var fromVidCallURL = this.vidCallURL + '?roof_key=' + this.options.roofKey;
    if (this.options.VCUser != "")
        fromVidCallURL = fromVidCallURL + "&rd=1&manual_user_name=" + this.options.VCUser;

    var callWrapper = document.createElement('div');
    callWrapper.className = 'vid_call_wrapper';
    callWrapper.style.cssText = 'z-index: 999999; position: fixed; bottom: ' + this.options.bottomPosition + 'px; right: ' + this.options.rightPostion + 'px;';

    if (this.options.VCButtonOn == '1') {
        // create link
        let anchoreLink = document.createElement('a');
        anchoreLink.setAttribute('target', '_blank');
        anchoreLink.href = fromVidCallURL;

        var VCWrapper = document.createElement('div');
        VCWrapper.className = 'service_wrapper';

        // maximized image
        var VCWrapperMaximinzed = document.createElement('img');
        VCWrapperMaximinzed.classList.add('large_call_img');
        VCWrapperMaximinzed.src = this.options.VCMaximizedImg;
        VCWrapperMaximinzed.width = this.options.VCImgWidth;
        VCWrapper.appendChild(VCWrapperMaximinzed);

        // minimized image
        var VCWrapperMinimized = document.createElement('img');
        VCWrapperMinimized.classList.add('small_call_img', 'is_hidden');
        VCWrapperMinimized.src = this.options.VCMinimizedImg;
        VCWrapperMinimized.width = this.options.VCImgWidth;
        VCWrapper.appendChild(VCWrapperMinimized);

        anchoreLink.appendChild(VCWrapper);
        callWrapper.appendChild(anchoreLink);

        var closeButton = document.createElement('span');

        closeButton.style.cssText = 'align-self: flex-end; position: absolute; right: 40px; top: 33px; color:#fff;';
        closeButton.classList.add('close_btn');
        callWrapper.appendChild(closeButton);

        let style = document.createElement('style');
        style.innerText =
            ".close_btn::before { content: '\\2A2F'; font-size: 25px; align-self: flex-end; position: absolute; background-color: #043b9c; width: 25px; height: 25px; display: flex; align-items: center; justify-content: center; border-radius: 50%; cursor: pointer; transition: all 500ms ease; z-index: 999; } .close_btn::after { content: 'Minimize'; position: absolute; right: -7px;line-height: 14px; display: flex; top: 1px; font-size: 12px; background-color: #043b9c; padding: 4px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; opacity: 0; transition: all 400ms ease; cursor: pointer; padding-right: 8px; } .close_btn:hover::after { transition: all 400ms ease; opacity: 1; } .close_btn:hover::before { transition: all 200ms ease; } .is_hidden { display: none; } .vid_call_wrapper.on_open .small_call_img { display: block; } .vid_call_wrapper.on_open .large_call_img { display: none; } .vid_call_wrapper.on_open .close_btn::after { content: 'Maximize'; } .vid_call_wrapper.on_open .close_btn::before { content: '\\021D6'; } @media(max-width:812px){.vid_call_wrapper{max-width:200px;width:100%;}.close_btn{right:20px !important;top:5px !important;}.close_btn::before{width:20px;height:20px;font-size:17px;}.close_btn::after{font-size:10px;top:0px;right:-8px;height:12px;line-height:12px;}}";
        document.head.appendChild(style);

        const isMinimized = localStorage.getItem("isMinimized");
            if (isMinimized === "true") {
                callWrapper.classList.add("on_open");
            }

        closeButton.onclick = function () {
            // callWrapper.classList.toggle('on_open');
            toggleOpenClass();
        };

        // if(window.innerWidth < 800){
        //     callWrapper.classList.add('on_open');
        // }

        function toggleOpenClass() {
            callWrapper.classList.toggle("on_open");
            const isMinimized = callWrapper.classList.contains("on_open");
            localStorage.setItem("isMinimized", isMinimized);
        }
        document.querySelector('body').appendChild(callWrapper);
    }
};

var extend = function (defaults, options) {
    var extended = {};
    var prop;
    for (prop in defaults) {
        if (Object.prototype.hasOwnProperty.call(defaults, prop)) {
            extended[prop] = defaults[prop];
        }
    }
    for (prop in options) {
        if (Object.prototype.hasOwnProperty.call(options, prop)) {
            extended[prop] = options[prop];
        }
    }
    return extended;
};
document.addEventListener('DOMContentLoaded', function (event) {
    var generate = new generateVideoCall({
        roofKey: '86C4B35D-48A2-8955-414C-C6A023C1508E',
        VCUser: '',
        bottomPosition: '0',
        rightPostion: '0',

        VCButtonOn: '1',
        VCMaximizedImg: '//media.flickfusion.net/videocall/images/ff_NADA_2021.png',
        VCMinimizedImg: '//media.flickfusion.net/videocall/images/button_sm.png',
        VCImgWidth: '360'
    });
});