Tre = {};

/*	You need:
	1 A container element with the class "expandContainer" 
	2 An element to expand inside 1 with the class "expandable"
	3 A link with a parent with the class "expandLink" inside 1 wih onclick="Tre.Toggle(this);"

	Ex:
	<div class="expandContainer">
		<div class="expandable">Expandable</div>
		<p class="expandLink"><a href="javascript:" onclick="Tre.Toggle(this);"><img src="/media/images/expand-icon.png" alt="" /> Mer om ...</a></p>
	</div>
*/
Tre.Toggle = function(sender){
	//sender should be the expandContainer or an element inside of the expandContainer
	var container = ($(sender).hasClass('expandContainer') ?  $(sender) : $(sender).closest('.expandContainer'));
	
	if(container.find('.expandable').toggle().css('display') !== 'none'){
		container.find('.expandLink a').each(function(){ $(this).attr('caption', $(this).html()).html('<img alt="" src="/media/images/contract-icon.png"> D&ouml;lj') });
	}
	else{
		container.find('.expandLink a').each(function(){ $(this).html($(this).attr('caption')) });
	}
	if(typeof(curvyCorners) !== 'undefined'){ curvyCorners.redraw(); }
	
};
Tre.Lightbox = {
	Open : function(className, content){
		$('body > form').prepend(
			'<div id="lightbox" class="' + className + '" onclick="if( !this.denyClose ){ Tre.Lightbox.Close(); } else { this.denyClose = 0; }">\
				<div class="lightBoxBlock block curvyRedraw" onclick="this.parentNode.denyClose=1;">\
					<div class="closeBtn"><a href="javascript:" onclick="Tre.Lightbox.Close();"><img src="/media/images/close-lightbox.png" alt="" /></a></div>'
					+ content + 
				'</div>\
			</div>');
		Tre.Init('#lightbox');
		// above won't work with curvycorners and lightboxes
		Tre.InitCurvyCorners();
		//centering with minus-margins and unknown dimensions
		$('#lightbox .lightBoxBlock').css('marginTop','-'+(($('#lightbox .lightBoxBlock').height()+30)/2) + 'px');
		$('#lightbox .lightBoxBlock').css('marginLeft','-'+(($('#lightbox .lightBoxBlock').width()+30)/2) + 'px');
	},
	Close : function(){
		$('#lightbox').remove();
	}
};
Tre.InfoLightbox = {
	Open : function(headline, content, imageSrc, className){
		Tre.Lightbox.Open( 'infoLightBox' + (className ? ' ' + className : ''), '<table><tr>' + (imageSrc ? '<td><img src="' + imageSrc + '" /></td>' : '') + '<td><h1>' + headline + '</h1></td></tr></table><div class="hr"></div><div class="text12">' + content  + '</div>');
	}
};
Tre.IframeLightbox = {
	Open : function(url){
		Tre.Lightbox.Open( 'iframeLightBox', '<div class="iframeBlock"><div id="iframeWrapper">\
			<div id="ie6TopMenuCover"></div>\
			<iframe id="TreUtland" src="'
			+ url + 
			'" height="550" scrolling="yes" frameborder="0"></iframe></div></div>');		
	}
};
Tre.ConfirmLightbox = {
	Open : function(headline, content, callback){
		Tre.Lightbox.Open( 'confirmLightBox', '<h3>' + headline + '</h3><p class="text12">' + content  + '</p><div class="hr"></div><div class="buttonSpace"><div class="button"><a href="javascript:" onclick="Tre.Lightbox.Close();"><img src="/media/images/buttons/no-white-btn.png" alt="nej" /></a></div><div class="button confirmBtn"><a href="javascript:"><img src="/media/images/buttons/yes-btn.png" alt="ja" /></a></div></div>');
		$('#lightbox.confirmLightBox .confirmBtn').click(callback).click(function(){ Tre.Lightbox.Close(); });
	}
};
Tre.GetBalloon = function(forId) {
	return $('[for=' + forId + ']').filter('[generated=true]').parent();
};

