var comp = new Array();
var ComponentList = new Array();
var funpComps = new Array();
var TabList = new Array();
var waitupdatecount = 0;
var currentTab = null;
var cTab_cookie_name = null;
var tabAction=' <a href="#" onclick="showmenu(\'dash\',event,-24);return false;"><img src="/images/tb.gif" width="18" height="15" class="dropDown"></a>';
var save_static_called = false;
var cn = 0;
var switchtab_retry = 0;

var lastControl;
function thisMovie(movieName) {
    if (navigator.appName.indexOf("Microsoft") != -1) {
        return window[movieName];
    }
    else {
        return document[movieName];
    }
}

function dropdown(x){
   showmenu('dash',null,x+2,192);
}

function setupFlashTab(){
    new Insertion.Top( $('div_flashTab'), '<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" width="100%" height="30" id="flashtab" align="middle">\
        <param name="allowScriptAccess" value="sameDomain" />\
        <param name="movie" value="'+BASE_P+'flash/flashtab.v2.1.swf" />\
        <param name="quality" value="high" />\
        <param name="wmode" value="transparent" />\
    <embed src="'+BASE_P+'flash/flashtab.v2.1.swf" quality="high" scale="noscale" wmode="transparent" width="100%" height="30" swLiveConnect=true name="flashtab" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />\
    </object>');
    
}
function switchtocurrenttab() {
   if( switchtab_retry > 10 )
      alert('點播台分頁切換失敗，請重開瀏覽器。');
   else if( thisMovie('flashtab').getselected() != currentTab ) {
      switchtab_retry++;
      thisMovie('flashtab').switchtab(currentTab);
      setTimeout(switchtocurrenttab,100);
   }
}

function resetflashview() {
   try {
      if( !currentTab ) firstTabSwitch();
      thisMovie('flashtab').setdata(comp);
      thisMovie('flashtab').resetview(currentTab);
      switchtab_retry = 0;
      switchtocurrenttab();
   } catch( e ) {
      setTimeout(resetflashview,100);
   }
}
function showControl(sub_id) {
   if (!$('control_'+sub_id)) return;
   if (lastControl && sub_id!=lastControl) Element.hide('control_'+sub_id);
   lastControl = sub_id;
   Element.show('control_'+sub_id);
}

function hideControl() {
   if (lastControl && $('control_'+lastControl)) Element.hide('control_'+lastControl);
   lastControl = null;
}

function isTab(id) {
   return (TabList.indexOf(id) != -1);
}

function setTab(obj) {
   funpComps[obj.id] = obj;
   ComponentList.push(obj.id);
   TabList.push(obj.id);
   ntab=new Array();
   ntab[0]=obj.title;
   ntab[1]=obj.id;
   ntab[2]=obj.icon;
   comp.push(ntab);
   //resetflashview();
}

function click_tab(testarg) {
   switchTab(testarg);
}
var tabMenu;


//function switchTab2(new_id){hiddenTabChanged=true;switchTab(new_id);}
function switchTab(new_id) {
   hideMenu();
   currentTab = new_id;
   renderTab();
}

function firstTabSwitch(){
   if( currentTab == null ) {
      if( !isUserLogined )
         cTab_cookie_name = 'currentTab_dummy';
      else
         cTab_cookie_name = 'currentTab_user';
      currentTab = parseInt(Cookie.get(cTab_cookie_name));
      var found = false;
      for( var i = 0; i < comp.length; i++ ) {
         if( comp[i][1] == currentTab ) found = true;
      }
      if( !found || !funpComps[currentTab] ) currentTab=null;
   }
   if(!currentTab){
      if(TabList.length==0)
         return;
      currentTab=TabList[0];
   }
   switchTab(currentTab);
}
var syncFlag=false;

