Bananas Development Blog - JS / AJAX

Browsererkennung mit Javascript

nospam@example.com (Banana) — Wed, 17 Mar 2010 14:07:07 +0100

Ist ja nichts neues aber hier sind mal ein paar ausführlichere Details dazu:

A useful but often overrated JavaScript function is the browser detect. Sometimes you want to give specific instructions or load a new page in case the viewer uses, for instance, Safari.

• Browser detect

Zufall ist nicht gleich Zufall. Vorallem nicht bei einer Maschine

nospam@example.com (Banana) — Thu, 04 Mar 2010 14:22:00 +0100

Zur geht ja es ja durch die Presse (da kommt das her), dass Microsoft den von der EU auferlegte Browserauswahl nicht so tolle und vorallem nicht sehr zufällig hinbekommen hat.

(Diese Forderung von der EU, ist meiner Meinung totaler bullshit !! Man könnte mit den Kriterien ja auch sagen, Mac OS X bietet keinen alternativ Browser an und dann heulen und sich beschweren. Wenn Microsft "Balls of steel" hätte, dann würde es sich diese kratzen und diese Verordnung ignorieren. Denn denkt euch einfach mal Microsoft weg. Wo wären wir dann ? aber das würde nun zu weit führen...)

Nun denn die Auswahl der Browser soll ja zufällig sein, ist sie aber nicht so richtig:

Hatte Microsoft anfangs vor, den IE prominent ganz vorne zu platzieren, kam man schließlich mit den Kartellwächtern überein, dass die Anzeigereihenfolge zufällig zu wählen sei. Dann habe jeder der Browserhersteller eine Chance und die Nutzer nähmen nicht gewohnheitsmäßig den Browser, der als erstes auftaucht. Wer sich in der Informatik auskennt, wird jedoch wissen, dass die Generierung von Zufallswerten, auf denen die Darstellung basiert, kein ganz triviales Unterfangen ist. Macht man es falsch, gibt es statistische Ausreißer.

• Entwickler kriegen Zufall nicht hin (Alleine diese Überschrift...grrr)

Nun denn hat sich ein gewiefer IBM Entwickler mal daran gemacht dies zu analysieren:
• Doing the Microsoft Shuffle: Algorithm Fail in Browser Ballot
Lest ihn mal durch. Sehr interresant.

Random is not the same as being casual. Getting random results on a deterministic computer is one of the hardest things you can do with a computer and requires deliberate effort, including avoiding known traps.

Also fangt nun nicht mit der "M$ ist zu doof" Linie an, sondern versucht das mal selber besser zu machen.

wtfjs. JavaScript und seine Fehler ;-)

nospam@example.com (Banana) — Wed, 17 Feb 2010 12:21:18 +0100

JavaScript hat schon alles abbekommen.
Von zu viel Bling Bling bis zu langsam und unnötig. Nun ist es einfach nicht mehr weg zudenken.

Nun hat sich jemand die Aufgabe gemacht all die unmöglichen Fehler die die Sprache so hat zu sammeln.
Dabei kommt so was heraus:

(true + 1) === 2;? ?// true

(true + true) === 2; // true

true === 2; // false

true === 1; // false

Mehr gibt es hier:
• http://wtfjs.com/

Windows simuliert mit JavaScript

nospam@example.com (Banana) — Mon, 25 Jan 2010 15:32:43 +0100

Da hat jemand zu viel Zeit.

Windows 3.1 im Browser

Beispiele für Mootools

nospam@example.com (Banana) — Tue, 08 Dec 2009 11:57:38 +0100

Ha, mal endlich wieder was mit mootools gemacht.

Dabei war ich auf der Suche nach Beispielen, denn man muss ja nicht immer das Rad neu erfinden.

48 incredible Mootools Sripts By Jeeremie

Viel Spass mit den Beispielen !

Mach Google Analytics schneller

nospam@example.com (Banana) — Wed, 02 Dec 2009 13:06:21 +0100

Wer Google Analytics im Einsatz hat, sollte immer bedenken, dass das einbinden von fremd Scripten die Seite lahm legen, oder sogar komplett unaufrufbar machen kann.

Nun hat Google sein Javscript aktualisiert, dass man in seine Seite einbaut.

Damit werden nun die Daten verzögert geladen und somit vermieden, dass die Auslieferung der Website blockiert wird.

Mehr Details und das neue Script findet man hier:

Google Analytics Launches Asynchronous Tracking Tuesday, December 01, 2009

Ordnerbäume mit Javascirpt erstellen

nospam@example.com (Banana) — Thu, 19 Nov 2009 11:38:04 +0100

Es gibt keinen besseren Weg eine Strucktur darzustellen als die Darstellung als "Baum".

In dem folgenden Beitrag finden man nun 10 Beispiele wie man so entwas lösen kann.

Javascript Tree view and sitemap are good tools to display the structure of your website. I have collected 10 plugins and tutorials that will save your time hunting for one.

10 Javascript & CSS TreeView and Sitemap Plugins and Tutorials

