Tag Archives: web applications

Julo24

Christian Decker

3

XML11: An Abstract Windowing Protocol

Just today I stumbled across a nice presentation about XML11, an Ajax Toolkit that bridges Java AWT applications right to the Web using modern Ajax-technologies:
The goal of XML11 is to help programmers write AJAX-applications without requiring any JavaScript knowledge. AJAX (Asynchronous JavaScript and XML) has become very popular for building web applications. AJAX basically proposes to move part of the application to the browser without requiring a JRE-plugin. In order to do so the application needs to be written in JavaScript since JavaScript is the lowest common denominator across different web browsers in terms of prerequisites. Writing portable JavaScript is a daunting and tedious task. XML11 allows you to write your application in Java (not JavaScript!). XML11 then translates your Java application to JavaScript so that it can run inside any browser. Just like a C++-compiler shields the programmer from the assembly language, XML11 shields the web-developer from the intrinsic complexities of writing cross-browser portable JavaScript code. As a consequence, a web-developer never has to write or even look at one line of JavaScript code. (source)
Personally I think the approach to the VM simulation using XMLVM a bit an overkill and it might lead to a lot of overhead it’s actually not that bad, due to moore’s law we probably should bother too much about it ^^
Just take a look at the presentation and you will fall in love with it :)
Did you like this? Share it:

Apro17

Christian Decker

0

Visual Form Feedback

In modern applications visual feedback is just as important as the application itself. With the Ajax boom we’re having a revolution of those nice immediate feedbacks in web applications.

To demonstrate what the little script does, here an example: enter something in the textbox below.

Just click on the buttons to see the effect.

So what does the script do? It inserts a span with the “status”-class directly after the input field. Once we have the status span we can then put the HTML that we want in it. Additionally we set the background color to either red, yellow or green, depending of the state.

 
var Feedback = {
  setError: function(element){
    element.style.background = '#FFDDDD';
    this.getStatusFromField(element).innerHTML = "<img src='images/error.png'/>";
  },
  setValid: function(element){
    element.style.background = "#DDFFDD";
    this.getStatusFromField(element).innerHTML = "<img src='images/ok.png'/>";
  },
  setValidating: function(element){
    element.style.background = "#FFFFAA";
    this.getStatusFromField(element).innerHTML = "<img src='images/indicator.gif'/>";
  },
	
  /**
    * Used to create or get the reference to the status box for a certain
   * field.
   */
  getStatusFromField: function(field){
    var f = field.nextSibling;
    if(f == null || f.class != "status"){
      var status = document.createElement("span");
      status.class = "status";
      var parentDiv = field.parentNode; 
      parentDiv.insertBefore(status, field.nextSibling);
      return status;
    }else{
      return f;
    }
  }
};

Download the full source of the Script.This is just a little time filler between the tutorial parts, so check back soon :)

Did you like this? Share it:

  Recent Entries »