function renderTab() {
   Cookie.set(cTab_cookie_name,currentTab);
  
//   Element.addClassName('comptitle_'+currentTab, 'active');
//   Element.update('comptitle_'+currentTab, 
//      '<div class="rightCorner">'+funpComps[currentTab].title+tabAction+'</div>');
   propobj = ej((funpComps[currentTab].properties) ? funpComps[currentTab].properties : '{}');
   fixH = (propobj.fixtab && propobj.fixtab==1) ? ' fixHeight' : '';
   Element.update('tabbedBox', '<div class="colContent'+fixH+'" id="colContent_'+currentTab+'">'); 
   if (funpComps[currentTab].content) Element.update('colContent_'+currentTab, funpComps[currentTab].content); 
   else updateCompContent(currentTab, false); 
}

function addToTab(wrapper_id) {
   hiddenTabChanged=true;
   id = parseInt(wrapper_id.match(/wrapper_(.+)/)[1]);
   funpComps[id].content = null;
   TabList.push(id);
   var ntab=new Array();
   ntab[0]=funpComps[id].title;
   ntab[1]=id;
   ntab[2]=funpComps[id].icon;
   comp.push(ntab);

   switchTab(id);
   //resetflashview();
   thisMovie('flashtab').addtab(ntab);
   //thisMovie('flashtab').switchtab(id);
   if (isUserLogined) updateCompSeq();
   setTimeout(function () {Element.remove(wrapper_id);}, 10);
}

function closeTab(noConfirm) {
   if (!noConfirm && !confirm('確定刪除？')) return;
   index = TabList.indexOf(currentTab);
   for(var a=0;a<comp.length;a++){
      if(comp[a][1]==currentTab){
         comp.splice(a,1);      
         break;
      }
   }
   //resetflashview();   
   thisMovie('flashtab').removetab(currentTab);
   if (funpComps[currentTab].dynamic) ajaxCloseComp(currentTab);
   TabList.remove(currentTab);
   if (TabList.length > 0) {
      if (index == TabList.length) index = TabList.length - 1;
      currentTab = TabList[index];
      thisMovie('flashtab').switchtab(currentTab);
      hideMenu();
      renderTab();
   } else {
      currentTab = null;
      Element.update('tabbedBox', '');
   }
}

function detachFromTab() {
   hiddenTabChanged=true;
   addComp('vCol1', funpComps[currentTab]);
   closeTab(true);
   hideMenu();
}

function updateCurrentTab() {
   updateCompContent(currentTab, false);
   hideMenu();
}

function editCurrentTab() {
   showEditCompDialog(currentTab);
   hideMenu();
}

function clickCurrentTab() {
   clickTitle(currentTab);
   hideMenu();
}

function moveToLeft() {
}

function moveToRight() {
}

