needsupdate = false;
if (navigator.userAgent.match(/Safari/)) {
    safari = true;
} else {
    safari = false;
}

config_selectedyear = 0;
var currentImage = 0;
var numimage = 0;

dojo.require("dojo.io.bind");
djConfig.isDebug=1;

//dojo.require("dojo.widget.*");
dojo.require("dojo.widget.ColorPalette");
dojo.require("dojo.widget.Button");
    dojo.require("dojo.widget.Menu2");
    dojo.require("dojo.widget.Manager");


showTemplatepreview = true;


function Hex2Dec(hex) {
    return parseInt(hex,16);
}
function findPos ( oElement ) {
  function getNextAncestor( oElement ) {
    var actualStyle;
    if( window.getComputedStyle ) {
      actualStyle = getComputedStyle(oElement,null).position;
    } else if( oElement.currentStyle ) {
      actualStyle = oElement.currentStyle.position;
    } else {
      //fallback for browsers with low support - only reliable for inline styles
      actualStyle = oElement.style.position;
    }
    if( actualStyle == 'absolute' || actualStyle == 'fixed' ) {
      //the offsetParent of a fixed position element is null so it will stop
      return oElement.offsetParent;
    }
    return oElement.parentNode;
  }
  if( typeof( oElement.offsetParent ) != 'undefined' ) {
    var originalElement = oElement;
    for( var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent ) {
      posX += oElement.offsetLeft;
      posY += oElement.offsetTop;
    }
    if( !originalElement.parentNode || !originalElement.style || typeof( originalElement.scrollTop ) == 'undefined' ) {
      //older browsers cannot check element scrolling
      return [ posX, posY ];
    }
    oElement = getNextAncestor(originalElement);
    while( oElement && oElement != document.body && oElement != document.documentElement ) {
      posX -= oElement.scrollLeft;
      posY -= oElement.scrollTop;
      oElement = getNextAncestor(oElement);
    }
    return [ posX, posY ];
  } else {
    return [ oElement.x, oElement.y ];
  }
}

function findPosOld2( oElement ) {
 alert('new find pos');
  if( typeof( oElement.offsetParent ) != 'undefined' ) {
    var originalElement = oElement;
    for( var posX = 0, posY = 0; oElement; oElement = oElement.offsetParent ) {
      posX += oElement.offsetLeft;
      posY += oElement.offsetTop;
      if( oElement != originalElement && oElement != document.body && oElement != document.documentElement ) {
        posX -= oElement.scrollLeft;
        posY -= oElement.scrollTop;
      }
    }
    return [ posX, posY ];
  } else {
    return [ oElement.x, oElement.y ];
  }
}

function findPosOld (obj) {
    var curleft = curtop = 0;
    if (obj.offsetParent) {
        do {
            curleft += obj.offsetLeft;
            curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);
    }
    return [curleft,curtop];
}

function wizardPageComplete(type, data, evt)
{
  var tag = '<wizard-goto>';
  var p = data.indexOf(tag);
  if(p != -1) {
    var e = data.indexOf('<', p + tag.length);
    var url;
    if(e == -1) {
      url = data.substr(p + tag.length);
    } else {
      url = data.substr(p + tag.length, e - (p + tag.length));
    }
    top.location.href = url;
  } else {
    dojo.byId('wizard').innerHTML = data;
  }
}


function inigt() {
    /*
    templatearea = document.getElementById('templateArea');
    dojo.io.bind({
    url: "ajax_templates.php",
    load: function(type, data, evt) {templatearea.innerHTML = data},
    error: function(type, error) { alert(error) },
    mimetype: "text/plain"
});
    */
}


function gotoPage(page) {
    alert('salig');
    loading = document.getElementById('divLoading');
    if (loading) {
        alert("Odota, että kuvat ovat latautuneet ennen kuin vaihdat sivua");
        return;
    }
    dojo.io.bind({
        url: "ajax_templates.php?offset=" + page,
        load: function(type, data, evt) {dojo.byId('templateArea').innerHTML = data},
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
        });
}

var djConfig={
    isDebug:true,
        debugContainerId:"dojoDebug"
        };

function init() {

    // Hack to it only works with card/calendars
    if (window.location.href.match(/(cardsv2|calendarsv2)/)) {
        // Load templates:
        dojo.io.bind({
            url: "ajax_templates.php",
            load: function(type, data, evt) {dojo.byId('templateArea').innerHTML = data},
            error: function(type, error) { alert(error) },
            mimetype: "text/plain"
        });
    }
}

function changeSelection(clicked) {
    if (typeof(clicked) != "undefined") {

        if (clicked == 2) {
            if (document.getElementById('orientationPortrait').checked) {
                document.getElementById('portraitImage').src = '/design/DEFAULT/graphics/card/portrait.gif';
                document.getElementById('orientationPortrait').checked = false;
            }
            else {
                document.getElementById('portraitImage').src = '/design/DEFAULT/graphics/card/selected_portrait.gif';
                document.getElementById('orientationPortrait').checked = true;
            }
        }

        if (clicked == 1) {
            if (document.getElementById('orientationLandscape').checked) {
                document.getElementById('landscapeImage').src = '/design/DEFAULT/graphics/card/landscape.gif';
                document.getElementById('orientationLandscape').checked = false;
            }
            else {
                document.getElementById('landscapeImage').src = '/design/DEFAULT/graphics/card/selected_landscape.gif';
                document.getElementById('orientationLandscape').checked = true;
            }
        }



        // Check the value of view:
        multiView = document.getElementById('multiview');
        if (clicked == 4) {
            document.getElementById('singledisplay').src= '/design/DEFAULT/graphics/card/singledisplay_selected.gif';
            document.getElementById('multidisplay').src= '/design/DEFAULT/graphics/card/multidisplay.gif';
            multiView.value = "false";
        }
        else if (clicked == 3) {
            multiView.value = "true";
            document.getElementById('singledisplay').src= '/design/DEFAULT/graphics/card/singledisplay.gif';
            document.getElementById('multidisplay').src= '/design/DEFAULT/graphics/card/multidisplay_selected.gif';
        }
    }

    // Orientation stuff:
    if (document.getElementById('orientationLandscape').checked) {
        document.getElementById('landscapeImage').src = '/design/DEFAULT/graphics/card/selected_landscape.gif';
    } else {
        document.getElementById('landscapeImage').src = '/design/DEFAULT/graphics/card/landscape.gif';
    }

    if (document.getElementById('orientationPortrait').checked) {
        document.getElementById('portraitImage').src = '/design/DEFAULT/graphics/card/selected_portrait.gif';
    } else {
        document.getElementById('portraitImage').src = '/design/DEFAULT/graphics/card/portrait.gif';
    }


    

    dojo.io.bind({
        url: "ajax_templates.php",
        load: function(type, data, evt) {dojo.byId('templateArea').innerHTML = data},
        error: function(type, error) { alert(error) },
        mimetype: "text/plain",
        formNode : "chooseForm"
    });
}


function photogiftUpdatePrices(custom) {

    // Set prices to default values:
    var i = 0;
    while (document.getElementById('quantity_photogift_' + i)) {
        document.getElementById('product_price_' + i).innerHTML = "..";
        i++;
    }

    qpg = document.getElementById('product_price');
    if (qpg) {
        qpg.innerHTML = '..';
    }
    tQ = document.getElementById('totalQuantity');
    if (tQ) {
        tQ.innerHTML = '..';
    }
    tP = document.getElementById('totalPrice');
    if (tP) {
        tP.innerHTML = '..';
    }

    if (custom == "custom") {
        addr = "ajax/getprices_custom.php";
    }
    else {
        addr = "ajax/getprices.php";
    }

    dojo.io.bind({
        url: addr,
        load: function(type, data, evt) {
            sdata = data.split(";");
            var i = 0;
            while (document.getElementById('quantity_photogift_' + i)) {
                document.getElementById('product_price_' + i).innerHTML = sdata[i];
                i++;
            }
            if (qpg) {
                qpg.innerHTML = sdata[0];
            }
            if (tQ) {
                tQ.innerHTML = sdata[i];
            }
            i++;
            if (tP) {
                tP.innerHTML = sdata[i];
            }
        },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain",
        formNode : "copiesForm"
    });
}

function photogiftNumberOfCopies(openPopup) {
    totalQty = 0
    i = 0
    while (document.getElementById('quantity_photogift_' + i)) {
        totalQty += document.getElementById('quantity_photogift_' + i).value;
        i++;
    }

    elm = document.getElementById('quantity_photogift');
    if (elm) {
        totalQty += elm.value;
    }

    if (totalQty == 0) {
        alert("Valitse kuvamäärä ennenkuin jatkat!");
        return;
    }

    dojo.io.bind({
        url: "ajax/do_add_to_shoppingcart.php",
        load: function(type, data, evt) { 
            if (typeof(openPopup) == "undefined") {
                document.location = '/sections/printsorder/shoppingcart.php';
            }
            else {
                
                OpenPopup(openPopup + "?items=" + data); 
            }
        },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain",
        formNode : "copiesForm"
        });
}

function addFolderCardsToCart() {
    totalQty = 0
    i = 0
    while (document.getElementById('quantity_photogift_' + i)) {
        totalQty += document.getElementById('quantity_photogift_' + i).value;
        i++;
    }

    elm = document.getElementById('quantity_photogift');
    if (elm) {
        totalQty += elm.value;
    }

    if (totalQty == 0) {
        alert("Valitse kuvamäärä ennenkuin jatkat!");
        return;
    }

    dojo.io.bind({
        url: "ajax/do_add_foldercards_to_cart.php",
        load: function(type, data, evt) { 
            document.location = '/sections/printsorder/shoppingcart.php';
        },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain",
        formNode : "copiesForm"
        });
}

function chooseNumberOfCopies(templatetype) {
    copies = document.getElementById('numberofcopies').value;
    if (copies == 0)
        copies = 1;
    dojo.io.bind({
        url: "ajax_wizard.php?page=numberofcopies&copies=" + copies + "&type=" + templatetype,
        load: function(type, data, evt) { document.location = '/sections/printsorder/shoppingcart.php'; },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });
}

function waitWhileGenerating(templatetype) {
    dojo.io.bind({
        url: "ajax_wizard.php?page=checkGenerating&type=" + templatetype,
        load: function(type, data, evt) { alert(data);  checkIfDone(data, templatetype); },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
   });
}

function checkIfDone(data, type) {
    if (data == "done") {
        document.location = '/sections/printsorder/shoppingcart.php';
    }
    else {
        dojo.byId('wizard').innerHTML = data;
        setTimeout('waitWhileGenerating("'+type+'")', 5000);
    }
}


