Tuesday, December 14, 2010
Kinect tech firm releases open-source drivers | Game Development | News by Develop
PrimeSense, the company behind the technology used by Microsoft's Kinect device has released open source drivers for both PC and MAC according to various blogs around the web.
Friday, December 10, 2010
Microsoft To Announce Second Major WP7 Update At MWC?
WP7 major updates coming according rumors floating around the web (see here). The updates will be announced during the upcoming Mobile World Congress that will be held between the 14-17 of February 2011, in Barcelona (see here). The updates should bring better controls to developers as well as information about Silverlight 5 for WP7. I am yet to begin working on WP7 but I have been playing with the tools and so far I am impressed.
JavaScript DOM ready function
For years we have relied on the window.onload event to trigger the execution of our JavaScript code; yet, by using such approach our code needs to wait until the last element of our page is loaded. To tell you the truth, relying on the window.onload event does the job most of the time; however, there are instances where we need to execute a piece of code while the page is still loading and that’s where a DOM ready function comes to play. So, in this post I will implement a DOM ready function.
From my previous posts you can tell that I always organize all the functions within a single namespace using JSON notation.
Basic namespace structure:
var DeveloperCaster = {
FunctionToExecuteOnReady: null,
Ready: function (_function) {
},
OnLoad: function (_function) {
}
};
I will need two function and a variable in this namespace.
Variable(s):
FunctionToExecuteOnReady : I will use this variable as a pointer to the function I will be executing.
Function(s):
Ready function: This is the actual DOMReady implementation
OnLoad function: I posted this function last month and it will used as a last resort if all my DOMReady attemps failed.
Ready Function
Ready: function (_function) {//DOM Ready
if (typeof DeveloperCaster.FunctionToExecuteOnReady != 'function') {
DeveloperCaster.FunctionToExecuteOnReady = _function;
} else {
var _current = DeveloperCaster.FunctionToExecuteOnReady;
DeveloperCaster.FunctionToExecuteOnReady = function () {
if (_current) {
_current();
}
_function ();
};
}
var _DOMReady = false;
var _wait = true;
if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', function () {
DeveloperCaster.FunctionToExecuteOnReady();
_DOMReady = true;
_wait = false;
}, false);
} else {
//Internet Explorer
document.onreadystatechange = function () {
if (document.readyState == "complete") {
DeveloperCaster.FunctionToExecuteOnReady();
_DOMReady = true;
_wait = false;
}
};
}
if (!_wait && !_DOMReady) {
DeveloperCaster.OnLoad(DeveloperCaster.FunctionToExecuteOnReady); //use window.onload as last resort
}
}
First thing I do is to check my pointer to see if there is already a function assigned to it (same idea from the multiple OnLoad functions). So, if it happens to be the first function I will assign that function to the pointer; however, if there is already a function assigned to be executed I will then copy that function into the _current variable and assign a new function to the FunctionToExecuteOnReady to execute my current function (_current) and the new function (_function).
Next I will check if the browser supports the document.addEventListener (Chrome, Firefox, IE9, and safari). If the event is not supported I will try to use the document.onreadystatechange (IE8 and lower). Before I started this processes I declared two variables _DOMReady and _wait which are flags I will use to call the window.onload event in cases where neither of my approaches worked.
Here is the fully implemented function:
var DeveloperCaster = {
DOMExecuted: false,
DOMExecuted: false,
FunctionToExecuteOnReady: null,
Ready: function (_function) {//DOM Ready
if (typeof DeveloperCaster.FunctionToExecuteOnReady != 'function') {
DeveloperCaster.FunctionToExecuteOnReady = _function;
} else {
var _current = DeveloperCaster.FunctionToExecuteOnReady;
DeveloperCaster.FunctionToExecuteOnReady = function () {
if (_current) {
_current();
}
_function ();
};
}
var _DOMReady = false;
var _wait = true;
if (document.addEventListener) {
document.addEventListener('DOMContentLoaded', function () {
DeveloperCaster.FunctionToExecuteOnReady();
DeveloperCaster.DOMExecuted = true;
}
_DOMReady = true;
_wait = false;
}, false);
} else {
//Internet Explorer
document.onreadystatechange = function () {
if (document.readyState == "complete") {
DeveloperCaster.FunctionToExecuteOnReady();
_DOMReady = true;
_wait = false;
}
};
}
if (!_wait && !_DOMReady) {
DeveloperCaster.OnLoad(DeveloperCaster.FunctionToExecuteOnReady); //use window.onload as last resort
}
},
OnLoad: function (_function) {
var _current = window.onload;
if (typeof window.onload != 'function') {
window.onload = _function;
} else {
window.onload = function () {
if (_current) {
_current();
}
_function();
};
}
}
};
Usage:
DeveloperCaster.Ready(function () {
alert('DOM is ready');
});
Wednesday, December 8, 2010
Add CSS style text to a DOM object in JavaScript
Today I am posting a function to programmatically add CSS text to an object using JavaScript.
Function
Usage
The function request an object id and then you may pass as many CSS parameters as needed.
Function
var DeveloperCaster = {
Css: function (id) {
var styleTxt = '';
if (arguments.length >= 2) {
for (var i = 0; i < arguments[1].length; i++) {
styleTxt += arguments[1][i] + ';';
}
}
//Check for IE
if (window.attachEvent) {
$(id).style.cssText = styleTxt;
} else {
$(id).setAttribute('style', styleTxt);
}
}
}
Usage
The function request an object id and then you may pass as many CSS parameters as needed.
window.onload = function () {
DeveloperCaster.Css('objectId', 'width:300px',
'height:200px',
'border:1px solid #333333');
}
Tuesday, December 7, 2010
Creating an AJAX JavaScript Object
I won’t get into details about Ajax so if you want to know more read here. In order to wrap Ajax functionality in a JavaScript object we need to leverage the XMLHttpRequest object; which is now part of all modern web browsers.
Compress this code at jscompressor.com
XMLHttpRequest wrapper function – The only reason we need this function is to provide some sort of feature validator when initializing the XMLHttpRequest object to account for older browsers.
XmlHttpObject: function () {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
} else {//IE 5,6
try {
return new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
return new ActiveXObject("Microsoft.XMLHTTP");
} catch (ex) {
return null; //Browser doesn't support AJAX
}
}
}
}
Creating the JSON structure for our AJAX object
var DeveloperCaster = {
Ajax: {
Vars: {
OnResponse: null,
XmlHttp: null,
RequestFormat: 'Text'
},
XmlHttpObject: function () {
},
Request: function (_params) {
}
},
OnStateChange: function () {
},
Xml: {
Parse: function (text)
}
}
};
I am using four functions and three variables to create the AJAX object.
Variables:
OnResponse – This is a placeholder for the function that will receive the request result in the client side.
XmlHttp – This is the global pointer to the XMLHttpRequest object
RequestFormat – Flag to decide which format (XML or TEXT) our OnResponse object is expecting.
Functions:
XmlHttpObject - Initialize XMLHttpRequest object
Request - Initiate request
OnStateChange - Handle responses
Xml.Parse - Parse text to XML
Parameters
This object is expecting the following parameters in JSON notation:
url – request url
format – either ‘Text’ or ‘Xml’
onresponse – the function that will handle the response
Example:
Example:
var _params = {
url: ‘’,
format:'Text'
onresponse: function (result) {
}
}
So, here is all put together:
var DeveloperCaster = {
Ajax: {
Vars: {
OnResponse: null,
XmlHttp: null,
RequestFormat: 'Text'
},
XmlHttpObject: function () {
if (window.XMLHttpRequest) {
return new XMLHttpRequest();
} else {//IE 5,6
try {
return new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
return new ActiveXObject("Microsoft.XMLHTTP");
} catch (ex) {
return null; //Browser doesn't support AJAX
}
}
}
},
Request: function (_params) {
if (typeof (_params.url) != 'undefined') {
//Initialize XmlHttpRequest object
DeveloperCaster.Ajax.Vars.XmlHttp = DeveloperCaster.Ajax.XmlHttpObject();
if (typeof (_params.onresponse) != 'undefined') {
DeveloperCaster.Ajax.Vars.OnResponse = _params.onresponse;
}
//Check for request format
if (typeof (_params.requestFormat) != 'undefined') {
DeveloperCaster.Ajax.Vars.RequestFormat = (_params.requestFormat == "Xml" ? "Xml" : "Text");
}
//Send request
DeveloperCaster.Ajax.Vars.XmlHttp.onreadystatechange = DeveloperCaster.Ajax.OnStateChange;
DeveloperCaster.Ajax.Vars.XmlHttp.open("Get", _params.url, true);
DeveloperCaster.Ajax.Vars.XmlHttp.send(null);
}
},
OnStateChange: function () {
if (DeveloperCaster.Ajax.Vars.XmlHttp.readyState == 4) {
if (DeveloperCaster.Ajax.Vars.XmlHttp.responseText.length > 0) {
var result = "";
var _status = DeveloperCaster.Ajax.Vars.XmlHttp.status;
if (DeveloperCaster.Ajax.Vars.RequestFormat == "Text") {
//Text
result = DeveloperCaster.Ajax.Vars.XmlHttp.responseText;
} else {
//XML
result = DeveloperCaster.Ajax.Xml.Parse(DeveloperCaster.Ajax.Vars.XmlHttp.responseText);
}
if (_status == 200) {
if (typeof DeveloperCaster.Ajax.Vars.OnResponse == "function") {
DeveloperCaster.Ajax.Vars.OnResponse(result);
}
}
//TO DO: Handle error is status is different than 200
}
}
},
Xml: {
Parse: function (text) {//text to xml object
var xmlDoc;
if (window.DOMParser) {
xmlParser = new DOMParser();
xmlDoc = xmlParser.parseFromString(text, "text/xml");
} else { // Internet Explorer
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = "false";
xmlDoc.loadXML(text);
}
return xmlDoc;
}
}
}
};
Usage:
To initiate a request
DeveloperCaster.Ajax.Request({
url: '',
format:'Text'
onresponse: function (result) {
}
});
Subscribe to:
Comments (Atom)