var button;
var userID = '';

$.jmsajaxurl = function (options) {
    var url = options.url;
    url += "/" + options.method;
    if (options.data) {
        var data = ""; 
        for (var i in options.data) {
            if (data != "")
                data += "&"; data += i + "=" + msJSON.stringify(encodeURIComponent(options.data[i]));
        }
        url += "?" + data;
        data = null; 
        options.data = "{}";
    }
    return url;
}



function initBMarkProcess(buttonElement) {
    button = $(buttonElement);
    getUserID();
    window.setTimeout(begin, 1500)
}

function begin() {
    var grayCurtain = generateGrayCurtain();
    grayCurtain.css('display', 'block');
    if (userID != '') {
        var contentHolderID = button.attr('contentHoderId');
        var contentName = button.attr('contentName');
        var contentType = button.attr('contentType');
        var contentTypeName = button.attr('contentTypeName');
        var genre = button.attr('genre');
        var genreName = button.attr('genreName');
        openConfirmationDialogBox(contentName, contentType, contentTypeName, genre, genreName, userID);
    }
    else {
        generateBMarkDialogBox();
    }
}

function getUserID() {
    var url = $.jmsajaxurl({
        //url: "http://localhost:1903/B-Mark/BMarkServices.asmx",
        url: "http://www.bmarkcentral.com/BMarkServices.asmx",
        method: "GetUserID",
        data: { }
    });

    url = url + "&format=json";
    $.ajax({
        url: url,
        dataType: "jsonp",
        cache: false,
        success: function (userIDFromAjax) {
            userID = userIDFromAjax.d;
        }
    });

    return '';
}

function generateGrayCurtain() {
    var grayCurtain = $('<div></div>');
    grayCurtain.attr('id', 'BMark_GrayCurtain');
    grayCurtain.css('display', 'none');
    grayCurtain.css('background-color', 'Gray');
    grayCurtain.css('filter', 'alpha(opacity=50)');
    grayCurtain.css('opacity', 0.5);
    grayCurtain.css('-moz-opacity', 0.50);
    grayCurtain.css('z-index', 1000);
    grayCurtain.css('height', '100%');
    grayCurtain.css('width', '100%');
    grayCurtain.css('background-repeat', 'no-repeat');
    grayCurtain.css('background-position', 'center');
    grayCurtain.css('position', 'fixed');
    grayCurtain.css('top', '0px');
    grayCurtain.css('left', '0px');
    document.body.appendChild(grayCurtain.get(0));
    return grayCurtain;
}

function generateBMarkDialogBox() {
    var innerHTML = '<div id="BMark_LoginPopup" style="padding:1%; background-color:white;">' +
					'<div style="margin-bottom: 5px;"><a href="http://www.bmarkcentral.com/?q=button_logo" target="_blank"><img src="http://www.bmarkcentral.com/images/logo_button.png" alt="Bmark" border="0"></a></div>' +
					'<div style="font-size: 9pt; color: #25702B; margin-bottom: 10px;">Log into your account to bmark the content.</div>' +
                    '<table>' +
                    '<tr><td>Email:</td><td><input type="text" id="bMarkUserEmail" /></td></tr>' +
                    '<tr><td>Password</td><td><input type="password" id="bMarkPassword" /></td></tr>' +
                    '<tr><td><input type="button" value="Login" onclick="identifyUser();" /></td><td><input type="button" value="Cancel" onclick="closePopup(\'BMark_LoginPopup\');" /></td></tr>' +
                    '</table>' +
					'<div style="font-size: 9pt; color: #25702B; margin-top: 5px;">Not a member of Bmark? <a href="http://www.bmarkcentral.com/?q=button">Sign Up Now!</a></div>' +
                    '</div>';
    var popup = $(innerHTML);
    popup.css('position', 'fixed');
    popup.css('z-index', 1500);
	popup.css('height', '250px');
    popup.css('width', '225px');
	popup.css('top', '50%');
	popup.css('left', '50%');
    document.body.appendChild(popup.get(0));
}

function closePopup(popupId) {
    var grayCurtain = $('#BMark_GrayCurtain');
    grayCurtain.remove();
    var popup = $('#' + popupId);
    popup.remove();
}

function identifyUser() {
    var email = $('#bMarkUserEmail').val();
    var password = $('#bMarkPassword').val();
    closePopup('BMark_LoginPopup');
    var contentHolderID = button.attr('contentHoderId');
    var contentName = button.attr('contentName');
    var contentType = button.attr('contentType');
    var contentTypeName = button.attr('contentTypeName');
    var genre = button.attr('genre');
    var genreName = button.attr('genreName');

    var url = $.jmsajaxurl({
        //url: "http://localhost:1903/B-Mark/BMarkServices.asmx",
        url: "http://www.bmarkcentral.com/BMarkServices.asmx",
        method: "CheckUser",
        data: { email: email, password: password }
    });

    url = url + "&format=json";
    $.ajax({
        url: url,
        dataType: "jsonp",
        cache: false,
        success: function (userID) {
            if (userID.d != '') {
                var grayCurtain = generateGrayCurtain();
                grayCurtain.css('display', 'block');
                openConfirmationDialogBox(contentName, contentType, contentTypeName, genre, genreName, userID.d);
            }
            else {
                alert('No User Found');
            }
        }
    });
}

function openConfirmationDialogBox(contentName, contentType, contentTypeName, genre, genreName, userID) {
    var innerHTML = '<div id="BMark_ConfirmationPopup" style="padding:1%; background-color:white;">' +
					'<div style="margin-bottom: 5px;"><a href="http://www.bmarkcentral.com/?q=button_logo" target="_blank"><img src="http://www.bmarkcentral.com/images/logo_button.png" alt="Bmark" border="0"></a></div>' +
                    '<table>' +
                    '<tr><td colspan="2"><div style="font-size: 11pt; color: #25702B; margin-bottom: 10px;">Click Confirm to bmark the content mentioned below.</div></td></tr>' +
                    '<tr><td>Content Name:</td><td>' + contentName + '</td></tr>' +
                    '<tr><td>Content Type:</td><td>' + contentTypeName + '</td></tr>' +
                    '<tr><td>Content Genre:</td><td>' + genreName + '</td></tr>' +
                    '<tr><td><input type="button" value="Confirm" onclick="bmarkContent(\''+ contentType +'\',\'' + genre + '\',\'' + contentName + '\',\'' + userID + '\');" /></td><td><input type="button" value="Cancel" onclick="closePopup(\'BMark_ConfirmationPopup\');" /></td></tr>' +
                    '</table>' +
                    '</div>';
    var popup = $(innerHTML);
    popup.css('position', 'fixed');
    popup.css('z-index', 1500);
	popup.css('top', '50%');
	popup.css('left', '50%');
    document.body.appendChild(popup.get(0));

}

function bmarkContent(contentType, genre, contentName, userID) {
    var url = $.jmsajaxurl({
        //url: "http://localhost:1903/B-Mark/BMarkServices.asmx",
        url: "http://www.bmarkcentral.com/BMarkServices.asmx",
        method: "SaveContent",
        data: { contentType: contentType, contentName: contentName, genre: genre, userID: userID, origin: "0" }
    });

    url = url + "&format=json";
    $.ajax({
        url: url,
        dataType: "jsonp",
        cache: false,
        success: function (msg) {
            closePopup('BMark_ConfirmationPopup');
            var image = button.find('img');
            var imageSrc = image.attr('src').replace('.png','1.png');
            image.attr('src', imageSrc);
            button.attr('onclick', '');
        },
    });
}