var tbCb;

/* create all functions with toolbar.* */

//

// INIT the webView Toolbar

//

/* Fade functions - modified the 3rdparty solution*/

var FadeAnim = {

    fade : function (id) {

        opacity = 96;

        this.fadeLoop(id, opacity);

    },

    fadeLoop : function (id, opacity) {

        var o = document.getElementById(id);

        if (opacity >= 5) {

            FadeAnim.setOpacity(o, opacity);

            opacity -= 4;

            window.setTimeout("FadeAnim.fadeLoop('" + id + "', " + opacity + ")", 50);

        } else {

//                        o.style.display = "none";

            o.style.visibility = 'hidden';

            //window.chrome.alert("Menu is " +  o.style.visibility);

            tbCb("hideCplt");

        }

    },

    setOpacity : function (o, opacity) {

        o.style.filter = "alpha(style=0,opacity:" + opacity + ")";      // IE

        o.style.KHTMLOpacity = opacity / 100;                           // Konqueror

        o.style.MozOpacity = opacity / 100;                                     // Mozilla (old)

        o.style.opacity = opacity / 100;                                        // Mozilla (new)

    },

    show : function (id) {

        opacity = 4;

        this.showLoop(id, opacity);

    },

    showLoop : function (id, opacity) {

        var o = document.getElementById(id);

        if (opacity <= 100) {

            FadeAnim.setOpacity(o, opacity);

            opacity += 4;

            window.setTimeout("FadeAnim.showLoop('" + id + "', " + opacity + ")", 50);

        }

        else {

            tbCb("showCplt");

        }

    }

}

/* Utility functions */

function Util() {

    /* Utility function to strip off the given string

     */

    function convertToValue(num, str) {

        var i = num.indexOf(str);

        var value = 0;

        if (i > -1) {

            value = num.slice(0, i);

        }

        return Number(value);

    }

    /* Get the first button if of the toolbar specified by 'view' */

    function firstBtn(tbId) {

        var rowid = getRowId(tbId);

        return (document.getElementById(rowid).firstChild.id);

    }

    /* Get the last button if of the toolbar specified by 'view' */

    function lastBtn(tbId) {

        var rowid = getRowId(tbId);

        return (document.getElementById(rowid).lastChild.id);

    }

    /* Get the row id of the toolbar specified by 'view' */

    function getRowId(tbId) {

       var id;

        switch( tbId) {

            case  "WebViewToolbarId":

                id = "webViewRow";

                break;

            case  "WebViewMiniToolbarId":

                id = "webViewMiniRow";

                break;

            case  "HistoryViewToolbarId":

                id = "historyRow";

                break;

            case  "BookmarkViewToolbarId":

                id = "bookmarkRow";

                break;

            case  "BookmarkHistoryViewToolbarId":

                id = "bookmarkHistoryRow";

                break;

            case  "WindowViewToolbarId":

                id = "windowRow";

                break;

            default:

                break;

        }

        return id;

    }

    /* This function calculates the margin-right needed */

    this.setMarginRight = function(tbId) {

        /* Get the total number of images in the toolbar */

        var firstIcon = firstBtn(tbId);

        var el = document.getElementById(getRowId(tbId));

        Icons = el.getElementsByTagName("img");

        numIcons = Icons.length;

        /* Get total width and total width od all icons */

        var  iconW = document.getElementById(firstIcon).offsetWidth;

        var  totalW =  document.getElementById(tbId).offsetWidth;

        var totalIconW= (iconW * numIcons);

        var firstobj = document.getElementById(firstIcon);

        var lastObj = document.getElementById(lastBtn(tbId));

        switch (numIcons) {

            case 1:

                /* Only one icon */

                var leftMarginStr=document.defaultView.getComputedStyle(firstobj, '').getPropertyValue("margin-left");

                var leftMargin = convertToValue(leftMarginStr, "px");

                var marginRight = totalW - totalIconW - leftMargin;

                Icons[0].style.marginRight = marginRight + "px";

                break;

        default:

            /* More than two buttons */

            var leftMarginStr=document.defaultView.getComputedStyle(firstobj, '').getPropertyValue("margin-left");

            var rightmarginStr=document.defaultView.getComputedStyle(lastObj, '').getPropertyValue("margin-right");

            var leftMargin = convertToValue(leftMarginStr, "px");

            var rightMargin = convertToValue(rightmarginStr, "px");

            var totalMargin = rightMargin + leftMargin ;

            /* Now determine remaining space */

            var marginRight = (totalW - totalIconW - totalMargin)/(numIcons - 1);

            for (var i = 0; i < numIcons; i++ ) {

                if (i !== (numIcons-1)  ){

                    Icons[i].style.marginRight = marginRight + "px";

                }

            }

            break;

        }

    }

}