function logIn() {
    dojo.io.bind({
    url: "ajax_wizard.php?page=login",
    load: wizardPageComplete,
    error: function(type, error) { alert(error) },
    mimetype: "text/plain",
    formNode : "calendarLoginForm"
    });
}
function calendarLogin() {
    dojo.io.bind({
    url: "ajax/login.php",
    load: function(type, data, evt) {
        if (data != "OK") {
            dojo.byId('loginError').innerHTML = data + '<br>';
            dojo.byId('loginError').style.display = 'inline';
        }
        else {
            OpenPopup("choosealbum.php");
        }
    },
    error: function(type, error) { alert(error) },
    mimetype: "text/plain",
    formNode : "loginForm"
    });
}

function photogiftLogin() {
    dojo.io.bind({
    url: "ajax/login.php",
    load: function(type, data, evt) {
        if (data != "OK") {
            dojo.byId('loginError').innerHTML = data + '<br>';
            dojo.byId('loginError').style.display = 'inline';
        }
        else {
            if (window.location.href.match(/(cardsv2)/)) {
                location.href = '/sections/storage/archive.php?mode=setactiveimage&ref=/sections/cardscalendars/cardsv2/create.php?loadscript=1';
            }
            else {
                location.href = '/sections/storage/archive.php?mode=setactiveimage&ref=/sections/cardscalendars/photogifts/create.php?loadscript=1';
            }
        }
    },
    error: function(type, error) { alert(error) },
    mimetype: "text/plain",
    formNode : "loginForm"
    });
}

function chooseFolder() {
    dojo.io.bind({
    url: "ajax_wizard.php?page=choosefolder",
    load: function(type, data, evt) { top.location.href="/sections/cardscalendars/calendarsv2/create.php"; },
    error: function(type, error) { alert(error) },
    mimetype: "text/plain",
    formNode : "showFolderList"
    });
}

function getWindowSizeXY() {
    var winW = 630, winH = 460;

    if (navigator.appName=="Netscape") {
        winW = window.innerWidth;
        winH = window.innerHeight;
    }
    else  {
        winW = document.body.offsetWidth;
        winH = document.body.offsetHeight;
    }
    return [winW, winH];
}


function getScrollXY() {
    var scrOfX = 0, scrOfY = 0;
    if( typeof( window.pageYOffset ) == 'number' ) {
        //Netscape compliant
        scrOfY = window.pageYOffset;
        scrOfX = window.pageXOffset;
    } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
        //DOM compliant
        scrOfY = document.body.scrollTop;
        scrOfX = document.body.scrollLeft;
    } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
        //IE6 standards compliant mode
        scrOfY = document.documentElement.scrollTop;
        scrOfX = document.documentElement.scrollLeft;
    }
    return [ scrOfX, scrOfY ];
}

function hideTemplatePreview() {
    templatepreview = document.getElementById('templatePreview');
    if (templatepreview) {
        templatepreview.style.display = 'none';
    }
}

function showTemplatePreview(id, event, type) {
    if (showTemplatepreview == false)
        return;
    if (!event) event = window.event;
    var scroll = getScrollXY();
    

    currentx = event.clientX+scroll[0] + 15;
    currenty = event.clientY+scroll[1] + 15;
   
    templatepreview = document.getElementById('templatePreview');
    newimage = document.getElementById('image' + id);
    
    if (type == 1) {
        newheight = 300;
        newwidth = 180;
        divheight = 370;
        divwidth = 220;
    }
    else {
        newheight = 220;
        newwidth = 250;
        divheight = 310;
        divwidth = 270;
    }

    if (!templatepreview) {
        var previewdiv = document.createElement('div');


        previewdiv.setAttribute("id", "templatePreview");
        previewdiv.onclick = function() { makeTemplate(newimage.src); }
        previewdiv.style.border = '1px solid black';
        previewdiv.style.width = divwidth + 'px';
        previewdiv.style.height = divheight + 'px';
        previewdiv.style.backgroundColor = 'white';
        previewdiv.style.paddingTop = '30px';
        previewdiv.innerHTML = '<table width=100% height=100%><td valign="top" align="center"><img id=previewImage src="'+newimage.src+'" style="border: 1px solid black;"></td></table>';
        document.body.appendChild(previewdiv);

        size = fitIn(newimage.width, newimage.height, newwidth, newheight);
        image = document.getElementById('previewImage');
        image.style.height = size[1] + 'px';
        image.style.width =  size[0] + 'px';
        
    }
    else {
        image = document.getElementById('previewImage');
        
        if (image) {
            image.src = newimage.src;
            size = fitIn(newimage.width, newimage.height, newwidth, newheight);
            image.style.height = size[1] + 'px';
            image.style.width =  size[0] + 'px';
        }
    }

    previewlargetext = document.getElementById('previewLargeText');
    textinfo = false;
    if (document.getElementById('previewtext_' + id)) {
        if (previewlargetext)
            previewlargetext.innerHTML = '<b>' + document.getElementById('previewtext_' + id).innerHTML + '</b>';
        else {
            var text  = '<b>' + document.getElementById('previewtext_' + id).innerHTML + '</b>';
            textinfo = document.createElement('div');
            textinfo.setAttribute('id', 'previewLargeText');
            textinfo.innerHTML = text;
            textinfo.style.position = 'absolute';
        if (image) {
            valigntop = (stripPt(image.style.height) + 10 + 40);
            textinfo.style.top = valigntop + 'px';
        }
        textinfo.style.left = '19px';
        textinfo.style.fontSize = '16px';
        textinfo.style.fontFamily = 'verdana';
     }
   } 

    //    document.getElementById('debug').innerHTML += image.src;
    templatepreview = document.getElementById('templatePreview');
//    templatepreview.appendChild(image);
    if (textinfo)
        templatepreview.appendChild(textinfo);
    templatepreview.style.position = 'absolute';

    var windowsize = getWindowSizeXY();
//    alert(windowsize[0]);
    if ((currentx + divwidth) > windowsize[0])
        var left = (currentx-divwidth-40);
    else
        var left = currentx;

    if ((currenty + divheight) > windowsize[1])
        var top = (currenty-divheight-50);
    else
        var top = currenty;

//    alert(top);

    //top = currenty + 10;
//    left = currentx + 10;

    if (top < 0)
        top = 0;


    templatepreview.style.top = top + 'px';
    templatepreview.style.left = left + 'px';
    templatepreview.style.display = '';
    return false;
}

function makeTemplate(template, type, muuid) {
    var param = ""
    if (type == 1) {
        OpenPopup("chooseyear.php?template=" + escape(template) + "&medium=" + muuid);
    }
    else if (type == 2) {
        param = "page=choosecardtemplate&template=" + escape(template) + "&medium=" + muuid;
        dojo.io.bind( {
            url: "ajax_wizard.php?" + param,
            load: function(type, data, evt) { changeTemplateCheckReload(data);},
            error: function(type, error) { alert("Error: " + error + "Type: "  + type); },
            mimetype: "text/plain"
        });
   }
}

function changeTemplateCheckReload(data) {
    if (data == "reload")
       document.location = 'create.php?loadscript=1';
    else
        document.location='create.php';
}

function closeWizard() {
    showTemplatepreview = true;
    /* Enable main form */
    /*
    sizes = document.getElementsByName('sizes[]');
    for (var i = 0; i < sizes.length; i++) {
        sizes[i].disabled = false;
    }
    parts = document.getElementsByName('parts[]');
    for (var i = 0; i < parts.length; i++) {
        parts[i].disabled = false;
    }
    */
    wiz = document.getElementById('wizard');
    wiz.style.display = 'none';
    wiz.innerHTML = 'Lataa...';

}

function documentClick() {
    templatepreview = document.getElementById('templatePreview');
    if (templatepreview)
        templatepreview.style.display = 'none';

    closeStringToolbarItems();
}

function yearMouseOver(year) {
    year = dojo.byId(year);
    year.className = 'yearActive';
}

function yearMouseOut(id, year) {
    if (config_selectedyear == year)
        return;
    
    year = document.getElementById(id);
    year.className = 'yearInActive';
}

function setYear(year) {
    if (year == config_selectedyear)
        return;
    oldyear = document.getElementById('year' + config_selectedyear);
    if (oldyear)
        oldyear.className = 'yearInActive';
    config_selectedyear = year;

    // Enable next step button:
    document.getElementById('nextStep').style.display = 'block';
    
}

function calendarChangeTemplate() {
    createWizard();
    dojo.io.bind({
        url: "ajax_wizard.php?page=calendarchangetemplate",
        load: wizardPageComplete,
        error: function(type, error) { alert(error) },
        mimetype: "text/plain",
        formNode : "chooseYearForm"
    });
}

function calendarSetYear() {
    year = "";
    yearform = document.getElementById("chooseYearForm");

    // If only one radio element:
    if (typeof(yearform.year.length) == "undefined") {
        year = yearform.year.value;
    }
    else {
        for (var i=0; i < yearform.year.length; i++)
        {
        if (yearform.year[i].checked)
        {
            year = yearform.year[i].value;
        }
       }
    }
   document.location.href="create.php?year=" + year;
}

function chooseImageSource() {
    year = "";
    yearform = document.getElementById("chooseYearForm");
    // If only one radio element:
    if (typeof(yearform.year.length) == "undefined") {
        year = yearform.year.value;
    }
    else {

        for (var i=0; i < yearform.year.length; i++)
        {
            if (yearform.year[i].checked)
            {
                year = yearform.year[i].value;
            }
        }
    }
    OpenPopup("imagesource.php?year=" + year);
}
flashnum = 0;

function flashEmptyMonths() {
    if (flashnum > 11) {
        flashnum = 0;
        return;
    }
    if (flashnum % 2 == 0) {
        for (i = 1; i<13; i++) {
            image = document.getElementById('month_' + i);
            if (image) {
                var re = image.style.backgroundImage.match(/green|_active/);
                if (!re) {
                    image.style.backgroundImage = 'url("/design/DEFAULT/graphics/calendar/monthbutton_red.png")';
                }
            }
        }
     }
     else {
         for (i = 1; i<13; i++) {
             image = document.getElementById('month_' + i);
             if (image) {
                var re = image.style.backgroundImage.match(/green|_active/);
                if (!re) {
                    image.style.backgroundImage = 'url("/design/DEFAULT/graphics/calendar/monthbutton_inactive.png")';
                }
             }
         }
     }
     flashnum += 1;
     setTimeout("flashEmptyMonths()", 200);
}

function createWizard() {
    // Check if it exists already:
    var wizard = document.getElementById('wizard');
    if (wizard) {
        wizard.style.display = 'block';
    }
    else {
        wizard = document.createElement('div');
        wizard.setAttribute('id', 'wizard');
//        wizard.setAttribute('class', 'wizard');
        wizard.className = 'wizard';
        wizard.innerHTML = 'Lataa...';
        wizard.style.display = 'block';
        wizard.style.zIndex = 101;
//        document.getElementById('crap').appendChild(wizard);
        document.getElementById('xcontent').appendChild(wizard);
    }
  
}


function finishCalendar() {
    createWizard();
    dojo.io.bind({
    url: "ajax_wizard.php?page=checkifdone",
    load: wizardPageComplete,
    error: function(type, error) { alert(error) },
    mimetype: "text/plain"
    });
}