function createComp(obj, isnew) {
   // store data structure
   funpComps[obj.id] = obj;
   ComponentList.push(obj.id);
   // add place holder
      if (isnew) ph = '<div id="wrapper_'+obj.id+'" class="Compwrapper" style="display:none">';
      else ph = '<div id="wrapper_'+obj.id+'" class="Compwrapper" >';
      if (obj.collapsed && obj.collapsed=='1') collapsed = 'collapsed';
      else collapsed = '';
      propobj = ej((obj.properties) ? obj.properties : '{}');
      if (!propobj) propobj = {};
      if (!propobj.color) propobj.color = 'c1';
      ph += '<div id="comp_'+obj.id+'" class="column '+propobj.color+'">';
      ph += '<div class="colTitle" onmouseover="mouse_over(this);" onmouseout="mouse_out(this);"><div class="colTitleInner1"><div class="colTitleInner2">';
      ph += '<span style="background-position: '+obj.icon+';" class="favIcon" id="favIcon_'+obj.id+'"></span>';
      ph += '<a href="javascript:collapseComp(\''+obj.id+'\');" class="collapseBtn"><!--IE--></a>';
      ph += '<div class="buttons">';
      ph += '<a href="javascript:updateCompContent(\''+obj.id+'\', false);" title="更新" class="changeBtn"><!--IE--></a>';
      ph += '<a href="javascript:showEditCompDialog(\''+obj.id+'\');" title="設定" class="configBtn"><!--IE--></a>';
//      ph += '<a href="javascript:addToTab(\'wrapper_\''+obj.id+'\');" title="放進去" class="addToTabBtn"><!--IE--></a>';
      ph += '<a href="javascript:closeComp(\''+obj.id+'\');" title="關閉" class="closeBtn"><!--IE--></a>';
      ph += '</div>';
      ph += '<div class="colName"><a href="javascript:clickTitle(\''+obj.id+'\');"  id="comptitle_'+obj.id+'">'+obj.title+'</a></div>';
      ph += '</div></div></div>';
      ph += '<div class="colBorder"><div class="colInnerBorder"><div class="colContent" id="colContent_'+obj.id+'">';
      if (obj.content) { // render directly
      ph += obj.content;
      } else {
      ph += '<img src="'+BASE_P+'images/loading.gif" />';
      }
      ph += '</div></div></div></div>';
      ph += '<div class="colBtm"><div class="colBtm1"><div class="colBtm2"><!--IE--></div></div></div>';
      ph += '</div></div>';
    
      if (isnew) {
         new Insertion.Top(CompContainers[obj.col_id], ph); 
         Effect.Appear('wrapper_'+obj.id);
         createSortables();
         if (!obj.content) // render using ajax
            updateCompContent(obj.id, true);
      } else {
         new Insertion.Bottom(CompContainers[obj.col_id], ph);
         //if( !obj.content )
         //   if( obj.handler != 'rssComp' && obj.handler != 'paperComp' && obj.handler != 'imtvComp' && obj.handler != 'youtubeComp' && obj.handler != 'keySearchComp' )
         //      updateCompContent(obj.id, true); // update by ajax
         //   else
         //      updateCompContentByjs(obj.id);   // update by dynamic scripting
      }
}

function updateCompContentByjs(id)
{
   js = document.createElement('script');
   js.setAttribute('type', 'text/javascript');
   js.setAttribute('src', COMP_PUSH_PATH+'pages/main/comp.js.php?s='+id);
   document.getElementsByTagName('body')[0].appendChild(js);
   waitupdatecount++;
   cn++;
}

function DoUpdateCompByjs(id)
{
   obj = funpComps[id];
   if (isTab(obj.id)) {
      Element.update('colContent_'+obj.id, '<!--IE-->'+funpComps[obj.id].content);
      propobj = ej((obj.properties) ? obj.properties : '{}');
      if (propobj.fixtab && propobj.fixtab == 1) Element.addClassName('colContent_'+obj.id, 'fixHeight');
      else Element.removeClassName('colContent_'+obj.id, 'fixHeight');
//      Element.update('comptitle_'+obj.id,
//         '<div class="rightCorner">'+
//         obj.title+tabAction+'</div>');
//      onPageResize();
   } else {
      if( obj.collapsed )
         Element.addClassName('comp_'+obj.id, 'collapsed');
      else {
         Element.update('colContent_'+obj.id, '<!--IE-->'+funpComps[obj.id].content);
         c = Element.hasClassName('comp_'+obj.id, 'collapsed');
         if( c ) Element.removeClassName('comp_'+obj.id, 'collapsed');
      }
      Element.update('comptitle_'+obj.id, obj.title);
      $('favIcon_'+obj.id).style.backgroundPosition = obj.icon;
   }
   waitupdatecount--;
   if( waitupdatecount == 0 ) createSortables();
}

function UpdateComponents() {
   for (var i=0; i<ComponentList.length; ++i) {
      if (funpComps[ComponentList[i]].col_id != -1)
         updateCompContent(funpComps[ComponentList[i]].id, true); // update by ajax
   }
}

