genericDlg = function(){
}

genericDlg.veil = null;
genericDlg.veilZ = 90;
genericDlg.dlg=null;
genericDlg.id='genericdlg';
genericDlg.panel=null;
genericDlg.autoclose=false;
genericDlg.beforeClose=null;
genericDlg.fading=null;

genericDlg.veilInit = function(){
   if (genericDlg.veil == null) { // once per page
      genericDlg.veil = document.createElement('div');
      genericDlg.veil.className = "dlgVeil";
      s=genericDlg.veil.style;
      s.zIndex = genericDlg.veilZ ;
      s.position = 'absolute';
      s.left = '0px';
      s.top= '0px';
      s.backgroundColor='black';
      genericDlg.veil.innerHTML = " ";
      document.body.appendChild(genericDlg.veil);
   }
   Element.setOpacity(genericDlg.veil,0.5);
   Event.observe(window,"resize",genericDlg.doResize,false);
   Event.observe(genericDlg.veil,"click",genericDlg.close,false);
   Event.observe(window,"scroll",genericDlg.doResize,false); //skip because .dialog css is set position:fixed
}

genericDlg.doResize = function(){
   genericDlg.moveToCenter();
   genericDlg.veilSetWidth();
}

genericDlg.veilSetWidth = function() {
   ssize=genericDlg.getScreenSize();
   genericDlg.veil.style.width= document.body.scrollWidth +"px";
   genericDlg.veil.style.height= ((document.body.scrollHeight>ssize.height )? document.body.scrollHeight: ssize.height)+"px";
}

genericDlg.setFullScreen = function(o) {
   screenSize=genericDlg.getDocumentSize();
   o.style.width = screenSize.width +"px";
   o.style.height = screenSize.height+"px";
}

genericDlg.veilShow = function(showIt) {
   genericDlg.veilInit();
   genericDlg.veilSetWidth();
   genericDlg.veil.style.display = showIt ? "block" : "none";
}

genericDlg.build=function(html){
   if(genericDlg.dlg) {Element.remove(genericDlg.dlg);}
   genericDlg.dlg=document.createElement('div');
   genericDlg.dlg.className='genericDlg '+(genericDlg.wide?'wideDialog':'');
   genericDlg.dlg.id=genericDlg.id;
   genericDlg.dlg.style.display='none';
   genericDlg.dlg.innerHTML =
   '<b class="genericDlgTop"> <b class="genericDlgTop1"><b></b></b><b class="genericDlgTop2"><b></b></b><b class="genericDlgTop3"></b><b class="genericDlgTop4"></b><b class="genericDlgTop5"></b></b>'+
   '<div id="genericDlg_panel" class="dlg_panel">'+html+'</div>'+
   '<b class="genericDlgTop"> <b class="genericDlgTop5"><b></b></b><b class="genericDlgTop4"><b></b></b><b class="genericDlgTop3"></b><b class="genericDlgTop2"></b><b class="genericDlgTop1"></b></b>';
   document.body.appendChild(genericDlg.dlg);
   genericDlg.panel = $('genericDlg_panel');
}

genericDlg.gen_buttons=function(btns){
   buttons = '';
   for(var i=0;i<btns.length;++i) buttons += genericDlg.gen_button(btns[i]);
   return '<div class="dlg_buttons">'+buttons+'</div>';
}
genericDlg.gen_button=function(btn){
   if( !btn.label || !btn.onclick ) return '';
   return '<input type="button" class="positive" id="'+(btn.id?btn.id:'')+'" value="'+btn.label+'" onClick="'+btn.onclick+'"/>';
}
genericDlg.gen_content=function(title,content){
   return '<h2>'+title+'</h2>'+'<div class="dlg_content">'+content+'</div>';
}
genericDlg.close=function(){
   genericDlg.veilShow(false);
   Event.stopObserving(window,"resize",genericDlg.doResize,false);
   Event.stopObserving(genericDlg.veil,"click",genericDlg.close,false);
   Event.stopObserving(window,"scroll",genericDlg.moveToCenter,false); //skip because .dialog css is set position:fixed
   if(genericDlg.beforeClose)
   genericDlg.beforeClose();
   genericDlg.beforeClose=null;
   if(genericDlg.dlg){
      Element.remove(genericDlg.dlg);
      genericDlg.dlg=null;
   }
   genericDlg.fading = false;
}

genericDlg.moveToCenter=function(noani,pos_top){
   if(!genericDlg.dlg) return;
   genericDlg.moveCompToCenter(genericDlg.dlg,noani,pos_top);
}
genericDlg.moveCompToCenter=function(dlg,noani,pos_top){
   var elementSize=Element.getDimensions(dlg);
   var screenSize=genericDlg.getScreenSize();
   var scrollPos=genericDlg.getScrollOffset(); //skip because .dialog css is set position:fixed
   // var scrollPos = {top:0,left:0};
   var newtop = scrollPos.top;
   if( pos_top ) newtop += pos_top; else newtop += (screenSize.height-elementSize.height)/2;
   var newleft = (scrollPos.left+(screenSize.width-elementSize.width)/2);
   if( noani ) {
      dlg.style.top=newtop+'px';
      dlg.style.left=newleft+'px';
   }else{
      new Effect.Move (dlg,
      { x: newleft, 
        y: newtop, 
        mode: 'absolute',
        duration: 0.3});
   }
}