/* create all functions with toolbar.* */

//

// INIT the webView Toolbar

//

function WebViewToolbar()

{

    var utils = new Util();

    var menuTimeoutCb = _hideToolbar;

    var menuTimeoutId = 0;

    tbCb = _handleToolbarMenuCb;

    //Private methods

    //write webview toolbar HTML code to document

    function _writeWebViewToolbar() {

    var html = ''+

        '<span id="webViewRow" style="width:100%">'+

        '<img class="toolBarBtn firstButton" id="backButton" >'+

        '<span id="menu" >'+

        '<img class="toolBarBtn" id="zoomIn"   >'+

        '<img class="toolBarBtn" id="zoomOut" >'+

        '<img class="toolBarBtn" id="winButton" >'+

        '<img class="toolBarBtn" id="contextMenuButton" >'+

        '</span>'+

        '<img class="toolBarBtn lastButton" id="mvButton">'+

        '</span>';

        document.write(html);

        // We can immediately set up the simple buttons

        // ActionButtons have to wait until the page is loaded

        var index = window.pageController.pageCount();

        var base = "toolbar2.snippet/fjicons/windows" + index;

        new SimpleButton("winButton",

                         base + ".png",

                         base + "_pushed.png",

                         base + ".png",

                         _goToWindowView);

       new SimpleButton("mvButton",

                         "toolbar2.snippet/fjicons/mostVisited.png",

                         "toolbar2.snippet/fjicons/mostVisited_pushed.png",

                         "toolbar2.snippet/fjicons/mostVisited.png",

                         _activateMostVisited);

        new SimpleButton("contextMenuButton",

                          "toolbar2.snippet/fjicons/menu.png",

                          "toolbar2.snippet/fjicons/menu_pushed.png",

                          "toolbar2.snippet/fjicons/menu.png",

                          _contextMenuF);

//       document.getElementById("menu").style.visibility = 'hidden';

       utils.setMarginRight("WebViewToolbarId");

   }

    /* Adds the back action button  using ActionButton from ../../js/ActionButton.js */

    function _setActions () {

        new ActionButton("backButton",

                     "toolbar2.snippet/fjicons/back.png",

                     "toolbar2.snippet/fjicons/back_pushed.png",

                     "toolbar2.snippet/fjicons/back_disabled.png",

                     window.pageController.actions.back);

        new ActionButton("zoomIn",

                     "toolbar2.snippet/fjicons/zoom+.png",

                     "toolbar2.snippet/fjicons/zoom+_pushed.png",

                     "toolbar2.snippet/fjicons/zoom+_disabled.png",

                     window.webView.actions.zoomIn);

        new ActionButton("zoomOut",

                     "toolbar2.snippet/fjicons/zoom-.png",

                     "toolbar2.snippet/fjicons/zoom-_pushed.png",

                     "toolbar2.snippet/fjicons/zoom-_disabled.png",

                     window.webView.actions.zoomOut);

        /* Add 'addWindow' action */

        new ActionButton("addWindow",

                         "toolbar2.snippet/fjicons/addwindow.png",

                         "toolbar2.snippet/fjicons/addwindow_pushed.png",

                         "toolbar2.snippet/fjicons/addwindow_disabled.png",

                         window.viewManager.WindowView.actions.addWindow);

    }

    var timeoutId = 0;

    function _contextMenuF ()

    {

    	  var hideFlag = 0;

    	  hideFlag = window.snippets.ContextMenuId.getContextMenuFlag();

    	  if(hideFlag == 1)

    	  {

    	     	 window.snippets.ContextMenuBgId.hide();

    	     	 window.snippets.ContextMenuId.hide();

    	       return;

    	  }

        clearTimeout(timeoutId);

        window.snippets.ContextMenuBgId.setPosition(0,20);

        window.snippets.ContextMenuBgId.show();

        window.snippets.ContextMenuBgId.zValue = 1;

        window.snippets.ContextMenuId.repaint();

        if (window.snippets.ContextMenuId.getDisplayMode() == "portrait")

            window.snippets.ContextMenuId.setPosition(83,270);

        else //landscape

            window.snippets.ContextMenuId.setPosition(223,130);

        window.snippets.ContextMenuId.show();

        window.snippets.ContextMenuId.zValue = 10;

        timeoutId = setTimeout ( 'window.snippets.ContextMenuId.hide(); window.snippets.ContextMenuBgId.hide()', 6000 ); // close the menu after 6 secs

//        _showToolbar();

    }

    /* Update the windows icon based on the number of windows open */

    function _changeWindowIcon () {

        var index = window.pageController.pageCount();

        var base = "toolbar2.snippet/fjicons/windows" + index;

        document.getElementById('winButton').button.updateImages(base + ".png",

                                                                 base + "_pushed.png",

                                                                 base + ".png");

        //window.snippets.repaint("WebViewToolbarId");

    }

    function _goToWindowView () {        

        window.viewStack.switchView("WindowView", "webView");

    }

    function _goToGoAnywhereView () {

        /* Change to history view */

        window.viewStack.switchView("goAnywhereView", "webView");

    }

    function _goToBookmarkView () {

        /* Change to Bookmark view */

        window.viewStack.switchView("bookmarkTreeView", "webView");

    }

    function _goToRecentUrlView () {

         window.viewStack.switchView("bookmarkHistoryView", "webView");

    }

    function _activateMostVisited () {

    }

    function _chromeLoadComplete () {

        _setActions();

        _changeWindowIcon();

        /* Connect to pageCreated signal */

        window.pageController.pageCreated.connect(_changeWindowIcon);

        /*

        window.pageController.loadStarted.connect(_showToolbar);

        window.pageController.loadFinished.connect(startMenuHideTimer);

        window.pageController.pageScrollRequested.connect(_showToolbar);

        */

    }

    function _showToolbar()  {

        var el = document.getElementById("menu");

        //window.chrome.alert("show Toolbar " +  el.style.visibility);

        if (el.style.visibility != 'visible') {

            document.getElementById("menu").style.visibility = 'visible';

            FadeAnim.show("menu");

        }

    }

    function startMenuHideTimer() {

        //window.chrome.alert("startMenuHideTimer");

        var el = document.getElementById("menu");

        if (el.style.visibility == 'visible' && (!menuTimeoutId) ) {

            //window.chrome.alert("startMenuHideTimer: started timer");

            //menuTimeoutId = setTimeout ('_hideToolbar()', 1000);

            menuTimeoutId = setTimeout (menuTimeoutCb, 3000);

        }

    }

    function _hideToolbar()  {

        //window.chrome.alert("hideToolbar " +  document.getElementById("menu").style.visibility);

        var el = document.getElementById("menu");

        clearTimeout(menuTimeoutId);

        menuTimeoutId = 0;

        if (el.style.visibility != 'hidden' ) {

            FadeAnim.fade("menu");

            //window.chrome.alert("hide Toolbar " +  document.getElementById("menu").style.visibility);

        }

    }

    function _handleToolbarMenuCb(x) {

        if (x == "showCplt" ) {

            startMenuHideTimer();

        }

        else if (x == "hideCplt"){

        }

    }

    function _activateBookmark () {

        window.chrome.toggleVisibility("BookmarkViewToolbarId");

    }

    function _deActivateBookmark () {

        window.chrome.toggleVisibility("BookmarkViewToolbarId");

    }

    function _activateHistory () {

        window.chrome.toggleVisibility("HistoryViewToolbarId");

    }

    function _deActivateHistory () {

        window.chrome.toggleVisibility("HistoryViewToolbarId");

    }

    function _activateBookMarkHistory () {

        window.chrome.toggleVisibility("BookmarkHistoryViewToolbarId");

    }

    function _deActivateBookMarkHistory () {

        window.chrome.toggleVisibility("BookmarkHistoryViewToolbarId");

    }

    function _activateWebView () {

        window.chrome.toggleVisibility("WebViewToolbarId");

    }

    function _deActivateWebView () {

        window.chrome.toggleVisibility("WebViewToolbarId");

    }

    function _activateWindowView () {

        window.chrome.alert("_activateWindowView");

        /* Show the window count snippet */

        document.getElementById('WindowCountBarId').wcChrome.wcUpdateWindowHtml();

        window.chrome.toggleVisibility("WindowCountBarId");

        window.chrome.toggleVisibility("WindowViewToolbarId");

    }

    function _deActivateWindowView () {

        window.chrome.toggleVisibility("WindowCountBarId");

        window.chrome.toggleVisibility("WindowViewToolbarId");

        /* Set the windows icon based on the number of windows */

        _changeWindowIcon();

    }

    function _pageChanged() {

        _changeWindowIcon();

        window.chrome.alert("_pageChanged");

        document.getElementById('WindowCountBarId').wcChrome.wcUpdateWindowHtml();

    }

    function _updateToolbar() {

       utils.setMarginRight("WebViewToolbarId");

    }

    _writeWebViewToolbar();

    window.chrome.loadComplete.connect(_chromeLoadComplete);

    window.viewStack.activateBookmark.connect(_activateBookmark);

    window.viewStack.deActivateBookmark.connect(_deActivateBookmark);

    window.viewStack.activateHistory.connect(_activateHistory);

    window.viewStack.deActivateHistory.connect(_deActivateHistory);

    window.viewStack.activateBookMarkHistory.connect(_activateBookMarkHistory);

    window.viewStack.deActivateBookMarkHistory.connect(_deActivateBookMarkHistory);

    window.viewStack.activateWebView.connect(_activateWebView);

    window.viewStack.deActivateWebView.connect(_deActivateWebView);

    window.viewStack.activateWindowView.connect(_activateWindowView);

    window.viewStack.deActivateWindowView.connect(_deActivateWindowView);

    window.viewStack.pageChanged.connect(_pageChanged);

    window.chrome.onDisplayModeChanged.connect(_updateToolbar);

    window.chrome.viewPortResize.connect(_updateToolbar);

} //end of class webViewToolbar