function createSortables() {
   for (var i=0; i<CompContainers.length; ++i) {
      Sortable.create(CompContainers[i],
         {tag:'div',
          only: 'Compwrapper',
          handle:'colName',
          dropOnEmpty:true,
          scroll:window,
          containment: CompContainers,
          onUpdate: updateCompSeq,
          reverteffect:function(element) {
            element.style.top  = 0;
            element.style.left = 0;
          },
          constraint:false});
   }
}

function customizeContent() {
   if (isUserLogined) saveStaticComponents();
   getAddComponentDialog();
   funpDlg.show('add_component_dialog');
}

function customizeLayout() {
   if (isUserLogined) saveStaticComponents();
   showEditTemplateDialog();
}

function saveStaticComponents() {
   if (save_static_called) return;
   save_static_called = true;
   for (var i=0; i<ComponentList.length; ++i) {
      if (!funpComps[ComponentList[i]].dynamic) {
         obj = funpComps[ComponentList[i]];
         extra = '&dummy_id='+encodeURIComponent(obj.id)+
                 '&col_id='+encodeURIComponent(obj.col_id)+
                 '&row_id='+encodeURIComponent(obj.row_id)+
                 '&add=1';
         new Ajax.Request( PORTAL_P+'component.ajax.php?add',
            { method: 'post',
              onSuccess: staticToDynamic,
              postBody: getParamStringById(obj.id) + extra
         });
      }
   }
}

function staticToDynamic(t) {
   rsobj = ej(t.responseText);
   for (var i=0; i<ComponentList.length; ++i) {
      if (!funpComps[ComponentList[i]].dynamic && // is static 
          funpComps[ComponentList[i]].id == rsobj.dummy_id) { // old id matched
          funpComps[rsobj.subscription_id] = funpComps[ComponentList[i]]; // copy
          funpComps[ComponentList[i]] = null; // clear old
          ComponentList[i] = rsobj.subscription_id; // switch
          // change id
          old_id = funpComps[rsobj.subscription_id].id;
          if (TabList.indexOf(old_id) != -1) {
             if (currentTab == old_id) {
               currentTab = rsobj.subscription_id;
//               $('tab_change').href = 'javascript:updateCompContent(\''+currentTab+'\', false);';
 //              $('tab_config').href = 'javascript:showEditCompDialog(\''+currentTab+'\');';
  //             $('tab_close').href = 'javascript:closeTab();';
               $('colContent_'+old_id).id = 'colContent_'+rsobj.subscription_id;
             }
//             Element.update('tabNav', 
//               $('tabNav').innerHTML.replace(new RegExp(old_id, 'g'), rsobj.subscription_id));
             TabList[TabList.indexOf(old_id)] = rsobj.subscription_id;
          } else {
             $('wrapper_'+old_id).id = 'wrapper_'+rsobj.subscription_id;
//             Element.update('wrapper_'+rsobj.subscription_id, 
//               $('wrapper_'+rsobj.subscription_id).innerHTML.replace(new RegExp(old_id, 'g'), rsobj.subscription_id));
             Element.update('comp_'+rsobj.subscription_id, 
               $('comp_'+rsobj.subscription_id).innerHTML.replace(new RegExp(old_id, 'g'), rsobj.subscription_id));
          }
          funpComps[rsobj.subscription_id].id = rsobj.subscription_id;
          funpComps[rsobj.subscription_id].dynamic = true;
          break;
      }
   }
   createSortables();
}

function collapseComp(id) {
   c = Element.hasClassName('comp_'+id, 'collapsed');
   if (c) {
      Element.removeClassName('comp_'+id, 'collapsed');
      funpComps[id].collapsed = false;
      if( !funpComps[id].content ) updateCompContent(id, true);
   } else {
      Element.addClassName('comp_'+id, 'collapsed');
      funpComps[id].collapsed = true;
   }
   if (funpComps[id].dynamic) ajaxCollapseComp(id);
   else if (isUserLogined) saveStaticComponents();
}