function finishCard() {
    createWizard();
    dojo.io.bind({
        url: "ajax_wizard.php?page=checkifdone&type=card",
	load: wizardPageComplete,
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });
}

function loadAlbum() {
   folderId = dojo.byId('folderId').value;
    
   dojo.io.bind({
       url: "ajax/addfolder.php?folder=" + folderId,
       load:  function(type, data, evt) { document.location.href = 'create.php'; },
       error: function(type, error) { alert(error) },
       mimetype: "text/plain"
    });
}

function chooseAlbum() {
    OpenPopup("choosealbum.php");
    /*
    dojo.io.bind({
    url: "ajax_wizard.php?page=choosealbum",
    load: wizardPageComplete,
    error: function(type, error) { alert(error) },
    mimetype: "text/plain"
    });
    */
}

function loadTemplate() {
    if (window.location.href.match(/(cardsv2|calendarsv2)/)) { 
        dojo.io.bind({
         url: "ajax_template.php",
            load: function(type, data, evt) { updateTemplateJs();checkIfImageIsTooSmall();},
            error: function(type, error) { alert(error) },
            mimetype: "text/plain"
         });
    }
}

function nextMonthPage() {
    loading = document.getElementById('divLoading');
    if (loading) {
        alert("Odota, että kuvat ovat latautuneet ennen kuin vaihdat sivua");
        return;
    }
  
    if ((calendarCurrentMonth+1) <= calendarTotalMonths) {
        swaptab_0(calendarCurrentMonth); 
        tabselect_0("javascript:gotoMonthPage("+(calendarCurrentMonth+1)+");");
    }
}

function previousMonthPage() {
    loading = document.getElementById('divLoading');
    if (loading) {
        alert("Odota, että kuvat ovat latautuneet ennen kuin vaihdat sivua");
        return;
    }

    if ((calendarCurrentMonth-2) >= 0) {
        swaptab_0(calendarCurrentMonth-2); 
        tabselect_0("javascript:gotoMonthPage("+(calendarCurrentMonth-1)+");");
    }
}


function gotoMonthPage(page) {
    loading = document.getElementById('divLoading');
    if (loading) {
        alert("Odota, että kuvat ovat latautuneet ennen kuin vaihdat sivua");
        return;
    }

    // Remove dropable:
    var i = 0;
    while (userimage = document.getElementById('userimage_' + i)) {
        Droppables.remove('userimage_' + i);
        i++;
    }
    dojo.io.bind({
        url: "ajax_template.php?gotopage=" + page,
        load: function(type, data, evt) {dojo.byId('templateEditArea').innerHTML = data; updateTemplateJs();},
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });
}
                    

function updateTemplateJs() {
    dojo.io.bind({
    url: "ajax_template_script.php",
    load: function(type, data, evt) {},
    error: function(type, error) { alert(error) },
    mimetype: "text/javascript"
});
    checkIfImageIsTooSmall();
}

function closeToolbar() {
    var toolbar = document.getElementById('toolbarDiv');
    if (toolbar) {
        toolbar.parentNode.removeChild(toolbar);
    }
}

function adjustImage(keepToolBar, numimage, noreload) {
   
    // Check if toolbar is up.. Remove?
    if (typeof numimage == "undefined") 
        numimage = currentImage;

    if (typeof keepToolBar == "undefined") {
        toolbarDiv = document.getElementById('toolbarDiv');
        if (toolbarDiv)
            toolbarDiv.parentNode.removeChild(toolbarDiv);
    }
    divelement = document.getElementById('userimage_' + numimage);
    image = document.getElementById('img_' + numimage);
    adaption = divelement.getAttribute('adaption');
    image.style.position = 'absolute';

    userimageareawidth = stripPt(divelement.style.width);
    userimageareaheight = stripPt(divelement.style.height);
    
    imagewidth = image.width;
    imageheight = image.height;

    srcratio = (imagewidth/imageheight);
    dstratio = (userimageareawidth/userimageareaheight);
    diff = userimageareaheight/imageheight;
    

    if (adaption == "fit-in") {
        if (srcratio < dstratio) {
            imageheight = imageheight*diff;
            imagewidth = imagewidth*diff;
        }
        else {
            /* Scale so width is correct: */
            diff = userimageareawidth/imagewidth;
            imageheight = imageheight*diff;
            imagewidth = imagewidth*diff;
        }
    }
    else {
        if (srcratio > dstratio) {
            imageheight = imageheight*diff;
            imagewidth = imagewidth*diff;
        }
        else {
            /* Scale so width is correct: */
            diff = userimageareawidth/imagewidth;
            imageheight = imageheight*diff;
            imagewidth = imagewidth*diff;
        }
    }

    image.style.width = imagewidth + "px";
    image.style.height = imageheight + "px";

    /* Center the image */
    diffx = (userimageareawidth/2) - (imagewidth/2);
    diffy = (userimageareaheight/2) - (imageheight/2);
    image.style.top = diffy + "px";
    image.style.left = diffx + "px";


    var re = image.src.match(/photoid\=([0-9]+)/);
    var idparam = 'photoid=' + re[1];


    /* Save config */
    if (typeof keepToolBar == "undefined") {
        address = "ajax_setData.php?offsetx=" + diffx + "&offsety=" + diffy + "&width=" + imagewidth + "&height=" + imageheight + "&" + idparam + "&dstwidth=" + userimageareawidth + "&dstheight=" + userimageareaheight  + "&imagenum=" + numimage;
    }
    else {
        address = "ajax_setData.php?offsetx=" + diffx + "&offsety=" + diffy + "&width=" + imagewidth + "&height=" + imageheight + "&dstwidth=" + userimageareawidth + "&dstheight=" + userimageareaheight  + "&imagenum=" + numimage;
    }


    if(!noreload) {
      loadingImage();
    }

    dojo.io.bind({
        url: address,
        load: function(type, data, evt) { if(!noreload) loadTemplateImage(data); },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });
   

    if (window.location.href.match(/(cardsv2|calendarsv2)/) && false) {   
        wrench = document.createElement('img'),
               wrench.setAttribute('width', '36');
        wrench.setAttribute('height', '32');
        wrench.setAttribute('src', '/design/DEFAULT/graphics/calendar/wrench.png');
        wrench.setAttribute('id', 'wrenchImage');
        wrench.style.zIndex = 2000;
        //    wrench.setAttribute('onClick', 'showToolBar();');
        wrench.idx = numimage;
        wrench.onclick = function() { showToolBar(this.idx);};
        wrench.style.position = 'absolute';
        //  bottom: 5px; right: 5px; cursor: pointer' onClick='showToolBar();'>
        wrench.style.bottom = '5px';
        wrench.style.right = '5px';
        wrench.style.cursor = 'pointer';
        document.getElementById('layer_' + numimage).appendChild(wrench);
    }

    checkIfImageIsTooSmall();
    selectImage(numimage);
    checkImageQuality();
    return false;
}

function nextPage() {
    loading = document.getElementById('divLoading');
    if (loading) {
        alert("Odota, että kuvat ovat latautuneet ennen kuin vaihdat sivua");
        return;
    }

    var i = 0;
    while (userimage = document.getElementById('userimage_' + i)) {
        Droppables.remove('userimage_' + i);
        i++;
    }
    dojo.io.bind({
        url: "ajax_template.php?nextpage=1",
        load: function(type, data, evt) {dojo.byId('templateEditArea').innerHTML = data; updateTemplateJs();},
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });
}

function prevPage() {
    loading = document.getElementById('divLoading');
    if (loading) {
        alert("Odota, että kuvat ovat latautuneet ennen kuin vaihdat sivua");
        return;
    }

    var i = 0;
    while (userimage = document.getElementById('userimage_' + i)) {
        Droppables.remove('userimage_' + i);
        i++;
    }

    dojo.io.bind({
        url: "ajax_template.php?prevpage=1",
        load: function(type, data, evt) {dojo.byId('templateEditArea').innerHTML = data; updateTemplateJs();},
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });
}

function errorNoImage() {
    createWizard();
    dojo.io.bind({
        url: "ajax_wizard.php?page=errornoimage",
	load: wizardPageComplete,
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });
}

function uploadImage(imagenum) {
    createWizard();
    dojo.io.bind({
        url: "ajax_wizard.php?page=uploadimage&imagenum=" + imagenum,
        load: wizardPageComplete,
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });
}

var selectedCount = 0;
function flashSelectedImage () {
    if (selectedCount > 3) {
        return;
    }
    selectDiv = dojo.byId('selectedImageFrame');
    if (selectedCount % 2 == 0) {
        selectDiv.style.borderColor = 'red';
    }
    else {
        selectDiv.style.borderColor = 'black';
    }
    selectedCount++;

    setTimeout("flashSelectedImage ()", 200);
}

function selectImage (imagenum) {

    if (typeof(imagenum) == 'undefined') {
        imagenum = currentImage;    
    } 
    
    // Deselect other images:
    /*
    num = 0;
    while (image = dojo.byId('userimage_' + num)) {
	if (safari)
	        image.style.border = 'hidden';
	else
		image.style.border = '';

        num = num + 1;
    }
    */  
    imageElement = dojo.byId('userimage_' + imagenum);
    //imageElement.style.border = '2px dashed red';
    
    
    elmpos = findPos(imageElement);

    if (!dojo.byId('selectedImageFrame')) {
        selectDiv = document.createElement('div');
        selectDiv.style.position = 'absolute';
        selectDiv.id = 'selectedImageFrame';
        selectDiv.style.border = '2px dashed black';
        selectDiv.style.zIndex = 100;
        document.body.appendChild(selectDiv);
    }
    else {
        selectDiv = dojo.byId('selectedImageFrame');
    }

    selectedCount = 0;
    flashSelectedImage();

    // Check number of images:
    imgcount = 0;
    while (dojo.byId('userimage_' + imgcount)) {
        imgcount++;
    }
    if (imgcount == 1) {
       selectDiv.style.border = '';
    }


    // Set position    
    selectDiv.style.left = elmpos[0]-1 + 'px';
    selectDiv.style.top = elmpos[1]-1 + 'px';
    selectDiv.style.width = imageElement.style.width;
    selectDiv.style.height = imageElement.style.height;
    selectDiv.style.cursor = 'pointer';

    var imglayer = dojo.byId('imglayer_' + imagenum);
    if (imglayer) {
        selectDiv.onclick = imglayer.onclick;
    }
    
//    alert('Size: ' + selectDiv.style.width + 'x' + selectDiv.style.height);

    //.style.border = '2px dashed black';
    currentImage = imagenum;
    dojo.io.bind({
    url: "ajax_setData.php?currentImage=" + imagenum,
        load: function(type, data, evt) {},
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });

    // Check if we should enable edit:
    if (document.getElementById('img_' + currentImage)) {

        dojo.byId('editboxOverlay').style.display = 'none';
        
        // Get effect:
        dojo.io.bind({
            url: "ajax/get_effect.php?imagenum=" + currentImage,
            load: function(type, data, evt) { 
                if (data == 'sepia') {
                    dojo.byId('editbuttonSepia').checked = true;
                }
                else if (data == 'bw') {
                    dojo.byId('editbuttonBw').checked = true;
                }
                else {
                    dojo.byId('editbuttonOriginal').checked = true;
                }
            },
            error: function(type, error) { alert(error) },
            mimetype: "text/plain"
        });
    }
    else {
        if (dojo.byId('editboxOverlay')) {
            dojo.byId('editboxOverlay').style.display = 'inline';
        }
    }
}

