PHP habe ich lieber als Javascript - also vom schreiben und verstehen - gerne... gucks mir gleich mal an.
EDIT: ... glaube nicht so recht, dass ich da was ändern kann, suche aber weiter...
PHP habe ich lieber als Javascript - also vom schreiben und verstehen - gerne... gucks mir gleich mal an.
EDIT: ... glaube nicht so recht, dass ich da was ändern kann, suche aber weiter...
Keine sorge, verwenden trotzdem weiter JS, dann hat man nämlich keine lästigen reloads
Aber mal eine Dumme frage, der Simens-server kann doch ne HTML seite ausliefern? dann tu das Javascript doch einfach in der HTML Datei des Servers belassen und wir arbeiten dort weiter.. also mir ist es wurscht
welches Javascipt meinst du?
Naja, das wir dann erstellen.. das geht schon oder?
jo, baue gerade eine Seite um.
Aus performance-Gründen musste ich die HTML, welche im Jsonp-Format die verschiedenen Zustände ausgeben, aufteilen. Dadurch habe ich eine Datei pro Raum. Selbst so, erhalte ich meinen Zustand für den jeweiligen Raum nach 1-2 Sekunden... Vorher waren es über 5 Sekunden. Schnell ist was anderes. Aber ich baue mal eine Seite fertig und stell sie dann mal rein. Denke, dass man das noch kompakter schreiben kann. Aber ich bau erstmal.
Danke für deine Hilfe! Hätte nicht gedacht, dass ich so eine gute Hilfe finde!
Schreib mal wenn du mit den Dateien fertig bist.. und wie deine Entscheidung ausgefallen ist WO das Script zum Anzeigen liegen soll (System oder Webserver)
Also... hier mal eine komplett fertige Seite:
<?php
include "../PHP/Funktionen.php";
HTML_Kopf('EG','Aussenbereich');
?>
<script>
$(document).ready(function() {
setInterval(function() {
$.ajax({
url : "http://192.168.???.???/awp/Haus/Status/Status_EG_AB.html",
dataType:"jsonp",
jsonp:"mycallback",
jsonpCallback: 'jsonCallback_EG_AB',
success:function(data)
{
$("#AB_LE01_Leistung").html('<img src="../Images/Status0' + data.EG_AB_LE01_Leistung + '.gif" width="30" />');
$("#AB_LE01_1Schalter").html('<img src="../Images/Status0' + data.EG_AB_LE01_1Schalter + '.gif" width="30" />');
$("#AB_LE01_2Schalter").html('<img src="../Images/Status0' + data.EG_AB_LE01_2Schalter + '.gif" width="30" />');
$("#AB_LE07_Leistung").html('<img src="../Images/Status0' + data.EG_AB_LE07_Leistung + '.gif" width="30" />');
$("#AB_LE07_1Schalter").html('<img src="../Images/Status0' + data.EG_AB_LE07_1Schalter + '.gif" width="30" />');
$("#AB_LE07_2Schalter").html('<img src="../Images/Status0' + data.EG_AB_LE07_2Schalter + '.gif" width="30" />');
$("#AB_LE03_1Schalter").html('<img src="../Images/Status0' + data.EG_AB_LE03_1Schalter + '.gif" width="30" />');
$("#AB_SD01").html('<img src="../Images/Status0' + data.EG_AB_SD01 + '.gif" width="30" />');
}
});
}, 1000);
});
</script>
<div style="text-align:left;" class="Zeile">
<br >
<table style="width:100%" border="0">
<tr>
<td style="width:2%"> </td>
<td style="width:5%">Eingang Leistung</td>
<td style="width:5%"> </td>
<td style="width:1%"><?php Button_Ausgeben('EG', 'AB.LE01_Leistung', 'on'); ?></td>
<td style="width:1%"><?php Button_Ausgeben('EG', 'AB.LE01_Leistung', 'off'); ?></td>
<td style="width:1%"><div id="AB_LE01_Leistung"> </div></td>
<td style="width:5%;" style="text-align:right"> Eingang Voll</td>
<td style="width:5%"> </td>
<td style="width:1%"><?php Button_Ausgeben('EG', 'AB.LE01_1Schalter', 'on'); ?></td>
<td style="width:1%"><?php Button_Ausgeben('EG', 'AB.LE01_1Schalter', 'off'); ?></td>
<td style="width:1%"><div id="AB_LE01_1Schalter"> </div></td>
<td style="width:1%"> </td>
</tr>
<tr><td colspan="15"><hr></td></tr>
<tr>
<td> </td>
<td>Eingang Alarm</td>
<td> </td>
<td><?php Button_Ausgeben('EG', 'AB.LE01_2Schalter', 'on'); ?></td>
<td><?php Button_Ausgeben('EG', 'AB.LE01_2Schalter', 'off'); ?></td>
<td><div id="AB_LE01_2Schalter"> </div></td>
</tr>
<tr><td colspan="15"><hr></td></tr>
<tr>
<td> </td>
<td>Terrasse Leistung</td>
<td> </td>
<td><?php Button_Ausgeben('EG', 'AB.LE07_Leistung', 'on'); ?></td>
<td><?php Button_Ausgeben('EG', 'AB.LE07_Leistung', 'off'); ?></td>
<td><div id="AB_LE07_Leistung"> </div></td>
<td> Terrasse Voll</td>
<td> </td>
<td><?php Button_Ausgeben('EG', 'AB.LE07_1Schalter', 'on'); ?></td>
<td><?php Button_Ausgeben('EG', 'AB.LE07_1Schalter', 'off'); ?></td>
<td><div id="AB_LE07_1Schalter"> </div></td>
<td> </td>
</tr>
<tr><td colspan="15"><hr></td></tr>
<tr>
<td> </td>
<td>Terrasse Alarm</td>
<td> </td>
<td><?php Button_Ausgeben('EG', 'AB.LE07_2Schalter', 'on'); ?></td>
<td><?php Button_Ausgeben('EG', 'AB.LE07_2Schalter', 'off'); ?></td>
<td><div id="AB_LE07_2Schalter"> </div></td>
</tr>
<tr><td colspan="15"><hr></td></tr>
<tr>
<td> </td>
<td>Frontbereich</td>
<td> </td>
<td><?php Button_Ausgeben('EG', 'AB.LE03_1Schalter', 'on'); ?></td>
<td><?php Button_Ausgeben('EG', 'AB.LE03_1Schalter', 'off'); ?></td>
<td><div id="AB_LE03_1Schalter"> </div></td>
<td> Außensteckdose</td>
<td> </td>
<td><?php Button_Ausgeben('EG', 'AB.SD01', 'on'); ?></td>
<td><?php Button_Ausgeben('EG', 'AB.SD01', 'off'); ?></td>
<td><div id="AB_SD01"> </div></td>
<td> </td>
</tr>
<tr><td> </td></tr>
</table>
<div class="Zeile_Text" style="color:white;text-align:right;font-size:12px;">
© Christian</div>
</div>
</div>
</div>
</body>
</html>
Alles anzeigen
und so sieht die HTML-Datei für diesen Raum, welche auf dem Webserver der Siemens SPS läuft:
jsonCallback_EG_AB(
{
"EG_AB_LE01_Leistung":<!-- AWP_In_Variable Name='"DB_EG_Zustand_PLC".AB.LE01_Leistung' -->:="DB_EG_Zustand_PLC".AB.LE01_Leistung:,
"EG_AB_LE01_1Schalter":<!-- AWP_In_Variable Name='"DB_EG_Zustand_PLC".AB.LE01_1Schalter' -->:="DB_EG_Zustand_PLC".AB.LE01_1Schalter:,
"EG_AB_LE01_2Schalter":<!-- AWP_In_Variable Name='"DB_EG_Zustand_PLC".AB.LE01_2Schalter' -->:="DB_EG_Zustand_PLC".AB.LE01_2Schalter:,
"EG_AB_LE07_Leistung":<!-- AWP_In_Variable Name='"DB_EG_Zustand_PLC".AB.LE07_Leistung' -->:="DB_EG_Zustand_PLC".AB.LE07_Leistung:,
"EG_AB_LE07_1Schalter":<!-- AWP_In_Variable Name='"DB_EG_Zustand_PLC".AB.LE07_1Schalter' -->:="DB_EG_Zustand_PLC".AB.LE07_1Schalter:,
"EG_AB_LE07_2Schalter":<!-- AWP_In_Variable Name='"DB_EG_Zustand_PLC".AB.LE07_2Schalter' -->:="DB_EG_Zustand_PLC".AB.LE07_2Schalter:,
"EG_AB_LE03_1Schalter":<!-- AWP_In_Variable Name='"DB_EG_Zustand_PLC".AB.LE03_1Schalter' -->:="DB_EG_Zustand_PLC".AB.LE03_1Schalter:,
"EG_AB_SD01":<!-- AWP_In_Variable Name='"DB_EG_Zustand_PLC".AB.SD01' -->:="DB_EG_Zustand_PLC".AB.SD01:,
}
);
Alles anzeigen
so schauts im Browser aus - siehe Anhang...
ist bisschen Tippelarbeit, aber sind ja nur 6 Räume pro Etage (EG+OG)
Ja gut, wenn du es so machen willst.. hinder ich dich nicht.. ich wollte einen eleganteren weg erarbeiten aber ok
Nur zu... bin offen für andere Dinge
hab nur auf dem Siemens-Webserver nur mit Einschränkungen zu kämpfen
Das sind alles nur on/off schalter, seh ich das richtig?
jo. Diese ja. Später kommen noch die Heizungswerte dazu, aber das steht auf einem anderen Papier
und wo willst du die Seite jetzt abrufen können? auf deinem Webserver oder auf deinem Simens server?
ich empfehler mal den Webserver
auf jedem Fall vom externen Webserver, durch den größeren Handlungsspielraum. Zum Beispiel kann mein Webserver durch die Speicherkarte ca mac. 1,5mb groß sein... Reicht mir nicht.
ist fix gemacht, dazu muss ich nur was wegnehmen. Wie greife ich dann darauf zu?
EDIT: fertsch
Dann bauen wir ein PHP Script das die Daten des Stockwerks läd..
speciher es am besten unter 'floorLoader.php' auf deinem Web-Server
<?php
error_reporting(E_ALL); //alle Fehler anzeigen
define('PATH', 'http://192.168.178.000/folder/with/files/');//Den Pfad zum Ordner der Dateien definieren
define('ERROR_MSG', 'No content found!');//Fehlermeldung die übertragen wird wenn kein inhalt gefunden wurde
$floor = empty($_GET['floor']) ? 'EG' : $_GET['floor'];//die id des stocks (wenn keine mitgegeben wurde EG)
//gehen wir mal davon aus das deine Datei nach dem schema 'data_[floor].html' benannt sind (bsp: data_EG.html)
$filePath = PATH.'data_'.$floor.'.html';//generiert ein Pfad wie 'http://192.168.178.000/folder/with/files/data_EG.html'
$rawData = file_get_contents($filePath);//Inhalt der Datei auslesen
if (!empty($rawData)) {//wenn Daten angekommen sind
echo($rawData);//Die Daten ausgeben
}
else{
header('HTTP/1.1 406 Not Acceptable');//dem JS mitteilen das etwas nicht stimmt
echo '{"error":"'.ERROR_MSG.'"}';//Die Fehlermeldung ausgeben
}
?>
Alles anzeigen
Dieses Script können wir nun via AJAX laden und uns damit die Stockwerk-Daten dynamisch nachladen wenn wir sie Brauchen
EDIT
In Zeile 8 hat sich ein Fehler eingeschlichen, bitte neue Version verwenden..
sieht interessant aus. Gleich mal probieren. Danke
hab mal für ein Raum das gerade realisiert... die Daten sind blitzschnell da. Jetzt muss ich die im PHP noch für mich aufbereiten und Ajax mit jQuery bauen. Sieht aber schon mal sehr vielversprechend aus. Fettes Danke!
NEEIIN nix aufbereiten
Das machen wir jetzt mit Javascript..
okkkkk
Habe gerade schon ein bisschen rumgespielt und neue Technologie ausprobiert.. http://codepen.io/wolf-w/pen/ZGLdPr
Ouh yes
Wenn du noch Power hast,
kannst du für jedes Stockwerk so ein Template erstellen und diese alle in einer HTML Datei speichern
<template data-template="EG">
<h2>Erdgeschoss</h2>
<div class="box" data-input-id="schalter_02">
<span>Licht Eingang</span>
{toggle_schalter_02}
</div>
<div class="box" data-input-id="schalter_06">
<span>Licht Küche</span>
{toggle_schalter_06}
</div>
</template>
Alles anzeigen
Die 'data-input-id' sollte immer den dazugehörigen 'key' aus den Daten beschreiben ..
Weiter gehts morgen
Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!
HTML-Seminar.de - mit Videos zum schnellen Lernen, wie man eine Website selbst erstellt.