function ajaxCollapseComp(id) {
   c = Element.hasClassName('comp_'+id, 'collapsed');
   new Ajax.Request( PORTAL_P+'collapse.ajax.php',
      { method: 'post',
        parameters: 'sid='+id+'&c='+(c ? 'true' : 'false')
   });
}

function closeComp(id) {
   if (!confirm('確定刪除？')) return;
   Element.remove('wrapper_'+id);
   ComponentList.remove(id);
   if (funpComps[id].dynamic) ajaxCloseComp(id);
   else if (isUserLogined) saveStaticComponents();
}

function ajaxCloseComp(id) {
   new Ajax.Request( PORTAL_P+'close.ajax.php',
      { method: 'post',
        parameters: 'sid='+id
   });
}

var compSeqs = null;
function updateCompSeq() {
   tempSeqs = '';
   for (var i=0; i<CompContainers.length; ++i) {
      temp = Sortable.serialize(CompContainers[i], {tag:'div', name:'seq'+i});
      seqs = temp.replace(/&/g,'').split('seq'+i+'[]='); // to array
      seqs.shift(); // drop the first empty element
      // update row_id and col_id
      for (var j=0; j<seqs.length; ++j) {
         for (var k=0; k<ComponentList.length; ++k) {
            if (ComponentList[k] == seqs[j]) {
               funpComps[ComponentList[k]].row_id = j;
               funpComps[ComponentList[k]].col_id = i;
               funpComps[ComponentList[k]].page_id = 1;
            }
         }
      }
      tempSeqs += temp + '&';
   }
   for (var i=0; i<TabList.length; ++i) {
      tempSeqs += 'tab[]=' + TabList[i] + '&';
      funpComps[TabList[i]].row_id = i;
      funpComps[TabList[i]].col_id = -1;
      funpComps[TabList[i]].page_id = 1;
   }
   if (compSeqs == tempSeqs) return;
   compSeqs = tempSeqs;
   new Ajax.Request( PORTAL_P+'updateCompSeq.ajax.php',
      { method: 'post',
        postBody: compSeqs,
        onSuccess: function(t) {
            if (isUserLogined) saveStaticComponents();
        }
   });
}

function getParamStringById(id) {
   obj = funpComps[id];
   return 'subscription_id='+encodeURIComponent(obj.id)+
         '&handler='+encodeURIComponent(obj.handler)+
         '&title='+encodeURIComponent(obj.title)+
         '&resource='+encodeURIComponent(obj.resource)+
         '&properties='+encodeURIComponent(obj.properties)+
         '&collapsed='+encodeURIComponent(obj.collapsed)+
         ((isTab(id)) ? '&tab=yes' : '&tab=no');
}

function updateCompContent(id, whole,action) {
   obj = funpComps[id];
   new Insertion.Top('colContent_'+obj.id, 
      '<div style="position:absolute;z-index:100;background:white;"><img src="'+BASE_P+'images/loading.gif" /></div>');
   extra = (whole) ? '&component=yes' : '&component=no';
   extra += (action) ? '&action='+encodeURIComponent(action) : '&action=no';
   extra += '&width='+Element.getDimensions('colContent_'+id).width;
   extra += (obj.last_viewed) ? '&last_viewed='+obj.last_viewed : '';
   waitupdatecount++;
   doUpdateRequest(id,extra);
}

function doUpdateRequest(id,extra) {
   new Ajax.Request( PORTAL_P+'component.ajax.php',
      { method: 'post',
        postBody: getParamStringById(id) + extra,
        onException: function() {
            Element.update('colContent_'+id, '請重新整理這個元件或整頁');
            waitupdatecount--;
            if( waitupdatecount == 0 ) createSortables();
        }.bind(id),
        onComplete: function(t) {
            rsobj = ej(t.responseText);
            if (!rsobj) return;
            funpComps[rsobj.subscription_id].title = rsobj.title;
            funpComps[rsobj.subscription_id].properties = rsobj.properties;
            funpComps[rsobj.subscription_id].icon = rsobj.icon;
            funpComps[rsobj.subscription_id].collapsed = rsobj.collapsed;
            funpComps[rsobj.subscription_id].content = rsobj.data;
            DoUpdateCompByjs(rsobj.subscription_id);
        }
      }
   );
}