function showToolBar(imagenum) {
    if (typeof(imagenum) != 'undefined') {
        currentImage = imagenum;
    }
    if (!document.getElementById('img_' + currentImage)) {
     errorNoImage();
     return;
    }
   
//    dojo.byId('userimage_' + currentImage).style.border='2px solid red';
    selectImage(imagenum);

    // Remove old toolbar (In case image switch etc)
    closeToolbar()    

   
   toolbar = document.getElementById('toolbarDiv'); 
   if (toolbar) {
    return false;
   }
   var toolbar = document.createElement('div');
   toolbar.style.width = 115;
   toolbar.style.height = 232;
   toolbar.setAttribute('id', 'toolbarDiv');
   toolbar.style.position = "absolute";
   toolbar.style.right =  "0px";
   toolbar.style.bottom = "0px";
   toolbar.style.borderLeft = '5px solid white';
   toolbar.style.borderTop = '5px solid white';
   
   // Add toolbar to body:
   document.getElementById('templateEditArea').appendChild(toolbar);
//   document.body.appendChild(toolbar);
    
   // Load content:
   dojo.io.bind({
    url: "ajax_toolbar.php?imagenum=" + currentImage,
    load: function(type, data, evt) {dojo.byId('toolbarDiv').innerHTML = data;},
    error: function(type, error) { alert(error) },
    mimetype: "text/plain"
    });
}

function zoomIn() {
    var zoomlevel = 1.1;
    image = document.getElementById('img_' + currentImage);

    oldwidth = stripPt(image.style.width);
    oldheight = stripPt(image.style.height);

    newheight = Math.floor(oldheight*zoomlevel);
    newwidth = Math.floor(oldwidth*zoomlevel);

    oldx = stripPt(image.style.left);
    oldy = stripPt(image.style.top);

    imageContainer = document.getElementById('userimage_' + currentImage);
    userimageareawidth = stripPt(imageContainer.style.width);
    userimageareaheight = stripPt(imageContainer.style.height);

//    alert('VW: ' + userimageareawidth + '\nW: ' + oldwidth + '\nX: ' + oldx);

    z = ((userimageareawidth*0.5/oldwidth) - (1.0*oldx / oldwidth));
    offsetx = oldx - (newwidth-oldwidth)*z;

    z = ((userimageareaheight*0.5/oldheight) - (1.0*oldy / oldheight));
    offsety = oldy - (newheight-oldheight)*z;

    image.style.width = newwidth + "px";
    image.style.height = newheight + "px";

    if (offsety > 0) { 
        image.style.borderTop = '3 px solid green';
    }
    image.style.top = offsety + "px";
    image.style.left = offsetx + "px";
    
    dojo.io.bind({
        url: "ajax_setData.php?offsetx=" + offsetx + "&offsety=" + offsety + 
        "&width=" + newwidth + "&height=" + newheight + "&imagenum=" + currentImage,
        load: function(type, data, evt) { },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
    });

    checkIfImageIsTooSmall();
    checkImageQuality();
/*
    saveConfig('offsetx', offsetx);
    saveConfig('offsety', offsety);
    saveConfig('width', newwidth);
    saveConfig('height', newheight);
*/
}

function dump(arr,level) {
    var dumped_text = "";
    if(!level) level = 0;
    
    //The padding given at the beginning of the line.
    var level_padding = "";
    for(var j=0;j<level+1;j++) level_padding += "    ";
    
    if(typeof(arr) == 'object') { //Array/Hashes/Objects 
        for(var item in arr) {
            var value = arr[item];
            
            if(typeof(value) == 'object') { //If it is an array,
                dumped_text += level_padding + "'" + item + "' ...\n";
                dumped_text += dump(value,level+1);
            } else {
                dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";
            }
        }
    } else { //Stings/Chars/Numbers etc.
        dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
    }
    return dumped_text;
}

function checkImageQuality() {
    image = document.getElementById('img_' + currentImage);
    imageContainer = document.getElementById('userimage_' + currentImage);

    var dstwidth = stripPt(imageContainer.style.width);
    var dstheight = stripPt(imageContainer.style.height);    

    var offsetx = stripPt(image.style.left);
    var offsety = stripPt(image.style.top);
    var width = stripPt(image.style.width);
    var height = stripPt(image.style.height);
    
    var re = image.src.match(/photoid\=([0-9]+)/);
    var imgid = re[1];
    imagesize = imageSizes[imgid];
    if (imagesize == "undefined") {
        return;
    }

    size = imagesize.split(" ");
    owidth = parseInt(size[0]);
    oheight = parseInt(size[1]);

    // In case image been rotated:
    if (width > height) {
        if (owidth < oheight) {
            tmpow = owidth;
            tmpoh = oheight;
            owidth = tmpoh;
            oheight = tmpow;
        }
    }
    if (width < height) {
        if (owidth > oheight) {
            tmpow = owidth;
            tmpoh = oheight;
            owidth = tmpoh;
            oheight = tmpow;
        }
    }
    
    if (offsetx >= 0)
        outoffsetx = 0;
    else
        outoffsetx = Math.abs(offsetx);

    if (offsety >= 0)
        outoffsety = 0;
    else
        outoffsety = Math.abs(offsety);

    if (offsetx <= 0 && offsetx + width >= dstwidth)
        outwidth = dstwidth;
    else if (offsetx > 0 && offsetx + width < dstwidth)
        outwidth = width;

    if (offsety <= 0 && offsety + height >= dstheight) {
        outheight = dstheight;
    }
    else if (offsety > 0 && offsety + height < dstheight)  {
        outheight = height;
    }

    // If its fit in, we might have a smaller image:
    if (offsety > 0) {
        percent = outheight/dstheight;
        dstheight = dstheight*percent;        
    }
    if (offsetx > 0) {
        percent = outwidth/dstwidth;
        dstwidth = dstwidth*percent;
    }
    
    scaleratio = (owidth/width);

    outoffsety = Math.round(outoffsety * scaleratio);
    outoffsetx = Math.round(outoffsetx * scaleratio);
    outwidth = Math.round(outwidth * scaleratio);
    outheight = Math.round(outheight * scaleratio);

    if (outwidth > owidth)
        outwidth = owidth-outoffsetx;
    if (outheight > oheight)
        outheight = oheight-outoffsety;

    odstwidth = Math.round(dstwidth / templateScaleratio);
    odstheight = Math.round(dstheight / templateScaleratio);


    // We need to find out how big dstwidth is in cm
    tsize = templatePrintArea.split("x");
    printareawidth = tsize[0];
    printareaheight = tsize[1];
    
    tsize = templateArea.split("x");
    templateareawidth = tsize[0];
    templateareaheight = tsize[1];
   

    // Rotate product so it's the same way as template:
    if (templateareawidth > templateareaheight) {
        if (printareawidth < printareaheight) {
            tmpwidth = printareawidth;
            tmpheight = printareaheight;
            printareaheight = tmpwidth;
            printareawidth = tmpheight; 
        }
    }
    else if (templateareawidth < templateareaheight) {
        if (printareawidth > printareaheight) {
            tmpwidth = printareawidth;
            tmpheight = printareaheight;
            printareaheight = tmpwidth;
            printareawidth = tmpheight;
        }
    }
    ratio = printareawidth/templateareawidth;

    odstwidth = odstwidth * ratio;
    odstheight = odstheight * ratio;
   
    
    // Frodes quality check:
    imgsize = (outwidth*outheight);
    dstsize = (odstwidth*odstheight)

    printsize = (odstwidth*odstheight);
    printsize2 = printsize / 10000.0;
    quality = (imgsize / printsize2) * (1000 + printsize2) / 1000;
//    alert(quality);
    /*
    if (quality > 10000) {
        alert('Excelent');;
    }
    else if (quality > 8000) {
        alert('GOOD');
    }
    else if (quality > 6000) {
        alert('OK');
    }
    else if (quality > 4000) {
        alert('MEDIOCRE');
    }
    else if (quality > 2000) {
        alert('BAD');
    }
    else {
        alert('TERRIBLE');
    }
    */
    if (!dojo.byId('warningImage_' + currentImage)) {
        warning = document.createElement('img'),
        warning.setAttribute('width', '36');
        warning.setAttribute('height', '32');
        var text = "The resolution of this image is low. You may try to zoom out to avoid a non-satisfactory print.";
        warning.setAttribute('title', text);
        warning.setAttribute('src', '/design/DEFAULT/graphics/calendar/warning.gif');
        warning.setAttribute('id', 'warningImage_' + currentImage);
        warning.style.zIndex = 2000;
        warning.idx = currentImage;
//        warning.onclick = function() { showToolBar(this.idx);};
        warning.style.position = 'absolute';
        warning.style.bottom = '5px';
        warning.style.left = '5px';
        warning.style.cursor = 'help';
        document.getElementById('layer_' + currentImage).appendChild(warning);
    }
    if (quality < 6000) {
        dojo.byId('warningImage_' + currentImage).style.display = '';
    }
    else dojo.byId('warningImage_' + currentImage).style.display = 'none';

}

function flashTopBorder() {
//    selectedDiv = document.getElementById('userimage_' + numimage);
    selectedDiv = document.getElementById('selectedImageFrame');
    if (topflashCounter < 10) {
        if (topflashCounter % 2 == 0) {
            selectedDiv.style.borderTop = '2px dashed red';
        }
        else {
            selectedDiv.style.borderTop = '2px dashed black';
        }
        topflashCounter = topflashCounter+1;
        setTimeout("flashTopBorder()", 200);
    }
}

function flashLeftBorder() {
//    selectedDiv = document.getElementById('userimage_' + numimage);
    selectedDiv = document.getElementById('selectedImageFrame');
    if (leftflashCounter < 10) {
        if (leftflashCounter % 2 == 0) {
            selectedDiv.style.borderLeft = '2px dashed red';
        }
        else {
            selectedDiv.style.borderLeft = '2px dashed black';
        }
        leftflashCounter = leftflashCounter+1;
        setTimeout("flashLeftBorder()", 200);
    }
}

function flashRightBorder() {
//    selectedDiv = document.getElementById('userimage_' + numimage);
    selectedDiv = document.getElementById('selectedImageFrame');
    if (rightflashCounter < 10) {
        if (rightflashCounter % 2 == 0) {
            selectedDiv.style.borderRight = '2px dashed red';
        }
        else {
            selectedDiv.style.borderRight = '2px dashed black';
        }
        rightflashCounter = rightflashCounter+1;
        setTimeout("flashRightBorder()", 200);
    }
}

