mailto: temat i treść predefiniowane

 

Mailto - specyfikacja, tytuł, treść e-mailZwykły tag odnośnika <a> pozwala na uruchomienie domyślnego klienta poczty i wysłanie e-maila pod wskazany adres. W tym celu stosuje się przedrostek mailto: z wpisanym adresem odbiorcy.

Czasami jednak warto rozszerzyć ten schemat o domyślne wartości tematu lub treści e-maila. Jak to zrobić?

<a href="mailto:art.polkowski@gmail.com?body=tresc&subject=tytul-wiadomosci">Artur Polkowski</a>

Powyższy przykład jest poprawny, ale nie radzi sobie z białymi znakami (spacja, przejście do następnej linii). Kodowanie takich znaków jest następujące:

  • spacja — %20
  • przejście do następnej linii — %0D%0A

Po ich zastosowaniu:

<a href="mailto:art.polkowski@gmail.com?body=Witaj!%0D%0ACo u Ciebie?&subject=Tytul%20wiadomosci">Artur Polkowski</a>

Przykład w wersji live: Artur Polkowski

Chcesz dowiedzieć się więcej? Zobacz specyfikację mailto.

 
 

Hack na @font-face – dowolna czcionka na stronie

 

100% @font-face -  dowolna czcionka na stronieMagia @font-face opisana  przeze mnie wymaga małego sprostowania. Wszystko wynika z faktu, iż różne przeglądarki akceptują różne formaty czcionek, linkowanych za pomocą @font-face.

Firefox i Chrome doskonale radzą sobie z formatem .ttf, natomiast Internet Explorer teoretycznie wspiera .eot. Jak w takim razie zapewnić spójną typografię na naszej stronie? Komentarze warunkowe mogą rozwiązać problem. Z tym, że to nieeleganckie rozwiązanie i należy je stosować w ostateczności.

Chcecie gotowca? Oto i on w całej okazałości:


@font-face {
  font-family: 'KISS design';
  src: url('Kissdesign.eot');
  src: local('KISS design Regular'), local('KISS design'),
         url('Kissdesign.otf') format('opentype');
}

Odrobina komentarza. Po pierwsze potrzebujemy w takim razie czcionki w dwóch formatach - .eot i .otf/.ttf. Z pewnością przyda Ci się doskonały i darmowy konwerter formatów czcionek opisany przeze mnie.

Po drugie, jeżeli przeglądarka znajdzie czcionkę o nazwie „KISS design Regular” na dysku lokalnym, zostanie ona użyta. Niesie to niewielkie ryzyko, że użytkownik będzie miał na swoim komputerze zupełnie inną czcionkę, zapisaną pod użytą przez nas nazwą. Warto mieć to na uwadze. Jeżeli jednak użytkownik nie posiada lokalnie żądanej czcionki, przeglądarka pobierze ją z serwera – „Kissdesign.otf”.

Po co w takim razie linkowanie „Kissdesign.eot”? Dla ukochanego IE. Internet Explorer zignoruje drugie wystąpienie „src: (…)”, ponieważ nie rozumie znaczenia klauzul local i format.

Jeżeli chcesz zgłębić ten temat, polecam wpis Bulletproof @font-face na blogu Paula Irisha.

 
 

Programowanie akcji w JavaScript

 

Czyli jak to zrobić zgodnie z zaleceniami w3c albo jak to zrobić… tak, by działało ;] Problem dotyczy (tradycyjnie) IE, a także Safari, które stosują inne odwołania do obiektu Event i obiektu wywołującego zdarzenie.

Oto rozwiązanie podpatrzone na quirksmode.org (polecam!):
Plik XHTML z linkiem, do którego dodamy akcję po kliknięciu (onclick). Dobrą praktyką jest definiowanie akcji po załadowaniu strony za pomocą zdarzenia onload elementu body.


<body onload="addListeners();">
<a href="site.html" id="link">Kliknij na mnie!</a>
</body>

Plik JavaScript z oprogramowaną akcją:


function addListeners(){
document.getElementById("link").onclick=doSomething;
}

//domyślnie wg. w3c powinniśmy otrzymać obiekt klasy Event
function doSomething(e) {
	var targ;
	if (!e) var e = window.event; //naprawiamy bug IE
	if (e.target) targ = e.target;
	else if (e.srcElement) targ = e.srcElement;
	if (targ.nodeType == 3) //naprawiamy bug Safari
		targ = targ.parentNode;
}

W ten prosty sposób mamy rozwiązanie cross-browser. Funkcja doSomething dostarcza nam niezbędnych informacji w obiekcie klasy Event (zmienna e), a także referencję do obiektu, który jest źródłem akcji (zmienna targ).

Więcej na ten temat (m.in. szczegółowa obsługa myszy/klawiatury) w tym artykule o eventach.

Skuteczne? Proste? Podziel się wrażeniami w komentarzu!

 
 

MYDŁO, czyli SOAP na sposób swojski

 

SOAP to protokół usług sieciowych. Prościej? Pozwala na zdefiniowanie zbioru funkcji, które możemy wykorzystywać, bądź udostępniać innym zdalnie. Wystarczy znać parametry wywołań, nazwy funkcji i zwracany obiekt.

SOAP to jak najbardziej przyszłościowa technologia, ponieważ na jednej stronie będziemy mogli wykorzystać funkcjonalność innych serwisów czy aplikacji. Potrzebujesz aktualnych kursów walut? Męczysz się z parsowaniem strony NBP? Może lepiej poszukać serwisu, który udostępnia odpowiednią funkcję?

Do rzeczy. Po pierwsze potrzebujesz włączonego rozszerzenia PHP php_soap.dll Następnie potrzebujemy klienta dla naszej usługi. Podstawowa konfiguracja pliku soap_client.php:


<?php
//Ustalenie adresu serwera:
$location = sprintf('http://%s%s/soap_server.php',
$_SERVER['HTTP_HOST'],
dirname($_SERVER['SCRIPT_NAME']));

//Utworzenie obiektu klienta SOAP
$soap = new SoapClient(null, array('location' => $location, 'uri'      => ''));

//wykorzystanie funkcji udostępnionej przez serwer
$ret = $soap->remoteToUpper('SOAP - i like it!');

echo $ret; //zwraca napis "SOAP - I LIKE IT!"
?>

Plik serwera soap_server.php, czyli właściwa implementacja usługi:


<?php
//Przekształca ciąg znaków na pisany wersalikami
function remoteToUpper($str){
return strtoupper($str);
}
//Utworzenie serwera SOAP i wyeksportowanie funkcji remoteToUpper()
$soap = new SoapServer(null, array('uri' => ''));
$soap->addFunction('remoteToUpper');

//Użycie żądania POST dla wywołania usługi
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
$soap->handle();
}
else {
//Bez podanych parametrów - wypisana zostanie lista dostępnych funkcji serwera SOAP
echo "Funkcje udostępnione:\n";
foreach ($soap->getFunctions() as $func) {
echo $func . "\n";
}
}
?>

Oczywiście przykład podany powyżej jest banalny, ale SOAP umożliwia stworzenie naprawdę potężnych zbiorów funkcji i budowę rozproszonych systemów o wygodnej, bo kapsułkowej budowie.

Najczęściej udostępnione przez serwer funkcje zwracają odpowiednie dane zawarte w lokalnych bazach danych.

Jeżeli przydały Ci się te informacje, wiesz już jak napisać serwer SOAP – podziel się wrażeniami w komentarzu!

 
 
« poprzednie wpisynastępne wpisy »