// INIT the History View Toolbar

function HistoryViewToolbar()

{

    //Private methods

    //write historyview toolbar HTML code to document

    function _writeHistoryViewToolbar() {

        var tbhtml = ''+

        //'<span id="historyRow" style="width:100%">'+

        //'<img class="toolBarBtn firstButton" id="goBacktoWebViewHist">'+

        //'</span>';

        '<table class="toolBarTable">' +

        '<tr>' +

        '<td class="toolBarBtnCell" style="width=100%;"><img class="toolBarBtn" id="goBacktoWebViewHist"></td>'+

        '</tr>' +

        '</table>';

         document.write(tbhtml);

         /* add back button as a simple button */

         new SimpleButton("goBacktoWebViewHist",

                          "toolbar2.snippet/fjicons/back.png",

                          "toolbar2.snippet/fjicons/back_pushed.png",

                          "toolbar2.snippet/fjicons/back.png",

                          _goBackFromGoAnywhereView);

    }

    _goBackFromGoAnywhereView = function() {

        window.viewStack.switchView("webView", "goAnywhereView");

    }

    _writeHistoryViewToolbar();

} //end of class HistoryViewToolbar

// INIT the bookmark View Toolbar

function BookmarkViewToolbar()

{

    //Private methods

    //write webview toolbar HTML code to document

    function _writeBookmarkViewToolbar() {

        var tbhtml = ''+

        //'<span id="bookmarkRow" style="width:100%">'+

        //'<img class="toolBarBtn firstButton" id="goBacktoWebViewBM">'+

        //'<img class="toolBarBtn lastButton"  id="addToBookMark">'+

        //'</span>';

        '<table class="toolBarTable">' +

            '<tr>' +

            '<td class="toolBarBtnCell" style="width=50%;"><img class="toolBarBtn" id="goBacktoWebViewBM"></td>'+

            '<td class="toolBarBtnCell" style="width=50%;"><img class="toolBarBtn" id="addToBookMark"></td>'+

            '</tr>'+

            '</table>';

         document.write(tbhtml);

         /* add back button as a simple button */

         new SimpleButton("goBacktoWebViewBM",

                          "toolbar2.snippet/fjicons/back.png",

                          "toolbar2.snippet/fjicons/back_pushed.png",

                          "toolbar2.snippet/fjicons/back.png",

                          _goBackFromBookmarkView);

         /* add bookmark button as a simple button */

         new SimpleButton("addToBookMark",

                         "toolbar2.snippet/fjicons/addwindow.png",

                         "toolbar2.snippet/fjicons/addwindow_pushed.png",

                         "toolbar2.snippet/fjicons/addwindow.png",

                         _addCurrentPageToBookMark);

    }

    function _goBackFromBookmarkView () {

        window.viewStack.switchView("webView", "bookmarkTreeView");

    }