Dlaczego każdy “informatyk” powinien choć trochę programować

05-09-2009     web    

W jednym z wcześniejszych wpisów, opisałem krótką historię dotyczącą znajomego, któremu nie chciało się przeglądać szablonów z templatemonstera przez ich stronę – bo jest to niewygodne. Cieszyłem się wtedy, że mogę w minutę napisać program, który pobiera te obrazki na mój dysk, i mogę je przeglądać lokalnie. Dziś naszedł mnie ten temat ponownie i pomyślałem, że przecież zrobienie takiego “programu” zajmuje maksymalnie 5 minut! …i wystarczy do tego javascript.

Działanie możecie zobaczyć na podstronie: http://marcin.kleczek.com/templatemonster/
A teraz szybka analiza i wytłumaczenie, dlaczego każdy powinien móc to zrobić…

uzywamy string’u lokacji i zamieniamy końcówkę na numer “strony” (jeśli nie ma, zaczynamy od 256):
loc = location.href;
num = parseInt( loc.substring( loc.indexOf( '?' ) + 1 ) );

if ( !num || num < 0 )
num = 256;

Teraz robimy szybką nawigację dla poprzedniej/następnej strony


document.writeln( '<a href="' + loc.substring( 0, loc.indexOf( '#' ) ) + '?' + (num-1) +'">&laquo;</a>' );
document.writeln( '<a href="' + loc.substring( 0, loc.indexOf( '#' ) ) + '?' + (num+1) +'">&raquo;</a><br />' );


A w ostatnim kroku wstawiamy wszystkie 100 obrazków z danej strony:


for( i = 0; i < 100; i++ )
document.writeln( '<img alt="' + i +'" title="' + i + '" src="http://images.templatemonster.com/screenshots/' + num + '00/' + num + ( i < 10 ? '0' : '' ) + i + '-b.jpg" /><br />' );

i w ośmiu linijkach mamy przeglądarkę obrazków z templatemonstera! Z nawigacją! A na upartego można jeszcze dodać linki do pełnej wersji szablonu, a ilość linii się nie zwiększy.

Spójrz teraz na ten kod  – czy jest w nim coś trudnego? Ciężkiego do zrozumienia? Napisania? Znalezienia w internecie? Nic. Sam szukałem części funkcji, ponieważ nie piszę zbyt dużo w JavaScript’cie.

location.href - aktualny adres w pasku przeglądarki
parseInt() – zamienia napis na liczbę
string.substring() - znajduje w napisie podaną literę
string.indexOf() - wybiera część napisu “od” – “do”
document.writeln() - wstawia tekst na aktualną stronę

Opisy funkcji specjalnie “spłaszczyłem” – bo “nieprogramistą”, do zrobienia takich rzeczy wcale nie potrzeba wielkiej “filozofii programowania”. Wystarczy wiedza, że zrobienie takich rzeczy jest na prawdę banalne.

Jest tylko jeden problem – musi im się chcieć. A chce?

Przekaż dalej!