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é 8318 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.
