Mar 19 2010

JS Call Later

Taki prosty skrypcik, umozliwiajacy wywolanie metody JavaScript z czasowym opoznieniem. Przydatne gdy chcemy na przyklad wyswietlic plywajacego diva 5 sekund po zaladowaniu strony, albo ukryc elementy widoku po 5 sekundach :)

Utworzmy klase obiektu dbajacego o wywolanie okreslonej metody po zadanym czasie a nastepnie sie zniszczy

loCallTimer = function(id, func, args, time)
{
	if (typeof(id) == "undefined") {
		return;
	}
	this.id = id;
	this.func = func || null;
	this.args = args || null;
	this.time = time || 1500;
	this.timer = null;
};
 
loCallTimer.prototype.suicide = function()
{
	this.stopTimer();
	eval("window.ct_" + this.id + " = null;");
};
 
loCallTimer.prototype.onTime = function()
{
	if (typeof(this.args) == "undefined" || this.args == null || this.args.length == 0) {
		this.func();
	} else {
		this.func.apply(this.func, this.args);
	}
	this.suicide();
};
 
loCallTimer.prototype.runTimer = function()
{
	this.stopTimer();
	this.timer = window.setTimeout("window.ct_" + this.id + ".onTime();", this.time);
};
 
loCallTimer.prototype.stopTimer = function()
{
	if (this.timer != null) {
		window.clearTimeout(this.timer);
		this.timer = null;
	}
};

Wyzwalacz

function callLater(func, args, time) {
    var id = (new Date()).getTime();
    var ct = eval("window.ct_" + id + " = new loCallTimer(" + id + ");");
    ct.func = func;
    ct.args = args;
    ct.time = time;
    ct.runTimer();
    return ct;
};

Testujemy
czytaj dalej


Mar 6 2010

JS dziedziczenie i override’y

Niby nie ma formalnie klas w JS, jednak mozemy stworzyc cos co mimo braku podzialu na obiekty prywatne, publiczne itd, bedzie wygladalo na klasy.

Na poczatek stworzmy nasza “klase” bazowa

// konstruktor klasy
BaseClass = function(name)
{
	this.name = name || "obj_" + (new Date()).getTime();
};
 
BaseClass.prototype.className = "BaseClass";
 
// instancja klasy BaseClass
var instanceOfBaseClass = new BaseClass();

w ten sposob mamy obiekt posiadajacy dwie wlasnosci name i className. Ta druga nie bedzie dziedziczona bezposrednio.

A teraz dziedziczenie.

DerivativeClass = function(name)
{
	this.super = BaseClass;
	this.super(name);
};
 
DerivativeClass.prototype = new BaseClass();
DerivativeClass.prototype.className = "DerivativeClass";
 
var instanceOfDerivativeClass = new DerivativeClass();

Po tym zabiegu instancja klasy DerivativeClass bedzie wygladac mniej wiecej tak

instanceOfDerivativeClass
	className = "DerivativeClass"
	name = "obj_1267912571913"
		super
			prototype
				className = "BaseClass"

Dzidziczenie? Jak najbardziej ;)

Teraz sprobujmy nadpisac funkcje bazowa init, na poczatek dodajmy ja
czytaj dalej


Jan 13 2010

WPtouch Theme

WPtouch Theme – aby strony generowane przez WordPressa wygladaly profesjonalnie w iPhone czy Android OS :)


Obslugiwani klienci: android, aspen, blackberry9500, blackberry9530, cupcake, dream, incognito, iphone, ipod, opera mini, webmate, webos


Nov 18 2009

Password Generator

Pojawilo sie nowe narzedzie w sekcji Tools. Password Generator umozliwia generowanie zarowno prostych hasel alfa-numerycznych, jak i bardziej zlozonych zawierajacych znaki specjalne. Ciekawa moze okazac sie mozliwosc definiowania wlasnego ciagu znakow, na podstawie ktorego zostanie wygenerowane haslo. Moga to byc limitowane znaki specjalne, badz znaki narodowe takie jak ĄĆĘŁŃÓŚŹ ąćęłńóśź ÄÖÜ äöü. Program umozliwia wygenerowanie jednorazowo do 100 hasel o dlugosci do 32 znakow.

passwd-gen

Zobacz jak to dziala


Nov 8 2009

Raportowanie bledow strony klienta

Back-end aplikacji webowej, mozna kontrolowac przegladajac raporty i logi, lecz nijak ma sie to do front-endu wyswietlanego po stronie klienta. Nie dowiemy sie czy i kiedy wystapi blad, dopoki jakis nawiedzony klient nie zwymysla nam do sluchawki, chyba, ze mamy 105 srodowisk testowych, na ktorych mozemy sprawdzic kazda funkcjonalnosc aplikacji.

I tutaj nasuwa sie pytanie, czy nie ma innej mozliwosci?
Sa, a to jedna z nich, dzieki asynchronicznym zapytaniom, raport o bledzie klienta trafi do back-endu, i zapisany zostanie, do bazki czy pliku logow.

Przechwytywanie bledow

1. Dodajemy wymagane pliki bibliotek

<script type="text/javascript" src="http://www.losoft.org/blog/download/ajax/loajax_v1.1.js"></script>

plik mozna pobrac z dzialu Download, albo zamiast klasy loAJAX, linkujemy wlasnego wrappera ajax.

2. Tworzymy metode akcyjna zdarzenia window.onerror

// on/off powiadomienie klienta o bledzie
var suppressErrors = true;
// nowy obiekt ajax
var ajax = new loAJAX(this, "http://www.losoft.org/blog/examples/ajax/errorreport.php", null, AJAX_POST);
// akcja zdarzenia onerror
function errorReport(msg, url, lineNumber)
{
	ajax.reset();
	ajax.addParam("msg", msg);
	ajax.addParam("url", url);
	ajax.addParam("lineNumber", lineNumber);
	ajax.request();
 
	if (suppressErrors) {
		return true;
	}
	alert("Error occurred: " + msg + "\nURL: " + url + "\nLine Number: " + lineNumber);
};

3. Podpiecie akcji

window.onerror = errorReport;

Jak mamy juz gotowa metode, to teraz … czytaj dalej