Arduino MEGA i BLYNK, LCD odchodzi do lamusa...

[SOYER]

@Treker teraz wrzuciłem nowy, z poprawkami które sugerował program zaproponowany przez @ethanak :

10 godzin temu, ethanak napisał:

wejdź sobie na https://validator.w3.org/ i kliknij "Validate by direct input", wklej swój kod, każ mu sprawdzić...

Document checking completed. No errors or warnings to show. Komunikat z validator.w3.org.

 

Kod

Jakby ktoś mógł sprawdzić czy mu się to poprawnie wyświetla teraz.

Edytowano Styczeń 15, 2019 przez SOYER

[ethanak]

Niestety...

Wspominałem, że różne silniki renderingu mogą dać różne efekty?

Pomogło zwiększenie szerokości klasy .czujnik do 358px, a w trybie hover aż do 390px (naprawdę pierwszy link w trybie hover wyświetla Ci się dobrze?)

Z reguły należy unikać zmiany kroju czcionki w trybie hover/active - powoduje to nieprzyjemne migotanie napisów, a w skrajnych przypadkach zmianę szerokości napisu prowadzącą do nieoczekiwanego rozbicia go na dwie linie. Lepiej robić to kolorem.

Tak przy okazji - zdajesz sobie sprawę z tego, że np. niewidomy z Twojej strony nie dowie się jaka jest wilgotność powietrza w Kryrach? Jeśli komuś myszka się zepsuje to też nie ma szans? Do linków jest element "a" a nie "div". Oczywiście - można i diva oprogramować (polecam jako ćwiczenie) tylko po jakiego grzyba, jeśli przeglądarka natywnie obsługuje element "a" bez kombinowania?

[SOYER]

1 godzinę temu, ethanak napisał:

Do linków jest element "a" a nie "div".

ale tam nie ma linków... chyba że piszesz o "click" w javascript....

 

1 godzinę temu, ethanak napisał:

naprawdę pierwszy link w trybie hover wyświetla Ci się dobrze?

tak

 

1 godzinę temu, ethanak napisał:

Pomogło zwiększenie szerokości klasy .czujnik do 358px, a w trybie hover aż do 390px

Zwiększyłem oba do 390px.

1 godzinę temu, ethanak napisał:

Z reguły należy unikać zmiany kroju czcionki w trybie hover/active

mam zmianę font-weight, wywalić to?

Co jeszcze trzeba zmienić żeby to się poprawnie wyświetlało?

1 godzinę temu, ethanak napisał:

Jeśli komuś myszka się zepsuje to też nie ma szans?

Co masz na myśli? Dzwięk?

1 godzinę temu, ethanak napisał:

Jeśli komuś myszka się zepsuje to też nie ma szans?

To akurat specjalnie zrobiłem. Żeby oglądający był aktywny, ćwiczył, bo to dobre dla zdrowia;-).

Chcę jeszcze dołożyć div z informacją jaka jest jakość powietrza. Zła, tragiczna, czy katastrofalna...

Może kiedyś wykresy....kiedyś

[ethanak]

4 godziny temu, SOYER napisał:

5 godzin temu, ethanak napisał:

Do linków jest element "a" a nie "div".

ale tam nie ma linków...

Właśnie... a powinny być. Są za to divy które zachowują się częściowo jak link.

W ostateczności mógłby być jakiś button... a nie div z clickiem.

4 godziny temu, SOYER napisał:

mam zmianę font-weight, wywalić to?

To już kwestia gustu. Napisałem, że nie należy tego stosować co nie oznacza że jest to niedopuszczalne. Ale ja bym to wywalił i raczej bawił się zmiana koloru.

4 godziny temu, SOYER napisał:

5 godzin temu, ethanak napisał:

Jeśli komuś myszka się zepsuje to też nie ma szans?

To akurat specjalnie zrobiłem. Żeby oglądający był aktywny, ćwiczył, bo to dobre dla zdrowia;-).