Tre.My3Lightbox = {
    Open: function(aboutPageUrl) {
        Tre.Lightbox.Open('my3Lightbox',
			'<div class="floatContainer tabs">\
				<div class="active"><a href="javascript:" onclick="Tre.My3Lightbox.TabOpen(\'login\',this);">Logga in</a></div>\
				<div><a href="javascript:" onclick="Tre.My3Lightbox.TabOpen(\'help\',this);">Hjälp med inloggning</a></div>\
				<div><a href="javascript:" onclick="Tre.My3Lightbox.TabOpen(\'register\',this);">Registrera dig</a></div>\
			</div>\
			<div class="tabLayers">\
				<div class="tabLayer" id="loginLayer">\
					<div class="body floatContainer">\
						<div class="imgContainer"><img src="/media/images/my3-lightbox-login.jpg" /></div>\
						<div class="txtContainer customForm">\
							<h3>Logga in</h3>\
							<input type="hidden" name="HiddenURI" value="https://min3web.tre.se/sesam3" />\
			                <input type="hidden" name="GARESOURCEID" value="dropitse" />\
			                <input type="hidden" name="AUTHMETHOD" value="UserPassword" />\
			                <input type="hidden" name="pageGenTime" value="" />\
			                <input type="hidden" name="LOCALE" value="sv_SE" />\
							<div class="floatContainer inputColumnContainer">\
								<div class="col">\
									<label for="Username">Mobilnummer&frasl;e-post:</label><br/>\
									<input type="text" id="loginUsername" tabindex="1" name="usr_name" class="my3login" />\
									<div class="forgotPasswordLnk"><a tabindex="4" onclick="Tre.My3Lightbox.DelayedClose();" href="https://login.tre.se/auth/Login?Template=wlnewpwd&GAURI=http://www.tre.se/Mitt3" target="_blank">Glömt lösenord?</a></div>\
								</div>\
								<div class="col">\
									<label for="Password">Lösenord:</label><br/>\
									<input type="password" id="loginPassword" tabindex="2" name="usr_password" class="my3login" />\
									<div class="logInBtn"><a tabindex="3" onclick="Tre.My3Lightbox.Login();" href="javascript:"><img src="/media/images/buttons/login-btn.png" alt="Logga in" /></a></div>\
								</div>\
							</div>\
						</div>\
					</div>\
					<div class="notice">Vad är det här? <a href="' + aboutPageUrl + '">Berätta mer om Mitt3</a></div>\
				</div>\
				<div class="tabLayer" id="helpLayer">\
					<h3>Du som har 1 abonnemang</h3>\
					<p>Du loggar in med ditt mobilnummer i formatet 0735XXXXXX eller 46735XXXXXX.</p>\
					<h3>Du som har 2 eller fler abonnemang</h3>\
					<p>Du måste registrera en administratör för att kunna se fakturor, ansöka om autogiro etc. Du får ett lösenord skickat till dig med post och loggar sedan in med den e-postadress du valde vid registreringen.</p>\
				</div>\
				<div class="tabLayer" id="registerLayer">\
					<div class="body floatContainer">\
						<div class="imgContainer"><img src="/media/images/my3-lightbox-register.jpg" /></div>\
						<div class="txtContainer">\
							<h3>Du som har 1 abonnemang</h3>\
							<p><a onclick="Tre.My3Lightbox.DelayedClose();" href="https://login.tre.se/auth/Login?Template=wlselfreg" target="_blank">Klicka här för att registrera dig på Mitt3</a></p>\
							<h3>Du som har 2 eller fler abonnemang</h3>\
							<p>Du måste registrera en administratör för att kunna se fakturor, ansöka om autogiro etc.<br/><a onclick="Tre.My3Lightbox.DelayedClose();" href="https://min3web.tre.se/nonadmin/login.do?country=se" target="_blank">Registrera en administratör</a></p>\
						</div>\
					</div>\
				</div>\
			</div>');
        $("#my3Lightbox .customForm").jNice();

        $(".my3login").keydown(function(event) {
            if (event.which == 13) {
                Tre.My3Lightbox.Login();

                return false;
            }
        });
    },
    DelayedClose: function() {
        window.setTimeout("Tre.Lightbox.Close()", 1000);
    },
    TabOpen: function(name, sender) {
        $('#lightbox.my3Lightbox .tabLayers>div').hide().filter('#' + name + 'Layer').show();
        $('#lightbox.my3Lightbox .tabs>div').removeClass('active');
        $(sender.parentNode).addClass('active');
    },
    Login: function() {
        var username = $("#loginUsername").val();

        if (username.indexOf("@") == -1 && username.charAt(0) == "0") {
            $("#loginUsername").val("46" + username.substring(1));
        }

        //set page generated time
        var today = new Date();
        var pageGenTime = today.getTime() - today.getMilliseconds();
        $("input[name='pageGenTime']").val(pageGenTime);

        //store original form values
        var formAction = document.forms[0].action;
        var formTarget = document.forms[0].target;
        var viewstate = $("input[name='__VIEWSTATE']").val();

        //empty viewstate value before submitting the form (oversized POST data issue) - by Nikolaj Carøe
        $("input[name='__VIEWSTATE']").val("");

        //set temporary form values
        document.forms[0].action = "https://login.tre.se/auth/Login";
        document.forms[0].target = "_blank";
        document.forms[0].submit();

        //store original form values
        document.forms[0].action = formAction;
        document.forms[0].target = formTarget;
        $("input[name='__VIEWSTATE']").val(viewstate);

        Tre.My3Lightbox.DelayedClose();
    }
};

