[Tuto] Utiliser Monitor

[MelloXVI]

Je viens de tout re-installer et de tout remettre à jour, c'est d'une simplicité déconcertante ! Bravo à toi !

[Jed59]

Bonjour,

Peut-on accéder à une page directement via un link dans une cellule ?
Ex lien "blabla..." dans clock_12 -> vers page3.html

[vil1driver]

Page3.html ?

Je ne comprends pas vraiment ton besoin..

Tu peux développer..

[Chrominator]

corrigé merci. et meilleurs vœux 2016

(...)
Le fond d'écran personnalisé par saison n'apparaît plus, c'est noir à la place.
(...)

par contre ça... à mon avis tu as une erreur dans le nom de ton fond printemps car ici il s'est bien affiché

Tu as tout à fait raison ; je n'ai pas encore choisi l'image, d'où le fond noir.

[Jed59]

Page3.html ?

Je ne comprends pas vraiment ton besoin..

Tu peux développer..

Bonjour vildriver et merci pour ton partage de ce développement,

A partir d'une tablette, on passe d'une page à une autre en scrollant l'écran vers la gauche ou vers la droite (page1 - page2 - page3 - etc).
Pour un accès direct à une page (pagecam.html par ex) je souhaite mettre un lien dans une cellule qui me permettrais d'accéder directement à la page désignée par ce lien m'évitant ainsi un scrolling sur les pages précédentes.
Cela permettra un accès direct à la page 'météo', 'caméras', 'sécurité', 'chauffage' etc

[vil1driver]

ah oui ok, sympa pour par exemple se fait un menu

donc j'avais une idée en exploitant la value 'Link' mais ça ne fonctionnait pas tel quel,
alors j'ai due faire quelques modifs, du coups il te faut mettre à jour.
ensuite tu peux tester comme suit dans la page settings:

Code : Tout sélectionner

['','Html','clock_5','<span onclick="mySwipe.slide(2)" style="color:#D5DE3F">page3</span>'],

la première page porte le numéro 0

Code : Tout sélectionner

['','Html','clock_5','<span onclick="mySwipe.slide(0)" style="color:#D5DE3F">page1</span>'],

[Jed59]

Ok merci
je vais tester ça
Concernant la màj tu conseille quoi ? car j'ai touché un peu partout

Bon un peu de copier/coller ça fonctionne ! cool merci
Ce sera plus simple pour madame (WAF - WAF oblige)

[deennoo]

Super !

Pour ceux en 4/3 1024*768, peut on imaginer une série de bouton menu en bas de chaque page servant de menu ?

[pics76]

Salut,

Bon, c'est mon premier post sur ce forum, je vais commencer par te féliciter pour ce super job !

J'ai travaillé sur une fonctionnalité dont j'avais besoin : ouvrir un lien directement dans une DIV (contrairement à ce que fait 'Link').
L'objectif : afficher ma télécommande Freebox Revolution

Pour la télécommande c'est ici : https://github.com/thib3113/freebox-telecommande
Installé ici : domoticzurl/monitor/pages/freebox/

1ère étape : Création d'une div dans le fichier index.html
<div id="popup_link"></div>

2nde étape :
Dans global.css : Ajout de #popup_link (au style de base de toutes les div)

3ème étape : frontpage.js
Création des fonctions d'ouverture et de fermeture de la DIV

function showLink(linkStyle) {
$('#popup_link').html(['<object type="text/html" data="',$.domoticzurl,'/monitor/pages/freebox/index.html" width="100%" height="100%"></object>'].join(''));
$('#popup_link').fadeIn(fad_Duration);
$('#fade').fadeIn(fad_Duration);
$('#fade').click(closeLink);

var myElement = document.querySelector("#popup_link");
myElement.style.cssText+=linkStyle;

tempo = setTimeout(closeLink,60000);
}

function closeLink() {
$('#popup_link').fadeOut(fad_Duration);
$('#fade').fadeOut(fad_Duration);
$("#fade").off("click");
$('#popup_link').html('');
clearTimeout(tempo);
}

L'ouverture se fait avec le style de DIV, pour ajuster notamment la taille au contenu et la position.

Il ne manque que le passage en paramètre du lien...


J'ai ensuite ajouté ceci afin de créer la nouvelle fonction 'LinkDiv" :
Le champs description pour le CSS de la div
La personnalisation de l'icone dans le champs habituel

else if ( $.PageArray[ii][1] === 'LinkDiv' ) { //Special nummer, Affichage d'une page dans un div (télécommande Freebox Revolution pour test)
var vlabel= $.PageArray[ii][2]; // cell number from HTML layout
var vdesc = $.PageArray[ii][3]; // description (DIV CSS) in this case
var vicon= $.PageArray[ii][4]; // Name of custom icon
var vattr= $.PageArray[ii][6]; // extra css attributes
var valarm= ''; // alarm value to turn text to red

$(['div.',vlabel].join('')).html(['<div onclick="showLink(\'',vdesc,'\')" style= ',vattr,'><img src=icons/',vicon,'.png height="48" width="48"></div>'].join(''));
if ($(['div.desc_',vlabel].join('')).length > 0) {
$(['div.desc_',vlabel].join('')).html('');
}
}

Exemple d'appel :

['0','LinkDiv', 'cell2', 'height:712px;width:216px;margin-left:-240px;margin-top:-380px;border:none','telecommande','','',''],

Il me reste à passer en paramètre l'adresse du lien

Pour ce résultat

Capture.PNG (493.9 Kio) Consulté 8316 fois

Je posterai la version finale avec le passage de l'URL en lien paramétrable.
Et si c'est interressant pourquoi pas une intégration dans ton excellent dev.

[MelloXVI]

Excellent le coup de la télécommande !