Obsah fóra
PravidláRegistrovaťPrihlásenie




Odpovedať na tému [ Príspevkov: 19 ] 
AutorSpráva
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok NapísalOffline : 15.02.2018 11:32

Zdravím,
mám stránku, na ktorej java script v pravidelnom intervale aktualizuje obrázok zasielaný z IP kamery cez FTP na server. Link na obrázok pre java script zabezpečuje samostatné php z dôvodu, že kamera vie posielať len obrázky vždy s iným názvom (v tvare: číslo-kamery(názov-kamery)_X_RRRRMMDDHHMMSS_poradové-číslo.jpg).

Chcel by som, aby sa pod zobrazovaným obrázkom zobrazoval aj časový údaj jeho vytvorenia, resp. stačila by aj časť názvu (RRRRMMDDHHMMSS).

Tu sú kódy:

java

Kód:
<script type="text/javascript">
refreshImage = function(){
img = document.getElementById("K1");
img.src="kamera-1.php?rand=" + Math.random();
}
window.onload=window.setInterval(refreshImage, 1*1000);
</script>
<style>
.rotate180 {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-o-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
</style>
</head>
<body>
<div class="rotate180">
<img id="K1" src="kamera-1.php" alt="kamera-1" />
</div>
</body>


kamera-1.php

Kód:
<?php
if ($handle=opendir('./kamera-1/')) {
while ($file = readdir($handle))
{
$polozky[count($polozky)] = $file;
}
closedir($handle);
sort($polozky);
$i = sizeof($polozky);
$link= 'kamera-1/'.$polozky[$i-2];
header("HTTP/1.1 301 Moved Permanently");
header("Location: ".$link);
exit();
}
reset($polozky);
?>


Celé som to poskladal podľa rôznych návodov z netu, som v tejto oblasti laik a preto píšem sem. Vedel by mi niekto poradiť?

Vďaka.


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 29.12.20
Príspevky: 1516
Témy: 3
Príspevok NapísalOffline : 16.02.2018 10:20

Ako prvé ma narýchlo zaujalo toto
$polozky[count($polozky)] = $file;
stačí napísať ako
$polozky[] = $file;
:)

Ale nie to sme chceli...
Keďže to robíš takto, že nastavuješ len .img atribút, tak tam nemáš veľmi priestor, kde prepašovať nejakú hodnotu naviac (teda ten čas). Mňa napadajú dva riešenia, ale napíšem len jedno, lebo je jednoduchšie a zaujímavejšie :D

1.
Php kód zmeň tak, aby skript servíroval priamo jpeg. Takže headre čo tam sú zmaž a daj tam toto:
Kód:
header("mytime: " . $polozky[$i-2]);
header("Content-type: image/jpeg");
return file_get_contents($link);


Tým odošleš priamo obrázok a s ním ešte aj názov súboru, v ktorom je tvoj čas (neskôr ho môžeme ešte z názvu súboru vydlabať, ale zatiaľ stačí celý názov)

2.
Na stránku si pridaj jQuery ak nemáš https://jquery.com/ Takže toto na začiatok stránky, ideálne do <head></head>
Kód:
<script src="http://code.jquery.com/jquery-3.3.1.min.js"></script>


3.
Do javascriptu hneď za riadok img.src= pridaj toto:
Kód:
$.get("kamera-1.php?rand=" + Math.random())
.done(function(d, s, h) {
    var headers = h.getAllResponseHeaders(); //vezmem vsetky headre
    var rx = /mytime: ([^\s]+)/; //pripravim regex
    var match = rx.exec(headers);

    var filename = match[1]; //vezmem match v zatvorke, to je nazov suboru

    $('#K1').append( $('<div>').html(filename) ); //vypisem nazov suboru za obrazok, toto si mozes upravit ako chces
})


