piątek, 28 grudnia 2012

Breakpoint js

Breakpoint - przydatna funkcja do przerywania asynchronicznego kodu. Wymaga obecności DOM (Document Object Model). Tworzy w nim przycisk, który umożliwia ręczne wywołanie zatrzymanych fragmentów kodu. Funkcja pozwala sprawnie śledzić błędy w ekstremalnych warunkach :)
var Breakpoint = (function(doc){
  doc = doc || document;
  var fns = [];

  var btn = doc.createElement('button');
  btn.innerHTML = 'Breakpoint';

  btn.addEventListener('click', function(e){
    fns.shift().call();
    update();
  });

  doc.body.appendChild(btn);

  var update = function(){
    btn.disabled = !fns.length;
  };

  update();

  return {
    add: function(fn){
      fns.push(fn);
      update();
    }
  };
})();
Przykład użycia:
// bez Breakpoint:
var test = function(){
  // czynnosc A
  // czynnosc B
};

// to samo z Breakpoint:
var test = function(){
  // czynnosc A
  Breakpoint.add(function(){
    // czynnosc B
  });
};

czwartek, 29 listopada 2012

Polecam Walutomat.pl

Zachęcam do wymiany walut w serwisie walutomat.pl.

Walutomat.pl - wymieniaj waluty bez opłat i prowizji

Tylko 3 kroki dzielą Cię od dokonania pierwszej transakcji w serwisie walutomat.

  1. Rejestracja w serwisie (4 min)
  2. Zasilenie konta (3 min)
  3. Wymiana waluty (3 min)

1. Rejestracja w serwisie



Zarejestruj się w serwisie. Aby to zrobić musisz podać następujące dane: adres e-mail, hasło, imię, nazwisko, adres zamieszkania (musi być zgodny z adresem podanym w Twoim banku), numer Telefonu. Twój numer telefonu zostanie wysłany potwierdzający kod SMS, dlatego jest konieczne, aby numer telefonu był prawidłowy.


Po uzupełnieniu podstawowych danych zostaniesz poproszony o potwierdzenie rejestracji konta przy pomocy kodu SMS przesłanego na Twój telefon. Przepisz kod wysłany w SMS i kliknij przycisk Dalej.


Gratulacje! Twoje konto w walutomacie zostało założone. Jeszcze Tylko 2 kroki dzielą Cię od zlecenia pierwszej wymiany waluty.

2. Zasilenie konta



Aby zasilić swoje konto, wybierz Bank, z którego dokonasz wpłaty oraz walutę, którą chcesz wymienić.


Po dokonaniu wyboru pojawią się dane rachunku, na który należy wpłacić wybraną walutę. Pamiętaj o dokładnym przepisaniu tytułu przelewu, aby przelew został prawidłowo zaksięgowany w systemie.

3. Wymiana waluty

soon…

piątek, 28 września 2012

LIFE, THE UNIVERSE, AND EVERYTHING

#include <stdio.h>

int main(){
  int i;

  while( 1 ){
    scanf("%d", &i);

    if( i == 42 )
      break;

    printf("%d\n", i);
  }
   
  return 0;
}

sobota, 3 marca 2012

Array unique - czyli pozbywamy się duplikatów

Funkcja jako argument przyjmuje tablicę z danymi dowolnego typu. W rezultacie funkcja zwraca tablicę zawierającą tylko unikalne elementy tablicy źródłowej.
var unique = function(arr){
  return arr.filter(function(el, i){
    return arr.indexOf(el, i+1) === -1;
  });
};
Poniżej zamieszczam funkcję robiącą to samo co powyższa funkcja z drobnym wyjątkiem. Poniższa funkcja zawiera dwa dodatkowe wykonania funkcji reverse co pozwoliło na zachowanie naturalnej kolejności elementów występujących w tablicy. Pierwsze wystąpienie danego elementu pozostaje w tym samym miejscu, kolejne wystąpienia tego samego elementu są ignorowane. W poprzedniej wersji funkcji to ostatni element zostałby zachowany.
var unique = function(arr){
  return arr.reverse().filter(function(el, i){
    return arr.indexOf(el, i+1) === -1;
  }).reverse();
};

środa, 22 lutego 2012

getType - sprawdzenie typu, pewniejsze od typeof

