function doublePage() {

  this.maxStageWidth    = 530;
  this.maxStageHeight   = 300;
  this.maxPreviewWidth  = 50;
  this.maxPreviewHeight = 60;
  this.maxLayoutWidth   = 50;
  this.maxLayoutHeight  = 50;
  this.pageBleed        = 0; // bleed in mm

  this.setCanvasBorder = function(page) {}

  this.showCanvasBorder = function(lay) {}

  this.setQualityLightPosition = function(light, CBID) {
    return light;
  }

  this.getView = function() {
    return "Preview";
  }

  this.getPageName = function (Nr) {
    // Name
    if (this.Numbers[Nr]) {
      return this.Numbers[Nr].name;
    }
    // Umschlag letzte Seite
    else if (Nr == (this.PageCount + 1)) {
      return this.Numbers[0].name;
    }
    // Seitennummer
    else {
      return Nr;
    }
  }

  this.getNoLayout = function (Nr) {

    var lay = true;

    switch (Nr) {
      case 0:
      case (this.PageCount + 1):
        lay = false;
        break;
    }

    if(project.Page[Nr].empty) {
      lay = false;
    }

    return lay;
  }

  this.getCoverColor = function (color, page, Nr) {
    // setzt die Seitenfarbe und gibt hintergundfarbe zurück
    var Desktop = $("PhotobookDesktop");
    if(this.Page[Nr].type == "cover") {
      Element.setStyle(page, { background: "transparent" });

      var spineWidth   = (this.SpineWidth   * this.Pagefactor);
      var pageWidth    = parseInt(Desktop.childNodes[0].style.width);
      Element.setStyle(Desktop,                 { width: (pageWidth * 2 + spineWidth) + 10 + 'px'});
      Element.setStyle(Desktop.childNodes[1],   { width: (this.SpineWidth * this.Pagefactor) + 'px'});
    }
    else {
      Element.setStyle(page, { background: "#" + color });

      Element.setStyle(Desktop,                 { width: this.DesktopWidth + 'px'})
      Element.setStyle(Desktop.childNodes[0],   { width: (this.PageWidth * this.Pagefactor) + 'px'});
      Element.setStyle(Desktop.childNodes[1],   { width: 0 + 'px'});
      Element.setStyle(Desktop.childNodes[2],    { width: (this.PageWidth * this.Pagefactor) + 'px'});
    }

    var returnColor = this.Page[this.page_cover_last].color;

    var spineWidth = project.SpineWidth;

    // wenn dem Cover andere spezielle Farben zugewiesen werden sollen
    var colorType;
    // Abfrage über linke Coverseite (leinen)
    if ((colorType = this.Page[-2].color_type) && (spineWidth > 0)) {
      $H(this.SpecialCoverColor).each(function(aCoverColorType) {
        if (aCoverColorType.key == colorType) {
          returnColor += "&split_color_type=cover_" + aCoverColorType.key + "&split_color_" + project.Page[-2].color_mode + "=" + aCoverColorType.value + "&spine_width=" + (spineWidth + 10);
        }
      });
    }
    return returnColor;
  }

  this.setNextPage = function(step) {

    this.lastPage = parseInt(project.getActivePage("PhotobookPage", "PhotobookDesktop").split("_")[1]);

    var nextStep = parseInt(this.desktopPages[this.PageSide]) + (step*2);

    if (nextStep > this.maxPageNr) {
      nextStep = this.minPageNr;
    }

    if (nextStep < this.minPageNr) {
      nextStep = this.maxPageNr;
    }

    if ($("PreviewPageLeft_" + nextStep)) {
      this.changePage($("PreviewPageLeft_" + nextStep));
    } else if ($("PreviewPageRight_" + nextStep)) {
      this.changePage($("PreviewPageRight_" + nextStep));
    }
  }

  this.handlePreviewPage = function (e, PageClass, newID) {

    var setPagesArray   = new Array();
    this.activePreview   = newID;
    var dataPageLeft     = ((newID*2));
    var dataPageRight   = ((newID*2)+1);
    var idPageLeft      = PageClass + "Left_" + this.desktopPages["Left"];
    var idPageRight      = PageClass + "Right_" + this.desktopPages["Right"];

    // set DesktopPages (Number and ID)
    this.desktopPages["Left"]   = dataPageLeft;
    this.desktopPages["Right"]   = dataPageRight;

    var PhotobookPageLeft   = $(idPageLeft);
    PhotobookPageLeft.id     = PageClass + "Left_" + dataPageLeft;
    PhotobookPageLeft.parentNode.getElementsByTagName("p")[0].childNodes[0].data = this.getPageName(dataPageLeft);

    var PhotobookPageRight   = $(idPageRight);
    PhotobookPageRight.id   = PageClass + "Right_" + dataPageRight;
    PhotobookPageRight.parentNode.getElementsByTagName("p")[1].childNodes[0].data = this.getPageName(dataPageRight);

    // set DesktopPageStatus: active
    var newID = e.id.split("_")[0];

    if (newID.search(/Left/) != -1) {
      this.setPageSide("Left");
      var Side       = "Left_" + dataPageLeft;
    }
    else {
      this.setPageSide("Right");
      var Side       = "Right_" + dataPageRight;
    }

    this.setActiveSide($("PreviewPage" + Side).parentNode.id.split("_")[1]);

    this.handlePage($(PageClass + Side),false,true);

    setPagesArray["Left"]   = dataPageLeft;
    setPagesArray["Right"]   = dataPageRight;

    return setPagesArray;
  }

  this.handlePage = function(e, relatedPage, safeMode) {

    if(!e.parentNode || !e.parentNode.id)
     return;

    var activePage = e.parentNode.id.split("_")[1];

    if(!activePage) {
      activePage = "Desktop";
    }

    // change single- or double- Page
    if(this.activePageNr == activePage || activePage == "Desktop") {
      var changePages = 1;
    }
    else {
      // save the last doublePage
      this.unsetDesktopActiveBox(getElementsByClass("ContentBox_active", $("PhotobookDesktop"), "div")[0]);
      if(safeMode) {
        this.safeDataFromPage($(this.desktopPageNames["Left"] + this.desktopPages["Left"]), this.desktopPages["Left"]);
        this.safeDataFromPage($(this.desktopPageNames["Right"] + this.desktopPages["Right"]), this.desktopPages["Right"]);
      }
      this.deregisterAllDrags();
      this.setActiveBox("");

      var changePages = 2;
    }

    // change PreviewPage / PhotobookPage
    if(relatedPage) {

      var PageClass = e.parentNode.className;

      // Click auf Preview => Desktop aendern!
      if(PageClass == "Preview") {
        var factor        = this.Pagefactor;
        var newPageClass  = "Photobook";
        PhotobookPageID   = this.handlePreviewPage(e,newPageClass + "Page", e.parentNode.id.split("_")[1]);
      }
       // Click auf Desktop => Preview aendern!
      else {
        var factor        = this.Previewfactor;
        var newPageClass   = "Preview";
        PhotobookPageID   = this.handlePreviewPage(e,newPageClass + "Page",this.activePreview);
      }

      if(changePages == 1) {
        this.setPageLayout($(PageClass + "Page" + this.PageSide + "_" + PhotobookPageID[this.PageSide]), factor, $(newPageClass + "Page" + this.PageSide + "_" + PhotobookPageID[this.PageSide]).id, PhotobookPageID[this.PageSide]);

        if(e.parentNode.className == "Photobook") {
          this.setDropZonePreview($(newPageClass + "Page" + this.PageSide + "_" + PhotobookPageID[this.PageSide]));
        }
      }
      else{
        this.setPageLayout($(PageClass + "PageLeft_" + PhotobookPageID["Left"]), factor, $(newPageClass + "PageLeft_" + PhotobookPageID["Left"]).id, PhotobookPageID["Left"]);
        this.setPageLayout($(PageClass + "PageRight_" + PhotobookPageID["Right"]), factor, $(newPageClass + "PageRight_" + PhotobookPageID["Right"]).id, PhotobookPageID["Right"]);

        if(e.parentNode.className == "Photobook") {
          this.setDropZonePreview($(newPageClass + "PageLeft_" + PhotobookPageID["Left"]));
          this.setDropZonePreview($(newPageClass + "PageRight_" + PhotobookPageID["Right"]));
        }
      }
      this.unsetAllPreviewActiveBoxes(e.id.split("_")[1]);
    }
    e = this.setActivePage(e);

    return e.firstChild;
  }

  this.setPageStyle = function(Page, factor, PageClass, PageNumber) {

    if (PageClass == "PreviewPage" || PageClass == "PreviewPage_active") {
      if (this.Page[parseInt(PageNumber)]) {
        Element.setStyle(Page, { backgroundColor: '#' + this.getCoverColorPreview(this.Page[parseInt(PageNumber)].color, PageNumber) });
      }
    } else {
      Element.setStyle(Page, { backgroundColor: 'transparent'});
      Element.setStyle(Page, { background: ''});
      Element.setStyle(Page, { backgroundColor: ''});
    }

    Page.style.width   = Math.floor(parseFloat(Page.getAttribute("floatWidth")) * factor) + 'px';
    Page.style.height = Math.floor(parseFloat(Page.getAttribute("floatHeight")) * factor) + 'px';
  }

  this.setPreviewPage = function(PageNumber, LayoutLeft, LayoutRight, PreviewListeTemplate, PageNumberLeft, PageNumberRight, PreviewClone) {

    PreviewClone.id = "Preview_" + PageNumber;

    var newPreviewPage     = getElementsByClass("PreviewPage", PreviewClone, "div");
    newPreviewPage[0].id   = newPreviewPage[0].id + "_" + PageNumberLeft;
    newPreviewPage[1].id   = newPreviewPage[1].id + "_" + PageNumberRight;
    var newPreview         = PreviewListeTemplate.firstChild.appendChild(PreviewClone);

    if (this.projectXML[PageNumberLeft]) {
      this.buildPageContent(PageNumberLeft, LayoutLeft, newPreviewPage[0].id, this.Previewfactor, this.projectXML[PageNumberLeft], "Preview");
    } else {
      this.setPageLayout(LayoutLeft, this.Previewfactor, newPreviewPage[0].id, PageNumberLeft);
    }

    if (this.projectXML[PageNumberRight]) {
      this.buildPageContent(PageNumberRight, LayoutRight, newPreviewPage[1].id, this.Previewfactor, this.projectXML[PageNumberRight], "Preview");
    } else {
      this.setPageLayout(LayoutRight, this.Previewfactor, newPreviewPage[1].id, PageNumberRight);
    }

    newPreview.getElementsByTagName("p")[0].childNodes[0].data   = this.getPageName(PageNumberLeft);
    newPreview.getElementsByTagName("p")[1].childNodes[0].data   = this.getPageName(PageNumberRight);
    newPreview.style.display = "block";
  }

  this.setDesktopPage = function(Page, Layout, PageNumber, side, paragraph) {
    Page.id = "PhotobookPage" + side + "_" + PageNumber;
    Page.parentNode.getElementsByTagName("p")[paragraph].childNodes[0].data = this.getPageName(PageNumber);
    this.setPageLayout(Layout, this.Pagefactor, Page.id, PageNumber);
  }

  this.init = function (bookPageLayout, PageNumberL, PageNumberR) {

    // set scrollFunk(bool, firstPage)
     this.setScroll(true, -1);

    // unregister Dropzones
    dndMgr.dropZones = new Array();

    var bookPage                    = $(bookPageLayout);
    var PhotobookFrame              = $("PhotobookFrame");
    var PreviewPage                 = $("Preview");
    var newPhotobook               = $("PhotobookDesktop");
    var PreviewListeTemplate       = $("PreviewListeTemplate");

    this.desktopPages["Left"]      = PageNumberL;
    this.desktopPages["Right"]      = PageNumberR;
    this.desktopPageNames["Left"]  = "PhotobookPageLeft_";
    this.desktopPageNames["Right"] = "PhotobookPageRight_";
    this.previewPageNames["Left"]  = "PreviewPageLeft_";
    this.previewPageNames["Right"] = "PreviewPageRight_";

    //********************************************************************************************************************************//
    //******************************************************** Init Previews *********************************************************//
    //********************************************************************************************************************************//
    // PreviewListeTemplate leeren
    if(PreviewListeTemplate.firstChild.hasChildNodes()){
      while(PreviewListeTemplate.firstChild.hasChildNodes()) {
        PreviewListeTemplate.firstChild.removeChild(PreviewListeTemplate.firstChild.firstChild);
      }
    }

    // init Previews
    this.maxPages               = (parseInt(this.PageCount) / 2);
    var PreviewPageInnerWidth   = parseFloat(bookPage.firstChild.getAttribute("floatWidth"));
    var BorderWidth              = 6;

    // Calculation for Preview-List-Width: ((Pagewidth * Viewfactor * 2) + MarginLeft + MarginRight + PaddingLeft + PaddingRight + BorderWidth)
    this.setPreviewPageWidth((parseFloat(bookPage.getAttribute("floatWidth")) * this.Previewfactor * 2) + 15 + BorderWidth);

    PreviewListeTemplate.firstChild.style.width           = ((this.PreviewPageWidth * (this.maxPages + 3))) + 'px';
    PreviewPage.style.border                               = "1px solid #000000";
    PreviewPage.getElementsByTagName("p")[0].style.width   = this.PreviewWidth   + "px";
    PreviewPage.getElementsByTagName("p")[1].style.width   = this.PreviewWidth   + "px";
    PreviewPage.style.height                              = this.PreviewHeight   + 10 + "px";    // 10 = CSS -padding,-border...
    PreviewListeTemplate.style.height                     = this.PreviewHeight   + 40 + "px";    // 40  = CSS -padding,-border... + Paragraph

    this.minPageNr = -2;

    var cover_lay_right = $("BookPage_2");
    // cover doppelseite
    if(!this.getNoLayout(-1)) {
      cover_lay_right = $("BookPage_Empty");
    }

    this.setPreviewPage(-1, $("BookPage_Empty"), cover_lay_right, PreviewListeTemplate, this.minPageNr, -1, PreviewPage.cloneNode(true));

    // erste doppelseite
    this.setPreviewPage(0, $("BookPage_Empty"), bookPage, PreviewListeTemplate, 0, 1, PreviewPage.cloneNode(true));

    for(e = 1; e < this.maxPages; e++) {
      this.setPreviewPage(e, bookPage, bookPage, PreviewListeTemplate, ((e*2)), ((e*2)+1), PreviewPage.cloneNode(true));
    }

    this.maxPageNr = this.PageCount + 1;
    this.setPreviewPage(this.maxPages, bookPage, $("BookPage_Empty"), PreviewListeTemplate, this.PageCount, this.maxPageNr, PreviewPage.cloneNode(true));

    // nachdem alle preview pages eingebunden sind
    $('PreviewList').style.height = PreviewListeTemplate.offsetHeight + 20 + "px";    // PreviewListeTemplate.style.height + scrollbalkenhöhe + 8(top) + 12(bottom)

    //********************************************************************************************************************************//
    //******************************************************** Init Desktop **********************************************************//
    //********************************************************************************************************************************//
    // PhotobookDesktopSize
    this.DesktopWidth    = (this.PageWidth * this.Pagefactor * 2 + BorderWidth + 1);
    this.DesktopHeight  = (this.PageHeight * this.Pagefactor + 20);

    newPhotobook.style.width       = this.DesktopWidth + "px";
    newPhotobook.style.height     = this.DesktopHeight + "px";

    // PhotobookFrameSize for Pages
    this.bgCoverSize[0]           = (this.PageWidth * this.Pagefactor * 2) + (this.SpineWidth * this.Pagefactor) + (this.CoverHeight * 0.08);
    this.bgCoverSize[1]            = this.DesktopHeight;

    // PhotobookFrameSize for Cover
    this.bgCoverSize[-1]          = (this.CoverHeight * this.Pagefactor) + (this.CoverHeight * 0.05);

    PhotobookFrame.style.width     = this.bgCoverSize[0] + 'px';
    PhotobookFrame.style.height   = (parseInt(newPhotobook.style.height) + 10) + 'px';
    $('toolbar_step_forward').style.top  = (this.bgCoverSize[1]/2-10) + 'px';
    $('toolbar_step_backward').style.top = (this.bgCoverSize[1]/2-10) + 'px';

    var activePreviewPageL = $("PreviewPageLeft_"  + PageNumberL);
    var activePreviewPageR = $("PreviewPageRight_" + PageNumberR);

    // set left DesktopPage
    this.setDesktopPage(newPhotobook.childNodes[0], activePreviewPageL, PageNumberL, "Left", 0);
    // set Bookspine
    newPhotobook.childNodes[1].style.height = bookPage.getAttribute("floatHeight") * this.Pagefactor + 'px';
    // set right DesktopPage
    this.setDesktopPage(newPhotobook.childNodes[2], activePreviewPageR, PageNumberR, "Right", 1);

    this.scrollFunk('PreviewListeTemplate',true);
    this.setActivePage(activePreviewPageR);
    this.handlePage(activePreviewPageR, true, false);
    this.setDesktopContentBox();
    this.saveProject('saveAll');
    this.setDropZoneDesktop();

    // register content for preloading
    var addContent = getElementsByClass("ContentBox", $("PhotobookDesktop"), "div");
    addContent = addContent.concat(getElementsByClass("ContentBox", $("PreviewListeTemplate"), "div"));

    // start the preloader
    preloader = new contentPreloader(addContent);
    setTimeout(function() { preloader.projectPreloader() }.bind(this), 100);

    // init active Box
    this.setDesktopActiveBox($("PhotobookDesktop").childNodes[2].childNodes[0]);
    this.setActiveBox($("PhotobookDesktop").childNodes[2].childNodes[0].id.split("Photobook")[1]);

    // init Tab menu
    var tabMenuList = $('projectPalette').getElementsByTagName("li");
    this.showTab(null, tabMenuList[(tabMenuList.length-1)], tabMenuList);

    // coverfarbe setzen
    this.setColor(-2, this.Page[-2].color, this.Page[-2].type, "Left");
  }
}

startEditor = function(open_project, user_id, project_id, format, cover, surface, page_width, page_height, page_count, cover_color, linen_color, leather_color, page_color, show_page, product_type, firstStart, projectOptions) {

  var xml_layout = product_type + "_" + format;

  // start doublePage
  doublePage.prototype = new PageEditor(user_id, project_id, format, cover, surface, page_width, page_height, page_count, cover_color, linen_color, leather_color, page_color, show_page, product_type, xml_layout, firstStart, projectOptions);
  project = new doublePage();
  project.pageType = 'double';

  // initalise the project XML, init, open Project by ID, Sides
   project.getProjectXML(true, 2);
}