[Java Script] Generowanie numerów UUID. 2010-03-18 10:50:05

Tutaj opiszę, jak zbudować generator UUID.
Są to 32-znakowe klucze, indetyfikujące jakąś usługę.
Są nieodwłocznym elementem kanału ATOM.
Zapisuje się je wg. schematu xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx, gdzie x to wartość szesnastkowa, czyli cyfry od 0 do 9, lub litery od a do f.
Poniżej kod generujący takie klucze.


var marks = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'a', 'b', 'c', 'd', 'e', 'f');
function l() {
var x = Math.ceil(Math.random() * 15);
document.write(marks[x]);
}
for (i=1; i<=32; i++) {
l();
if (i == 8) document.write("-");
if (i == 12) document.write("-");
if (i == 16) document.write("-");
if (i == 20) document.write("-");
}

Tagi: javascript generator uuid

skomentuj (1)

[JavaScript] Operowanie obiektami po osi. 2010-03-16 18:36:42

W języku Java Script można w prosty sposób operować obiektem po osi. Jednak należy pamiętać o jednej ważnej rzeczy. W przeglądarce oś X biegnie w prawą stronę, a oś Y w dół, tak, że ich końce są zespolone w lewym górnym rogu. Teraz pozostaje wczytać obrazek do kodu HTML, i nadać mu atrybut id, o wartości obiekt. W kodzie Java Script zaś tworzymy indetyfikator rysunku w postaci zmiennej z funkcją document.getElementById(). Teraz tylko wystarczy utworzyc funkcję sterującą obiektem. Na potrzeby skryptu niech będzie to getPosition(w). Jako argument podawać będzięmy kierunek, u, d, l, lub r, odpowiednio góra, dół, lewo, prawo. Pamiętajmy jeszcze o zasadzie ruchu, góra: y-10, dół: y+10, lewo: x-10, prawo: x+10.


var obiekt = getElementById("obiekt");
function setPosition(p) {
if (p == "u") { obiekt.style.top--; }
if (p == "d") { obiekt.style.top++; }
if (p == "l") { obiekt.style.left--; }
if (p == "r") { obiekt.style.left++; }
}


Kod HTML.

<img src="obiekt.png" id="obiekt"/>
<span onclick="javascript: setPosition('d')">góra</span>
...


Tagi: javascript oś

skomentuj (0)

[JQuery] Reakcja tekstu na kursor. 2010-03-16 18:27:56

Reakcję taką można zaprogramować na wiele sposobów, tutaj omówię trzy.
Będzie to CSS, statyczny Java Script, i framework w postaci JQuery.
Celem jest utworzenie niebieskiego tekstu, który po najechaniu myszką zmieni kolor na czerwony.
Najpierw najprostsza implementacja, czyli CSS.

p:hover {
color#ff0000;
}
p {
color#0000ff;
}

Pierwszy selektor korzysta z pseudoklasy jaką jest :hover.
Inne podobne to :link, :visited, i :active.
Druga metoda to Java Script.

function setColor(value) {
var line = getElementById("line");
line.style.color = value;
}

Kod HTML.

p onmouseover="javascript: setColor('#ff0000')" onmouseout="javascript: setColor('#0000ff')" /p

Oczywiście pomiędzy p a /p powinien się pojawić tekst.
A teraz wykorzystanie frameworka JQuery.



$(document).ready(function() {
$("p").css("color", "#0000ff");
$("p").mouseover(function() {
$(this).css("color", "#ff0000");
});
$("p").mouseout(function() {
$(this).css("color", "#0000ff");
});
});

Należy zaimportować bibliotekę JQuery.

Tagi: jquery reakcja zdarzenie

skomentuj (0)

Interwały w służbie dynamiki. 2010-03-12 15:53:37

W Java Script posługując się interwałami, opóźnieniami czasowymi, możemy stworzyć całkiem imponujące efekty.

Przykładowo linijka tekstu.
Najpierw możemy wczytać linijkę, np. o żółtym tle, a potem tekst, np. szary, nadając mu interwał na 2 sekundy.
Jednak efekt "wejścia smoka" linijki może zostać zniwelowany przez wczytujące się w tym czasie inne elementy strony.
Dlatego warto dla obu obiektów zwiększyć ten czas o 2 sekundy, czyli odpowiednio dla linijki interwał powinien wynosić 2 sekundy, 
a dla tekstu 4 sekundy.
I tak możemy udynamicznić np. sam tekst.
Lub stosując kilka interwałów, nadać mu efekt migotania.
Ale wtedy lepiej zastosować pętle korzystającą z tablicy kolorów.
Osobiście polecam stosowanie mało interwałów, tylko w potrzebie, np. przy wyświetlaniu banerów reklamowych.
Wtedy najpierw załaduje się treść strony, a dopiero potem reklamy.

Tagi: javascript interwały

skomentuj (0)

Zastosowanie obiektu this dla skryptów zewnętrznych. 2010-02-27 17:24:09

Tutaj przedstawię jak można użyć obiekt this dla skryptów zewnętrznych.

Opiszę tutaj tworzenie prostej listy odnośników.

Na początek tworzymy plik links.js, o następującej treści.

     function linksGallery() {
      this.homepage="index.html";
      this.contact="kontakt.html";
     }

Teraz czas na plik HTML, o dowolnej nazwie.

     <html>
     <head>
     <script type="text/javascript" src="links.js"> </script>
     </head>
     <body>
     <script language="JavaScript" type="text/javascript">
     /* <![CDATA[ */
     var newLink = new linksGallery();
     var hmp = newLink.homepage;
     var cnt = newLink.contact;
     document.write("<a href='" + hmp + "'>strona główna</a>&nbsp;|&nbsp;<a href='" + cnt + "'>kontakt</a>");
     /* ]]> */
     </script>
     </body>
     </html>

Nazwy plików, stron, są pobierane ze skryptu links.js, i prezentowane w zmiennych.
Za pomocą funkcji document.write() możliwe jest ich wypisanie.

Tagi: javascript

skomentuj (0)

Irytujące błędy w nazywaniu. 2010-02-27 16:27:16

W publikacjach na papierze, w internetowych serwisach.
Redaktorzy popełniają często błąd, który mnie irytuje.

"Skrypty Java", "JME-Java Mobile Edition".
Takie błędy są dość często spotykane.
A przecież nie ma takiego czegoś jak "skrypty Java", czy "Java Mobile Edition".
Takie publikacje są wprost niedopuszczalne.
Tego typu artykuły powinni pisać redaktorzy mający pojęcie w dziedzinie informatyki.
Trzeba ich uczyć, że skrypty z "Java" w nazwie to "Java Script", i że JME to Java Micro Edition.

Innym nawykiem Polaków jest nazywanie wiadomości tekstowych "SMS".
Na przykład w Anglii takiego słowa by nie zrozumiano, gdyż SMS to skrót techniczny.
Dlaczego więc w sklepach nie mówimy "poproszę CPU", czy "czy dostałem HDD 500 GB"?

Dziękuję za wizytę.

Tagi: javascript sms jme

skomentuj (3)

Księga Gości