No to teraz usiądź, odłóż myszkę gdzieś na bok żeby nie kusiło, nie dotykaj touchpada czy innych urządzeń do machania wskaźnikiem i używając wyłącznie klawiatury odczytaj wartość stężenia PM10. Ćwicząc aktywnie dla zdrowia oczywiście. Podaj wynik, jak Ci poszło.

Nie, nie możesz nie zrobić tego ćwiczenia. Nie odpowiem na żaden post dopóki nie dowiem się jakie były wyniki. Pamiętaj, że na razie się uczysz 😉

BTW. co to jest ug/m3?  Nie chodziło przypadkiem o µg/m³?

[Polecacz 101]

Produkcja i montaż PCB - wybierz sprawdzone PCBWay!
   • Darmowe płytki dla studentów i projektów non-profit
   • Tylko 5$ za 10 prototypów PCB w 24 godziny
   • Usługa projektowania PCB na zlecenie
   • Montaż PCB od 30$ + bezpłatna dostawa i szablony
   • Darmowe narzędzie do podglądu plików Gerber
Zobacz również » Film z fabryki PCBWay

[SOYER]

2 godziny temu, ethanak napisał:

No to teraz usiądź, odłóż myszkę gdzieś na bok żeby nie kusiło, nie dotykaj touchpada czy innych urządzeń do machania wskaźnikiem i używając wyłącznie klawiatury odczytaj wartość stężenia PM10. Ćwicząc aktywnie dla zdrowia oczywiście. Podaj wynik, jak Ci poszło.

Widzisz,  tu mnie masz. O klawiaturze to nie pomyślałem. Zapewne są jaieś sposoby do poruszania wskaźnikiem, klikania na stronie www. Poszukam.

 

2 godziny temu, ethanak napisał:

BTW. co to jest ug/m3?  Nie chodziło przypadkiem o µg/m³?

a jak Tyś to napisał na klawiaturze? Też chcę....

Teraz sedzę nad Ajaxem w jQuery. Podstawy nie wydają się strasznie skomplikowane, ale chyba muszę mieć jakąś bazę danych czy cóś żeby ćwiczyć to przesyłanie danych na stronę. Czy jak to ugryźć?

[ethanak]

38 minut temu, SOYER napisał:

3 godziny temu, ethanak napisał:

No to teraz usiądź, odłóż myszkę gdzieś na bok żeby nie kusiło, nie dotykaj touchpada czy innych urządzeń do machania wskaźnikiem

 

38 minut temu, SOYER napisał:

Zapewne są jaieś sposoby do poruszania wskaźnikiem

Czego nie zrozumiałeś w określeniu "urządzenie do machania wskaźnikiem"?

Każdą normalną przeglądarką sterujesz w najprostszym przypadku klawiszami tab (następny element), shift-tab (poprzedni element) i enter (aktywacja).

38 minut temu, SOYER napisał:

a jak Tyś to napisał na klawiaturze? Też chcę....

Nie wiem jak U ciebie (inny OS) ale u mnie to:

altgr-M g slash m altgr-3

Możesz użyć tablicy znaków, możesz zerknąć na swoim RPi do /usr/share/i18n/charmaps/UTF-8.gz i zapisać to w postaci np. szesnastkowej w JavaScripcie:

'\xc2\xb5g/m\xc2\xb3'

albo bezpośrednio w unikodzie:

'\u00b5g/m\u00b3'

Co do AJAX-a: przesyłaj na razie losowe dane, będziesz mógł skupić się na raptem dwóch rzeczach zamiast trzech...

 

Edytowano Styczeń 16, 2019 przez ethanak

[SOYER]

14 minut temu, ethanak napisał:

Co do AJAX-a: przesyłaj na razie losowe dane, będziesz mógł skupić się na raptem dwóch rzeczach zamiast trzech...