function flashBottomBorder() {
//    selectedDiv = document.getElementById('userimage_' + numimage);
    selectedDiv = document.getElementById('selectedImageFrame');
    if (bottomflashCounter < 10) {
        if (bottomflashCounter % 2 == 0) {
            selectedDiv.style.borderBottom = '2px dashed red';
        }
        else {
            selectedDiv.style.borderBottom = '2px dashed black';
        }
        bottomflashCounter = bottomflashCounter+1;
        setTimeout("flashBottomBorder()", 200);
    }
}



topflashCounter = 0;
leftflashCounter = 0;
rightflashCounter = 0;
bottomflashCounter = 0;

function checkFitIn(offsetx,offsety,width,height) {
    imageContainer = document.getElementById('userimage_' + currentImage);
    image = document.getElementById('img_' + currentImage);
    ret = 1;
    adaption = imageContainer.getAttribute('adaption');
    cwidth = stripPt(imageContainer.style.width);
    cheight = stripPt(imageContainer.style.height)
   
    if (adaption == 'fill-in') {
        if (offsety > 0) {
            topflashCounter=0; 
            flashTopBorder();
            ret = 0;
        }
        if (offsetx > 0) {
            leftflashCounter=0;
            flashLeftBorder();
            ret = 0;
        }

        if (width + offsetx < stripPt(imageContainer.style.width)) {
            rightflashCounter=0; 
            flashRightBorder();
            ret = 0;
        }
        if (height + offsety < stripPt(imageContainer.style.height)) {
            bottomflashCounter=0; 
            flashBottomBorder();
            ret = 0;
        }
    } 
    else {
       // Fit-in
        
       if (offsety > 0 && width + offsetx < cwidth) {
           return 0;
       } 
       else if (offsety > 0 &&  height + offsety < cheight) {
           image.style.top = (cheight/2)-(height/2) + "px";
           return 2;
       } 
       else if (offsety + height < cheight) {
            ret = 0;
       } 
       else if (offsety > 0 && offsety+height > cheight )  {
            ret = 0;
       }
      
       // X-axis 
       if (offsetx > 0 && height + offsety < cheight) {
          ret = 0;
       } 
       else if (offsetx > 0 && width + offsetx < cwidth) {
         image.style.left = (cwidth/2)-(width/2) + "px";
         return 3;
       }
       else if (offsetx + width < cwidth) {
            ret = 0;
       }
       else if (offsetx > 0 && width + offsetx > cwidth) {
          ret = 0;
       }
    }  

    return ret;
}

function zoomOut() {
    var zoomlevel = 0.9;
    image = document.getElementById('img_' + currentImage);
    imageContainer = document.getElementById('userimage_' + currentImage);
    userimageareawidth = stripPt(imageContainer.style.width);
    userimageareaheight = stripPt(imageContainer.style.height);
    oldwidth = stripPt(image.style.width);
    oldheight = stripPt(image.style.height);

    newheight = oldheight*zoomlevel;
    newwidth = oldwidth*zoomlevel;

    oldx = stripPt(image.style.left);
    oldy = stripPt(image.style.top);

//    alert('VW: ' + userimageareawidth + '\nW: ' + oldwidth + '\nX: ' + oldx);

    z = ((userimageareawidth*0.5/oldwidth) - (1.0*oldx / oldwidth));
    offsetx = oldx - (newwidth-oldwidth)*z;

    z = ((userimageareaheight*0.5/oldheight) - (1.0*oldy / oldheight));
    offsety = oldy - (newheight-oldheight)*z;

    ret = checkFitIn(offsetx, offsety, newwidth, newheight);
    if (ret == 0)
        return;

    image.style.width = newwidth + "px";
    image.style.height = newheight + "px";



    if (ret == 3 || ret == 1) {
        image.style.top = offsety + "px";
    }
    if (ret == 2 || ret == 1) {
        image.style.left = offsetx + "px";
    }
    dojo.io.bind({
       url: "ajax_setData.php?offsetx=" + offsetx + "&offsety=" + offsety + 
             "&width=" + newwidth + "&height=" + newheight  + "&imagenum=" + currentImage,
        load: function(type, data, evt) {  },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
        });
    checkIfImageIsTooSmall();
    checkImageQuality();
/*
    saveConfig('offsetx', offsetx);
    saveConfig('offsety', offsety);
    saveConfig('width', newwidth);
    saveConfig('height', newheight);
*/
}

function checkIfImageIsTooSmall() {
    image = document.getElementById('img_' + currentImage);
    if (!image) {
        return;
    }
    offsetx = stripPt(image.style.left);
    offsety = stripPt(image.style.top);

    imagewidth = stripPt(image.style.width);
    imageheight = stripPt(image.style.height);
    warningdiv = document.getElementById('warningBox');
    if (!warningdiv) {
        return;
    }
    divelement = document.getElementById('userimage_' + currentImage);
    userimageareawidth = stripPt(divelement.style.width);
    userimageareaheight = stripPt(divelement.style.height);
    if (offsetx > 0 || offsety > 0) {
        warningdiv.style.display = '';
    }
    else if (offsetx+imagewidth < userimageareawidth) {
        warningdiv.style.display = '';
    }
    else if (offsety+imageheight < userimageareaheight) {
        warningdiv.style.display = '';
    }
    else {
        warningdiv.style.display = 'none';
    }
}

function saveConfig(name, value, func) {
    /* Save config */
    if (typeof func == "undefined") { 
        dojo.io.bind({
        url: "ajax_setData.php?" + name + "=" + value + "&imagenum=" + currentImage,
        load: function(type, data, evt) { },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
        });
    }
    else if (func == 'rotate') {
        dojo.io.bind({
        url: "ajax_setData.php?" + name + "=" + value + "&imagenum=" + currentImage,
        load: function(type, data, evt) {  loadTemplateImage(data); },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
        });
    }
    else if (name == 'effect') {
        dojo.io.bind({
        url: "ajax_setData.php?" + name + "=" + value + "&imagenum=" + currentImage,
        load: function(type, data, evt) {  loadTemplateImage(data, false, false); },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
        });
    }
    else  {
        dojo.io.bind({
        url: "ajax_setData.php?" + name + "=" + value + "&imagenum=" + currentImage,
        load: function(type, data, evt) { loadTemplateImage(data); },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
        });
    }
}


function moveUp() {
    image = document.getElementById('img_' + currentImage);
    var newpos = stripPt(image.style.top)-10;
    ret = checkFitIn(image.style.left, newpos, stripPt(image.style.width), stripPt(image.style.height));
    if (ret == 0)
        return;
    
    if (ret == 1 || ret == 3)
        image.style.top = newpos + "px";
    saveConfig('offsety', newpos);
    checkIfImageIsTooSmall();
}

function moveDown() {
    image = document.getElementById('img_' + currentImage);
    var newpos = stripPt(image.style.top)+10;
    ret = checkFitIn(image.style.left, newpos, stripPt(image.style.width), stripPt(image.style.height));

    if (ret == 0)
        return;

    if (ret == 1 || ret == 3)
        image.style.top = newpos + "px";
    saveConfig('offsety', newpos);
    checkIfImageIsTooSmall();
}

function moveLeft() {
    image = document.getElementById('img_' + currentImage);
    var newpos = stripPt(image.style.left)-10;
    ret = checkFitIn(newpos, image.style.top, stripPt(image.style.width), stripPt(image.style.height));
    if (ret == 0)
        return;
    if (ret == 1 || ret == 2)
        image.style.left = newpos + "px";
    saveConfig('offsetx', newpos);
    checkIfImageIsTooSmall();
}

function moveRight() {
    image = document.getElementById('img_' + currentImage);
    var newpos = stripPt(image.style.left)+10;
    ret = checkFitIn(newpos, image.style.top, stripPt(image.style.width), stripPt(image.style.height));

    if (ret == 0)
        return;
    if (ret == 1 || ret == 2)
        image.style.left = newpos + "px";

    saveConfig('offsetx', newpos);
    checkIfImageIsTooSmall();
}

function rotateLeft() {
    saveConfig('rotateleft', 'true', 'rotate');
    loadingImage();
}

function rotateRight() {
    saveConfig('rotateright', 'true', 'rotate');
    loadingImage();
}

loadingnum = 0;
loadingimage = false;
function loadingImage(numimage) {
    loadingimage = true;
    loadingImageStart(numimage);
}

function loadingImageStart(numimage) {
    if (typeof(numimage) == 'undefined') {
        numimage = currentImage;
    }

    if(loadingimage == false) {
        return;
    }

    loading = document.getElementById('divLoading');
    if (!loading) {
        loading = document.createElement('div');
        loading.style.position = 'absolute';
        loading.style.backgroundColor = 'white';
        loading.style.padding = '2px';
        loading.style.left = '0px';
        loading.style.top = '0px';
        loading.style.height = '20px';
                loading.innerHTML = 'Ladataan kuva...';
        loading.setAttribute('id', 'divLoading');
        //imagediv = document.getElementById('userimage_' + numimage);
        imagediv = document.getElementById('selectedImageFrame');
        
        imagediv.appendChild(loading);
    }
        if (loadingnum == 0)
        loading.innerHTML = 'Ladataan kuva';
    else if (loadingnum == 1)
        loading.innerHTML = 'Ladataan kuva.';
    else if (loadingnum == 2)
            loading.innerHTML = 'Ladataan kuva..';
    else {
        loading.innerHTML = 'Ladataan kuva...';
        loadingnum = 0;
    }
    loadingnum += 1;
    
    setTimeout("loadingImageStart("+numimage+")", 500);
    return true;
}

function changeColors() {
    // Get image id:

    loadingImage();

    buttons = document.getElementsByName('imagetype');
    for (i = 0; i < buttons.length; i++) {
        if (buttons[i].checked == true)
            imagetype = buttons[i].value;
    }

    saveConfig('effect', imagetype, 'true');
}

function displayImage() {
    dojo.io.bind({
    url: "ajax_setData.php?getData=true",
    load: function(type, data, evt) { loadTemplateImage(data); },
    error: function(type, error) { alert(error) },
    mimetype: "text/plain"
});
}

function updateMonths() {
    dojo.io.bind({
        url: "ajax_getCurrentMonth.php",
        load: function(type, data, evt) { setMonthCovered(data); },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain"
        });
}

function setMonthCovered(page) {
    month = document.getElementById('month_' + (page-1));
    if (month) {
          month.src = '/design/DEFAULT/graphics/calendar/calight-green.png';
//        month.style.backgroundColor = 'green';
    }
}


function loadTemplateImage(source, numimage, reloadimage) {
    if (typeof(numimage) == 'undefined' || numimage == false) {
        numimage = currentImage;
    }
    if (typeof(reloadimage) == "undefined") {
        reloadimage = true;
    }
    else {
        reloadimage = false;
    }
    loadedstatus = 0;
    loadtemplateimagesrc = source;
    loadTemplateImg(numimage, reloadimage); 
}

