Page 1 sur 2

Monitor - Fond animé avec les images chromecast

Publié : 05 mars 2017, 19:12
par vil1driver
Salut,

monitor en cadre photo ?

méthode:

éditer index.html et ajoutez ceci

Code : Tout sélectionner

<div id='fond'><object height="99%" width="100%" data="https://clients3.google.com/cast/chromecast/home"></object></div>
juste avant ceci

Code : Tout sélectionner

<div id='black'></div>
éditez global.css et étendez les propriétés de black à fond

Code : Tout sélectionner

#black, #fond
{
   content:"";
   position:absolute;
   left:0;
   right:0;
   top:0;
   bottom:0;
   background:rgba(0,0,0,0);
   z-index:-1;
}
créer une page empty.html qui n'affiche rien :D

empty.html

Code : Tout sélectionner

<div class="cnt v-wrap">
<div class="v-box">
</div>
</div>
la placer en première (sans définir d'icone),
Elle sera donc présente mais ne sera pas ajoutée au menu

frontpage_settings.js

Code : Tout sélectionner

$.PagesList = [
					
				['empty.html'],
				['iframe.html','domoticz.png'],
				['clock.html','clock.png'],
				['meteo.html','meteo.png'],
				['pluie.html','pluie.png'],
				['page1.html','light1.png'],
				['page2.html','light2.png'],
				['page3.html','light3.png'],
				['page4.html','light4.png'],
				['page5.html','chauffage.png'],
				['trafic.html','map.png'],
				['logs.html','log.png'],
				

		[]];
				
Supprimez tous les fonds que vous avez défini dans settings

Code : Tout sélectionner

// Change backgrounds images,size and brightness
var bg_day = '';
var bg_night = '';
var bg_day_spring = '';
var bg_night_spring = '';
var bg_day_summer = '';
var bg_night_summer = '';
var bg_day_autumn = '';
var bg_night_autumn = '';
var bg_day_winter = '';
var bg_night_winter = '';
paramétrer monitor pour toujours revenir à la première page (après 2min ici)

Code : Tout sélectionner

// Swipe options
var speed = 300;
var delai = 120000;
var direction = 'index';
éditez swipeSetup.js et ajouter une fonction d'assombrissement du fond lorsque l'on n'est pas sur la première page

Code : Tout sélectionner

    stopPropagation: true,
	callback:function(index) {
								if (index === 0){
									$('#black').css('background','rgba(0,0,0,0)');
								}else{
									$('#black').css('background','rgba(0,0,0,0.5)');
								}	
							}
							
ne pas oublier la virgule après true, :geek:
voila ;)

je suis preneur d'une méthode similaire pour afficher les photos persos d'un dossier google drive :D

Re: Monitor - Fond animé avec les images chromecast

Publié : 12 mars 2017, 19:37
par deennoo
super nickel !

juste un soucis avec la fonction assombrissement :

on le colle ou

Code : Tout sélectionner

stopPropagation: true,
   callback:function(index) {
                        if (index === 0){
                           $('#black').css('background','rgba(0,0,0,0)');
                        }else{
                           $('#black').css('background','rgba(0,0,0,0.5)');
                        }   
                     }
dans swipeSetup.js ?

a la fin ? si je fais ainsi je n'ai plus acces au boutton de selection, idem si je le colle avec mySwipe.setup()

Re: Monitor - Fond animé avec les images chromecast

Publié : 12 mars 2017, 22:45
par vil1driver
juste après

Code : Tout sélectionner

stopPropagation: true
ajouter la virgule

Code : Tout sélectionner

stopPropagation: true,
et ajouter

Code : Tout sélectionner

callback:function(index) {
                        if (index === 0){
                           $('#black').css('background','rgba(0,0,0,0)');
                        }else{
                           $('#black').css('background','rgba(0,0,0,0.5)');
                        }   
                     }

Re: Monitor - Fond animé avec les images chromecast

Publié : 12 mars 2017, 22:47
par vil1driver
madame préfère les photos perso, alors j'ai créé une présentation avec google slides..
et ai collé l'url à la place de celle de chromecast, waf+++ :D

Re: Monitor - Fond animé avec les images chromecast

Publié : 14 mars 2017, 00:46
par deennoo
vil1driver a écrit :juste après

Code : Tout sélectionner

stopPropagation: true
ajouter la virgule

Code : Tout sélectionner

stopPropagation: true,
et ajouter

Code : Tout sélectionner

callback:function(index) {
                        if (index === 0){
                           $('#black').css('background','rgba(0,0,0,0)');
                        }else{
                           $('#black').css('background','rgba(0,0,0,0.5)');
                        }   
                     }
A bah oui forcement sans mes lunettes aussi...merci

Re: Monitor - Fond animé avec les images chromecast

Publié : 14 mars 2017, 00:47
par deennoo
vil1driver a écrit :madame préfère les photos perso, alors j'ai créé une présentation avec google slides..
et ai collé l'url à la place de celle de chromecast, waf+++ :D
Tu me donnes idée...

Re: Monitor - Fond animé avec les images chromecast

Publié : 14 mars 2017, 11:09
par Nemesis24
Pour les photos persos, j'ai ce qu'il faut je vais bientôt partager :D :D
Patience !!
:ugeek:

Re: Monitor - Fond animé avec les images chromecast

Publié : 18 mars 2017, 11:21
par deennoo
Nemesis24 a écrit :Pour les photos persos, j'ai ce qu'il faut je vais bientôt partager :D :D
Patience !!
:ugeek:
ok parce que mon idée ne fonctionne pas comme je veux.

Le principe : mettre en fond un defilement de phot crée de puis photo station (logiciel de photo des syno), cela ne parche pas trop mal sauf que je n'arrive pas a le mettre ne plain ecran, et cela demande une connetion avec identifiant a chaque deconnection.

Re: Monitor - Fond animé avec les images chromecast

Publié : 18 mars 2017, 11:36
par Nemesis24
Va faire un tour sur mon git

https://github.com/Nemesis24/monitor-master

cela devrait te donner des idées :D :D

Re: Monitor - Fond animé avec les images chromecast

Publié : 21 mars 2017, 11:01
par deennoo
Nemesis24 a écrit :Va faire un tour sur mon git

https://github.com/Nemesis24/monitor-master

cela devrait te donner des idées :D :D
euh ouais mais ou ? parce que tu ne details pas trop tes changement donc pour le visiteur....il est perdu