Poniżej zamieszczam funkcję zwracającą typ danej. Funkcja w przeciwieństwie do operatora typeof znacznie skuteczniej oddaje typ przekazanej danej. Pomysł został zaczerpnięty z serwisu JavaScript Garden. Funkcja do sprawdzenia typu wykorzystuje generyczną funkcję toString podstawowego obiektu.
var getType = function(obj){
  return ({}).toString.call(obj).slice(8, -1);
};
Poniżej szybkie sprawdzenie różnic funkcji getType oraz operatora typeof. Pomaga on uświadomić sobie, z jakimi problemami mamy do czynienia, jeśli używamy operatora typeof.
[{}, [], '', 0, 1/0, false, function(){}, /./, null, undefined].map(function(obj){
  return [getType(obj), typeof obj];
});
Tak naprawdę operator typeof JavaScriptu ma tylko jedno uzasadnione zastosowanie.
typeof variable === 'undefined';

wtorek, 14 lutego 2012

Object each - iteracja po obiekcie

Poniżej zamieszczam bardzo przydatną funkcję pozwalającą w prosty sposób iterować po obiekcie.
var each = function(obj, fn){
  var res = {};
  for( var i in obj ){
    if( obj.hasOwnProperty(i) ){
      res[i] = fn.call(obj, obj[i], i);
    }
  }
  return res;
};
Przykład zastosowania:
each({
  name: 'Grzegorz',
  job: 'web developer',
  website: 'gkucmierz.blogspot.com'
}, function(value, key){
  alert([key, ': ', value].join(''));
});

poniedziałek, 13 lutego 2012

Twoja przeglądarka nie obsługuje JavaScript

Przeglądając kod źródłowy pewnej strony natknąłem się na ciekawy kawałek kodu. Na szczególną uwagę zasługuje linijka 902 :)

sobota, 11 lutego 2012

Array shuffle

Implementacja funkcji mieszającej elementy tablicy w języku JavaScript.
Array.prototype.shuffle = function(){
  return this.sort(function(){
    return Math.random() - 0.5;
  });
};
Przykład użycia:
[1, 2, 3].shuffle();
Poniżej inna implementacja bez użycia prototypów.
var shuffle = function(arr){
  return arr.sort(function(){
    return Math.random() - 0.5;
  });
};

piątek, 10 lutego 2012

Pobranie treści strony przy pomocy XMLHttpRequest

Poniższa funkcja pozwala pobrać treść podstrony przy pomocy JavaScript.
var get = function(url, fn){
  var xhr = new XMLHttpRequest();
  xhr.open('GET', url);
  xhr.onabort = xhr.onerror = function(){
    fn(false);
  };
  xhr.onreadystatechange = function(resp){
    if( xhr.readyState === 4 ){
      fn(resp.target.responseText, resp);
    }
  };
  xhr.send();
};

piątek, 3 lutego 2012

Kliknięcie w dowolny element HTML przy pomocy js

Poniższa funkcja pozwala na kliknięcie w dowolny obiekt HTML przy pomocy JavaScript, niemal identycznie jak gdyby to zrobił użytkownik.
var click = function(htmlElement){
  var evt = document.createEvent('MouseEvents');
  evt.initMouseEvent('click');
  htmlElement.dispatchEvent(evt);
};
W podobny sposób można oczywiście wywoływać wszystkie inne możliwe zdarzenia.

czwartek, 5 stycznia 2012

Wykrywanie interakcji użytkownika

Poniżej zamieszczam prosty kod umożliwiający wykrycie interakcji użytkownika z przeglądarką internetową.
'keydown keyup mousemove mousedown mouseup'.split(' ').map(function(evtName){
  window.addEventListener(evtName, function(e){
    console.log(e.type);
  }, false);
});
Powyższy kawałek kodu można łatwo rozbudować, tworząc obiekt pozwalający na proste odczytanie czy użytkownik jest obecny na stronie.
var idleDetection = (function(delay){
  if( typeof delay === 'undefined' ){
    delay = 6e4; // 60s
  }
  var t;

  var interaction = function(){
    t = Date.now();
  };
  'keydown keyup mousemove mousedown mouseup'.split(' ').map(function(evtName){
    window.addEventListener(evtName, interaction, false);
  });
  interaction();

  return Object.create(null, {
    idle: {get: function(){
      return Date.now() - t >= delay;
    }}
  });
})(2e4);
Konstruktor funkcji przyjmuje jeden opcjonalny parametr, który jest wartością czasu braku interakcji użytkownika, po upłynięciu którego użytkownik zostaje uznany za nieobecnego na stronie. Domyślna wartość tego czasu wynosi 1 minutę. Poniższy kawałek kodu demonstruje działanie funkcji.
setInterval(function(){
  document.title = idleDetection.idle ? 'idle' : 'welcome back';
}, 1e3);