genericDlg.getDocumentSize=function(){
   return {width:document.body.offsetWidth,height:document.body.offsetHeight};
}

genericDlg.getScreenSize=function(){
   var x,y;
   if (self.innerHeight) {
      x = self.innerWidth-18;
      y = self.innerHeight-18;
   }
   else if (document.documentElement && document.documentElement.clientHeight) {
      x = document.documentElement.clientWidth;
      y = document.documentElement.clientHeight;
   }
   else if (document.body) {
      x = document.body.clientWidth;
      y = document.body.clientHeight;
   }
   return {width:x,height:y};
}

genericDlg.getScrollOffset=function(){
   var x,y;
   if (self.pageYOffset) // all except Explorer
   {
      x = self.pageXOffset;
      y = self.pageYOffset;
   }
   else if (document.documentElement && document.documentElement.scrollTop)
   {
      x = document.documentElement.scrollLeft;
      y = document.documentElement.scrollTop;
   }
   else if (document.body) // all other Explorers
   {
      x = document.body.scrollLeft;
      y = document.body.scrollTop;
   }
   return {left:x,top:y};
}

genericDlg.shake=function(){
   Effect.Shake(genericDlg.dlg);
}

genericDlg.fadeout=function(){
   if( !genericDlg.dlg ) return;
   genericDlg.fading = true;
   Effect.Fade(genericDlg.veil,{duration:0.1});
   Effect.Fade(genericDlg.dlg,{duration:0.2,afterFinish:genericDlg.close});
}

genericDlg.show_dialog=function(id,html,autoclose,wide,pos_top){
   hideMenu();
   if( genericDlg.fading ) {
      setTimeout(function(){genericDlg.show_dialog(id,html,autoclose,wide)},300);
      return;
   }
   genericDlg.veilShow(true);
   genericDlg.id = 'genericdlg_'+id;
   genericDlg.wide = (wide?true:false);
   genericDlg.autoclose = autoclose;
   genericDlg.build(html);
   genericDlg.dlg.style.top=0;
   genericDlg.dlg.style.left=0;
   genericDlg.dlg.style.zIndex=genericDlg.veilZ+1;
   genericDlg.moveToCenter(true,pos_top);
   Element.show(genericDlg.dlg);
   if( genericDlg.autoclose ) setTimeout(function(){genericDlg.fadeout();},750);
}

genericDlg.show_loading=function(id,text){
   genericDlg.show_dialog(id,'<div class="dlg_loading">'+text+'</div>',false,false,150);
}

genericDlg.show_ajax_dialog=function(id,action,params,btns){
   showLoading();
   genericDlg.show_loading(id,'載入中...');
   new Ajax.Request(action, {  
      method: "post",  
      parameters: params,
      onSuccess:function(rs){
         hideLoading();
         rsobj = ej(rs.responseText);
         if (rsobj.error) {
            genericDlg.show_error( rsobj );
         } else {
            Element.hide(genericDlg.panel);
            Element.update(genericDlg.panel, rsobj.content);
            Effect.BlindDown(genericDlg.panel,{duration:0.3/*,afterFinish:function(){genericDlg.moveToCenter();}*/});
         }
      },
      onFailure:function() {
         hideLoading();
         Element.update(genericDlg.panel, '傳輸錯誤');
      }});
}
genericDlg.post_ajax=function(form_id){
   var form = $(form_id);
   showLoading();
   new Ajax.Request(form.action, {  
      method: "post",  
      parameters: Form.serialize(form),
      onSuccess:function(rs){
         hideLoading();
         rsobj = ej(rs.responseText);
         if (rsobj.beOK) {
            Element.update(genericDlg.panel, "更新成功");
            if( rsobj.autoclose ) setTimeout(function(){genericDlg.fadeout();},750);
            if( rsobj.reload ) window.location.reload();
         } else {
            genericDlg.show_error( rsobj );
         }
      },
      onFailure:function() {
         hideLoading();
         Element.update(genericDlg.panel, '傳輸錯誤');
      }});
}

genericDlg.show_form=function(id,html,title,buttons){
   var content='<form action="'+target+'" method="post">'+html+genericDlg.gen_content(buttons)+'</form>';
   genericDlg.show_dialog(id,genericDlg.gen_content(content));
}

genericDlg.show_message=function(id,html,title,buttons,noautoclose){
   if(!buttons) buttons = [{name:'ok',label:'確認',onclick:'genericDlg.fadeout();'}];
   html = genericDlg.gen_content(title, html)+genericDlg.gen_buttons(buttons);
   genericDlg.show_dialog(id,html,!noautoclose);
}

genericDlg.show_confirm=function(id,html,title,handle,oklabel){
   var buttons = [ {name:'ok',label:(oklabel?oklabel:'確認'),onclick:'genericDlg.fadeout();'+handle},
               {name:'cancel',label:'取消',onclick:'genericDlg.fadeout();'}];
   html = genericDlg.gen_content(title, html)+genericDlg.gen_buttons(buttons);
   genericDlg.show_dialog(id,html);
}
genericDlg.show_error=function( rsobj ){
   var content = genericDlg.gen_content(rsobj.errorTitle, rsobj.errorDesc)+
                 genericDlg.gen_buttons([{name:'ok',label:'確認',onclick:'genericDlg.fadeout();'}]);
   Element.update(genericDlg.panel, content);
}