Úrobí to síce dva requesty, takže je otázka, či to vezme naozaj vždy ten istý obrázok - to záleží na tom, ako často sype kamera obrázky na ftp. Teoreticky sa môže stať, že do obrázku sa nahrá jeden a cez $.get sa stiahne už nasledujúci, ale to by ti nemuselo vadiť, či? Ak kamera nahráva napr jeden obrázok za sekundu, tak v 99.9% prípadoch sa to nestane, takže 99.9% času sa to bude zobrazovať správne.
Môže sa to urobiť aj synchronizovane, že sa aj obrázok zobrazí z $.get, ale príde mi to zbytočné.


pozn. kódy som netestoval, snáď som neurobil nejaké preklepy







_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok Napísal autor témyOffline : 20.02.2018 10:48

Veľmi pekne ďakujem za rady.

Nedopracoval som sa ale k výsledku. Postupoval som takto:

1. php som upravil na:

Kód:
<?php
if ($handle=opendir('./kamera-1/')) {
while ($file = readdir($handle))
{
$polozky[count($polozky)] = $file;
}
closedir($handle);
sort($polozky);
$i = sizeof($polozky);
$link= 'kamera-1/'.$polozky[$i-2];
header("mytime: " . $polozky[$i-2]);
header("Content-type: image/jpeg");
return file_get_contents($link);
exit();
}
reset($polozky);
?>


2. pridal som
Kód:
<script src="http://code.jquery.com/jquery-3.3.1.min.js"></script>

stačí len to, alebo je potrebné niečo viac (niečo inštalovať a pod.)?

3. kam presne dať javascript kód?

priamo za
Kód:
<script type="text/javascript">
refreshImage = function(){
img = document.getElementById("K1");
img.src=


alebo až za celý riadok

Kód:
img.src="kamera-1.php?rand=" + Math.random();


Skúšal som to rôzne, princípu ako tak rozumiem, ale skladbe veľmi nie.. Poprosím o podrobnejší návod (aj keď to vyzerá celkom jednoducho :).

Inak, výsledok bol, že sa na stránke nezobrazoval ani názov ani samotný obrázok..

Vďaka.


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 29.12.20
Príspevky: 1516
Témy: 3
Príspevok NapísalOffline : 20.02.2018 10:57

Bod 1 a 2 súhlasí. Skús keď tak namiesto return pred file_get_contents... dať echo
Kód:
echo file_get_contents($link);

a hlavne skontroluj, či sa na tej adrese obrázok zobrazí v prehliadači (naťukaj tú adresu normálne do url v prehliadači a mal by sa zobraziť obrázok)

V bode dva sa presvedč, že si ten riadok pridal PRED ten javascript, ktorý som napísal ja (to len pre istotu, nesmie to byť až za ním)

V bode tri samozrejme až za celý riadok :)

Ďalej si otvor javascript konzolu (bežne je to F12 a záložka Console, v Safari treba ísť cez Developer tools), zobraz stránku a ak sa nič nezobrazí, pošli sem to, čo ti vypíše konzola.

Ideálne by bolo, keby si to mal na internete a mohol sem poslať url tej stránky, nech to vidim aj ja...







_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok Napísal autor témyOffline : 20.02.2018 11:42

Tak, keď tam je echo, tak sa obrázok zobrazuje. Ak však zmením javascript zobrazí sa otočený o 180° (len pre vysvetlenie: fyzicky je kamera naopak, ukotvená k podhľadu pod strechou, obraz sa dá otočiť aj programovo priamo v nej, ale nemám k nej momentálne prístup a preto obraz otáčam kódom na stránke..).

Názov sa nezobrazuje.

Ešte dodám, že stránka beží cez "free" službu a spravujem ju cez redakčný systém WordPress. V zdrojovom kóde vidím aj nejaké riadky s jquery... Pre úplnosť ešte dodám, že ide o "bezpečnostnú" kameru na chalupe, snímky posiela každú sekundu, pričom stránku mám len na náhodné sledovanie priestoru odkiaľkoľvek. Ďalej používam WP plugin na zálohovanie snímok každú hodinu s ukladaním na GDrive (sekundový interval zabezpečí aký-takí prehľad pri spätnom prezeraní).