Tre.Preload = function(images){
	var preimages = new Array();
	for (var key in images){
		preimages.push(new Image().src = images[key]);
	}
}

Tre.Init = function(context) {
	var siteInsideIframe = top.location != location;

	//fixing issues with floated elements with margin in IE7
	$('.ie7 .floatContainer > .block:not(.floatWrapped)', context).addClass('floatWrapped').wrap('<div class="floater" style="background:none !important; padding:0 !important; margin:0 !important;" />');

	// fix bug in curvycorners
	//$('.block > .floatContainer:not(.fcCCwrapper)').wrap('<div class="fcCCwrapper" />');

	// exclude curvycorners autoPadDiv or curvyCorners.redraw() will break
	//$('body *:not(script,.autoPadDiv):first-child', context).addClass('first');
	//$('body *:not(script,.autoPadDiv):last-child', context).addClass('last');
	$('tr:odd', 'table').addClass('even');
	$('tr:even', 'table').addClass('odd');
	//	$('.TinyMCE > *:last-child, .TinyMCE td > *:last-child').addClass('noMarginBottom');
	//img or p inside p for example.
	//	$('.noMarginBottom > *:last-child').addClass('noMarginBottom');
	$('.TinyMCE *:last-child').addClass('noMarginBottom');


	// removing text-to-image margins with css
	$('img[src*=class=price-tag]', context).addClass('priceTextImg');
	$('img[src*=class=price-tag-month]', context).removeClass('priceTextImg').addClass('textImg');

	// wrap tinyMCE-columns (we need it for margins in floated content)
	$('.TinyMCE .vansterkolumn:not(.colWrapped)', context).addClass('colWrapped').wrap('<div class="lColWrapper" />');
	$('.TinyMCE .hogerkolumn:not(.colWrapped)', context).addClass('colWrapped').wrap('<div class="rColWrapper" />');

	$("img.reflect").reflect({ height: 12 });
	$("img.reflect10light").reflect({ height: 10, opacity: 0.4 });
	$("img.reflect6light").reflect({ height: 6, opacity: 0.4 });
	$("img.smallreflect").reflect({ height: 4, opacity: 0.4 });

	if (typeof ($.jNice) !== 'undefined') { $('.customForm', context).jNice(); }
	//
	//$('.ie7 .tabContainer .tab, .ie8 .tabContainer .tab').css('backgroundColor','transparent').css('padding','0').addClass('curvyIgnore').prepend('<div class="tab" style="height:3px;padding:8px 15px 0; overflow:hidden;margin-bottom:-3px;background-color:white;">mupp</div>');;

	if (siteInsideIframe) {
		// test if site is inside en iframe
		$(window).load(function() {
			setTimeout("Tre.InitCurvyCorners()", 500);
		});
	}
	else {
		$(window).load(function() {
			Tre.InitCurvyCorners();
		});
	}
	//	$('.ie7 .tabContainer .tab a, .ie8 .tabContainer .tab a').click( function(){ $('.tabContainer .tab').removeClass('activeTab'); $(this).closest('.tab').addClass('activeTab'); });

	//removing outline in ie7
	$('a, button', '.ie7').focus(function() { this.blur(); });
}

Tre.InitCurvyCorners = function() {
	if (typeof (curvyCorners) !== 'undefined') {
		curvyCorners.init();
		curvyCorners.redraw();
		curvyCorners.scanStyles();
	}
}