var lastSerialized = null;
function modifyComp(id) {
   current = Form.serialize("edit_component_form");
   if (lastSerialized && lastSerialized == current) {
      funpDlg.close();
      return;
   }
   lastSerialized = current;
   new Ajax.Request( PORTAL_P+'component.ajax.php?modify',
      { method: 'post',
        postBody: current+'&modify=yes&'+getParamStringById(id),
        onSuccess: function(t) {
            funpDlg.close();
            rsobj = ej(t.responseText);
            funpComps[rsobj.id].title = rsobj.title;
            funpComps[rsobj.id].resource = rsobj.resource;
            funpComps[rsobj.id].properties = rsobj.properties;
            if (isTab(rsobj.id)) updateCompContent(rsobj.id, false);
            else updateCompContent(rsobj.id, true);
            if (isUserLogined) saveStaticComponents();
        }
   });
}

function sizeSelector(label, name, values, selectedValue) {
   s = label+'：';
   s += '<select name="'+name+'" id="'+name+'" />';
   for (var i=0; i<values.length; ++i) {
      if (selectedValue == values[i]) selected = ' selected ';
      else selected = '';
      s += '<option value="'+values[i]+'" '+selected+'>'+values[i]+'\n';
   }
   s += '</select>';
   s += '<br/>';
   return s;
}

function dropSelector(label, name, labels, values, selectedValue) {
   s = label+'：';
   s += '<select name="'+name+'" id="'+name+'" />';
   for (var i=0; i<values.length; ++i) {
      if (selectedValue == values[i]) selected = ' selected ';
      else selected = '';
      s += '<option value="'+values[i]+'" '+selected+'>'+labels[i]+'\n';
   }
   s += '</select>';
   s += '<br/>';
   return s;
}

function radioSelector(label, name, labels, values, checkedValue) {
   s = label+'：';
   for (var i=0; i<values.length; ++i) {
      if (checkedValue == values[i]) checked = ' checked ';
      else checked = '';
      s += '<input type="radio" name="'+name+'" value="'+values[i]+'" '+checked+'>';
      s += labels[i]+'\n';
   }
   s += '<br/>';
   return s;
}

function showEditCompDialog(id) {
   showLoading(true);
   obj = funpComps[id];
   extra = '&edit=yes';
   new Ajax.Request( PORTAL_P+'component.ajax.php?edit',
      { method: 'post',
        postBody: getParamStringById(id) + extra,
        onComplete: function(t) {
            head='<form method="POST" id="edit_component_form" action="javascript:modifyComp(\''+obj.id+'\')">';
            mid = '<input type="hidden" name="comp_id" id="comp_id" value="'+obj.id+'"/>';
            tail='</form>';
            button='<input type="submit" id="component_submitBtn" class="positive" value="確定"> '+
            '<input type="button" id="component_cancelBtn" class="negtive" onclick="funpDlg.close()" value="取消">';
            str = getDialogBox('edit_component_dialog',2,mid+t.responseText,button,head,tail);
            new Insertion.Bottom(document.body, str);
            hideLoading();
            funpDlg.show('edit_component_dialog');
        }
       }
   );
}

