Event.observe(window, 'load', function() {
  
  right_shadow = false;
  left_shadow = false;

formInterface = '/interfaces/form_epubli_jig_form.php?page=';

/*
if(option == 'editor'){
  Event.observe('e_jig', 'click', function(event) {
    $('e_jig_editor_form').onsubmit = function(){
      alert('test');
      $('e_jig_editor_form').request();
      editor_setPage(page);
      return false;
    }
  });
}
*/

function loaded(elm,p) {
  var Bild = new Image();
  Bild.src = contentInterface+pages[p*2];
  if(Bild.complete) {
  $(elm).style.background="url('"+contentInterface+pages[(p*2)]+"') #ffffff";
  }
  else {
   setTimeout(function(){ loaded(elm,p); }, 100); 
  }
}

function browser_setPage(p){

  switch(p){
  // fornt cover
  case cover_front:
    browser_setCover('e_jig_browser_book_front','front');
    $('e_jig_browser_book').hide();
    $('e_jig_browser_book_cover').show();
    $('e_jig_browser_book_front').show();
    $('e_jig_browser_book_back').hide();

    $('e_jig_browser_navi_left').hide();
    $('e_jig_browser_navi_right').show();
  break;
  case cover_back:
    browser_setCover('e_jig_browser_book_back','back');

    $('e_jig_browser_book').hide();
    $('e_jig_browser_book_cover').show();
    $('e_jig_browser_book_front').hide();
    $('e_jig_browser_book_back').show();

    $('e_jig_browser_navi_left').show();
    $('e_jig_browser_navi_right').hide();
  break;
  default:
    browser_setContent(p);
    $('e_jig_browser_book').show();
    $('e_jig_browser_book_cover').hide();

    $('e_jig_browser_navi_left').show();
    $('e_jig_browser_navi_right').show();

    // shift Position of the page
    browser_shiftPage(p);
  break;
  }

  // preload pages befor/after the current page
//  browser_preLoad(p);
}

function editor_setPage(p){

  switch(p){
  // fornt cover
  case cover_front:
    browser_setCover('e_jig_browser_book_front','front');
    editor_setForm('e_jig_browser_book_back','front');
    
    $('e_jig_browser_book').hide();
    $('e_jig_browser_book_cover').show();
    $('e_jig_browser_book_front').show();
    $('e_jig_browser_book_back').show();

    $('e_jig_browser_navi_left').hide();
  break;
  case cover_back:
    browser_setCover('e_jig_browser_book_front','back');
    editor_setForm('e_jig_browser_book_back','back');

    $('e_jig_browser_book').hide();
    $('e_jig_browser_book_cover').show();
    $('e_jig_browser_book_front').show();
    $('e_jig_browser_book_back').show();

    $('e_jig_browser_navi_right').show();
    $('e_jig_browser_navi_left').show();
  break;
  default:
    editor_setContent(p);
    $('e_jig_browser_book').show();
    $('e_jig_browser_book_cover').hide();
    editor_setForm('e_jig_browser_page1',p);

    $('e_jig_browser_navi_left').show();
    if(p<page_max){
      $('e_jig_browser_navi_right').show();
    }
    else {
      $('e_jig_browser_navi_right').hide();
    }
  break;
  }

  // preload pages befor/after the current page
//  browser_preLoad(p);
}

function browser_setCover(div,type){
  $(div).style.background="url('"+coverInterface+type+"') #ffffff";
}

function editor_setForm(div,type){
  $(div).addClassName('e_jig_editor_frame');
  new Ajax.Updater(div, formInterface+type, { method: 'get' });
}

function browser_setContent(p) {
  // load new page

  if(p < (page_min+1) && binding == "hc"){ // cover-page2 hc -> white, no shadow
    background_page1 = "#ffffff";
    left_shadow = false;
  }
  else{
    background_page1 = "url('"+contentInterface+(parseInt(pages[p*2]))+"&s=l&sh=1') #ffffff";
    left_shadow = true;
  }
  $('e_jig_browser_page1').style.background = background_page1;

  if(p > page_total-1 && binding == "hc"){ // cover-page3 hc -> white, no shadow
    background_page2 = "#ffffff";
    right_shadow = false;
  }
  else{
    background_page2 = "url('"+contentInterface+(parseInt(pages[(p*2)+1]))+"&s=r&sh=1') #ffffff";
    right_shadow = true;
  }
  $('e_jig_browser_page2').style.background = background_page2;
}

function editor_setContent(p) {
  console.log(p);
  background_page2 = "url('"+contentInterface+(parseInt(pages[p]))+"&sh=0') #ffffff";
  $('e_jig_browser_page2').style.background = background_page2;
}

function browser_shiftPage(p){
  // shift page
  if(shift>0){
    shiftof = (shift*pages[p]/page_total);
    sol = 5+shiftof;
    $('e_jig_browser_page1').setStyle({left: sol+'px'});
    sor = 298+shiftof;
    $('e_jig_browser_page2').setStyle({left: sor+'px'});
  }
}

function browser_preLoad(p){
  for (var i=Math.max((p-2)*2,0); i<Math.min(pages.length,(p+5)*2);i++){
  var Bild = new Image();
  Bild.src = contentInterface+pages[i];
  }
}

if(option == 'editor'){
  var page_max = pages.length-1;
  var page_min = 0;
  var cover_back = page_min-1;
  var cover_front = page_min-2;
  var page_start = cover_front;
  var page = page_start;

  editor_setPage(page);
}
if(option == 'preview') {
  var page_max = (pages.length/2)-1;
  var page_min = 0;
  var cover_back = page_max+1;
  var cover_front = page_min-1;
  var page_start = cover_front;
  var shift = 100;
  var page = page_start;

  browser_setPage(page);
}


if(option != 'editor'){
  Event.observe('e_jig', 'mouseover', function(event) {
    var element = $(Event.findElement(event));
    if((element == $('e_jig_browser_page1') || element == $('e_jig_browser_page1_shadow') || element == $('jig_browser_navi_pp').firstChild) && left_shadow && !Prototype.Browser.IE){
      $('e_jig_browser_page1_shadow').show();
    }
    if((element == $('e_jig_browser_page2') || element == $('e_jig_browser_page2_shadow') || element == $('jig_browser_navi_np').firstChild) && right_shadow && !Prototype.Browser.IE){
      $('e_jig_browser_page2_shadow').show();
    }
  });

  Event.observe('e_jig', 'mouseout', function(event) {
    var element = $(Event.findElement(event));
    if(element == $('e_jig_browser_page1') || element == $('e_jig_browser_page1_shadow') || element == $('jig_browser_navi_pp').firstChild){
      $('e_jig_browser_page1_shadow').hide();
    }
    if(element == $('e_jig_browser_page2') || element == $('e_jig_browser_page2_shadow') || element == $('jig_browser_navi_np').firstChild){
      $('e_jig_browser_page2_shadow').hide();
    }
  });

  Event.observe('e_jig', 'click', function(event) {
    var element = $(Event.findElement(event));
    if(element == $('e_jig_browser_page1') || element == $('e_jig_browser_page1_shadow') || element == $('e_jig_browser_book_back') || element == $('jig_browser_navi_pp').firstChild){
      if(page>cover_front){
        page --;
        browser_setPage(page);
      }
    }
    if(element == $('e_jig_browser_page2') || element == $('e_jig_browser_page2_shadow') || element == $('e_jig_browser_book_front') || element == $('jig_browser_navi_np').firstChild){
      if(page<cover_back){
        page ++;
        browser_setPage(page);
      }
    }
    if(element == $('jig_browser_navi_lp').firstChild){
        page = cover_back;
        browser_setPage(page);
    }
    if(element == $('jig_browser_navi_fp').firstChild){
        page = cover_front;
        browser_setPage(page);
    }
  });
}
else {
  Event.observe('e_jig', 'click', function(event) {
    var element = $(Event.findElement(event));
    if(element == $('jig_browser_navi_pp').firstChild){
      if(page>cover_front){
        page --;
        editor_setPage(page);
      }
    }
    if(element == $('jig_browser_navi_np').firstChild){
      if(page<page_max){
        page ++;
        editor_setPage(page);
      }
    }
  });

}

});