/// ===============================================================================================
/// Maker group [start]
/// ===============================================================================================

var maker_Size;
var maker_color;
var maker_targetDiv;
var maker_chooseColor;

function ShowMaker(targetId){
    maker_targetDiv = targetId;
    i18nReplaceText();
    $('#dlgMaker').show();
    $('#dlgMaker').draggable();
    Maker_handleColorPickerEvent();
    $('#dlgMaker').center();
};

function touchStart_BtnOk_Maker(e){
    e.preventDefault();
    Maker_dspOK_click();
};

function touchStart_BtnCancel_Maker(e){
    e.preventDefault();
    Maker_dspCancel_click();
};

function Maker_handleColorPickerEvent(){    
    
    if(avwUserEnvObj.os == "ipad" || avwUserEnvObj.os == "android"){
        $('#dlgMaker .colorpicker').unbind('mouseenter');
        $('#dlgMaker .colorpicker').unbind('mouseleave');
        $('#makerColorwrapper').unbind('mouseleave');
        
        document.getElementById('Maker_btnOk').addEventListener('touchstart',touchStart_BtnOk_Maker,false);
        document.getElementById('Maker_btnCancel').addEventListener('touchstart',touchStart_BtnCancel_Maker,false); 
    }
    else{
        $('#dlgMaker .colorpicker').unbind('mouseenter');
        $('#dlgMaker .colorpicker').unbind('mouseleave');
        $('#makerColorwrapper').unbind('mouseleave');
        
        $('#dlgMaker .colorpicker').bind('mouseenter', Maker_colorPickerMouseEnterFunction);
        $('#dlgMaker .colorpicker').bind('mouseleave', Maker_colorPickerMouseLeaveFunction);
        $('#makerColorwrapper').bind('mouseleave', Maker_colorWrapperMouseLeaveFunction);
    }
    
    $('#Maker_btnOk').live('click', Maker_dspOK_click);
    $('#Maker_btnCancel').live('click', Maker_dspCancel_click);

    Maker_SetDefaultValue();

    $('#marker-small-text').live('click', markerSmallTextClick);
    $('#marker-medium-text').live('click', markerMediumTextClick);
    $('#marker-large-text').live('click', markerLargeTextClick);
    $('#marker-oversize-text').live('click', markerOversizeTextClick);
    
    $('#dlgMaker .colorpicker').live('click', Maker_colorPickerClickFunction);
};

function markerSmallTextClick(){
    $('#maker-size-small').attr('checked','checked');
    $('#maker-size-medium').removeAttr('checked');
    $('#maker-size-large').removeAttr('checked');
    $('#maker-size-oversize').removeAttr('checked');
    Maker_rdo1_click();
};

function markerMediumTextClick(){
    $('#maker-size-small').removeAttr('checked');
    $('#maker-size-medium').attr('checked','checked');
    $('#maker-size-large').removeAttr('checked');
    $('#maker-size-oversize').removeAttr('checked');
    Maker_rdo2_click();
};

function markerLargeTextClick(){
    $('#maker-size-small').removeAttr('checked');
    $('#maker-size-medium').removeAttr('checked');
    $('#maker-size-large').attr('checked','checked');
    $('#maker-size-oversize').removeAttr('checked');
    Maker_rdo3_click();
};

function markerOversizeTextClick(){
    $('#maker-size-small').removeAttr('checked');
    $('#maker-size-medium').removeAttr('checked');
    $('#maker-size-large').removeAttr('checked');
    $('#maker-size-oversize').attr('checked','checked');
    Maker_rdo4_click();
};

// Choose type of eraser, and draw to canvas
function Maker_chooseType(typeValue, color) {
    var fillColor;
    maker_Size = typeValue;
    var canvas = document.getElementById('Maker_cvPreviewmaker');
    
    if(color == null || color == 'undefined'){
        fillColor = "f8ff00";
    }
    else{
        fillColor = '#'+ color;
    }
    
    if (canvas.getContext) {
        
        // use getContext to use the canvas for drawing
        var ctx = canvas.getContext('2d');

        // Draw shapes
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        
        ctx.fillStyle = fillColor;
        ctx.strokeStyle = fillColor;
        ctx.fillRect((eval(canvas.width)/2) - (eval(typeValue)/2), (eval(canvas.height)/2) - (eval(typeValue)/2), typeValue, typeValue);
    }
};

// Set default value for maker.
function Maker_SetDefaultValue() {
    var typeValue = undefined;
    var makerColor = ClientData.maker_color();
    typeValue = ClientData.maker_size();
    maker_Size = typeValue;
    
    if(makerColor != null || makerColor != undefined){
        maker_chooseColor = makerColor;
    }
    else{
        maker_chooseColor = 'f8ff00';
        makerColor = 'f8ff00';
    }
    
    if (typeValue == 5) {
        $("#maker-size-small").attr('checked', 'checked');
        $("#maker-size-small").focus();
    }
    else if (typeValue == 12.5) {
        $("#maker-size-medium").attr('checked', 'checked');
        $("#maker-size-medium").focus();
    }
    else if (typeValue == 25) {
        $("#maker-size-large").attr('checked', 'checked');
        $("#maker-size-large").focus();
    }
    else if (typeValue == 50) {
        $("#maker-size-oversize").attr('checked', 'checked');
        $("#maker-size-oversize").focus();
    }
    else {
        maker_Size = 10;
        $("#maker-size-small").attr('checked', 'checked');
        $("#maker-size-small").focus();
    }
     
    //START FIXCSS
    //$('#dlgMaker .colorpicker[colorId="'+makerColor+'"]').css('border','1px solid #e6e6e6');
    $('#dlgMaker .colorpicker[colorId="'+makerColor+'"]').addClass('picker-choose-on');
    $('#dlgMaker .colorpicker[colorId="'+makerColor+'"]').removeClass('picker-choose-off');
    //END FIXCSS
    Maker_chooseType(maker_Size, makerColor);
};

