Does anybody here undergo most this field?
San Francisco PD has a full division for this and it looked engrossing to me.
Anyone undergo what the chronicle is like?
GWT EXT 2.0 RELEASED
When making ChartMaker on the plane, I was tempted to use GWT Ext, but it didn’t support Ext 2.0 yet so I held off. However, at JavaPolis I was told about the work being done by Sanjiv Jivan, and he has just released GWT Ext 2.0 which “is a powerful widget library that provides rich widgets like Grid with sort, paging and filtering, Tree’s with Drag & Drop support, highly customizable ComboBoxes, Tab Panels, Menus & Toolbars, Dialogs, Forms and a lot more right out of the box with a powerful and easy to use API.”
Sanjiv actually added a partial port of Chart Maker as one of the demos. There are a couple of nice touches in there. The one that jumps out at me is the way you add data. Instead of my cheesy textarea, he added a really nice data entry system. Thanks Sanjiv!
If you are a GWT developer that loves staying in Java land, you can continue to do so knowing that you will be getting fantastic looking widgets via Ext 2. A nice pairing.
JSJAC: JAVASCRIPT JABBER CLIENT LIBRARY
JSJaC is a JavaScript Jabber Client Library that was built "to ease implementation of web based jabber clients. For communication with a jabber server it needs to support either HTTP Polling or HTTP Binding."
To use the library you can check out examples to see how you can do things like send a message:
JAVASCRIPT:
function sendMsg(aForm) {
if (aForm.msg.value == '' || aForm.sendTo.value == '')
return false;
if (aForm.sendTo.value.indexOf('@') == -1)
aForm.sendTo.value += '@' + con.domain;
if (aForm.msg.value == '' || aForm.sendTo.value == '')
return false;
if (aForm.sendTo.value.indexOf('@') == -1)
aForm.sendTo.value += '@' + con.domain;
try {
var aMsg = new JSJaCMessage();
aMsg.setTo(new JSJaCJID(aForm.sendTo.value));
aMsg.setBody(aForm.msg.value);
con.send(aMsg);
aForm.msg.value = '';
return false;
} catch (e) {
html = "<div class='msg error''>Error: "+e.message+"</div>";
document.getElementById('iResp').innerHTML += html;
document.getElementById('iResp').lastChild.scrollIntoView();
return false;
}
}
or handle presence:
JAVASCRIPT:
function handlePresence(aJSJaCPacket) {
var html = '<div class="msg">';
if (!aJSJaCPacket.getType() && !aJSJaCPacket.getShow())
html += '<b>'+aJSJaCPacket.getFromJID()+' has become available.</b>';
else {
html += '<b>'+aJSJaCPacket.getFromJID()+' has set his presence to ';
if (aJSJaCPacket.getType())
html += aJSJaCPacket.getType() + '.</b>';
else
html += aJSJaCPacket.getShow() + '.';
if (aJSJaCPacket.getStatus())
html += ' ('+aJSJaCPacket.getStatus().htmlEnc()+')';
}
html += '</div>';
var html = '<div class="msg">';
if (!aJSJaCPacket.getType() && !aJSJaCPacket.getShow())
html += '<b>'+aJSJaCPacket.getFromJID()+' has become available.</b>';
else {
html += '<b>'+aJSJaCPacket.getFromJID()+' has set his presence to ';
if (aJSJaCPacket.getType())
html += aJSJaCPacket.getType() + '.</b>';
else
html += aJSJaCPacket.getShow() + '.';
if (aJSJaCPacket.getStatus())
html += ' ('+aJSJaCPacket.getStatus().htmlEnc()+')';
}
html += '</div>';
document.getElementById('iResp').innerHTML += html;
document.getElementById('iResp').lastChild.scrollIntoView();
}
Since Jabber (XMPP) is taking over the world, it may be a nice tool in the toolbox.
NATIVE CSS SELECTORS WITH QUERYSELECTOR
David Smith of WebKit posted about their native implementation of querySelector and querySelectorAll from the W3C Selectors API.
Native CSS selectors in the browsers is going to be a huge boon for us and the Ajax libraries that will be able to use them.
You can use the standard via:
JAVASCRIPT:
/*
* Get all the elements with class "hot" (duplicating getElementsByClassName)
* A common use for this is as a toggle;
* for example, a search feature might tag results with a class
*/
document.querySelectorAll(".hot");
* Get all the elements with class "hot" (duplicating getElementsByClassName)
* A common use for this is as a toggle;
* for example, a search feature might tag results with a class
*/
document.querySelectorAll(".hot");
/*
* Get the currently hovered element
*/
document.querySelector(":hover");
/*
* Get every other element in the <li> with id "large"
* This is mostly useful for doing "zebra stripe" alternating rows.
* Once CSS3 becomes more widespread, doing this directly via CSS will be more practical
*/
document.querySelectorAll("#large:nth-child(even)");
Our favourite libraries can implement the same API and do the hard work in JavaScript if the browser doesn't support it.
Point your new Webkit build at the performance test that they use (based on the mootools one) to see how fast you can be if you are native. Vroom vroom.
CROSS WINDOW MESSAGING WITH HTML 5 POSTMESSAGE
John Resig has written a Cross-Window Messaging sample using Firefox 3, which implements the current postMessage API in HTML 5. Opera 9 implements a slightly older version, and a new release will fix that of course:
This particular API adds a new method to every window (including the current window, popups, iframes, and frames) that allows you to send textual messages from your current window to any other - regardless of any cross-domain policies that might exist.
Specifically, you're given a new window.postMessage("string") method that generates a message DOM event on the document of the receiving document. This event object contains the message as a property: event.data which the receiving document can use however they see fit.
His example has a sender:
HTML:
<iframe src="http://dev.jquery.com/~john/message/" id="iframe"></iframe>
<form id="form">
<input type="text" id="msg" value="Message to send"/>
<input type="submit"/>
</form>
<script>
window.onload = function(){
var win = document.getElementById("iframe").contentWindow;
document.getElementById("form").onsubmit = function(e){
win.postMessage( document.getElementById("msg").value );
e.preventDefault();
};
};
</script>
<form id="form">
<input type="text" id="msg" value="Message to send"/>
<input type="submit"/>
</form>
<script>
window.onload = function(){
var win = document.getElementById("iframe").contentWindow;
document.getElementById("form").onsubmit = function(e){
win.postMessage( document.getElementById("msg").value );
e.preventDefault();
};
};
</script>
and a receiver:
HTML:
He also touches on the security issues:
- If you're expecting a message from a specific domain, set of domains, or even a specific url, please remember to verify the .domain or .uri properties as they come in, otherwise another page will be bound to spoof this event for malicious purposes.
- Just because a string is coming in, as a message, doesn't mean that it's completely safe. Note that in the example, above, I inject the string using .textContent, this is intentional. If I were to inject it using .innerHTML, and the message contained a script tag, it would execute immediately upon injection. This is a critical point: You'll need to be sure to purify all your incoming messages before they are used and injected into the DOM (or sent to the server). This is the same that you would do on the server-side of your application, be sure to take the same precautions here, as well.
Having a standard, blessed, way to talk using this message based system is going to be great for Web developers.