
var RotateYouriPhone = new Class({

	Implements:[Options,Events],
	
	options: {
		mode:0, //0=landscape,1=portrait
		rotateActive:false
	},
	initialize: function(elements){
		if((navigator.userAgent.match(/iPhone/i))||(navigator.userAgent.match(/iPod/i))){
			this.setOptions(elements);
			this.first();
			window.addEvent('resize', this.first.bind(this));			
		}
	},
	first: function(){
		w=window.getWidth();
		h=window.getHeight();
		wh=w/h;
		if(wh > 1.5){
			if( this.options.mode==1){
				this.portrait(w,h);
				this.setOptions({rotateActive:true});
			}else{
				this.deleteDiv();
				this.setOptions({rotateActive:false});
			}
		}else{
			if(this.options.mode==0){
				this.landscape(w,h);
				this.setOptions({rotateActive:true});
			}else{
				this.deleteDiv();
				this.setOptions({rotateActive:false});
			}
		}

	},
	portrait: function(w,h){
		if(!this.options.rotateActive) this.makeDivForLandscape(w,h,"please,<br/>rotate in portrait mode");
	},
	landscape: function(w,h){
		if(!this.options.rotateActive) this.makeDivForPortrait(w,h,"please,<br/>rotate in landscape mode");
	},
	makeDivForPortrait: function(w,h,text){
	
		orwidth=(w*0.8);
		
		this.createDiv(text,orwidth);
	},
	makeDivForLandscape: function(w,h,text){
	
		orwidth=(h*0.8);
		
		this.createDiv(text,orwidth);
	},
	createDiv: function(text,orwidth){
		
		height=orwidth;
		width=orwidth;
		
		padding=(orwidth/2)-(orwidth*0.1);
		
		top=((h/2)-(height/2));
		
		left=((w/2)-(width/2));
		
		
		height=orwidth-(padding/2);
		width=orwidth-(top);
		
		var myDiv = new Element ( 'div' , { 
			'id':'RotateYouriPhone',
    		'html': text,
			'styles' : {
				'font-size':(width/9)+'pt',
				'font-family':'"Lucida Grande", Verdana, Arial, sans-serif',
				'text-align':'center',
				'padding':(padding/2)+'px '+(top/2)+'px 0px',
				'margin':'0',
				'color':'#FFFFFF',
       			'display': 'block',
				'width':width+"px", 
				'height':height+'px', 
				'background-color':'#000000',
				'position':'absolute',
				'top':top+'px',
				'left':left+'px',
				'opacity':'0.8',
				'-webkit-border-radius':(top/2)+'px',
				'-webkit-text-size-adjust':'auto'
			 }
		}).inject($(document.body));
	},
	deleteDiv: function(){
		if($('RotateYouriPhone')) $('RotateYouriPhone').parentNode.removeChild($('RotateYouriPhone'));
	}
});