no dobra losowe, ale skądś muszę te losowe brać i przesyłać... z jakiegoś miejsca do mojej strony... więc muszę gdzieś te losowe wpisać ino nie wim gdzie... 

 

17 minut temu, ethanak napisał:

Każdą normalną przeglądarką sterujesz w najprostszym przypadku klawiszami tab (następny element), shift-tab (poprzedni element) i enter (aktywacja).

Tego to nie wiedziałem. Sprawdzę. 

[ethanak]

Przed chwilą, SOYER napisał:

więc muszę gdzieś te losowe wpisać ino nie wim gdzie... 

W skrypcie po stronie serwera zrób funkcję typu (w przypadku PHP):

function getCurrentStatus($what)
{
    // tu w przyszłości będzie pobieranie danych z bazy, a na dzisiaj...
	return rand(10,40); // tak na przykład
}

i jej używaj do pobierania danych do odpowiedzi na zapytanie AJAX-a.

[SOYER]

Zobaczymy wieczorem. Na xampp też da się to zrobić? 

Muszę też się dowiedzieć co z tym moim IP. 

47 minut temu, ethanak napisał:

W skrypcie po stronie serwera zrób funkcję typu (w przypadku PHP):

Niestety do PHP jeszcze nie doszedłem. Co znaczy powyższe zdanie. Mam utworzyć nowy plik z rozszerzeniem .php i w środku umieścić tą funkcję? Gdzie ma być ten plik?

2 godziny temu, ethanak napisał:

Każdą normalną przeglądarką sterujesz w najprostszym przypadku klawiszami tab (następny element), shift-tab (poprzedni element) i enter (aktywacja).

Na mojej stronie to niestety nie działa;-(. Więc co z tym zrobimy;-)?

W międzyczasie wstawiłem poprawione pliki strony na malinkę. Chyba coś mi grzebią przy tym IP, bo zmienił mi się adres malinki. Przestalo działać auto uwierzytelnianie. Ale nowa strona wyświetla się bez problemów i przesunięć. Jest progres :-).

Ok, zmieniłem to µ/m³. Dzięki:-)

Poprawiony kod.

Edytowano Styczeń 16, 2019 przez SOYER

[SOYER]

W oczekiwaniu na odpowiedź;-) trochę zoptymalizowałem css aby strona poprawnie wyświetlała się zarowno na kompie jak i na urządzeniach mobilnych. U mnie ok, jakby ktoś sprawdził u siebie, będę zobowiązany.

Pliki.

 

@ethanakCzy powinienem utworzyc plik index.php zawierający kod z mojego pliku index1.html i dodatkowo:

<?PHP

function getCurrentStatus($what) { // tu w przyszłości będzie pobieranie danych z bazy, a na dzisiaj... 
return rand(10,40);} // tak na przykład 

?>

a w moim pliku index1.html umieścić coś takiego:

