
/// <reference path="../common/js/jquery-ui-1.8.23.custom.min.js" />

/// <reference path="../common/js/common.js" />

/// <reference path="contentview_VarDef.js" />

/// <reference path="contentview_CallApi.js" />

/// <reference path="contentview_GetData.js" />


/* init Image memo */
function initImageMemo() {
    if (ClientData.IsDisplayMemo() == true) {
        //change class
        $('#imgmemo').removeClass();
        $('#imgmemo').addClass('memoDisplay_hover');

    } else {
        //change class
        $('#imgmemo').removeClass();
        $('#imgmemo').addClass('memoDisplay');
    }
};

/* init Image add memo */
function initImageAddMemo() {
    if (ClientData.IsAddingMemo() == true) {
        //change class
        $('#imgaddmemo').removeClass();
        $('#imgaddmemo').addClass('memoAdd_hover');

    } else {
        //change class
        $('#imgaddmemo').removeClass();
        $('#imgaddmemo').addClass('memoAdd');

    }
};

/*check display marking?? */
function initDisplayMarking() {
    if (ClientData.IsDisplayMarking() == true) {
        // change class
        $('#imgmarking').removeClass();
        $('#imgmarking').addClass('marking_hover');

        if (ClientData.IsAddingMarking() == true) {
            if (ClientData.IsHideToolbar() == false) {
                ShowMarking();
            }

            disableAllControl();
        } else {
            //change image				
            $('#imgmarkingtoolbar').removeClass();
            $('#imgmarkingtoolbar').addClass('markingToolbar');

        }
    } else {
        $("#dlgMarking").hide();

        // change class
        $('#imgmarking').removeClass();
        $('#imgmarking').addClass('marking');

        $('#draw_canvas').css('display', 'none');

        //change image				
        $('#imgmarkingtoolbar').removeClass();
        $('#imgmarkingtoolbar').addClass('markingToolbar');

    }
};


/* init Image bookmark */
function initImageBookmark() {
    if (isExistBookmark() == -1) {
        //change class
        $('#imgbookmark').removeClass();
        $('#imgbookmark').addClass('bmAdd_off');

    } else {
        //change class
        $('#imgbookmark').removeClass();
        $('#imgbookmark').addClass('bmAdd');
    }
};


/* init flag marking, memo when init page */
function initFlagDisplay() {
    ClientData.IsDisplayMemo(false);
    ClientData.IsAddingMemo(false);
    if (ClientData.userOpt_makingDsp() == "1") {
        ClientData.IsDisplayMarking(true);
    } else {
        ClientData.IsDisplayMarking(false);
    }
    ClientData.IsAddingMarking(false);
};


/* set size bot toolbar for ipad */
function initDisplayToolbarDevice() {
    if (avwUserEnvObj.os == "ipad" || avwUserEnvObj.os == "android") {
        $('.transition').css('padding', '4px 0 0 0');
        $('.sizing').css('padding', '4px 0 0 2px');
        $('.toolbar').css('margin', '0 0 0 0');
    }
};


