Text

· · zu lesen

…oder How to use hCards to fill in forms.

hCardMapper ist eine JavaScript-Klasse (basierend auf Prototype) um Kontakt- oder Profil-Formulare mit Hilfe einer hCard automatisch zu füllen, ähnlich wie bei bragster.com oder getsatisfaction.com.

Das schöne an hCardMapper ist seine flexible Struktur. Die JavaScript Klasse ist so aufgebaut, dass sie eigentlich Microformats-Parser unabhängig funktionieren sollte, da sie die Daten über einen „Proxy“ abfrägt. Die einzige Vorgabe ist, dass dieser Proxy eine JSON formatierte hCard (jCard) zurückgibt. Das Problematische an dieser Variante ist, dass jeder Parser unterschiedliche Ergebnisse liefert… ich werde es heute abend mal mit dem hKit-Parser testen.

Ein weiter Vorteil ist die Formular-Unabhängige Programmierung die es ermöglicht, das Script auch problemlos auf vorhandene Formulare anzuwenden. Über mappnings werden die hCard-Attribute den entsprechenden Formular-Felder zugeordnet.

Event.observe(window, 'load', function() {
  hcr = new com.omniacomputing.HCardMapper({
    register: true,
    proxy: '/hcardmapper/hcard?uri=',
    insertBelowEl: 'hcr-hook',
    mappings: {
      given_name: 'first',
      family_name: 'last',
      tel: {tel: 'phone', work: 'phone', cell:'phone'},
      email: 'email',
      org: {org: 'company', organization_name: 'company'},
      url: 'website',
      street_address: 'street',
      postal_code: 'zip',
      locality: 'town' 
    }
  })
});Code-Sprache: JavaScript (javascript)

Quelle: http://lib.omnia-computing.de/hcardmapper

Tolle Idee, mal schau’n wie gut das Script mit den (oben schon erwähnten) unterschiedlichen Verarbeitungsweisen der Parser umgeht…

Text

· · zu lesen

microJSON ist ein Projekt von Jon Sykes und Jim Barraud. Es geht darum, Microformats in Form der JSON Schreibweise darzustellen. Die Idee von JSON ist, einen einfachen Datenaustausch von Objekten oder auch anderen Datenstrukturen wie z.B. Arrays zwischen Client Systemen (z.B. dem WebBrowser) und Server Systemen zu realisieren. Der Vorteil von JSON ist, dass sie kaum Overhead produziert und in JavaScript über die eval() Funktion wieder ganz einfach in ein Objekt gewandelt werden kann.

Beipiel einer hCard: 

<div id="hcard-given-middle-family" class="vcard">
  <span class="fn n">
    <span class="given-name">given</span>
    <span class="additional-name">middle</span>
    <span class="family-name">family</span>
  </span>
  <div class="org">org</div>
  <a class="email" href="mailto:email">email</a>
  <div class="adr">
    <div class="street-address">street</div>
    <span class="locality">city</span>,<span class="region">state/province</span>,<span class="postal-code">postal</span>
    <span class="country-name">country</span>
  </div>
  <div class="tel">phone</div>
  <a class="url" href="aim:goim?screenname=AIM">AIM</a>
  <a class="url" href="ymsgr:sendIM?YIM">YIM</a>
</div>Code-Sprache: HTML, XML (xml)

Die gleiche hCard als jCard: 

{
"vcard":{
  "name":{
    "given":"John",
    "additional":"Paul",
    "family":"Smith"
  },
  "org":"Company Corp",
  "email":"john@companycorp.com",
  "address":{
    "street":"50 Main Street",
    "locality":"Cityville",
    "region":"Stateshire",
    "postalCode":"1234abc",
    "country":"Someplace"
  },
  "tel":"111-222-333",
  "aim":"johnsmith",
  "yim":"smithjohn"
}Code-Sprache: JSON / JSON mit Kommentaren (json)

Neben den Abbildungen der Microformats hCard (jCard) und hCalendar (jCalendar) sind auch die Format jAtom, jResume, jReview, jAtom und jResume geplant. Weitere abbildung gibt es für normale Formulare (jForm), sowie auch für RSS Feeds (jRSS).

MicroJSON sind meiner Meinung nach eine sehr gute Idee, wenn man Bedenkt dass viele gute Microformats Parser, wie z.B. der vom Firefox Addon Operator verwendete ufParser, auf JavaScript basiert.