var getVinDetailsService = "https://verify.flickfusion.net/cc_ff_verify_vin.php?",
    hostURL = '//media.flickfusion.net/',
    domainReferrer = window.location.hostname,
    isOnly360 = 1;

// site configuration
var siteConfig = {
    VDP: {
        VDPIndicator: '#vdp',
        target: '.view360',
        vin: '.details-vin-value',
    }
};

// VDP SNIPPET
if (siteConfig.VDP && document.querySelector(siteConfig.VDP.VDPIndicator)) {
    var targetElementOnVDP = {
        target: document.querySelector(siteConfig.VDP.target),
        vinIdentifier: function() {
            return siteConfig.VDP.vin;
        },
        targetVinNumber: function() {
            if (this.vinIdentifier()) {
                return document.querySelector(this.vinIdentifier()).innerText;
            }
        },
        vinRegex: siteConfig.VDP.vinRegex,
        vinAttribute: siteConfig.VDP.vinAttribute,
    };

    if (window.isFlickScriptLoaded === undefined) generateButtonsOnVDP();
    window.isFlickScriptLoaded = true;
}

// VDP
function generateButtonsOnVDP() {
    var vinNumber = targetElementOnVDP.targetVinNumber();
    insertButtonOnPostion(vinNumber);
}

function insertButtonOnPostion(vinNumber) {

    requestDataJSONP(getVinDetailsService + "cc_vin=" + vinNumber, "jsoncallback", function(data) {
        if(data.code === 200){
            loadFFScript(hostURL + 'videos/global/new_modal.js', function () {
                if(data.data.popup && data.data.popup.is360){

                    var targetExistingButton = document.querySelector(siteConfig.VDP.target);
                    targetExistingButton.style.display = 'inline';

                    targetExistingButton.addEventListener('click', function () {
                        document.querySelector('.sts-spin').style.display = "none";
                        new ConModal({
                            width: 960,
                            videoPage: data.data.popup.type,
                            modalTitle: 'Video',
                            iframeUrl: data.data.popup.url + '&only_360='+ isOnly360 +'&referer=' + domainReferrer,
                        });
                    })
                }
            })
        }
    })
}

// dev
function requestDataJSONP(url, key, callback) {
    var doc = document,
        head = doc.head,
        script = doc.createElement("script"),
        callbackName = "f" + Math.round(Math.random() * Date.now());

    script.setAttribute("src", url + (url.indexOf("?") > 0 ? "&" : "?") + key + "=" + callbackName);

    window[callbackName] = function(json) {
        window[callbackName] = undefined;
        setTimeout(function() {
            head.removeChild(script);
        }, 0);
        callback(json);
    };

    head.appendChild(script);
}

function loadFFScript(url, callback) {
    var head = document.getElementsByTagName('head')[0];
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;
    var done = false;
    script.onload = script.onreadystatechange = function() {
        if (!done && (!this.readyState || this.readyState == 'loaded' || this.readyState == 'complete')) {
            done = true;
            if (callback) callback();
            script.onload = script.onreadystatechange = null;
            head.removeChild(script);
        }
    };
    head.appendChild(script);
}