function initPage() {
    

    $('#divImageLoading').css('display', 'block');

    /* init footer toolbar */
    $('#footer_toolbar_2').hide();
    $('#footer_toolbar_1').show();

    /* init pos bottom toolbar*/
    initDisplayToolbarDevice();  

    // Lock screen
    LockScreen();

    getContentID();

    StartTimerUpdateLog();

    /* set start log */
    SetStartLog(contentID);

    /* get info of content */
    //Start Function: No.12
    if(contentType == ContentTypeKeys.Type_Image){
        getContentInfoTypeImage();
    }
    else if(contentType == ContentTypeKeys.Type_NoFile){
        //Start Function: No.4 - Editor : Long - Date: 08/20/2013
        getPageTransitionConfig();
        //End Function : No.4 - Editor : Long - Date : 08/20/2013
        
        //Start Function: No.12 - Editor : Long - Date: 08/28/2013
        getJsonContentInfoTyeNone();
        //Start Function: No.12 - Editor : Long - Date: 08/28/2013
    }
    else{
        getJsonContentInfo();
        
        //Start Function: No.4 - Editor : Long - Date: 08/20/2013
        getPageTransitionConfig();
        //End Function : No.4 - Editor : Long - Date : 08/20/2013
    }
    //End Function: No.12
    
    initializeViewerComponent('wrapper');

    /* handle display tooltip */
    handleTooltip();

    /* set text dialog confirm of audio */
    createTextConfirmAudio();

    /* handle toolbar */
    $('#control_screen').click(handleDisplayToolbar);
    $('#control_screen_2').click(handleDisplayToolbar);

    /* bookmark Page */
    $('#imgbookmark').click(bookmarkPage);
    $('#listbookmark').click(showListBookMark);
    $('#divListBookmark li').live('click', clickBookmark);

    /* close bookmark dialog */
    //$("#bookmarkClosing").live('click',closeBookmarkBox);


    //Start Function : No.12
    if(contentType == ContentTypeKeys.Type_PDF){
        /* page index */
        $('#listindex').click(showListPageIndex);
        $('#divSearchResult li').live('click', clickSearchDetail);
    
        /* copy text */
        $('#copytext').click(showCopyText);
        /* close copy text dialog */
        $("#copyTextClosing").click(closeCopyTextBox);
    }
    

    /*event click next page button */
    $('#nextpage').click(nextPage_click);
    $('#button_next_canvas').click(nextPage_click);
    /*event click prev page button */
    $('#prevpage').click(prevPage_click);
    $('#button_pre_canvas').click(prevPage_click);
    /*event click fist page button */
    $('#firstpage').click(firstPage_click);
    /*event click last page button */
    $('#lastpage').click(lastPage_click);

    $("#imgBack").click(imgBack_click);
    $("#imgHome").click(imgHome_click);
    $("#btn_show_memo").click(showEditMemo);
    $("#btn_copy_memo").click(copyMemo);
    $('#memoClosing').click(closePopUpCopyMemo);
    $('#liAddMemo').click(click_liAddMemo);
    $('#liCopyMemo').click(click_liCopyMemo);
    $('#liDeleteMemo').click(click_liDeleteMemo);

    //Start Function: No.12
    if(contentType == ContentTypeKeys.Type_PDF){
        /*event search*/
        showListSearchResult();
    }
    //End Function: No.12
    
    /* zoom event */
    $('#zoomin').click(zoomIn);
    $('#zoomout').click(zoomOut);
    $('#zoomfit').click(screenFit);

    /* event memo */
    $('#imgmemo').click(handleMemo);
    $('#imgaddmemo').click(handleAddMemo);

    /* event marking */
    $('#imgmarking').click(imgmarking_click);
    $('#imgmarkingtoolbar').click(handleDrawCanvas);

    /*draw canvas*/
    drawOnCanvas();

    /*init flag */
    initFlagDisplay();

    sizingScreen();

    /* move image check marking*/
    $('#divCheckExistMarking').css('top', '70px');
    $('#divCheckExistMarking').hide();

    /* disable controls */
    isLoadingObject = true;
    disableAllControl();

    /* window resize event */
    $(window).resize(function () {  
                                        
        //Start : TRB00015 - Editor : Long - Date : 08/28/2013 - Summary : For win 8 rotate handling.
        setViewportForWin8();
        //End : TRB00015 - Editor : Long - Date : 08/28/2013 - Summary : For win 8 rotate handling.
        
        sizingScreen();     
        /* close dialog popuptext */
        closeDialogResize();
        
    });

    $(document).ajaxComplete(function () {

        /*Init Page */
        nAjaxLoad++;
        if (nAjaxLoad == 7) {

            /* handle from bookmark page */
            //handleFromBookMarkPage();	
            /* check move content */
            if (ClientData.bookmark_pageNo()) {

                handleFromBookMarkPage();

            } else if (ClientData.common_prePageNo()) {
                /* handle from jump content */
                handleFromJumpContent();
            } else if (ClientData.IsJumpBack() == true) {
                /* handle back */
                oldContent_Back();
            } else {
                if (getPageIndex() == 0) {
                    getContent().setPageImages(totalPage, pageImages)
					 				.setPageObjects(pageObjects)
					 				.setUpPage(0);
                                                           
                    //Start Function: No.12 - Editor : Long - Summary : Render next page
                    //Get next
                    
                    if(totalPage > 1){
                        getNextPageObjectsByPageIndex(pageObjectsData, getPageIndex() + 1);
                    
                        //Render next page
                        renderNextPage();
                    }

                    
                    //End Function: No.12 - Editor : Long - Summary : Render next page

                    /* set pageTitle*/
                    if (dataPageTitle[0]) {
                        if (dataPageTitle[0] != '') {
                            document.title = contentName + '_' + dataPageTitle[0] + ' | ' + i18nText('sysAppTitle');
                        } else {
                            document.title = contentName + ' | ' + i18nText('sysAppTitle');
                        }
                    } else {
                        document.title = contentName + ' | ' + i18nText('sysAppTitle');
                    }

                    /* handle slider bar */
                    handleSliderBar();
                }
            }

            /* window resize event */
            $(window).resize(function () {               

                if (isTouchDevice() == true) {
                    if (avwUserEnvObj.os == "android") {
                        var tempRatio = document.documentElement.clientWidth / window.innerWidth;
                        if (tempRatio <= 1) {
                            // Adjust position for toolbar and footer bar
                            var top = window.innerHeight - $("#footer_toolbar_1").height();
                            $("#wrapper").css("width", window.innerWidth);
                            $("#wrapper").css("height", window.innerHeight);
                            $("#footer_toolbar_1").css("top", top + "px");
                            $("#footer_toolbar_2").css("top", top + "px");
                        }
                        else {
                            var top = $(window).height() - $("#footer_toolbar_1").height();
                            $("#wrapper").css("width", $(window).width());
                            $("#wrapper").css("height", $(window).height());
                            $("#footer_toolbar_1").css("top", top + "px");
                            $("#footer_toolbar_2").css("top", top + "px");
                        }
                    }
                }

                resizeScreen();
                isChangeSizeScreen = false;

                /* change position dialog */
                changePosDialog();

                /* close dialog popuptext */
                closeDialogResize();                

            });

            /* check status button */
            checkExistNextPrePage();

            /*init Image Bookmark */
            initImageBookmark();

            $('#lblSlider').text('/ ' + totalPage);
            /* memo */
            initImageMemo();
            initImageAddMemo();

            /* init image had draw */
            initDisplayMarking();

            /* check status */
            checkStatusImageMarking();

            trackTransforms(context_main);

            //nAjaxLoad = 0;	

            if (isTouchDevice() == true) {
                if (avwUserEnvObj.os == "android") {
                    standardRatio = document.documentElement.clientWidth / window.innerWidth;
                    startDetectZoom({ time: 500,
                        callbackFunction: function (oldRatio, newRatio, oldW, oldH, newW, newH) {
                            currentRatio = newRatio;

                        }
                    });
                    var top = window.innerHeight - $("#footer_toolbar_1").height();
                    $("#wrapper").css("width", window.innerWidth);
                    $("#wrapper").css("height", window.innerHeight);
                    $("#footer_toolbar_1").css("top", top + "px");
                    $("#footer_toolbar_2").css("top", top + "px");
                    sizingScreen();
                }
            }
        }

    });
};