function showEditTemplateDialog() {
   head='<form method="POST" id="edit_template_form" action="javascript:modifyTemplate()">';
   tail='</form>';
   button='                        <input type="submit" id="component_submitBtn" value="確定"> '+
   '                        <input type="button" id="component_cancelBtn" onclick="funpDlg.close()" value="取消">';
   mid = '';
   mid += radioSelector('版面設定', 'homepage_mode', 
      new Array('3欄', '4欄'), new Array(0, 1), homepage_mode);
   mid += radioSelector('版面風格', 'homepage_style', 
      new Array('預設', '科技', '華麗', '優雅'), new Array(0, 1, 2, 3), homepage_style);
   str = getDialogBox('edit_template_dialog',2,mid,button,head,tail);
   new Insertion.Bottom(document.body, str);
   funpDlg.show('edit_template_dialog');
}

function modifyTemplate() {
   showLoading();
   new Ajax.Request( PORTAL_P+'modifyTemplate.ajax.php',
      { method: 'post',
        parameters: Form.serialize("edit_template_form"),
        onSuccess: function(t) {
            funpDlg.close();
            rsobj = ej(t.responseText);
            if (rsobj.homepage_mode != homepage_mode) changeHomepageMode(rsobj.homepage_mode);
            if (rsobj.homepage_style != homepage_style) changeHomepageStyle(rsobj.homepage_style);
        }
   });
}

function changeHomepageMode(mode) {
   if (mode == 1) { // 3->4
      cols = document.getElementsByClassName('threeCols');
      for (i=0; i<cols.length; ++i) {
         cols[i].className = 'fourCols';
      }
      new Insertion.Top('mainTable', '<col id="firstCol" class="fourCols">');
      CompContainers.push('vCol3');
      $('vCol1').style.width = '25%';
      $('vCol2').style.width = '25%';
      $('sidebar').style.width = '25%';
      x = $('main_row').insertCell($('sidebar').cellIndex);
      x.vAlign = 'top';
      x.className = 'cCol';
      x.rowspan = '2';
      x.id = 'vCol3';
   } else { // 4->3
      cols = document.getElementsByClassName('fourCols');
      for (i=0; i<cols.length; ++i) {
         cols[i].className = 'threeCols';
      }
      Element.remove('firstCol');
      CompContainers.pop();
      $('vCol1').style.width = '33%';
      $('vCol2').style.width = '34%';
      $('sidebar').style.width = '33%';
      new Insertion.Bottom('vCol2', $('vCol3').innerHTML);
      Element.remove('vCol3');
      for (var i=0; i<ComponentList.length; ++i) {
         if (funpComps[ComponentList[i]].col_id == 3) 
            funpComps[ComponentList[i]].col_id = 2;
      }
   }
   if (isUserLogined) updateCompSeq();
   homepage_mode = mode;
   createSortables();
   hideLoading();
}

function changeHomepageStyle(style) {
   homepage_style = style;
}

function clickTitle(id) {
   if (DRAGGING_ELEMENT) return;
   location.href = $F('link_'+id);
}

function toggleDesc(comp_id, index) {
   suffix = comp_id+'_'+index;
   if (Element.empty('desc_'+suffix)) {
      Element.update('desc_'+suffix, decodeURIComponent(descMap['s'+comp_id][index]));
      descMap['s'+comp_id][index] = null;
   }
   Element.toggle('desc_'+suffix);
   if (Element.visible('desc_'+suffix)){
         Element.addClassName('toggler_'+comp_id+'_'+index, 'minusBtn');
         Element.removeClassName('toggler_'+comp_id+'_'+index, 'plusBtn');
   }else{
         Element.addClassName('toggler_'+comp_id+'_'+index, 'plusBtn');
         Element.removeClassName('toggler_'+comp_id+'_'+index, 'minusBtn');
   }
   others = Element.select('colContent_'+comp_id, '.item_description');
   for (var i=0; i<others.length; ++i) {
      if (others[i].id != 'desc_'+suffix) { 
         Element.hide(others[i]);
         Element.addClassName('toggler_'+comp_id+'_'+i, 'plusBtn');
         Element.removeClassName('toggler_'+comp_id+'_'+i, 'minusBtn');
      }
   }
}

var descMap = new Array()