function loadTemplateImg(numimage, reloadimage) {
//    alert('loadTemplateImg: ' + numimage);
    if (typeof(numimage) == 'undefined') {
        numimage = currentImage;
    }
    if (loadedstatus == 0) {
        image = document.createElement('img'); 
	image.numimage = numimage;
    image.reloadimage = reloadimage;

	if (safari) 
		image.setAttribute('onload', 'loadedTemplateImage(this,numimage)');
	else
	        image.onload = loadedTemplateImage;
        
	if (safari)
            image.setAttribute('onerror', 'errorTemplateImage(numimage)');
        else
            image.onerror = errorTemplateImage;
    // Have to add a random var, so IE7 refresh the image
	random = Math.floor(Math.random() * 55555555);
   image.src = loadtemplateimagesrc + "&random=" + random;
//	image.setAttribute('src', loadtemplateimagesrc);
        loadedstatus = 1;
    }
    return true;
}

function increaseNumberOfCopies() {
    number = document.getElementById('numberofcopies');
    if (number) {
        num = parseInt(number.value);
        number.value = num + 1;
    }
}
function decreaseNumberOfCopies() {
    number = document.getElementById('numberofcopies');
    if (number) {
        num = parseInt(number.value);
        if (num > 1) 
            number.value = num - 1;
    }
}

function cardChooseImage(numimage) {

    if (loadingimage) {
	alert('Odota, että kuvat ovat ladattu ennen kuin valitset uuden kuvan');
	return 0;
    }

    if (typeof(numimage) != 'undefined') {
        currentImage = numimage;
    }
    else {
        selectImage(currentImage);
    }

    if (window.location.href.match(/calendarsv2/)) {
        createWizard();
        dojo.io.bind({
            url: "ajax_wizard.php?page=cardchooseimage&numimage=" + currentImage,
            load: wizardPageComplete,
            error: function(type, error) { alert(error) },
            mimetype: "text/plain"
        });
    }
    else {
        OpenPopup("chooseimage.php?page=cardchooseimage&numimage=" + currentImage);
    }
}

function cardChooseText(textnum) {
    if (typeof(textnum) != 'undefined') {
        activetext = textnum;
    } else {
        activetext = 0;
    }

    if (window.location.href.match(/calendarsv2/)) {
       dojo.io.bind({
            url: "ajax_wizard.php?page=cardchoosetext&activetext=" + activetext,
            load: function(type, data, evt) { dojo.byId('wizard').innerHTML = data; if (text = dojo.byId('yourtext_' + activetext)) text.focus(); },
            error: function(type, error) { alert(error) },
            mimetype: "text/plain"
        });
    }
    else {
        OpenPopup("edittext.php?activetext=" + activetext);
    }
}


function cardAddText(close) {
    if (typeof(close) != 'undefined') {
        close = 1;
    } else {
        close = 0;
    }


    warningtext = dojo.byId('tooLongTextDiv');
    warningtext.style.display = 'none';
    var fieldCounter = 0;
    var done = false;
    while (done == false) {
        errorinput = dojo.byId('yourtext_' + fieldCounter);
        if (errorinput) {
            bgcolor = dojo.byId('fontcolor_' + fieldCounter);
            var bgcolor = getBackgroundColor(bgcolor.value);
            errorinput.style.backgroundColor = bgcolor;
        }
        else {
            done = true;
        }
        fieldCounter += 1;
    }
    dojo.io.bind({
        url: "ajax_wizard.php?page=setcardtext",
        load: function(type, data, evt) {
            if (data != ".") {
                temp = new Array();
                temp = data.split(' ');
                var number = temp[0];
                var text = data.substring(2);
                errorinput = dojo.byId('yourtext_' + number);
                if (errorinput)
                    errorinput.style.backgroundColor = '#ff8282';
                warningtext = dojo.byId('tooLongTextDiv');
                warningtext.innerHTML = text;
                warningtext.style.display = '';
            }
            else {
//                document.location = 'create.php';
                  var num = 0;
                  while (textstrings = dojo.byId('textarea_' + num)) {
                    if (navigator.userAgent.match(/MSIE (5.5|6.0)/)) {
                        bgimage = textstrings.style.filter;
                        var re = bgimage.match(/(TextString.php\?partnum=\d&stringnum=\d)/);
                        url = re[1];
                        var d = new Date();
                        localtime = d.getTime();
                        textstrings.style.filter = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + url + '&time=' + localtime + '" , sizingMethod="scale")';
//                        alert(textstrings.style.filter);
                    }
                    else {
                        bgimage = textstrings.style.backgroundImage;
                        var re = bgimage.match(/(TextString.php\?partnum=\d&stringnum=\d)/);
                        url = re[1];
                        var d = new Date()
                        localtime = d.getTime()
                        textstrings.style.backgroundImage = 'url(' + url + '&time=' + localtime + ')';
                    }
                    num = num + 1;
                    
                }
                if (close == 1) {
                    ClosePopup();
                }
            }
        },
        error: function(type, error) { alert(error) },
        mimetype: "text/plain",
        formNode: document.getElementById('textform')
    });
}

function updateText(text) {
    textarea = document.getElementById('textarea');
    if (textarea) {
        bg = textarea.style.backgroundImage;
 //       alert(bg);
        start = bg.indexOf('text=');
   //     alert(start);
        end = bg.substr(bg.indexOf('text=')).indexOf('&') + start;
        newstring = bg.substr(0,start) + bg.substr(end+1);
        newstring = newstring.substr(4);
        newstring = newstring.substr(0, newstring.length-1);
        newstring = newstring.replace(" ", "+");
        textarea.style.backgroundImage = 'url("' + newstring.substr(0,newstring.length-1) + "&text=" + text + '")';
        closeWizard();
    }
}

function getKeyCode(e) {
    var keynum;
    var numcheck;

    if(window.event) // IE
    {
        keynum = e.keyCode
    }
    else if(e.which) // Netscape/Firefox/Opera
    {
        keynum = e.which
    }
    return keynum;
}

var imageIsNull = 0;
function imageGetSize (numimage) {
    if (document.getElementById('tempimageid').width != 0) {
        var tempimage = document.getElementById('tempimageid');
        var image = document.getElementById('img_' + currentImage);        
        image.style.height = tempimage.height + "px";
        image.style.width = tempimage.width + "px";
    
        image.style.cursor = 'pointer';
        image.idx = currentImage;
        image.onclick = function () { selectImage(this.idx); }

        loading = document.getElementById('divLoading');
        loadingimage = false;
        if (loading) {
            loading.parentNode.removeChild(loading);
        }
        imageIsNull = 0;
        document.body.removeChild(tempimage);
        adjustImage('true', numimage);
        return 0;
    }
    switch (imageIsNull) {
        case 0:
            // Wait some, then check again:
            timer = setTimeout("imageIsNull=1;imageGetSize("+numimage+");", 2000); //sleep for 500 ms
//            alert('Setting timer etc');
            break;
    case 1:
        imageIsNull = 0;
//        alert('Not setting timer');
        
        break;
    }
    return 0;
}


function loadedTemplateImage(object, numimage) {
    loadedstatus = 2;
    if (typeof(numimage) == "object") {
        numimage = this.numimage;
    }
    if (typeof(numimage) == 'undefined') {
            numimage = this.numimage;
    }
    if (typeof(numimage) == 'undefined') {
        numimage = currentImage;
    }

    var image = document.getElementById('img_' + numimage);
    if (!image) {
        document.getElementById('userimage_' + numimage).innerHTML = '<img id="img_'+numimage+'" width=0 height=0>';
        var image = document.getElementById('img_' + numimage);
       
    }

    if (safari)
	this.src = object.src;
    // If safari, we create a temp image:
    image.src = this.src;
    
    image.numimage = numimage;
    if (safari) {
        tempimage = document.createElement('img');
        tempimage.setAttribute('id', 'tempimageid');
        tempimage.src = image.src;
        document.body.appendChild(tempimage);
        tempimage = document.getElementById('tempimageid');
        image.style.height = tempimage.height + "px";
        image.style.width = tempimage.width + "px";
//        alert(tempimage.width);
        imageGetSize(numimage);
    }
    else if (this.reloadimage) {

        image.style.height = this.height + "px";
        image.style.width = this.width + "px";
    
        image.style.cursor = 'pointer';
        image.idx = currentImage;
        image.onclick = function () { selectImage(this.idx); }

        loading = document.getElementById('divLoading');
        loadingimage = false;
        if (loading) {
            loading.parentNode.removeChild(loading);
        }
        adjustImage('true', numimage, true);
    }
    else {
        loading = document.getElementById('divLoading');
        loadingimage = false;
        if (loading) {
            loading.parentNode.removeChild(loading);
        }
    }
    
    return true;
}

function hideForm(formid) {
    form = document.getElementById(formid);
    if (form) {
        inputs = document.getElementsByTagName('input');
        for (var i = 0; i < inputs.length; i++) {
            inputs[i].style.display = 'none';
        }
    }
}

function showForm(formid) {
    form = document.getElementById(formid);
    if (form) {
        inputs = document.getElementsByTagName('input');
        for (var i = 0; i < inputs.length; i++) {
            inputs[i].style.display = '';
        }
    }

}

var currbar = 0;
var progressrunning = false;
function ProgressBar() {
    if (progressrunning == false)
        return;
    if (!document.getElementById('formarea'))
        return false;
     
    barelement = document.getElementById('formarea');
    var width = 100;
    var height = 13;
    var barwidth = 10;
    if (currbar == 10)
        currbar = 0;
    barpos = currbar*barwidth;
    
    
    pdiv = document.getElementById('progressdiv');
    if (!pdiv) {
        pdiv = document.createElement('div');
        pdiv.setAttribute('id', 'progressdiv');
        pdiv.style.width = width + 'px';
        pdiv.style.height = height + 'px';
        pdiv.style.position = 'relative';
        pdiv.style.border = '1px solid black';
        barelement.appendChild(pdiv);
    }

    bardiv = document.getElementById('bardiv');
    if (!bardiv) {
        bardiv = document.createElement('div');
        bardiv.setAttribute('id', 'bardiv');
        bardiv.style.height = height + 'px';
        bardiv.style.width = barwidth + 'px';
        bardiv.style.backgroundColor = 'black';
        bardiv.style.position = 'absolute';
        bardiv.style.left = barpos + 'px';
        pdiv.appendChild(bardiv);
    }
    else
        bardiv.style.left = barpos + 'px';
    currbar = currbar+1;
    setTimeout("ProgressBar()", 500);
}

