Tuesday, August 29, 2017

A gem from sockjs sources...

var area = that._send_area = _document.createElement('textarea'); 
... 
try {
    area.value = payload;
} catch(e) {
    utils.log('Your browser is seriously broken. Go home! ' + e.message);
}

Wednesday, May 10, 2017

Marionette Carousel


The amount of javascript frameworks increases every day, though the majority of projects implements angular, backbone or react. Searching for an example implementation for a foundation learning marionette I found TodoMVC. TodoMVC laverages examples of many recent javascript frameworks and provided the basis for marionette-carousel.
"Developers these days are spoiled with choice when it comes to selecting an MV* framework ...
To help solve this problem, we created TodoMVC - a project which offers the same Todo application implemented using MV* concepts in most of the popular JavaScript MV* frameworks of today."

Tuesday, March 21, 2017

Frontend Work Samples

Two new sample projects emerged into my github repositories collections:

Angular Jukebox (github)

Angular Jukebox is a fork from arey/angular-musicbrainz. Arey implemented a music search client querying an elasticsearch instance, that you install on your local device or connect to a default service. The implementation serves data from musicbrainz: artists, albums and meta data. I replaced elasticsearch service, changing the service to query data from the spotify web api eddiemoore/angular-spotify.

Geek Label (github)

Geek Label is a simple sample for one page scrolling sites, describing the services of a pseudo company called "Geek Label". Given the design, the implementation provides page slides. It is enhanced by jquery, elegant icon font animating the scolling and MargotFF. The project can be a template for small companies.

Friday, March 17, 2017

jQuery Simple Websocket


https://github.com/jbloemendal/jquery-simple-websocket
Why implementing a websocket wrapper, you may ask. Because the current websocket api implementation is cumbersome, specifically handling errors asynchronously.
Let's assume you want to send a message and if the connection drops or the post failed you want to send the message again, it requires you to implement this by yourself:


"As establishing a connection is asynchronous and prone to failure there is no guarantee that calling the send() method immediately after creating a WebSocket object will be successful. We can at least be sure that attempting to send data only takes place once a connection is established by defining an onopen handler to do the work." [1].
jQuery Simple WebSocket does this for you, it implements jquery deferreds for handling connection drops. For example send a hello message:
    webSocket.send({ 'text': 'hello' }).done(function() {
      // message send
  }).fail(function(e) {
      // error sending
  });
Listening for a message is simple, jQuery Simple WebSocket reconnects automatically in case the connection drops due to for example bad mobile network:
     webSocket.listen(function(message) {
     console.log(message.text);
  });
A few benefits of jQuery Simple WebSocket:
  • deferred handling of asynchrounous code, handles websocket reconnects and errors gracefully
  • json, xml and text payload
  • a fluent interface

[1] https://developer.mozilla.org/en-US/docs/Web/API/WebSockets_API/Writing_WebSocket_client_applications
[2] https://github.com/jbloemendal/jquery-simple-websocket
[3] http://jbloemendal.github.io/jquery-simple-websocket/