function Maker_colorPickerMouseLeaveFunction() {
    //START FIXCSS
    //$(this).css('border','1px solid white');    
    //$('#dlgMaker .colorpicker[colorId="'+makerColor+'"]').css('border','1px solid #e6e6e6');
    $(this).addClass('picker-choose-off');
    $(this).removeClass('picker-choose-on');
    $('#dlgMaker .colorpicker[colorId="'+makerColor+'"]').addClass('picker-choose-on');
    $('#dlgMaker .colorpicker[colorId="'+makerColor+'"]').removeClass('picker-choose-off');
    //END FIXCSS
};

function Maker_colorPickerMouseEnterFunction() {
    //START FIXCSS
    //$(this).css('border','1px solid #e6e6e6');
    $(this).removeClass('picker-choose-off');
    $(this).addClass('picker-choose-on');
    //END FIXCSS
    var color = $(this).attr('colorId');
    Maker_chooseType(maker_Size, color);
};

function Maker_colorPickerClickFunction() {
    //START FIXCSS
    //$('#dlgMaker .colorpicker[colorId="' + maker_chooseColor + '"]').css('border', '1px solid white');
    //$(this).css('border','1px solid #e6e6e6');
    $('#dlgMaker .colorpicker[colorId="' + maker_chooseColor + '"]').addClass('picker-choose-off');
    $('#dlgMaker .colorpicker[colorId="' + maker_chooseColor + '"]').removeClass('picker-choose-on');
    $(this).addClass('picker-choose-on');
    $(this).removeClass('picker-choose-off');
    //END FIXCSS
    maker_chooseColor = $(this).attr('colorId');
    Maker_chooseType(maker_Size, maker_chooseColor);
};

function Maker_rdo1_click() {
    Maker_chooseType(5, maker_chooseColor);  
};
function Maker_rdo2_click() {
    Maker_chooseType(12.5, maker_chooseColor);
};
function Maker_rdo3_click() {
    Maker_chooseType(25, maker_chooseColor);
};
function Maker_rdo4_click() {
    Maker_chooseType(50, maker_chooseColor);
};

// Event of button OK
function Maker_dspOK_click() {

    // Set selected value to local storage
    var typeValue = undefined;

    if ($("#maker-size-small").attr('checked') == 'checked') {
        typeValue = 5;
    }
    else if ($("#maker-size-medium").attr('checked') == 'checked') {
        typeValue = 12.5;
    }
    else if ($("#maker-size-large").attr('checked') == 'checked') {
        typeValue = 25;
    }
    else if ($("#maker-size-oversize").attr('checked') == 'checked') {
        typeValue = 50;
    }

    if(ClientData.maker_color() != maker_chooseColor){
        imgMarkerTemp = canvas_marker.toDataURL("image/png;");
    
        var img = new Image();
        img.onload = function () {
            context_draw.drawImage(img, 0, 0, canvas_draw.width, canvas_draw.height);
        };
        img.src = imgMarkerTemp;    
        
        context_marker.clearRect(0, 0, canvas_marker.width, canvas_marker.height);
        
        ClientData.maker_color();
    }
    // Set value to local
    ClientData.maker_size(typeValue);
    ClientData.maker_color(maker_chooseColor);    
    maker_Size = typeValue;
    makerColor = maker_chooseColor;
    
    maker_targetDiv.hide();
    
    /*enable button */
    enableButtonMarking();
    ClientData.IsAddingMarking(true);
    isAddingMarking = ClientData.IsAddingMarking();
    makerSize = ClientData.maker_size();
    makerColor = ClientData.maker_color();
    
    /* unlock dialog overlay */
    $("#overlay").hide();
    $('#dlgMarking_imgMakerOption').removeClass();
    $('#dlgMarking_imgMakerOption').addClass('maker_option_hover');
};

// Event of button cancel
function Maker_dspCancel_click() {

    maker_targetDiv.hide();
    /*enable button */
    enableButtonMarking();
    ClientData.IsAddingMarking(true);
    isAddingMarking = ClientData.IsAddingMarking();
    
    /* unlock dialog overlay */
    $("#overlay").hide();
    
    $('#dlgMarking_imgMakerOption').removeClass();
    $('#dlgMarking_imgMakerOption').addClass('maker_option_hover');
};

function Maker_colorWrapperMouseLeaveFunction() {
    Maker_chooseType(maker_Size, maker_chooseColor);
    //START FIXCSS
    //$('#dlgMaker .colorpicker[colorId="' + maker_chooseColor + '"]').css('border', '1px solid #e6e6e6');
    $('#dlgMaker .colorpicker[colorId="' + maker_chooseColor + '"]').addClass('picker-choose-on');
    $('#dlgMaker .colorpicker[colorId="' + maker_chooseColor + '"]').removeClass('picker-choose-off');
    //END FIXCSS
};

/// ===============================================================================================
/// Maker group [ end ]
/// ===============================================================================================