function removeProgressBar() {
    pdiv = document.getElementById('progressdiv');
    if (pdiv) {
        pdiv.parentNode.removeChild(pdiv);
    }
}
var loadedstatus = 0;
var errorSwitch = 0;
currLoading = 0;
function errorTemplateImage(numimage) {
//    alert('Numimage: ' + numimage);
//    alert('This: ' + this.numimage);
  
    if (typeof(numimage) == "object") {
        numimage = this.numimage;
    }
    if (typeof(numimage) == 'undefined') {
	    numimage = this.numimage;
    }
    reloadimage = this.reloadimage;
//    alert('errorTemplateImage ' + numimage);    
    if (typeof(numimage) == 'undefined') {
  //      alert('numimage is undefined');
        numimage = currentImage;
    }
    switch (errorSwitch) {
	case 0:
		timer = setTimeout("errorSwitch=1;errorTemplateImage(" + numimage + ");", 2000); //sleep for 500 ms
		break;
	case 1:
		clearTimeout(timer);
		errorSwitch=0;
		loadedstatus = 0;
//		alert('trying again' + numimage);
		loadTemplateImg(numimage, reloadimage);
		break;
    }
}

var imageloaded = 0;

imgstatus = new Array();
imgtable = new Array();
imgloadtable = new Array();
imageCount = 0;
function preLoadImages() {
    // Wait for browser to catch stuff:
    for (i=0;i<preLoadImages.arguments.length;i++) {
        imgstatus[i] = 0;
        imgloadtable[i] = preLoadImages.arguments[i];
    }
    imageCount = preLoadImages.arguments.length;
    loadImages();
}

function getLoadedRef(obj, i) {
    return function () { loadedImage(obj, i) }
}

function getErrorRef(obj, i) {
    return function() { imageLoadError(i); };
}

function loadImages() {
    var finished = true;
    imgtable=new Array()
    for (i=0;i<imageCount;i++) {
        if (imgstatus[i] == 0) {
            finished = false;
            imgtable[i] = document.createElement('img');
            imgtable[i].idx = i;
            imgtable[i].onload = function ()  { loadedImage(this, this.idx); };
//            imgtable[i].setAttribute('onerror', 'imageLoadError(this.idx);');
            if (safari) {
                imgtable[i].setAttribute("onerror", "imageLoadError(this.idx);");
	}
            else {
                imgtable[i].onerror = function () { imageLoadError(this.idx); };
	    }
            imgstatus[i] = 1;
	    random = Math.floor(Math.random() * 55555555);
            imgtable[i].src=imgloadtable[i] + "&random=" + random;
            break;
        }
       
         else if (imgstatus[i] == 1) {
            finished = false;  
        }
    }
    if (finished == true) {
        return true;
    }
/*    setTimeout("loadImages()", 1000); */
}

function onAbort() {
    return true;
}

function doNothing() {
    return true;
}

function fillIn(swidth, sheight, dwidth, dheight) {
    if (typeof(dwidth) == 'undefined')
        var dwidth = 50;
    if (typeof(dheight) == 'undefined')
        var dheight = 50;

    var dratio = dwidth/dheight;
    var sratio = swidth/sheight;

    if (dratio > sratio) {
       debug('width');
       diff = dwidth/swidth;
       width = dwidth;
       height = diff*sheight;
    }
    else {
       debug('height');
        diff = dheight/sheight;
        height = dheight;
        width = diff*swidth;
    }
    debug(width + " " + height);
    return [width, height];
}

function fitIn(swidth, sheight, dwidth, dheight) {
    if (typeof(dwidth) == 'undefined')
        var dwidth = 90;
    if (typeof(dheight) == 'undefined')
        var dheight = 70;

    var dratio = dwidth/dheight;
    var sratio = swidth/sheight;

    if (dratio < sratio) {
       debug('width');
       diff = dwidth/swidth;
       width = dwidth;
       height = diff*sheight;
    }
    else {
       debug('height');
        diff = dheight/sheight;
        height = dheight;
        width = diff*swidth;
    }
    debug(width + " " + height);
    return [width, height];
}


function getImageBoxSize(i) {
    var image = dojo.byId('image_' + i);
    size = fitIn(image.width, image.height);
    image.style.width = size[0] + 'px';
    image.style.height = size[1] + 'px';
}

// FIXME
oldimage = new Array();
function isImageUsed(imgnum, partnum, img) {
    usedImages[imgnum]++;
    if (typeof(oldimage[partnum][img]) != "undefined")
        usedImages[oldimage[partnum][img]]--;
    
  
    for (var i in usedImages) {
        if (usedImages[i] == 0) {
            dojo.byId('imageused_' + i).style.display='none';
        }
        else {
            if (dojo.byId('imageused_' + i)) {
                dojo.byId('imageused_' + i).style.display='';
            }
        }
    }
}

function loadedImage(object,i) {
//    alert(object.src);
     imgstatus[i] = 2;
  //  alert('image loaded');
    var image = dojo.byId('image_' + i);
    if (image) {
        size = fillIn(object.width, object.height);
        image.style.width = size[0] + 'px';
        image.style.height = size[1] + 'px';
        image.src = object.src;
        image.style.left = (50/2)-(size[0]/2) + 'px';
        image.style.top = (50/2)-(size[1]/2) + 'px';
        image.style.border = 'none';

        // Parent offset:
        var parentDiv = dojo.byId('image_parent_' + i);
        
        
        var re = object.src.match(/photoid\=([0-9]+)/);
        var imgid = re[1];

        image.setAttribute('photoid', imgid);
        new SubsDraggable('image_' + i, {revert: true, dragelement:getDragElement, zindex: 100});
        image.style.cursor='move';
        // Need a second try on fit in for safari
        if (safari)
            getImageBoxSize(i);


    }
    else {
        imgstatus[i] = 0;
    }
    
    imageloaded++;
    loadImages();
    return true;
}

function debug(message) {

//    document.getElementById('debugdiv').innerHTML += message + "<br>";
}

function scaleImage(imageid) {
    image = document.getElementById(imageid)
    if (image) {
        dstwidth = 85;
        dstheight = 70;
        
        orgwidth = stripPt(image.width);
        orgheight = stripPx(image.height);
        fitratio = dstwidth/dstheight;
        orgratio = orgwidth/orgheight;
        if (fitratio > orgratio) {
            diff = orgwidth/dstwidth;
            height = orgheight*diff;
            width = dstwidth;
        }
        else {
            diff = orgheight/dstheight;
            width = orgwidth*diff;
            height = dstheight;
        }
        return width;
    }
}

function imageLoadError(i) {
//    alert('imageloaderror');
    imgstatus[i] = 0;
    setTimeout("loadImages()", 2000);
}

function loadImage(src) {
    var tryimage = new Image();
    tryimage.onload = loadedImage;
    tryimage.onerror = imageLoadError;
    tryimage.src=src;
    return true;
}

function stripPt(value) {
    if (value == "") return 0;
    return parseFloat(value.substring(0, value.length - 2));
}
var picker;
var pickerTarget;
var pickerExample;


function selectText(textnum) {

  // Hide all first:
  var num = 0;
  while (textarea = dojo.byId('toolbar_' + num)) {
      textarea.style.display = 'none';
      dojo.byId('toolbar_hidden_' + num).style.display = '';
      num = num+1;
  }

  // Select current one:
  dojo.byId('toolbar_hidden_' + textnum).style.display = 'none';
  dojo.byId('toolbar_' + textnum).style.display = '';
  
}
function getBackgroundColor(color) {
    var r = Hex2Dec(color.substring(1,3));
    var g = Hex2Dec(color.substring(3,5));
    var b = Hex2Dec(color.substring(5,7));
    if ((r+g+b)/3 < 127) {
        var bgcolor = "white";
    } else {
        var bgcolor = "black";
    }
    return bgcolor;
}

function updateColorAndClose(color) {
    picker.hide();
    picker = null;
    
    bgcolor = getBackgroundColor(color);
    dojo.byId('yourtext_' + pickerTarget).style.backgroundColor = bgcolor;
    dojo.byId('yourtext_' + pickerTarget).style.color=color;
    dojo.byId('fontcolor_' + pickerTarget).value = color;
    dojo.byId('smallfontcolor_' + pickerTarget).style.backgroundColor = color;
}

function chooseFont(font, image) {
    var fontchooser = dojo.byId("fontchooser");
    document.body.removeChild(fontchooser);
    dojo.byId('fontfamily_' + currentString).value = font;
    dojo.byId('fontImage_' + currentString).src = image; 
}

function closeStringToolbarItems() {
    var fc = dojo.byId('fontchooser');
    if (fc) {
        document.body.removeChild(fc);
    }
    var sc = dojo.byId('fontZoomer');
    if (sc) {
        document.body.removeChild(sc);
    }
    var cp = dojo.byId('colorPalette');
    if (cp) {
       if (picker != null) 
           picker.hide();
       picker = null;
       document.body.removeChild(cp);
    }
}


currentString = 0;

