Nov 29 2008

Runde Ecken ganz einfach mit Liquid Canvas

Tag: Canvas,Javascript,jQueryPatrick @ 10:03 pm

Steffen Rusitschka veröffentliche vor wenigen Tagen die sehr gelungene Mini-Javascriptbibliothek Liquid Canvas zum Erzeugen perfekter runder Ecken an beliebigen HTML-Elementen.

Die Rundungen werden zur Laufzeit über Canvas generiert und automatisch in den HTML-Code eingebettet. Der Einsatz von herkömmlichen Bildbearbeitungsprogrammen wie Gimp, Inkscape oder Photoshop entfällt völlig.

Die Features im Einzelnen:

  • automatisches Erzeugen von HTML-Canvas-Elementen, die sich der Größe des HTML-Elements anpassen
  • Canvas-Abstraktion – jedes HTML-Element erhält eine paint-Methode
  • Plugins zum Rendern können verwendet werden
  • etliche Plugins existieren bereits, eigene können ebenso eingebunden werden
  • vereinfachte Render-Sprache für Plugin basiertes Rendern
  • an CSS angelehnte Syntax der Render-Sprache für die plugin-Formatierung
  • nutzt nur HTML, Canvas, jQuery und exCanvas
  • funktioniert mit Firefox (2+), Internet Explorer (6+), Safari (3+), Chrome

runde Ecken mit Liquid Canvas - Beispiel 1 runde Ecken mit Liquid Canvas - Beispiel 2 runde Ecken mit Liquid Canvas - Beispiel 3 runde Ecken mit Liquid Canvas - Beispiel 4


Nov 25 2008

Unser Blog wird erneut von T3N empfohlen

Tag: Infos zum BlogTobi @ 2:25 pm

ajaxschmiede-bei-t3n.jpg

Nach wir bereits als Blog der Woche auf der Webseite des T3N Magazins erschienen, sind wir nun erneut in den Schlagzeilen. Diesmal wurden wie im Rahmen eines Beitrages über 15 Blogs für Webentwickler vorgestellt. Dieser Beitrag stellt 15 verschiedene Blogs vor (u.a. auch die Ajaxschmiede :)) , die sich mit aktuellen Webtechnologien befassen sowie praktische Tipps und Tricks bieten.

Wir freuen uns über die erneute Anerkennung für unsere Arbeit von den Kollegen bei T3N. Ebenso danken wir allen Lesern, denn für euch schreiben wir den Blog. Wir hoffen, euch auch weiterhin interessante Themen aus der Welt von Ajax und Javascript bieten zu können.

Tobias & Patrick.


Nov 20 2008

Browservorschau 2009

Tag: TrendsPatrick @ 5:27 pm

Wie nun ein Mitarbeiter von Microsoft indirekt bekannt gab, wird die die finale Version des Internet Explorers 8 erst 2009 erscheinen.

Gingen viele Experten bisher noch von einer Veröffentlich in diesem Jahr aus, sieht es nun so aus, dass es nach IE8 Beta 2 im August im Februar den ersten Release-Kandidaten (RC1) geben wird.

Da die Redmonder im Gegensatz zu Opera und Firefox keine Nightly Builds veröffentlich, müssen sich alle bis dahin gedulden.

Mit dem offiziellen Erscheinen rechne ich frühstens im Mai 2009.

Unterdessem dürfte innerhalb der nächsten beiden Wochen die zweite Beta des FF3.1 von der Mozilla Foundation bereit gestellt werden. Als Termin für die fertige Version geben die Mozilla-Mitarbeiter März / April 2009 an.

Wie die Kollegen von ZDnet berichten, arbeitet man bei Opera seit geraumer Zeit an der zehnter Generation des hauseigenen Browsers, dessen Oberfläche eine grundlegende Neugestaltung erführt. Ein Veröffentlichungszeitpunkt wurde nicht genannt. Ich spekuliere auf das erste Halbjahr 2009.