document.getElementById("temp").addEventListener("click", function(){
   $.ajax({url: "index.php", success: function(what){
    $("#wyniki").html(what);
  }});

???

Edytowano Styczeń 17, 2019 przez SOYER

[ethanak]

Dnia 16.01.2019 o 09:31, SOYER napisał:

Niestety do PHP jeszcze nie doszedłem. Co znaczy powyższe zdanie. Mam utworzyć nowy plik z rozszerzeniem .php i w środku umieścić tą funkcję? Gdzie ma być ten plik?

To może dojdź do PHP, zacznij się uczyć a dopiero potem jeśli coś sprawi trudność - zacznij zadawać pytania. W tej chwili to nie ma żadnego sensu.

Dnia 16.01.2019 o 09:31, SOYER napisał:

Dnia 16.01.2019 o 08:45, ethanak napisał:

Każdą normalną przeglądarką sterujesz w najprostszym przypadku klawiszami tab (następny element), shift-tab (poprzedni element) i enter (aktywacja).

Na mojej stronie to niestety nie działa;-(

No pewnie że nie działa bo zacząłeś stosować jakieś dziwaczne wydumki. Nie mam pojęcia co Ci przeszkadza w elemencie "a", może za krótki albo co... rozumiem że kombinerki są bardziej uniwersalne niż młotek - ale mimo wszystko jednak dużo lepiej się wbija gwoździe młotkiem.

Dnia 16.01.2019 o 09:31, SOYER napisał:

Więc co z tym zrobimy;-)?

Moja propozycja: zaorać, zrobić od początku, tym razem porządnie.

Tutaj masz przykład na to, co można zrobić na normalnych tagach a nie samych divach. Masz interaktywne linki ułożone w listę... W międzyczasie sprawdź w googlu co znaczy pojęcie "divitis" 🙂

Dnia 16.01.2019 o 09:31, SOYER napisał:

Na xampp też da się to zrobić?  

A co znaczy literka P w xampp?

16 godzin temu, SOYER napisał:

Czy powinienem utworzyc plik index.php zawierający kod z mojego pliku index1.html i dodatkowo: 

Wiesz co...

Jednak jestem za tym, żebyś najpierw nauczył się:

a) PHP

b) JavaScriptu

a dopiero później użył czegoś co łączy obie te technologie (AJAX). Wybacz - ale w jaki sposób jeśli nie doszedłeś jeszcze (jak sam piszesz) do PHP chcesz nagle w tym języku coś pisać?

 

Edytowano Styczeń 17, 2019 przez Treker
Poprawiłem formatowanie.

[SOYER]

.
 

Edytowano Styczeń 18, 2019 przez SOYER

[Treker (Damian Szymański)]

@SOYER, powyższy post jest do usunięcia, czy przypadkowo nadpisałeś jego zawartość? Mogę odzyskać poprzednią wersję, jeśli to pomyłka.

[SOYER]

@Treker a co mi tam, daj to, najwyżej znowu dostanę zj... kę od @ethanak 😉

to wczoraj się bawiłem i nawet nadpisuje... ale skasowałem żeby nie usłyszeć, że moje postępy są niewystarczające:)). 

Za Chiny ludowe nie mogę uchwycić zasady kiedy i jak odwołujemy się do PHP w htmlu... 

 

Edytowano Styczeń 19, 2019 przez SOYER

[ethanak]

1 godzinę temu, SOYER napisał:

Za Chiny ludowe nie mogę uchwycić zasady kiedy i jak odwołujemy się do PHP w htmlu... 

I bardzo dobrze - po prostu nigdy. HTML renderowany jest po stronie przeglądarki, a PHP działa po stronie serwera i dopiero może stworzyć kod HTML (w zasadzie może stworzyć cokolwiek, ale na początek przyjmijmy że będziemy tworzyć HTML).  W dodatku wszystko, co nie jest ujęte w znaczniki języka <?php ... ?> jest bezpośrednio i bez żadnych zmian kopiowane na wyjście skryptu.

Stwórz sobie taki pliczek i zapisz go w swoim katalogu domowym pod nazwą test.php:

<!DOCTYPE html>
<head>
<title>Test PHP</title>
</head>
<body>
<?php
$a = 5;
$b = $a * $a;
echo "<span>5<sup>2</sup>=$b</span>";
?>
</body>
</html>

Teraz wykonaj polecenie:

php test.php

Powinieneś zobaczyć, co interpreter PHP zrobił z tym plikiem.

Jeśli Ci się udało i zobaczyłeś kod w HTML - skopiuj ten plik na swój serwer i przeglądarką wejdż na adres:

http://twój_ip/.../test.php

(zamieniając oczywiście te trzy kropki w ścieżkę do pliku). Powinieneś zobaczyć efekt działania interpretera - mianowicie taki, że umie pomnożyć 5 x 5 🙂

Czy to mniej więcej wyjaśnia, o co w tym wszystkim chodzi?