function photogiftFontChooser(id, stringnum, e) {
    if (dojo.byId('fontchooser')) {
        return;
    }
    closeStringToolbarItems();
    obj = dojo.byId(id);
    currentString = stringnum;
    fonts = new Array();
    fonts[0] = '<img onClick=\'chooseFont("arial","/design/DEFAULT/graphics/photogifts/fonts/arial.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/arial.png"><br>';
fonts[1] = '<img onClick=\'chooseFont("blackchancery","/design/DEFAULT/graphics/photogifts/fonts/blackchancery.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/blackchancery.png"><br>';
fonts[2] = '<img onClick=\'chooseFont("dream orphans","/design/DEFAULT/graphics/photogifts/fonts/dream orphans.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/dream orphans.png"><br>';
fonts[3] = '<img onClick=\'chooseFont("exmouth","/design/DEFAULT/graphics/photogifts/fonts/exmouth.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/exmouth.png"><br>';
fonts[4] = '<img onClick=\'chooseFont("gentium","/design/DEFAULT/graphics/photogifts/fonts/gentium.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/gentium.png"><br>';
fonts[5] = '<img onClick=\'chooseFont("goodfish","/design/DEFAULT/graphics/photogifts/fonts/goodfish.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/goodfish.png"><br>';
fonts[6] = '<img onClick=\'chooseFont("living by numbers","/design/DEFAULT/graphics/photogifts/fonts/living by numbers.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/living by numbers.png"><br>';
fonts[7] = '<img onClick=\'chooseFont("pakenham free","/design/DEFAULT/graphics/photogifts/fonts/pakenham free.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/pakenham free.png"><br>';
fonts[8] = '<img onClick=\'chooseFont("primer print","/design/DEFAULT/graphics/photogifts/fonts/primer print.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/primer print.png"><br>';
fonts[9] = '<img onClick=\'chooseFont("tall paul","/design/DEFAULT/graphics/photogifts/fonts/tall paul.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/tall paul.png"><br>';
fonts[10] = '<img onClick=\'chooseFont("times new roman","/design/DEFAULT/graphics/photogifts/fonts/times new roman.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/times new roman.png"><br>';
fonts[11] = '<img onClick=\'chooseFont("verdana","/design/DEFAULT/graphics/photogifts/fonts/verdana.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/verdana.png"><br>';
fonts[12] = '<img onClick=\'chooseFont("vinque","/design/DEFAULT/graphics/photogifts/fonts/vinque.png");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/photogifts/fonts/vinque.png"><br>';
    var starty = getY(obj) + obj.height;
    var startx = getX(obj);
    var fontchooser = document.createElement('div');
    fontchooser.style.position = 'absolute';
    fontchooser.style.top = starty + 0 + 'px';
    fontchooser.style.left = startx + 'px';
    fontchooser.style.border = '1px solid black'; 
    fontchooser.style.zIndex = 101;
    fontchooser.style.backgroundColor = 'white';
    fontchooser.id = 'fontchooser';
    
    for (i=0;i<fonts.length;i++) {
        fontchooser.innerHTML += fonts[i];
    }
    document.body.appendChild(fontchooser);

    // Try to stop cathing:
    if (!e) var e = window.event;
    e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();
}
function fontChooser(id, stringnum, e) {
    if (dojo.byId('fontchooser')) {
        return;
    }
    closeStringToolbarItems();
    obj = dojo.byId(id);
    currentString = stringnum;
    fonts = new Array();
    fonts[0] = '<img onClick=\'chooseFont("arial","/design/DEFAULT/graphics/card/fonts/arial.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/arial.gif"><br>';
fonts[1] = '<img onClick=\'chooseFont("blackchancery","/design/DEFAULT/graphics/card/fonts/blackchancery.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/blackchancery.gif"><br>';
fonts[2] = '<img onClick=\'chooseFont("dream orphans","/design/DEFAULT/graphics/card/fonts/dream orphans.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/dream orphans.gif"><br>';
fonts[3] = '<img onClick=\'chooseFont("exmouth","/design/DEFAULT/graphics/card/fonts/exmouth.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/exmouth.gif"><br>';
fonts[4] = '<img onClick=\'chooseFont("gentium","/design/DEFAULT/graphics/card/fonts/gentium.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/gentium.gif"><br>';
fonts[5] = '<img onClick=\'chooseFont("goodfish","/design/DEFAULT/graphics/card/fonts/goodfish.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/goodfish.gif"><br>';
fonts[6] = '<img onClick=\'chooseFont("living by numbers","/design/DEFAULT/graphics/card/fonts/living by numbers.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/living by numbers.gif"><br>';
fonts[7] = '<img onClick=\'chooseFont("pakenham free","/design/DEFAULT/graphics/card/fonts/pakenham free.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/pakenham free.gif"><br>';
fonts[8] = '<img onClick=\'chooseFont("primer print","/design/DEFAULT/graphics/card/fonts/primer print.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/primer print.gif"><br>';
fonts[9] = '<img onClick=\'chooseFont("tall paul","/design/DEFAULT/graphics/card/fonts/tall paul.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/tall paul.gif"><br>';
fonts[10] = '<img onClick=\'chooseFont("times new roman","/design/DEFAULT/graphics/card/fonts/times new roman.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/times new roman.gif"><br>';
fonts[11] = '<img onClick=\'chooseFont("verdana","/design/DEFAULT/graphics/card/fonts/verdana.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/verdana.gif"><br>';
fonts[12] = '<img onClick=\'chooseFont("vinque","/design/DEFAULT/graphics/card/fonts/vinque.gif");\' onMouseOut="this.style.opacity=0.40;this.style.filter=\'alpha(opacity=40);\';" onMouseOver="this.style.opacity=1;this.style.filter=\'alpha(opacity=100);\';" style="filter: alpha(opacity=40); opacity:.40; cursor: pointer; width: 101px;" src="/design/DEFAULT/graphics/card/fonts/vinque.gif"><br>';
    var starty = getY(obj) + obj.height;
    var startx = getX(obj);
    var fontchooser = document.createElement('div');
    fontchooser.style.position = 'absolute';
    fontchooser.style.top = starty + 5 + 'px';
    fontchooser.style.left = startx + 'px';
    fontchooser.style.border = '2px solid black'; 
    fontchooser.style.zIndex = 101;
    fontchooser.style.backgroundColor = 'white';
    fontchooser.id = 'fontchooser';
    
    for (i=0;i<fonts.length;i++) {
        fontchooser.innerHTML += fonts[i];
    }
    document.body.appendChild(fontchooser);

    // Try to stop cathing:
    if (!e) var e = window.event;
    e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();
}

function cardChooseTextSize(size) {
    var sizechooser = dojo.byId("fontZoomer");
    document.body.removeChild(sizechooser);
    var strings = new Array();
    strings[0] = 'Erittäin pieni';
    strings[1] = 'Pieni';
    strings[2] = 'Normaali';
    strings[3] = 'Suuri';
    strings[4] = 'Erittäin suuri';
    dojo.byId('fontzoom_' + currentString).value = size; 
    dojo.byId('sizeTextDiv_' + currentString).innerHTML = strings[size];
}

function sizeChooser(id, stringnum, e) {

    if (dojo.byId('fontZoomer')) {
        return;
    }
    closeStringToolbarItems();

    obj = dojo.byId(id);
    currentString = stringnum;
    
    var sizes = new Array();
    sizes[0] = "<img onClick=cardChooseTextSize(0); onMouseOut=\"this.style.opacity=0.40;\" onMouseOver=\"this.style.opacity=1\" style=\"opacity:.40; cursor: pointer;\" src='FontSizes.php?text=Eritt%C3%A4in+pieni&size=0'><br>"
    sizes[1] = "<img  onClick=cardChooseTextSize(1); onMouseOut=\"this.style.opacity=0.40;\" onMouseOver=\"this.style.opacity=1\" style=\"opacity:.40; cursor: pointer;\" src='FontSizes.php?text=Pieni&size=1'><br>"
    sizes[2] = "<img onClick=cardChooseTextSize(2);  onMouseOut=\"this.style.opacity=0.40;\" onMouseOver=\"this.style.opacity=1\" style=\"opacity:.40; cursor: pointer;\" src='FontSizes.php?text=Normaali&size=2'><br>"
    sizes[3] = "<img onClick=cardChooseTextSize(3); onMouseOut=\"this.style.opacity=0.40;\" onMouseOver=\"this.style.opacity=1\" style=\"opacity:.40; cursor: pointer;\" src='FontSizes.php?text=Suuri&size=3'><br>"
    sizes[4] = "<img  onClick=cardChooseTextSize(4); onMouseOut=\"this.style.opacity=0.40;\" onMouseOver=\"this.style.opacity=1\" style=\"opacity:.40; cursor: pointer;\" src='FontSizes.php?text=Eritt%C3%A4in+suuri&size=4'><br>"
    
    
    var starty = getY(obj) + 12;
    var startx = getX(obj);
    
    var fontchooser = document.createElement('div');
    fontchooser.style.position = 'absolute';
    fontchooser.style.top = starty + 7 + 'px';
    fontchooser.style.left = startx + 'px';
    fontchooser.style.border = '2px solid black';
    fontchooser.style.backgroundColor = 'white';
    fontchooser.id = 'fontZoomer';

    for (i=0;i<sizes.length;i++) {
        fontchooser.innerHTML += sizes[i];
    }
    document.body.appendChild(fontchooser);

    // Try to stop cathing:
    if (!e) var e = window.event;
    e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();

 
}



function showColorPalette(divid, targetnum, obj, e) {
    if (picker != null) {
    return;
    }
    closeStringToolbarItems();
    
    // StartY:
    var starty = getY(obj) + obj.height;
    var startx = getX(obj) - obj.width;
    palette = document.createElement('div');
    palette.style.position = 'absolute';
    palette.style.top = starty + 7 + 'px';
    palette.style.left = startx - 110 + 'px';
    palette.style.zIndex = 102;
    
    palette.id = 'colorPalette';
    document.body.appendChild(palette);
    pickerTarget = targetnum;
    picker = dojo.widget.fromScript("ColorPalette",
    {widgetId: "textPalettePicker"}, dojo.byId('colorPalette'), "last");
    dojo.event.kwConnect({srcObj: picker,srcFunc:"onColorSelect",targetObj:
    this, targetFunc:"updateColorAndClose", once:true});

    // Try to stop cathing:
    if (!e) var e = window.event;
    e.cancelBubble = true;
    if (e.stopPropagation) e.stopPropagation();

}



function getY( oElement )
{
    var iReturnValue = 0;
    while( oElement != null ) {
    iReturnValue += oElement.offsetTop;
    oElement = oElement.offsetParent;
    }
    return iReturnValue;
}

function getX( oElement )
{
    var iReturnValue = 0;
    while( oElement != null ) {
    iReturnValue += oElement.offsetLeft;
    oElement = oElement.offsetParent;
    }
    return iReturnValue;
}

function setPhotogiftTextAlign (elementid, num) {
    elm = dojo.byId(elementid);
    re = elm.style.backgroundImage.match(/(.+)([i][n]active)-align_(.+).png\)/);
    currentState = re[2];
    align = re[3];
    path = re[1];
    //alert('Align: ' + align);
//    alert('Path: ' + path);
//    alert('currentState: ' + currentState);
    // Disable stuff:
    dojo.byId('align_left_' + num).style.backgroundImage = path + "inactive-align_left.png)";
    dojo.byId('align_center_' + num).style.backgroundImage = path + "inactive-align_center.png)";
    dojo.byId('align_right_' + num).style.backgroundImage = path + "inactive-align_right.png)";

    // Re-enable the clicked one:
    re = elm.style.backgroundImage.match(/(.+)-(active|inactive)\)/);
    elm.style.backgroundImage = path + "active-align_"+align+".png)";

    dojo.byId('fontalign_' + num).value = align;
}

function toggleButton(buttonid) {
    elm = document.getElementById(buttonid);

    re = elm.style.backgroundImage.match(/(.+)(active|inactive)\)/);
    currentState = re[2];

    if (currentState == "active") {
        elm.style.backgroundImage = re[2] + "inactive)";
    }
    else {
        elm.style.backgroundImage = re[2] + "active)";
    }
    
}

function currentAlign ( currentSelected, obj, align, num) {

    var image_left = '/design/DEFAULT/graphics/photogifts/align_left.gif';
    var image_center = '/design/DEFAULT/graphics/photogifts/align_center.gif';
    var image_right = '/design/DEFAULT/graphics/photogifts/align_right.gif';
    
    dojo.byId('align_left_' + num).src = image_left;
    dojo.byId('align_center_' + num).src = image_center;
    dojo.byId('align_right_' + num).src = image_right;

    // Active active:
    obj.src = currentSelected;

    dojo.byId('fontalign_' + num).value = align;
    
     
}

function uploadPhotogiftImage() {
    if (dojo.byId('uploadimage').value=='') {
        dojo.byId('uploadNoImage').style.display = 'inline';
        return;
    }
    dojo.byId('uploadNoImage').style.display = 'none';
    dojo.byId('errormsg').style.display = 'none';

    // Set imagenum:
    dojo.byId('imagenum').value = currentImage;
    dojo.byId('uploadform').submit();

}

document.onclick = documentClick;