Banana
out.

Charts / Diagramme via Javascript

nospam@example.com (Banana) — Thu, 19 Nov 2009 11:34:56 +0100

Ich hatte schon mal über die Erstellung von Diagrammen mit JS oder Flash geschrieben.

Nun gibt es hier noch eine weitere Sammlung die noch mehr Scripte anbietet und sogar Beispiele liefert:

Wont it be nice if all your theoretical data were presented as charts? Charts add style and spice up the graphical intereface. Style your content and layout with my handpicked collection of best JavaScript Charting plugins.

20 Best JavaScript Charting and Plotting Libraries

Formular button via JS auslösen

nospam@example.com (Banana) — Wed, 18 Nov 2009 11:46:41 +0100

Man kann ja ein Formular ja via JavaScript absenden:

document.forname.submit();

So nun ist aber komischer weise, der Absendeknopf dann nicht in dem POST enthalten.

Ich verwende den button tag und nicht den input tag für den Absende Knopf, daher kann es sein, dass der input tag dann trotzdem vorhanden ist.

Nur wenn ich diesen nun auch drücke, dann ist diese in POST enthalten.

Nun gibt es aber auch eine Lösung die wirklich das drücken des Knopfes via JS nachmacht und zwar so als hätte der Benutzer wirklich darauf gedrückt.

document.getElementById('submitButton').click();

Somit ist auch der Button im POST enthalten und mann kann diesen abfragen.

Banana
out.

Das richtige JavaScript Framework finden

nospam@example.com (Banana) — Fri, 13 Nov 2009 13:24:00 +0100

Schöner vergleich der aktuell verfügbaren JS Frameworks.

JavaScript Framework matrix

Banana
out.

Mootools Kalender: Eightysix

nospam@example.com (Banana) — Mon, 02 Nov 2009 15:37:58 +0100

Man kennt ja den Mootools calendar aber nun habe ich noch einen gefunden, der mindestens genauso gut ist.

Calender Eightysix documentation and examples

Banana
out.

Wie geht denn das nun mit dem AJAX ?

nospam@example.com (Banana) — Fri, 30 Oct 2009 08:41:59 +0100

Nein ich meine nicht das Putzmittel.
Ich meine das hier.

Und wie lernt man das nun ?

Am besten mit Beispielen und Anleitungen

How AJAX Works: 10 Practical Uses For AJAX

Most Wanted Ajax Techniques: 50+ Examples and Tutorials

Viel Spass

banana
out.

WYSIWYG Editors roundup

nospam@example.com (Banana) — Tue, 20 Oct 2009 14:08:00 +0200

Es gibt sie wie ja Sand am Meer, aber es sind ein paar neue dabei und diese können sich sehen lassen:

Yahoo! UI Rich Text Editor
TinyMCE
NicEdit
CKEditor
openWYSIWYG

Ich persönlich verwende ja den Tiny aber der CKEditor sieht nicht schlecht aus !

5 Powerful WYSIWYG editors for web-based applications

Banana
out

Tabelle mit Javascript verbessern

nospam@example.com (Banana) — Fri, 24 Jul 2009 16:03:00 +0200

Tabelle an sich können ja nicht viel...
Ok die Daten tabellarisch darstellen. Aber was noch ?

Dazu braucht man Javascript.

Hier kommt nun eine Liste mit Beispielen wie man seine schlichte HTML Tabelle aufpeppen kann.

Table is an excellent way of presenting information, especially when a company wants to cite various prices for its services or products. For instance, some websites require users to sign up different levels of membership in order to access certain exclusive contents. They can present to users the distinct features that each level has to offer in a table-like format. Depending on the content, tables can be good for arranging many other kinds of data for deeper clarity other than pricing.

Creating a table is easy, but organizing data in an easy-to-understand tabular format together with an appealing layout is often challenging. Most of us have came across numerous tables on the net, and some of these can be rather plain-looking ones with no or minimal design whatsoever. However, we are about to show you that tables need not be such uninteresting and boring visual communication. It can be uniquely designed to suit your web content and stand out from the vast array of tables from websites all over the world. Also, we’ve put together a list of useful scripts to help you get the best of of table display.

HTML Table Building: 30+ Beautiful Examples and Useful Javascripts

Banana
out.

Interactive Data Visualizations

nospam@example.com (Banana) — Mon, 20 Jul 2009 09:11:41 +0200

The JavaScript InfoVis Toolkit provides tools for creating Interactive Data Visualizations for the Web.

Multiple Data Representations
- Treemaps, Radial Layouts, HyperTrees/Graphs, SpaceTree-like Layouts, and more...
Major Browsers Support
- IE6+, Firefox2+, Safari3+, Opera9.5+
Open Source
- Licensed under the BSD License
Library Agnostic
- You may use the JIT with your favorite DOM manipulation framework
Extensible
- All visualization classes are mutable, so you can easily add/override any method you want.
Composable
- Visualizations can be combined in order to create new visualization methods.

InfoVis Toolkit