https://puntodepartida.com/_js/general.js

1
2(function(){
3
4	var creaReglaCSS = function(nombre,props) {
5
6		var style;
7		if ( document.getElementsByTagName('style').length === 0 ) {
8			style = document.createElement('style');
9			style.type = 'text/css';
10			document.getElementsByTagName('head')[0].appendChild(style);				
11
12		}
13		else
14		{
15			style = document.getElementsByTagName('style')[0];
16		}
17
18		style.innerHTML += '\n'+nombre+' { '+props+' }\n';
19
20	}
21
22	var ponRelojesEnHora = function() {
23 		var date = new Date();
24    	var horas = date.getHours();
25    	if ( horas > 12 ) horas -= 12;
26    	var minutos = date.getMinutes();
27    	
28    	var grados_horas = ( 30 * horas );
29    	var grados_minutos = ( 6 * minutos ) ;
30    	
31
32    	var relojes = document.querySelectorAll('.reloj');
33    	for ( var i = 0 ; i < relojes.length ; i++ ) {
34    		var aguja_horas = relojes[i].querySelector('.aguja_horas');
35    		aguja_horas.style.transform = 'rotate('+grados_horas+'deg)';
36    		var aguja_minutos = relojes[i].querySelector('.aguja_minutos');
37    		aguja_minutos.style.transform = 'rotate('+grados_minutos+'deg)';
38    	}
39	}
40	
41
42	var anima = function(p) {
43		var e = p.e;
44		var x1 = p.x1;
45		var x2 = p.x2;
46		var y1 = p.y1;
47		var y2 = p.y2;
48		var nombre = p.nombre;
49		var duracion = p.duracion;
50		var timing = p.timing;
51		var repetir = p.repetir;
52
53		var x1_random = parseInt ( Math.random() * x2 , 10 );
54		var duracion_random = parseInt ( ((x2-x1_random) * duracion ) / x2,10);
55		
56		creaReglaCSS('@keyframes def_animacion_'+nombre,'0% { -webkit-transform: translate3d('+x1_random+'px,'+y1+'px,0) } 100% { -webkit-transform: translate3d('+x2+'px,'+y2+'px,0)}');
57		creaReglaCSS('.animacion_'+nombre,'animation: def_animacion_'+nombre+' '+duracion_random+'s'+' '+timing);
58		e.className += ' animacion_'+nombre;
59
60		e.style.opacity = "1";
61
62		window.setTimeout ( function() {
63			e.className = e.className.replace(' animacion_'+nombre,'');
64			creaReglaCSS('@keyframes def_animacion2_'+nombre,'0% { -webkit-transform: translate3d('+x1+'px,'+y1+'px,0) } 100% { -webkit-transform: translate3d('+x2+'px,'+y2+'px,0)}');
65			creaReglaCSS('.animacion2_'+nombre,'animation: def_animacion2_'+nombre+' '+duracion+'s'+' '+repetir+' '+timing);
66			e.className += ' animacion2_'+nombre;
67
68		},duracion_random*1000);
69	}
70		
71	window.addEventListener('load',function() {
72		var ancho_pagina = window.innerWidth;
73		var avion = document.querySelector('.avion');
74		anima ( { e:avion , nombre:'avion' , x1:(-avion.offsetWidth), y1:0 , x2:ancho_pagina , y2:0 , duracion:'20' , timing:'linear' , repetir:'infinite' } );
75		for ( var i = 1 ; i <= 3 ; i++ ) {
76			var nube = document.querySelector('.nube'+i);
77			anima ( { e:nube , nombre:'nube'+i , x1:(-nube.offsetWidth), y1:0 , x2:ancho_pagina , y2:0 , duracion:'120' , timing:'linear' , repetir:'infinite' } );
78		}
79
80		ponRelojesEnHora();
81		window.setInterval(ponRelojesEnHora,60000);
82
83	},false);
84	
85	// cookies
86
87	var ok_cookies = window.localStorage.getItem('ok_cookies');
88	if ( !ok_cookies ) {
89		var div_cookies = document.createElement('div');
90		div_cookies.className = 'cookies';
91		var p = document.createElement('p');
92		div_cookies.appendChild(p);
93		boton_cerrar = document.createElement('a');
94		var textos = {};
95		textos.es = {};
96		textos.fr = {};
97		textos.en = {};
98		textos.es.cerrar = 'ENTENDIDO, CERRAR';
99		textos.es.texto_cookies = 'Este sitio usa cookies propias y de terceros para mejorar la experiencia de navegación'; 
100		textos.en.cerrar = 'OK, CLOSE';
101		textos.en.texto_cookies = 'This website uses third party cookies to improve the browsing experience'; 		
102		textos.fr.cerrar = 'FERMER';
103		textos.fr.texto_cookies = 'Ce site utilise des cookies afin de nous aider à améliorer votre expérience de navigation'; 				
104		var lang = 'es';
105		var head = document.getElementsByTagName('head')[0];
106		var metas = head.getElementsByTagName('meta');
107		for ( var i = 0 ; i < metas.length ; i++ ) {
108			if ( metas[i].getAttribute('name') === 'lang' ) {
109				lang = metas[i].getAttribute('content');
110			}
111		}
112		boton_cerrar.innerHTML = textos[lang].cerrar;
113		p.innerHTML = textos[lang].texto_cookies;
114		p.appendChild(boton_cerrar);
115		document.body.appendChild(div_cookies);
116		var alto_cookies = div_cookies.offsetHeight;
117		div_cookies.style.bottom = -alto_cookies + 'px';
118		window.setTimeout(function() {
119			div_cookies.style.transform='translate3d(0,-'+alto_cookies+'px,0)';
120		},1000);
121		boton_cerrar.onclick = function() {

122			div_cookies.style.transform='translate3d(0,0,0)';
123			window.localStorage.setItem('ok_cookies','1');
124		}
125	}
126
127})();
128
129
130(function(){
131    function carrusel(opciones) { // constructor    opciones: div,total_fotos,segundos
132     var that = this;       
133     // opciones por defecto
134     that.opciones = {
135      
136     };    
137     // opciones definidias por el usuario
138     if (typeof opciones == 'object') {
139       
140       for (var i in opciones) {         
141         that.opciones[i] = opciones[i];         
142       }
143     }     
144     that.cont_foto = 0;
145     that.div_carrusel = that.opciones.div.getElementsByTagName('div')[0];
146     that.inicializar();
147    }
148    carrusel.prototype = {
149
150     inicializar: function () {
151       var that = this;       
152       that.cambiaFoto();       
153     }
154     ,cambiaFoto :function() {
155        var that = this;
156        var ancho = that.opciones.div.offsetWidth;        
157        that.div_carrusel.style.transform = 'translate3d(-'+(ancho*that.cont_foto)+'px,0,0)';        
158        window.setTimeout(function() { that.cambiaFoto() } , ( that.opciones.segundos * 1000 ) );
159        that.cont_foto ++;
160        if ( that.cont_foto === that.opciones.total_fotos ) that.cont_foto = 0;
161     }    
162    }    
163    window.Carrusel = carrusel; // exponemos el objeto
164    
165}());
166
167
168