function initPageMediaAndHtmlType(){
    
    //$('#divImageLoading').css('display', 'block');

    /* init footer toolbar */
    $('#footer_toolbar_2').hide();
    $('#footer_toolbar_1').show();

    /* init pos bottom toolbar*/
    initDisplayToolbarDevice();

    // Lock screen
    LockScreen();
      
    //enable SpecifyControl
    enableSpecifyControl();
    
    //Display overlay dialog for specify content type
    displayOverlayForSpecifyContentType();
    
    //Resize window
    $(window).resize(function () {
        
        //Check if content is zooming
        if(isZoomingContent){
            var $container = $("#dialog");
            var w = window.innerWidth;
            var h = window.innerHeight;
            
            $container.css('height', h);
            $container.css('width', w);
        }                
    });
    
    handleSliderBar();
    $('#lblSlider').text('/ ' + 1);
    
    if (avwUserEnvObj.os != "android") {
        $("#slider_page").slider("option", "disabled", true);
    }

    disable('#txtSearch', '#txtSlider');
};

//Start: Function: No.4 - Editor : Long - Date : 08/09/2013 - Summary : Create next and previous canvas
/* Initialize PageViewer Component */
function initializeViewerComponent(viewId) {

    /* add some tags we need.*/
    $('#' + viewId).prepend(
        '<div id="canvasWrapper">' +
        '<canvas id="mainPre"></canvas>' +
        '<canvas id="main"></canvas>' +
        '<canvas id="mainNext"></canvas>' +
        '</div>' +
        '<canvas id="offscreenPre"></canvas>' +
        '<canvas id="offscreen"></canvas>' +
        '<canvas id="offscreenNext"></canvas>' +
        '<canvas id="draw_canvas"></canvas>' +
        '<canvas id="marker_canvas"></canvas>' +
        '<div id="playvideo"></div>' +
        '<div id="playaudio" style="width:0px; height:0px;"></div>' +
        '<div id="playaudiopage" style="width:0px; height:0px;"></div>' +
        '<div id="playaudioallpage" style="width:0px; height:0px;"></div>' +
        '<div id="text"></div>'
        );

    

    /* apply css style */
    $('#canvasWrapper').css(
        {
            'position': 'absolute',
            'height' : '100%',
            'width' : '100%',
            'left': '0px'
        }
    );
    
    //Start : Function : No.20 - Editor : Le Long - Date: 27/08/2013 - Summary : For performing on ipad. On Android 4.1.x do not use overflow : hidden in parent canvas
                                                                            //to avoid draw duplicate canvas bug. 
    
    if(avwUserEnvObj.os == 'ipad'){
        $('#wrapper').css('overflow', 'hidden');
    }
    
    //End: Function : No.20 - Editor : Le Long - Date: 27/08/2013 - Summary : For performing on ipad. On Android 4.1.x do not use overflow : hidden in parent canvas
                                                                            //to avoid draw duplicate canvas bug. 
      
    $('#main').css(
        {
            'position': 'absolute',
            'top': marginY + 'px',
            'left': marginX + 'px',
            'box-shadow': '3px 3px 14px #333',
            'background-color': 'rgba(153, 153, 153, 0.7)',
            'border-radius': '4px'
        }
    );  
    
    
    if(animateType == animateTypeKeys.Type_Slide){
        $('#mainNext').css(
            {
    
                'position': 'absolute',
                'top': marginY + 'px',
                'left': marginX + 'px',
                'box-shadow': '3px 3px 14px #333',
                'background-color': 'rgba(153, 153, 153, 0.7)',
                'border-radius': '4px',
                'display': 'none'
            }
        );
        $('#mainPre').css(
            {
    
                'position': 'absolute',
                'top': marginY + 'px',
                'left': marginX + 'px',
                'box-shadow': '3px 3px 14px #333',
                'background-color': 'rgba(153, 153, 153, 0.7)',
                'border-radius': '4px',
                'display': 'none'
            }
        );
    }
    else{
        $('#mainNext').css(
            {
    
                'position': 'absolute',
                'top': marginY + 'px',
                'left': marginX + 'px',
                'box-shadow': '3px 3px 14px #333',
                'background-color': 'rgba(153, 153, 153, 0.7)',
                'border-radius': '4px',
                'display': 'none'
            }
        );
        $('#mainPre').css(
            {
    
                'position': 'absolute',
                'top': marginY + 'px',
                'left': marginX + 'px',
                'box-shadow': '3px 3px 14px #333',
                'background-color': 'rgba(153, 153, 153, 0.7)',
                'border-radius': '4px',
                'display': 'none'
            }
        );
    }
    
    $('#offscreen').css(
        {
            'visibility': 'hidden',
            'display': 'none'
        }
    );
     $('#offscreenPre').css(
        {
            'visibility': 'hidden',
            'display': 'none'
        }
    );
     $('#offscreenNext').css(
        {
            'visibility': 'hidden',
            'display': 'none'
        }
    );

    $('#marker_canvas').css(
        {
            'display': 'none',
            'position': 'absolute',
            'cursor': 'default'

        }
    );

    $('#draw_canvas').css(
        {
            'display': 'none',
            'position': 'absolute',
            'cursor': 'default'
        }
    );

    $('#playvideo').css(
        {
            'position': 'fixed',
            'top': marginY + 'px',
            'left': marginX + 'px'
        }
    );

    //set default event
    setDefaultEvent();

    /*init canvas value */
    canvas_marker = document.getElementById('marker_canvas');
    context_marker = canvas_marker.getContext('2d');
    canvas_draw = document.getElementById('draw_canvas');
    context_draw = canvas_draw.getContext('2d');
    canvas_main = document.getElementById('main');
    context_main = canvas_main.getContext('2d');
    canvas_offscreen = document.getElementById('offscreen');
    context_offscreen = canvas_offscreen.getContext('2d');
};
//End: Function: No.4 - Editor : Long - Date : 08/09/2013 - Summary : Create next and previous canvas

/* init image if exist marking in page */
function initImageCheckMarking() {
    /* set draw image if exist */
    var dataMarking = ClientData.MarkingData();

    var isExistMarking = false;
    
    //Start Function: No.12 - Editor : Long
    
    var tempPageNo = 0;
    if(contentType == ContentTypeKeys.Type_Image)
    {
        tempPageNo = 1;
    }
    else{
        tempPageNo = changePageIndex(getPageIndex());
    }
    //End Function: No.12 - Editor : Long
    
    
    for (var nIndex = 0; nIndex < dataMarking.length; nIndex++) {
        if (dataMarking[nIndex].contentid == contentID
		&& dataMarking[nIndex].pageNo == tempPageNo) {
            isExistMarking = true;
            break;
        }
    }

    /* init image display or not */
    if (ClientData.IsAddingMarking() == true) {
        $('#divCheckExistMarking').hide();
    } else {
        if (isExistMarking == true) {
            $('#divCheckExistMarking').show();
        } else {
            $('#divCheckExistMarking').hide();
        }
    }
};