$(document).ready(function(){
	/*browser detect (customized and minified) */
	var a=navigator.userAgent.toLowerCase();$.browser.chrome=/chrome/.test(navigator.userAgent.toLowerCase());if($.browser.msie){$('body').addClass('ie');$('body').addClass('ie'+$.browser.version.substring(0,1))}if($.browser.chrome){$('body').addClass('browserChrome');a=a.substring(a.indexOf('chrome/')+7);a=a.substring(0,1);$('body').addClass('browserChrome'+a);$.browser.safari=false}if($.browser.safari){$('body').addClass('safari');a=a.substring(a.indexOf('version/')+8);a=a.substring(0,1);$('body').addClass('safari'+a)}if($.browser.mozilla){if(navigator.userAgent.toLowerCase().indexOf('firefox')!=-1){$('body').addClass('firefox');a=a.substring(a.indexOf('firefox/')+8);a=a.substring(0,1);$('body').addClass('firefox'+a)}else{$('body').addClass('mozilla')}}if($.browser.opera){$('body').addClass('opera')}

	Tre.Init(document);
	//preload images
	Tre.Preload(['/media/images/contract-icon.png', '/media/images/bagarrow.gif', '/media/images/lightbox-bg.png', '/media/images/balloon-body.png', '/media/images/color-hover.gif', '/media/images/color-active.gif']);
	Tre.ie6Notice();
});




/* Malplaced? */
Product = {
    TabOpen: function(name, sender) {
        $('#tabLayers>div.' + name).show().siblings().hide();
        $('.pTabContainer .pTab').removeClass('active');
        var index = $('#tabLayers>div').index($('div.' + name, "#tabLayers"));
        $(".pTabContainer .pTab").eq(index).addClass('active');
        if (typeof (curvyCorners) !== 'undefined') { curvyCorners.redraw(); }
    }
}



/* Deprecated stuff */



/* Deprecated! Used by previous datasubscription.js (modems) */
General = {
	Expand : function(id, object, contractText){
		$('#' + id + ' .expandLink a').attr('href','javascript:' + object + '.Contract();').html('<img alt="" src="/media/images/contract-icon.png"> ' + contractText + '</a>');
		$('#' + id + ' .expandable').show();
		if(typeof(curvyCorners) !== 'undefined'){ curvyCorners.redraw(); }
	},
	Contract : function(id, object, expandText){
		$('#' + id + ' .expandLink a').attr('href','javascript:' + object + '.Expand();').html('<img alt="" src="/media/images/expand-icon.png"> ' + expandText + '</a>');
		$('#' + id + ' .expandable').hide();
		if(typeof(curvyCorners) !== 'undefined'){ curvyCorners.redraw(); }
	}
};

/*

Tre.Expand = function(sender){
	// deprecated, now used as wrapper function for backward compability
	this.Toggle(sender);
};

Tre.Contract = function(sender){
	// deprecated, now used as wrapper function for backward compability
	this.Toggle(sender);
};
*/
Tre.ie6Notice = function(){
	$('body.ie6 form').prepend('<div id="ie6Container">\
		<div class="noticeBlockCS squareBlock">\
			<div class="floatContainer">\
				<div class="exclamation">\
					<img src="/media/images/exclamation.png" alt="tre" /></div>\
				<div class="body">\
					<h3>Viktig information: </h3>\
					<p>Du använder en gammal webbläsare som saknar stöd för funktionalitet på den här webbplatsen. <br />Du bör uppgradera till en senare version av t ex <a href="http://www.microsoft.com/windows/internet-explorer/default.aspx">Internet Explorer</a> eller <a href="http://www.mozilla-europe.org/sv/firefox/">Firefox</a>.</p>\
				</div>\
				<div class="download">\
					<a href="http://www.microsoft.com/windows/internet-explorer/default.aspx" onclick="$(this).closest(\'.noticeBlockCS\').hide();">\
						<img src="/media/images/download-explorer.png" alt="tre" /></a>\
				</div>\
				<div class="download">\
					<a href="http://www.mozilla-europe.org/sv/firefox/" onclick="$(this).closest(\'.noticeBlockCS\').hide();">\
						<img src="/media/images/download-firefox.png" alt="tre" /></a>\
				</div>\
			</div>\
		</div>\
	</div>');
}