//container for current view values
  var PVFilter   = null ;
  var PSKeywords = null;
  
  var PBSelectedTopLevelObject = null;
  
  
  function dectivatePB()
  {
  
      if (PBSelectedTopLevelObject == null) {
          return;
      }
      
      //close it  
      menuClose(PBSelectedTopLevelObject.sMenuBlockId,PBSelectedTopLevelObject.oLink);
      PBSelectedTopLevelObject = null;
  
  }
  
  function deactivatePS()
  {
      PVFilter.Keywords = '';
      resetSearchBox();  
  }
  
  
  function menuClose(sMenuBlockId,oLink) 
  {
  
      //fold in 
      $(sMenuBlockId).hide();  
  
      //adjust classname
      if (typeof(oLink)=="object") {
          if (oLink.className == 'open') {
              oLink.className = 'close';
          } else {
              oLink.className = 'open';
          }          
      }  
  
  }
  
  function menuOpen(sMenuBlockId,oLink) 
  {
  
      //fold out
      $(sMenuBlockId).show();  
  
  }  
  
  
  //fold in/out menu
  function menuToggle(iLevel,sMenuBlockId, oLink, sPath)
  {
      //fold in and out
      $(sMenuBlockId).toggle();

      //adjust classname
      if (typeof(oLink)=="object") {
          if (oLink.className == 'open') {
              oLink.className = 'close';
          } else {
              oLink.className = 'open';
          }          
      }
      
      //set selected path
      onPictureBrowserPath_Changed(sPath); 

      if (iLevel == 1) {
          
          //a first level item was selected ...
          if (PBSelectedTopLevelObject != null 
              && PBSelectedTopLevelObject.sMenuBlockId != sMenuBlockId) {
              
              // ... and it is different than the last one ...
             
              //CLOSE IT
              menuClose(PBSelectedTopLevelObject.sMenuBlockId,PBSelectedTopLevelObject.oLink);
               
          
          }
                  
          PBSelectedTopLevelObject = {
              'sMenuBlockId' : sMenuBlockId,
              'oLink':oLink
          };    
          
      }
      
  }
  
  //setting busy
  function setContainerBusy(sContainerId) 
  {
      Element.update(sContainerId, '<img id="ContentLoadingIndicator" src="http://www.sbc-support.ch/gallery/components/laf/IAmLoading.gif" border="0" width="31" height="31" alt="" />');
  }
  
  //used as callback to set new view state                
  function setViewState(oCurrentFilter)
  {
     PVFilter = oCurrentFilter;
     
     if (PVFilter.Path != '') {
         $('PictureBrowser').className = 'active';
         $('PictureSearch').className = 'inactive';
     } else if (PVFilter.Keywords) {
         $('PictureBrowser').className = 'inactive';
         $('PictureSearch').className = 'active';
     
     }
     
  }
  
  function setAllKeywords(oKeywords) 
  {            
     PSKeywords = oKeywords;
  }
  
  //
  function updatePictureViewer() 
  {         
      //set busy
      setContainerBusy('PictureViewer');
  
      new Ajax.Updater( 
         { success: 'PictureViewer' } , 
         'index.php?type=service&format=xhtml&object=View&view=PictureViewer',
         { 
            parameters: {  VSUpdate: Object.toJSON(PVFilter) }   ,
            evalScripts: true 
         }
      );
  }
  
  
  function onPicturesPerPage_Changed(sNewValue)
  {
      PVFilter.ThumbPerPage = sNewValue;
      updatePictureViewer()      
  }
  
  function onPictureBrowserPath_Changed(sNewPath) 
  {
      if (PVFilter.Path == sNewPath) return;
  
      PVFilter.Path = sNewPath;
      
      if (PVFilter.Keywords != '') {
         deactivatePS();

      }
            
      updatePictureViewer()        
  
  }
  function onThumbSize_Changed(sNewSize) 
  {
      PVFilter.ThumbSize = sNewSize;
      updatePictureViewer()        
  
  }  
  function onPageNr_Changed(iNewPageNr) 
  {
      PVFilter.DisplayPage = iNewPageNr;
      updatePictureViewer()        
  
  }  
  
  //some data changed update PV
  function onKeywordFilterBox_Changed()
  {
      //deactivate
      dectivatePB();
  
      aFormElements = Form.getElements('SearchBox');
      
      for (i=0; i< aFormElements.length;i++) {
         var item = aFormElements[i]; 
         
         if (item.value == 'choose') {
             aFormElements.splice(i,1);
             continue;
         }
         
         if (! item.name.startsWith('keyword_')) {
             aFormElements.splice(i,1);
         }
      }
      
      PVFilter.Keywords = Form.serializeElements(aFormElements, false);
      PVFilter.Path = '';
      updatePictureViewer();  
  
  }
  
  
  function onKeywordOption_Changed(oSelector)
  {
      //update viewstate
      onKeywordFilterBox_Changed();
  }
  
  
  
  
  var iDivBoxId = 10;   
  //adding a new item
  function onAddNewSelector_Changed(oSelector)
  {
  
      sSelectedOption = oSelector.value;

      iDivBoxId++;
      sNewSelectBoxName = 'keyword_'   + iDivBoxId;
      sDivBoxId         = 'SelLineId_' + sNewSelectBoxName;
  
      //create div container
      oDivBox = new Element('div', { 'id' : sDivBoxId} );
      Element.addClassName(oDivBox,"searc_selline");
  
      //create selectbox
      oSelectBox = new Element( 'select' , { 'name': sNewSelectBoxName } );
      Element.observe(oSelectBox, 'change', function(event){
          onKeywordOption_Changed(event.element());
      });
  
      //adding select options
      for (OptionKey in PSKeywords) {
          OptionCaption = PSKeywords[OptionKey];    
          oOption = new Element('option', {'value':OptionKey}).update(OptionCaption);

          if (sSelectedOption == OptionKey) {
              Element.writeAttribute(oOption , {'selected' : 'selected'});
          } 
          Element.insert(oSelectBox, {bottom:oOption}); 
      }
      
      //create and add remove link 
      a = new Element('a', {'href':'#'} ).update("  [X] ");
      Element.observe( a, 'click', function(event){
       
           sParentId = event.element().parentNode.id;
           onRemoveKeyword_Click(sParentId);
           return false;
      });
       
      oDivBox.update(oSelectBox);
      Element.insert(oDivBox, {bottom:a});
       
      //adding DivBox into SearchBox
      Element.insert(oSelector.parentNode, {before: oDivBox});
      //reset to DefaultOption
      //Element.writeAttribute('DefaultOption', { 'selected':'selected'});
      $('DefaultOption').selected = true;
      //alert($('DefaultOption').selected);
      
      //after adding update viewstate...
      onKeywordFilterBox_Changed()
      
  }

  
  function resetSearchBox()
  {
      //remove elements
      
      
      
      $('SearchBox').childElements().each(function(oDiv) {
         if (oDiv.id == 'SelLineId_keyword_default') {
             return;
         }
         
         Element.remove(oDiv.id);       
      });
     
      
  
  
  
  }
  

  function onRemoveKeyword_Click(sSelectorName)
  {
      Element.remove(sSelectorName);
      
      //after remove update viewstate
      onKeywordFilterBox_Changed();
  }   
  
  //
  function updatePictureSearch() 
  {
      setContainerBusy('PictureSearch');
  
      new Ajax.Updater( 
         { success: 'PictureSearch' } , 
         'index.php?type=service&format=xhtml&object=View&view=PictureSearch', 
         { 
            parameters: {  VSUpdate: Object.toJSON(PVFilter) }   ,
            evalScripts: true 
         }
      );    
  }  
  
  
  function onHelpOpen_Click() 
  {
      //show wrapper
      $('HelpWrapper').show();
  
      //set busy
      setContainerBusy('HelpContent');
      
      //loading help content
      new Ajax.Updater( 
         { success: 'HelpContent' } , 
         'index.php?type=service&format=xhtml&object=View&view=Help', 
         { 
            parameters: {   }   ,
            evalScripts: true 
         }
      );      
  
  
  }
  
  
  function onHelpClose_Click() 
  {
      //show wrapper
      $('HelpWrapper').hide();  
      
      $('HelpContent').update();
  }