Nachdem Apple kürzlich still und heimlich Version 3.2 des Safari-Browsers herausgegeben hatte, darf man 2009 auf die 4. Auflage gespannt sein, die die von WebKit bekannte virtuelle Javascript-Engine Squirrellfish beinhalten wird.

Für Überraschungen könnte auch der Chrome-Renderers des Suchmaschinenriesen Google sorgen. Über die Pläne Googles für 2009 in Bezug auf den eigenen Browser ist bisher wenig bekannt.

Fazit:

Der Browsermarkt bleibt hart umkämpft. Alle Großen haben im neuen Jahr viel vor. Die Nutzer können sich neue Features und verbesserte Versionen freuen. Es bleint also äußerst spannend. Ein Sieger ist noch lange nicht in Sicht.


Nov 17 2008

Cooler Zeitvertreib: Digg Attack

Tag: Canvas,SpielePatrick @ 8:25 pm

Kürzlich bin ich auf der bereits bekannten Seite nihilogic auf ein weiteres interessantes JS-Game namens Digg Attack gestoßen, das der Jacob Seidelin programmiert hat.

Die Idee zu diesem coolen Spiel hatte Seidelin bereits vor langer Zeit, doch erst kürzlich gelang es ihm, diese Idee eine benutzbar Anwendung umzusetzen.

Die Zielsetzung bestand darin ein kleines Game zu entwickeln, das von einer externen Datenquelle beeinflusst wird. Dabei stieß er auf die Digg-API, die zum einen unterschiedliche Daten und zum anderen einen beständigen Datenfluß von Daten bereitstellt.

Desweiteren sollte die sich die Anwendung „flüssig“ anfühlen und dem Vergleich mit ähnlichen Flash-Games standhalten können, selbst im fortgeschrittenden Spielverlauf, wenn eine Vielzahl beweglicher Objekte über die Spielfläche toben.

Bis auf den Vortex Sprite (Wurmloch-Effekt) und den vorgerenderten Text, werden alle Grafiken zur Laufzeit mittels Canvas erzeugt.

Mit Ausnahme der Hintergrundmusik, wurde für Digg Attack nur Canvas und reguläres DHTML verwendet. Zusätzliche Soundeffekte wurden auf Grund etlichen Schwierigkeiten deaktiviert.

Der Benutzer steuert in dem Spiel eine Schar von Helden – dargestellt durch Blöcke – durch den virtuellen, begrenzten 2D-Raum. Dabei erscheinen verschiedene, in Größe und Geschwindigkeit variable Gegnertypen, die es auf des Spielers Figuren abgesehen haben.

Ingesamt existieren derzeit 12 Level, die es zu überstehen geht – was bei einer unendlichen Anzahl von Leben kein Problem sein sollte. Wenn man eine bestimmte Zeit in einem Level überlebt hat, erreicht man den nächsten.

Zudem gibt etliche Boni-Gegenstände.

Ich wünsche allen viel Spaß beim Probieren!

Digg Attack.png


Nov 10 2008

DOMAssistant in Version 2.7.4 erschienen

Tag: DOMAssistantPatrick @ 9:19 pm

Vor gut einer Woche erhielt die DOMAssistant-Bibliothek ein kleines Update und steht nun in der Version 2.7.4 zur Verfügung.

Die großen Änderungen halten sich in Grenzen, da vor allem viele kleine Fehler ausgemerzt worden:

  • getStyle() und setStyle() unterstützen nun auch die CSS-Eigenschaft opacity (Undurchsichtigkeit) – und zwar browserübergreifend
  • Antworten (Responses) von Ajax-Aufrufe vom Typ json werden automatisch „geparst“
  • Ajax-Aufrufe unterstützen nun auch timeout’s und Ausnahmenverarbeitung (Exceptions)
  • removeEvent() ermöglicht nun das Entfernen aller (einschließlich anoymer) Ereignisse eines Elementes
  • getStyle() liefert im Internet Explorer nun immer die korrekten Werte für float, width und height zurück

Die aktuelle DA-Version steht bei code.google.com zum Download zur Verfügung.