Tu je odkaz: http://h107.wz.sk/
Heslo v správe


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 29.12.20
Príspevky: 1516
Témy: 3
Príspevok NapísalOffline : 20.02.2018 12:04

Tak jquery už tam máš v rámci wordpressu, takže to čo som písal už pridávať nemusíš...

Nikde tam ten svoj kód pridaný nevidím a obrázok vidím správne otočený...
Inak php časť vyzerá správne, header správne posiela názov súboru, takže to je ok.







_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok Napísal autor témyOffline : 20.02.2018 12:32

Vrátil som a neuložil zmeny.. Teraz je to už tam, ale názov nevidím..


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 29.12.20
Príspevky: 1516
Témy: 3
Príspevok NapísalOffline : 20.02.2018 12:46

Wordpress editor ti tam hlúpo pridáva tagy, pozri čo máš v zdrojovom kóde (pozri CTRL+U)
Kód:
refreshImage = function(){
        img = document.getElementById("K1");
        img.src="kamera-1.php?rand=" + Math.random();</p>
<p>$.get("kamera-1.php?rand=" + Math.random())
.done(function(d, s, h) {
    var headers = h.getAllResponseHeaders(); //vezmem vsetky headre
    var rx = /mytime: ([^\s]+)/; //pripravim regex
    var match = rx.exec(headers);</p>
<p>    var filename = match[1]; //vezmem match v zatvorke, to je nazov suboru</p>
<p>    $('#K1').append( $('</p>
<div>').html(filename) ); //vypisem nazov suboru za obrazok, toto si mozes upravit ako chces
})</p>
<p>    }
    window.onload=window.setInterval(refreshImage, 1*1000);


Tie <p> </p> tam nemajú čo robiť. Skús sa toho nejak zbaviť. Možno pomôže používať shift+enter pre nový riadok, aby to nezačalo nový odsek. Alebo prepni z WYSIWYG na HTML editor.

// Spojený príspevok Uto 20.02.18 13:38

Pozerám, že už je to opravené, ale ešte jedna maličkosť - je dôležité, aby toto
Kód:
$('#K1').append( $('</p>
<div>').html(filename) );

bolo na jednom riadku (javascript nemá rád stringy cez viac riadkov) A tiež som si trochu pomýlil funkciu, treba použiť after a až po tom rotate180 (daj tomu divu id, ak ich tam bude viac)
takže ideálne takto
Kód:
$('.rotate180').after( $('<div>').html(filename) );







_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok Napísal autor témyOffline : 20.02.2018 14:12

Pracujem v HTML editore, skúšal som aj shift+enter a stále tam tie <p> </p> ostávajú. Pomôže celé to prepísať? Alebo ako by sa to ešte dalo?


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 29.12.20
Príspevky: 1516
Témy: 3
Príspevok NapísalOffline : 20.02.2018 14:15

Pred chvíľou som sa tam pozeral a neboli tam. V HTML editore to musí ísť. Nejak sa ich musíš zbaviť, inak to nejde. A pozri predchádzajúcu odpoveď, doplnil som ju.







_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok Napísal autor témyOffline : 20.02.2018 22:12

Odtiaľto sa mi nedarí dostať </p> preč:

Kód:
$('#K1').append( $('</p>
<div>').html(filename) );


Aj v iných častiach to raz je potom nie, tak neviem...

Budem to skúšať ďalej, ak sa mi podarí "očistiť" to, ozvem sa. Vďaka.


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 29.12.20
Príspevky: 1516
Témy: 3
Príspevok NapísalOffline : 21.02.2018 8:38

Pozri moju pzredchádzajúcu odpoveď, doplnil som ju. Daj to na jeden riadok, nesmie to byť cez dva. A zmeň tam tú funkciu.







_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok Napísal autor témyOffline : 21.02.2018 9:36

Musel som do WP doinštalovať modul, ktorý zabezpečuje, že vložený kód nie je ďalej automaticky upravovaný.. Takže teraz to je už v poriadku, pokiaľ ide o nadbytočne tagy.

Stále sa však názov nezobrazuje, aj po oprave tej funkcie. Čo skúsiť ďalej?


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 29.12.20
Príspevky: 1516
Témy: 3
Príspevok NapísalOffline : 21.02.2018 10:11

Ešte je tam problém s jQuery, zase asi nejaká Wordpress špecialita... znak dolára prepíš všade na jQuery a už to bude fungovať :)
Kód:
jQuery.get("kamera-1.php?rand=" + Math.random())
.done(function(d, s, h) {
  var headers = h.getAllResponseHeaders();
  var rx = /mytime: ([^\s]+)/;
  var match = rx.exec(headers);
  var filename = match[1];
  jQuery('.rotate180').after( jQuery('<div>').html(filename) );
})


Ale ešte to aj tak chce doladiť :lol: takto sa bude stále pridávať nový element a pod obe kamery rovnaký...
Takže ešte pod obrázok kamery pridaj nejaký div s id-čkom a riadok, kde zapisuješ filename uprav takto, aby sa stále prepisoval ten istý element
Kód:
jQuery('#tuMaIstJedinecneIdDivuPreNazovSuboru').html(filename);


A až to bude fungovať, tak ešte môžeme vydlabať čas z názvu, nech je krajší...







_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok Napísal autor témyOffline : 21.02.2018 12:28

SUPER!!! Podarilo sa, názov sa pod snímkou zobrazuje a aktualizuje sa spolu s ňou. Ešte poznámka k: "... Teoreticky sa môže stať, že do obrázku sa nahrá jeden a cez $.get sa stiahne už nasledujúci.." toto vôbec nevadí, hlavným cieľom je vidieť, že kamera je "živá". Niekedy nie je možné postrehnúť, či sa snímka mení a prípadný výpadok (na strane kamery) som mohol zaregistrovať až po hodine, keď sa (po zálohovaní a vymazaní) nič nezobrazilo.. Snímka sa aktualizuje cca každú 1 sekundu, takže malý nesúlad je OK.

Veľmi pekne ďakujem za tvoj čas a pomoc. A ak by si si našiel chvíľu na vydolovanie dátumu/času z názvu, budem rád.

Ešte raz, vďaka.


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 29.12.20
Príspevky: 1516
Témy: 3
Príspevok NapísalOffline : 21.02.2018 13:15

Gratulujem :D

Čas môžeš vydolovať v php časti napr takto
Kód:
$filename = $polozky[$i-2];
if(preg_match('#_(\d\d\d\d\d\d+)_#', $filename, $m)) {
    $time = date_create_from_format('YmdHis', $m[1])->getTimestamp();
    $filename = date('j. n. Y H:i:s', $time);
}


Daj to pred headre a miesto $polozky[$i-2] v headri mytime použi $filename.







_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok Napísal autor témyOffline : 21.02.2018 14:35

Je to tam, akurát najprv sa zobrazoval len deň, spôsobovala to medzera. Po odstránení všetkých medzier a pridaní "&\nb\sp" medzi dátum a čas je to už v poriadku. Vďaka.


Offline

Skúsený užívateľ
Skúsený užívateľ
Obrázok užívateľa

Registrovaný: 17.07.11
Prihlásený: 29.12.20
Príspevky: 1516
Témy: 3
Príspevok NapísalOffline : 22.02.2018 10:14

Rado sa stalo, mám rád takéto srandy :-)







_________________
Na súkromné správy týkajúce sa problémov, ktoré sa riešia vo fóre, neodpovedám!
Offline

Užívateľ
Užívateľ
Obrázok užívateľa

Registrovaný: 15.02.18
Prihlásený: 03.04.18
Príspevky: 10
Témy: 1
Príspevok Napísal autor témyOffline : 12.03.2018 15:00

Tak som tu zas a znova ide o časový údaj.

Tentokrát by som potreboval vyriešiť, aby kamera-1.php nezoraďoval snímky podľa celého názvu (podľa ktorého potom zobrazujem "najnovšiu" snímku), ale práve podľa času vzniku (ktorý sa mi pod snímku podarilo dostať z názvu súboru s pomocou BX-a). Nastáva totiž situácia, keď pri detekcii pohybu, resp. pri externom alarme kamera cez FTP posiela snímky s iným indexom X (v strede reťazca: číslo-kamery(názov-kamery)_X_RRRRMMDDHHMMSS_poradové-číslo.jpg) a aj keď sú tieto snímky novšie na stránke sa zobrazuje posledná snímka s indexom X-1.

Čo by sa s tým dalo robiť?


Odpovedať na tému [ Príspevkov: 19 ] 


Podobné témy

 Témy  Odpovede  Zobrazenia  Posledný príspevok 
V tomto fóre nie sú ďalšie neprečítané témy. Ktorý údaj je pravý

v nVidia grafické karty

8

601

23.05.2007 15:57

chester55555 Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Trhá mi video snímky pri capture.

v Video programy

0

660

15.10.2007 20:27

DNA Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Tajné: první snímky prototypu hodinek Samsungu

[ Choď na stránku:Choď na stránku: 1, 2, 3 ]

v Novinky

65

2457

08.09.2013 12:52

Semp Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Ako v PhpMyAdmin zablokovat udaj ?

v PHP, ASP

4

446

30.05.2009 16:01

waltherold Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Google spustil na Slovensku panoramatické snímky Street View

[ Choď na stránku:Choď na stránku: 1, 2 ]

v Novinky

42

2273

02.11.2012 18:17

KingTommy Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. EÚ považuje IP adresu za osobný údaj

v Novinky

2

442

22.01.2008 22:18

Shit Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. UPGRADE Aktuálnej zostavy

v PC zostavy

17

548

05.02.2018 22:20

dark_globe Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Úprava aktuálnej zostavy/doplnenie

v PC zostavy

4

517

02.01.2014 8:59

castelL Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. ICQ 6 - vymazanie aktualnej debatky

v Sieťové a internetové programy

0

386

09.03.2008 15:55

dulius Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Vloženie aktuálnej stránky do dokumentu

v PHP, ASP

1

411

01.05.2007 10:50

p360t Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Skript na zobrazenie aktualnej adresy

v PHP, ASP

7

748

23.02.2007 18:33

--==[Lu-Boss]==-- Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Schéma: Časový spínač

v Elektronika

0

3364

23.01.2007 6:39

Elektronic Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Časový spínač 230V

v PC skrinky, zdroje a všetky druhy chladenia

7

1168

24.02.2012 15:46

haffen Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. MicroSD karta -nespravny udaj o kapacite na HP Ipaq 614C

v Ostatné zariadenia

0

1029

20.04.2008 10:56

zyban Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Schéma: Sekvenčný časový spínač

v Elektronika

1

2654

02.09.2015 14:24

FricoSK Zobrazenie posledných príspevkov

V tomto fóre nie sú ďalšie neprečítané témy. Schéma: Schodiskový časový spínač

v Elektronika

0

6757

23.01.2007 4:25

Elektronic Zobrazenie posledných príspevkov


Nemôžete zakladať nové témy v tomto fóre
Nemôžete odpovedať na témy v tomto fóre
Nemôžete upravovať svoje príspevky v tomto fóre
Nemôžete mazať svoje príspevky v tomto fóre

Skočiť na:  

Powered by phpBB Jarvis © 2005 - 2024 PCforum, webhosting by WebSupport, secured by GeoTrust, edited by JanoF
Ako väčšina webových stránok aj my používame cookies. Zotrvaním na webovej stránke súhlasíte, že ich môžeme používať.
Všeobecné podmienky, spracovanie osobných údajov a pravidlá fóra