Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][PHP] Uploader w HTML5?
Forum PHP.pl > Forum > Przedszkole
Asig
Witam!

Czytałem trochę o uploaderze w HTML5 oraz to, że można w nim bez użycia JS/Jquery zrobić ProgressBar, ale szczerze mówiąc nie za bardzo to rozumiem, zwłaszcza z tego powodu, że szukając w google informacji na ten temat HTML'a było tam może z 10%, a reszta kodu to sam JS z bibliotekami...

Więc prosiłbym kogoś obeznanego o wyjaśnienie, pokazanie jakiegoś kodu Uploadera w oparciu o HTML5.

Oraz wyjaśnienie mi w "czym" ja piszę Uploader, do przenoszenia plików używam "move_uploaded_file", a kod html:
  1. <form method="post" enctype="multipart/form-data" action="#">
  2. <input name="APC_UPLOAD_PROGRESS" value="id przesyłu"> ---- do progressbaru
  3. a tutaj iframe wykorzystujące JS+Jquery wyświetlające cały ProgressBar - cały progressbar działa w oparciu o moduł APC RFC


Dokładniej kod i działanie można sprawdzić na http://uphere.pl

Wiem co to Upload we Flashu, ale nie rozumiem co znaczy w HTML'u5 - a może to ten sposób w którym ja to piszę?

Proszę po prostu o jakieś objaśnienie tongue.gif

Dziękuję z góry,
Pozdrawiam.
Asig
@wicek
I właśnie o tym mówię. Byłem już na tego typu stronach i ciągle nie rozumiem o co z tym chodzi, wygląda to jak zwykły HTML + JS z jakimś ASPX o którym czytałem na wiki: http://pl.wikipedia.org/wiki/ASP.NET co jeszcze bardziej mnie zagmatwało :/
Tuminure
HTML5 wprowadza tag <progress>. Do zmiany atrybutów, które są używane przy tym tagu (value, max) potrzebujesz użyć javascriptu.
Asig
@Tuminure
Dzięki wielkie za informację smile.gif
Teraz przynajmniej rozumiem czego szukać w google i mam przykład w praktyce: http://www.fanaticalcode.com/blog/wp-conte...ress_html5.html

I chyba już nawet wiem jak użyć go w praktyce przy uploadzie.

Jednak pozostaje tylko jedno pytanie, co jeśli przeglądarka nie obsługuje tego progres? czy jest jakiś odpowiedni tag czy coś, który pozwoli sprawdzić czy przeglądarka użytkownika obsługuje ten tag, a jeżeli nie obsługuje to wyświetli mu się zwykły progress?
trueblue
Znacznik <progress> nie załatwi uploadu, to tylko element prezentujący dane jakie mu dostarczysz.
Poczytaj o HTML5 File API: https://developer.mozilla.org/en-US/docs/Us...eb_applications
Będziesz i tak musiał użyć JS, i do tego jakiś skrypt uploadujący pliki na serwer (np. PHP).

Jak sprawdzić czy przeglądarka obsługuje tag progress: http://stackoverflow.com/questions/1599446...s-element-check
Tuminure
http://css-tricks.com/html5-progress-element/
ctrl+f What about browsers that don't support them?

Asig
@trueblue
Wiem, chodziło mi o to, że wiem jak wykorzystać ten <progress> w oparciu o JS, że na podstawie rozmiaru pliku przeliczyć go na % i odświeżać progres co np. 1 sekundę (tzn. obecnyrozmiar/calkowityrozmiar*100).

A co do obsługi to wiem które przeglądarki obsługują, lecz chodzi mi o jakiś warunek typu:
Kod
if(przeglądarka_obsluguje) { } elseif(przeglądarka_nie_obsluguje) { }

No i z tego co mi podaliście widzę, że jest taka możliwość dzięki JS.
Więc dzięki wielkie za pomoc i uświadomienie smile.gif

Szczerze mówiąc spodziewałem się czegoś bardziej skomplikowanego, ale na szczęście nie jest to wcale takie trudne tongue.gif

Dzięki jeszcze raz i Pozdrawiam smile.gif
trueblue
W linku, który Ci podałem przykłady przypisują true lub false do zmiennej, wystarczy, że ją sprawdzisz ifem.

Nie odświeżasz co sekundę, od tego jest zdarzenie "progress".
Asig
@trueblue
Faktycznie, nie przypatrywałem się tamtemu linkowi za dobrze.
W takim razie działa to o wiele lepiej niż stare metody, ponieważ działa bardziej "dynamicznie" bez opóźnień.
No nic, w wolnym czasie pobawię się dokładnie z tym, mam trochę linków do przeanalizowania więc "nudów" nie będzie tongue.gif

@Tak swoją drogą rozbroiło mnie w tamtym linku: "KiB", "MiB", "GiB", "TiB", "PiB", "EiB", "ZiB", "YiB", ciekawe czy są jakieś pliki mające przynajmniej 1TB a co dopiero YobiBajty, ale może za 100 lat będą takie pliki tongue.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.