Új hozzászólás Aktív témák

• #8165 Keem1 veterán Silεncε #8164

  Új Válasz 2021-01-24 11:59:11 #8165

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Keem1

  veterán

  válasz Silεncε #8164 üzenetére

  Neem, természetesen JSON a fogadott data.

  A "bajom" az, hogy beágyazott webserverrel kell dolgoznom (C# HTTPListener), így a HTML-en felüli dinamikus részt muszáj JSON API-val és kliensoldali scripttel megoldanom. Ez utóbbihoz viszont nem értek igazán, legalábbis eddig kevés dolgom volt még vele.

  $.getJSON(hubaddress+"/smarthomeapi/"+homeexternalid+"/devices", (responsejson) =>
  {
  $.each(responsejson, function (key, val)
  {
  console.log("Filling up devices box: " + val.displayname);
  $(".devices").append("<div><span class='icon icon"+val.devicekind+"' data-homeid='"+val.homeexternalid+"' data-deviceid='"+val.deviceid+"' data-action='ledtoggle'></span>"+val.displayname+"<small>"+val.manufacturer+"</small></div>");
  });
  });

• #8163 Keem1 veterán martonx #8160

  Új Válasz 2021-01-24 09:55:02 #8163

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Keem1

  veterán

  válasz martonx #8160 üzenetére

  Igen, tegnap dobtam össze a pár HTML, CSS és JS kódot, szóval tegnap kezdtem a nulláról, a frontend részét legalábbis. A vezérlő apit, ami már C#, azt legalább egy hete hegesztem.

  Sokat agyaltam én is hogy mi legyen a frontend része. Ez egy családi-baráti projekt (egyelőre nem szánom publikusnak, de nem csak én használnám), ezért a natív android appot kizártam (egyrészt nem fejlesztettem még androidra, másrészt ágyúval veréb esete, harmadrészt rühellem az összes olyan appot, ami egy frankó webappal tökéletesen megoldható [meki kupon app ], negyedrészt kell több platform, és értelmetlen android, ios, windows külön alkalmazásokat gyártani, ha egyben egy frankó webes megoldással kivitelezhető).
  A frontend nagy része akár Apache+MySQL+PHP vonalon gyorsan és egyszerűen leprogramozható lenne, talán még frontend script nélkül is (bár ilyen esetben a page reload nem biztos sokat rontana a felhasználói élményen), de sajnos ez sem jöhet szóba. Van egy minimál JSON API-t kezelő C# service, mögötte egy SQLite database, ami eddig a pontig király. Már "csak" egy jó kis GUI-t kellene hozzá gyártanom.

  Eredetileg Angular volt a kiszemelt, de azt se ismerem semennyire. Nem tudtam, hogy a jquery már elavultnak számít (5-6 éve használtam, minimál saját kóddal, inkább internetes example bedolgozásával - elég volt a célhoz).
  Még nem biztos, hogy az eddigieket nem dolgozom át, de majd meglátjuk.

  Más:
  Hogy tudok eseményt rendelni (a fenti click) a dom-hoz ajax-szal hozzáadott objektumokhoz? A fenti, beégetett HTML-lel jól megy már a kapcsolás, viszont az egyes device-okat reprezentáló div-ek is ajax jsonból jönnének (és már jönnek is), de az oldal létrehozásakor nem létező objektumokra nem megy az event. Pedig pont egyszerű selectort választottam: css class. Azt hittem/reméltem, hogy ez a classhoz adja az eventet, függetlenül attól, hogy épp hány birtokolja a lapon, illetve utólag változik-e a számuk.

  Egyébként valami ilyesmi lesz a cél (csak példa):

  |-- Misi Home (https://192.168.0.xxx/misihome/ --- Raspberry Pi)
  |------------ Bejárati lámpa
  |------------ Hajdú bojler
  |------------ Nappali lámpa
  |-- Anett Home (https://192.168.0.xxx/anetthome/ --- Raspberry Pi)
  |------------ Fürdőszoba lámpa
  |------------ Hálószoba lámpa
  |------------ Nappali lámpa
  |-- Gyuri Home (https://192.168.0.xxx/gyurihome/ --- Raspberry Pi)
  |------------ Műhely lámpa
  |------------ Borotválkozós lámpa
  |------------ Nappali lámpa
  |------------ Kazán

• #8159 Keem1 veterán cattus #8158

  Új Válasz 2021-01-23 20:11:32 #8159

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Keem1

  veterán

  válasz cattus #8158 üzenetére

  Ééés valóban ez a megoldás, hálásan köszönöm!

  Szerintem jövök még hozzátok, mivel a készülő smart home projectem backend része C#, abban azért otthon vagyok (igaz, nem vagyok ám programozó), de a GUI az HTML5 + javascript, emiatt biztos lesz szükségem segítségre.

• #8157 Keem1 veterán cattus #8156

  Új Válasz 2021-01-23 19:40:37 #8157

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Keem1

  veterán

  válasz cattus #8156 üzenetére

  Hmm... valami ilyesmire gondolsz? (kis guglizás)

  $.getJSON(hubaddress+"/smarthomeapi/toggle/"+$(this).data("deviceid"), responsejson => function()
  //.....

  Mert sajnos az eredmény ugyanaz...

• #8155 Keem1 veterán

  Új Válasz 2021-01-23 17:48:30 #8155

  Új hozzászólás

  Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra

  Privát üzenet küldése

  

  Keem1

  veterán

  Srácok, a jQuery topik nem igazán aktív, így kicsit offként, de ide írom a problémámat.

  Adott ez a kódrészlet:
  $(document).ready(function()
  {
  $(".iconlamp").click(function()
  {
  if ($(this).data("deviceid") != null)
  {
  $.getJSON(hubaddress+"/smarthomeapi/toggle/"+$(this).data("deviceid"), function (responsejson)
  {
  $("#status").text(responsejson.displayname + (responsejson.state != true ? " kikapcsolva" : " bekapcsolva"));
  });
  }
  });
  });
  

  Ez pedig a related HTML:
  <h1>Smart Home</h1>
  <div class="devices">
  <div><span class="icon iconlamp" data-deviceid="vfNVnFFZX9XrAgQF"></span>Spotlight<small>SonOff</small></div>
  <div><span class="icon iconlamp" data-deviceid="twYSpcyO4Z2Dt9vX"></span>Desk Lamp<small>Xiaomi</small></div>
  <div><span class="icon iconboiler" data-deviceid="KSnlcaoerJkPv8xw"></span>Bojler<small>SonOff</small></div>
  </div>
  <div id="status"></div>

  Ez gyakorlatilag egy Sonoff mögötti lámpát kapcsolgat, frankón. Viszont, az API egy JSON-t ad vissza, amiben többek között benne van, hogy fel- vagy lekapcsolt állapotú-e a lámpa, ezt a GUI-n lévő ikonra is rávezetném (lekapcsolt, felkapcsolt lámpa ikon, pure css). De a $.getJSON alatt sehogysem tudom elérni a parent objektumokat, nekem igazából az AJAX fölötti, if-ben lévő $(this) kellene, de a xy.parent() se vezet eredményre, az xy.parent().parent() se működik, ezt halmozhatom akármeddig, az ajax objektumba beszorul az egész, följebb nem tudok menni.

  Tehát összefoglalva... Van pár div-em (jelenleg 3 db), amikben egy-egy lámpa ikon (inline-block span) a backgroundja. A span (majd később pedig a parent div, de ez most mellékes) elemre kattintva ki/bekapcsolom a lámpát (toggle API), amire visszajön egy JSON, benne az aktuális státusz (responsejson.state = true/false). Eddig minden fasza. Viszont a true/false alapján, az adott span-nek kéne a class listáját módosítani [addClass() / removeClass()], de nincs mit, mert a span objektumra nem tudok hogy hivatkozni. a $(this).parent() nem működik, folyamatosan a getJSON objektumot kapom vissza.

  Hogy tudnám ezt a problémát áthidalni?

Új hozzászólás Aktív témák