$(document).ready(function() {
	$('.rooftile').show();

    $('.chooseVariation').click(function() {
        var popup = openCenteredWindow(popupUrl, "popup", 664, 374, "directories=no, toolbar=no, location=no, menubar=no, scrollbars=no, status=no, resizable=no, dependent=no");
		popup.focus();
	});
    /*
    $('.chooseVariation').click(function (e) {
		e.preventDefault();
		$('#modalContainer').modal({
			onShow: loadModalContent(popupUrl),
			onClose: function (dialog) {
				dialog.data.hide();
				dialog.container.hide();
				dialog.overlay.hide();
				// must call this to have SimpleModal re-insert the data correctly and clean up the dialog elements
				$.modal.close();
			}
		});
	});
    */
});

function insertVariation(material, model, color) {
    var itemCount = $('.variations dl').length;

	if (itemCount > 1) {
		alert(errVarLabel);
		return false;
	} else {
		var materialHtml	= '<dt>' + materialLabel	+ ':</dt><dd>' + material + '</dd>';
		var modelHtml		= '<dt>' + modelLabel		+ ':</dt><dd>' + model + '</dd>';
		var colorHtml		= '<dt>' + colorLabel		+ ':</dt><dd>' + color + '</dd>';
		var variationHtml	= materialHtml + modelHtml + colorHtml;

		var variationValue	= trim(material) + '###' + trim(model) + '###' + trim(color);
		var variationInput	= '<input type="hidden" name="tx_abbrochure_pi2[order][variation]" value="' + variationValue + '" class="variation" />';

		$('.variations').append('<dl>' + variationHtml + '<span class="delete">' + delVarLabel + '</span></dl>');
		$('#orderForm').append(variationInput);

        $('.chooseVariation').hide();

		refreshItems();
	}
}

function refreshItems() {
    $('.variations dl span.delete').unbind('click');

	$('.variations dl span.delete').click(function() {
		$(this).parent('dl').remove();
		$('input.variation').remove();

		var itemCount = $('.variations dl').length;

		// if less than 1 variations are selected, then show the chooseVariation-text
		if (itemCount < 1) {
			$('.chooseVariation').show();
		}
	});
}

// function for trimming whitespaces
function trim (string) {
  return string.replace (/^\s+/, '').replace (/\s+$/, '');
}

function openCenteredWindow(url,winName,winWidth,winHeight,winParams)	{
    // coords to center popup
    var newX, newY;
    newX = (screen.width - winWidth) / 2;
    newY = (screen.height - winHeight) / 2;

    // check user resolution to center the popup
    if (screen.width > winWidth) {
        if (screen.height > winHeight) {
            newWinParams = winParams + ',width=' + winWidth + ',height=' + winHeight + ',left=' + newX + ',top=' + newY;
        }
        else {
            newWinParams = winParams + ',width=' + winWidth + ',height=' + screen.height + ',left=' + newX + ',top=0,scrollbars=yes';
        }
    }
    else {
        if (screen.width <= winWidth) {
            if (screen.height <= winHeight) {
                newWinParams = winParams + ',width=' + screen.width + ',height=' + screen.height + ',left=0,top=0,scrollbars=yes';
            }
            else {
                newWinParams = winParams + ',width=' + screen.width + ',height=' + winHeight + ',left=0,top=' + newY + ',scrollbars=yes';
            }
        }
    }

    var ppWindow = window.open(url,winName,newWinParams);
	if (ppWindow) {
        ppWindow.focus();
    }

    return ppWindow;
}

function loadModalContent(url) {
	var mC = $('.modalContent');
	$(mC).html('<iframe src="'+url+'" height="374" width="664" frameborder="0" scrolling="no"></iframe>');
}
function closeModal() {
    $.modal.close();
}
