return new Status( text, status, 'error' );
}
Status.error = function( text, status ) {
return new Status( text, status, 'error' );
}  
// Simple helper function to create a simple node
function htmlNode( type, content, color ) {
var node = document.createElement( type );
if( color ) {
node.style.color = color;
}
node.appendChild( document.createTextNode( content ) );
return node;
}  
// A simple dragable window  
function SimpleWindow( width, height ) {
var stylesheet = document.createElement('style');
stylesheet.type = 'text/css';
stylesheet.rel = 'stylesheet';
stylesheet.appendChild( document.createTextNode("") ); // Safari bugfix
document.getElementsByTagName("head")[0].appendChild(stylesheet);
var styles = stylesheet.sheet ? stylesheet.sheet : stylesheet.styleSheet;
styles.insertRule(
".simplewindow { "+
"position: fixed; "+
"background-color: AliceBlue; "+
": ridge Black; "+
"z-index: 100; "+
"}",
0
);  
styles.insertRule(
".simplewindow .content { "+
"position: absolute; "+
"top: ; "+
"bottom: 0; "+
"overflow: auto; "+
"width: 100%; "+
"}",
0
);  
styles.insertRule(
".simplewindow .resizebuttonhorizontal { "+
"position: absolute; "+
"background-color: MediumPurple; "+
"opacity: 0.5; "+
": -; "+
"bottom: -; "+
"width: ; "+
"height: ; "+
"cursor: se-resize; "+
"}",
0
);
styles.insertRule(
".simplewindow .resizebuttonvertical { "+
"position: absolute; "+
"opacity: 0.5; "+
"background-color: MediumPurple; "+
": -; "+
"bottom: -; "+
"width: ; "+
"height: ; "+
"cursor: se-resize; "+
"}",
0
);  
styles.insertRule(
".simplewindow .closebutton {"+
"position: absolute; "+
"font: 100 0.8em sans-serif; "+
"top: ; "+
": ; "+
"height: 100%; "+
"cursor: pointer; "+
"}",
0
);  
styles.insertRule(
".simplewindow .topbar { "+
"position: absolute; "+
"background-color: LightSteelBlue; "+
"font: 900 1em sans-serif; "+
"vertical-align: baseline; "+
"text-align: ; "+
"width: 100%; "+
"height: ; "+
"cursor: move; "+
"}",
0
);  
this.width = width;
this.height = height;  
var = document.createElement( 'div' );
var content = document.createElement( 'div' );
var topbar = document.createElement( 'div' );
var title = document.createElement( 'span' );
var closeButton = document.createElement( 'span' );
var resizeButton2 = document.createElement( 'div' );
var resizeButton1 = document.createElement( 'div' );  
this. = ;
this.title = title;
this.content = content;  
.className = 'simplewindow';
content.className = 'content';
topbar.className = 'topbar';
resizeButton1.className = 'resizebuttonvertical';
resizeButton2.className = 'resizebuttonhorizontal';
closeButton.className = 'closebutton';
title.className = 'title';  
topbar.appendChild( closeButton );
topbar.appendChild( title );
.appendChild( topbar );
.appendChild( content );
.appendChild( resizeButton1 );
.appendChild( resizeButton2 );  
.style.width = width + 'px';
.style.height = height + 'px';
.style.top = parseInt( window.innerHeight - this.height )/2 + 'px' ;
.style. = parseInt( window.innerWidth - this.width )/2 + 'px';
var img = document.createElement( 'img' );
img.src = "//upload.wikimedia.org/wikipedia/commons//5/52/Nuvola_apps_error.png/-Nuvola_apps_error.png";
closeButton.appendChild( img );  
var self = this;  
// Specific events
.addEventListener( 'mousedown', function(event) { self.focus(event); }, false );
closeButton.addEventListener( 'click', function(event) {self.close(event); }, false );
topbar.addEventListener( 'mousedown', function(event) {self.initMove(event); }, false );
resizeButton1.addEventListener( 'mousedown', function(event) {self.initResize(event); }, false );
resizeButton2.addEventListener( 'mousedown', function(event) {self.initResize(event); }, false );  
// Generic events
window.addEventListener( 'mouseover', function(event) {self.handleEvent(event); }, false );
window.addEventListener( 'mousemove', function(event) {self.handleEvent(event); }, false );
window.addEventListener( 'mouseup', function(event) {self.handleEvent(event); }, false );
this.currentState = this.initialState;
}  
SimpleWindow.prototype = {
focusLayer: 100,
width: 800,
height: 600,
initialState: "Inactive",
currentState: null, // current state of finite state machine (one of 'actionTransitionFunctions' properties)
focus: function(event) {
this..style.zIndex = ++this.focusLayer;
},
close: function(event) {
event.preventDefault;
document.body.removeChild( this. );
},
initMove: function(event) {
event.preventDefault;
this.initialX = parseInt( event.clientX - this..offsetLeft );
this.initialY = parseInt( event.clientY - this..offsetTop );
this..style.opacity = '0.5';
this.currentState = 'Move';
},
initResize: function(event) {
event.preventDefault;
this..style.opacity = '0.5';
this.currentState = 'Resize';
},
handleEvent: function(event) {
event.preventDefault;
var actionTransitionFunction = this.actionTransitionFunctions[this.currentState][event.type];
if( !actionTransitionFunction ) {
actionTransitionFunction = this.unexpectedEvent;
}
var nextState = actionTransitionFunction.call(this, event);
if( !nextState ){
nextState = this.currentState;
}
if( !this.actionTransitionFunctions[nextState] ){
nextState = this.undefinedState(event, nextState);
}
this.currentState = nextState;
event.stopPropagation;
},
unexpectedEvent: function(event) {
throw ("Handled unexpected event '" + event.type + "' in state '" + this.currentState);
return this.initialState;
},  
undefinedState: function(event, state) {
throw ("Transitioned to undefined state '" + state + "' from state '" + this.currentState + "' due to event '" + event.type);
return this.initialState;
},
actionTransitionFunctions: {
Inactive: {
mouseover: function(event) {
return this.currentState;
},
mousemove: function(event) {
return this.currentState;
},
mouseup: function(event) {
return this.currentState;
}
},
Move: {
mouseover: function(event) {
this.moveWindow( event.clientX, event.clientY );
return this.currentState;
},
mousemove: function(event) {
return this.doActionTransition("Move", "mouseover", event);
},
mouseup: function(event) {
this..style.opacity = '1';
return 'Inactive';
}
},
Resize: {
mouseover: function(event) {
this.resizeWindow( event.clientX, event.clientY );
return this.currentState;
},
mousemove: function(event) {
return this.doActionTransition("Resize", "mouseover", event);
},
mouseup: function(event) {
this..style.opacity = '1';
return 'Inactive';
}
}
},
doActionTransition: function(anotherState, anotherEventType, event) {
return this.actionTransitionFunctions[anotherState][anotherEventType].call(this,event);
},
display: function {
document.body.appendChild( this. );
},
setTitle: function( title ) {
this.title.textContent = title;
},
setWidth: function( width ) {
this..style.width = width;
},
setHeight: function( height ) {
this..style.height = height;
},
setContent: function( content ) {
this.purgeContent;
this.addContent( content );
},
addContent: function( content ) {
this.content.appendChild( content );
},
purgeContent: function( content ) {
while( this.content.hasChildNodes ) {
this.content.removeChild( this.content.firstChild );
}
},
moveWindow: function( x, y ) {
this..style. = x - this.initialX + 'px';
this..style.top = y - this.initialY + 'px';
},
resizeWindow: function( x, y ) {
this..style.height = Math.max( parseInt( y - this..offsetTop ), 200 ) + 'px';
this..style.width = Math.max( parseInt( x - this..offsetLeft ), 200 ) + 'px';
}
}