rdspoons
08-29-2010, 06:05 AM
This is a FF, Chrome, and IE Javascript Joystick Object.
Note: The code requires the Javacript Joystick Plugin found here: link (http://code.google.com/p/javascript-joystick)
This OOD Javascript Joystick Object Singleton was refactored from the original source code by
cwoffenden found at: http://code.google.com/p/javascript-joystick (joystick.js)
shared under the GNU Lesser General Public License (http://www.gnu.org/licenses/lgpl.html).
The reson for the refactoring was to replace the original class with a singleton object that supported a single joystick
and efectivly encapsulated the methods and properties of the original class.
You should find the result to be as easy to use as the original code by cwoffenden.
If you want to support other applications (Flash, etc) then please see the original source link (http://code.google.com/p/javascript-joystick)
for the registration code that was removed from this object.
To use the Joystick object, just include the object code at startup and then utilize any of the following methods after the document has loaded:
Joystick.getX() : returns the current Joystick X-Axis value.
Joystick.getY() : returns the current Joystick Y-Axis value.
Joystick.getZ() : returns the current Joystick Z-Axis AKA Throttle value.
Joystick.getR() : returns the current Joystick R-Axis AKA Rudder value.
Joystick.getX1() : returns the current Joystick X-Axis value mapped to the set (-1,0,1).
Joystick.getY1() : returns the current Joystick Y-Axis value mapped to the set (-1,0,1).
Joystick.getZ1() : returns the current Joystick Z-Axis value mapped to the set (-1,0,1).
Joystick.getR1() : returns the current Joystick R-Axis value mapped to the set (-1,0,1).
Joystick.getButtons() : returns the combined state of all Joystick buttons as a bit field.
Joystick.isConnected() : returns true if the Joystick is connected, otherwise false.
var Joystick = (function(){
/*
| This OOD Joystick Singleton Object is refactored from the original source code by
| cwoffenden found at: http://code.google.com/p/javascript-joystick (joystick.js)
| shared under the GNU Lesser General Public License.
| The original public property and method names now have an underscore prepended.
| Eight methods were added including getX1 and getY1 which behave simmilar to getX and
| getY, except the new methods return values that are mapped onto the set (-1,0,1).
| Finally, the additional application (flash etc) registration code has been
| removed from this object (see the original source for the removed code).
| The Joystick plugin required to run this code can be found at the same location.
+------------------------------------------------------------------------------*/
_createPlugin = function() {
var ctrlIE = document.createElement("object");
if (ctrlIE) {
try {
ctrlIE.classid = "CLSID:3AE9ED90-4B59-47A0-873B-7B71554B3C3E";
if (ctrlIE.setDevice(0) != null) {
return ctrlIE;
}
} catch (e) {
}
}
var ctrlFF = document.createElement("embed");
if (ctrlFF) {
if (navigator && navigator.plugins) {
var found = false;
for (var n = 0; n < navigator.plugins.length; n++) {
if (navigator.plugins[n].name.indexOf("Joystick") != -1) {
found = true;
break;
}
}
if (!found) {
return null;
}
}
try {
ctrlFF.type = "application/x-vnd.numfum-joystick";
ctrlFF.width = 0;
ctrlFF.height = 0;
document.body.appendChild(ctrlFF, document.body);
if (ctrlFF.setDevice(0) != null) {
return ctrlFF;
}
} catch (e) {}
document.body.removeChild(ctrlFF);
}
return null;
};
_ctl = null;
_CENTER = 32768;
_init = function() {
_ctl = _createPlugin();
};
_getX = function( /* x-axis */ ) {
return (_ctl) ? _ctl.x : _CENTER;
};
_getY = function( /* y-axis */ ) {
return (_ctl) ? _ctl.y : _CENTER;
};
_getZ = function( /* z-axis | Throttle */ ) {
return (_ctl) ? _ctl.z : _CENTER;
};
_getR = function( /* r-axis | Rudder */ ) {
return (_ctl) ? _ctl.r : _CENTER;
};
_getX1 = function() {
var x = (_ctl) ? _ctl.x : _CENTER;
return (x < 28672 || x > 36864)?(x < 28672)?-1:1:0;
};
_getY1 = function() {
var y = (_ctl) ? _ctl.y : _CENTER;
return (y < 28672 || y > 36864)?(y < 28672)?-1:1:0;
};
_getZ1 = function() {
var z = (_ctl) ? _ctl.z : _CENTER;
return (z < 28672 || z > 36864)?(z < 28672)?-1:1:0;
};
_getR1 = function() {
var r = (_ctl) ? _ctl.r : _CENTER;
return (r < 28672 || r > 36864)?(r < 28672)?-1:1:0;
};
_getA = function( /* Button-A */ ) {
return (_ctl) ? _ctl.a : false;
};
_getB = function( /* Button-B */ ) {
return (_ctl) ? _ctl.b : false;
};
_getButtons = function( /* All-Buttons BitField */ ) {
return (_ctl) ? _ctl.buttons : 0;
};
_read = function(prop, off, len) {
switch (arguments.length) {
case 0:
return null;
case 1:
off = 0;
case 2:
len = prop.length - off;
}
var ret = [];
for (var n = 0; n < len; n++) {
switch (prop[off + n]) {
case "x":
ret.push(_getX());
break;
case "y":
ret.push(_getY());
break;
case "a":
ret.push(_getA());
break;
case "b":
ret.push(_getB());
break;
case "buttons":
ret.push(_getButtons());
break;
default:
ret.push(0);
}
}
return ret;
};
_isConnected = function(){
return (_ctl) ? _ctl.isConnected() : false;
};
return {
__init:function(){_init()},
getX:function(){return _getX()},
getY:function(){return _getY()},
getZ:function(){return _getZ()},
getR:function(){return _getR()},
getX1:function(){return _getX1()},
getY1:function(){return _getY1()},
getZ1:function(){return _getZ1()},
getR1:function(){return _getR1()},
getA:function(){return _getA()},
getB:function(){return _getB()},
getButtons:function(){return _getButtons()},
read:function(){return _read()},
isConnected:function(){return _isConnected()}
}
})();
/*
| Just load the Joystick object into the page at startup and you're
| ready to go.
|
| You can remove this clunky initialzation, just remember to call
| Joystick.__init after the document body is avilable but before
| any other use of the Joystick object
+------------------------------------------------------------------------------*/
var clunkyload=(window.attachEvent)?window.attachEvent("onload",Joystick.__init):
(window.addEventListener)?window.addEventListener("load",Joystick.__init,true):
window.onload=Joystick.__init;
delete clunkyload
Here is an OOD proof of usgae for the Joystick object:
<html>
<head>
<title>
Javascript Joystick Use Example (OOD)
</title>
<script type="text/javascript" src="Joystick.js"></script>
<script type="text/javascript">
//OOD Version
var App=(function(){
/*
| This example code is refactored from the original source code found at:
| http://code.google.com/p/javascript-joystick (joystick.html)
| original public property and method names have an ubderscore prepended.
| display method and Page object added.
+------------------------------------------------------------------------------*/
var _gameLoop = function(INTERVAL){
var con = Joystick.isConnected();
if(con==false){
setTimeout("App.gameLoop()", INTERVAL);
return ("Joystick is connected: "+con);
}
var btn=" ";
var a=false;
var A = Joystick.getA();
var x = Joystick.getX1();
var y = Joystick.getY1();
var z = Joystick.getZ();
var r = Joystick.getR();
var Btn = Joystick.getButtons();
if(A==true /* Button-A */){
//addYourCode
a=true;
}
if(Btn & 1 /* Button-1 (A) */){
//addYourCode
}
if(Btn & 2 /* Button-2 */){
//addYourCode
}
if(Btn & 4 /* Button-3 */){
//addYourCode
}
if(Btn & 8 /* Button-4 */){
//addYourCode
}
if(Btn & 16 /* Button-5 */){
//addYourCode
}
if(Btn & 32 /* Button-6 */){
//addYourCode
}
if(Btn & 64 /* Button-7 */){
//addCode
}
if(Btn & 128 /* Button-8 */){
//addYourCode
}
setTimeout("App.gameLoop()", INTERVAL);
return("Joystick is connected: "+con+"<br>X:"+x+"<br>Y:"+y+"<br>BTN:"+Btn);
}
var _display = function(txt){
document.getElementById("res").innerHTML=txt;
}
return{
gameLoop:function(){return _gameLoop(50 /*Milliseconds between each frame*/)},
display:function(txt){_display(txt)}
}
})();
var Page=(function(){
var _bind=function(a /*binding object*/, b /*binding function*/, c /*function bound to*/){
var d = a[b];
a[b]=function(){
c(d(arguments));
}
return Page;
};
var _addEvent=function(el,ev,fnc){
if(el.attachEvent)
el.attachEvent("on"+ev,fnc);
else if(el.addEventListener)
el.addEventListener(ev,fnc,true);
else
el[ev]=fnc;
return Page;
};
return {
bind:function(a,b,c){return _bind(a,b,c);},
addEvent:function(el,ev,fnc){return _addEvent(el,ev,fnc);}
};
})();
Page.addEvent(window,"load",App.gameLoop).bind(App,"gameLoop",App.display);
</script>
</head>
<body>
<div id="res"></div>
<div id="res2"></div>
</body>
</html>
original code by cwoffenden link (http://code.google.com/p/javascript-joystick)
refactoring provided by rdspoons
Note: The code requires the Javacript Joystick Plugin found here: link (http://code.google.com/p/javascript-joystick)
This OOD Javascript Joystick Object Singleton was refactored from the original source code by
cwoffenden found at: http://code.google.com/p/javascript-joystick (joystick.js)
shared under the GNU Lesser General Public License (http://www.gnu.org/licenses/lgpl.html).
The reson for the refactoring was to replace the original class with a singleton object that supported a single joystick
and efectivly encapsulated the methods and properties of the original class.
You should find the result to be as easy to use as the original code by cwoffenden.
If you want to support other applications (Flash, etc) then please see the original source link (http://code.google.com/p/javascript-joystick)
for the registration code that was removed from this object.
To use the Joystick object, just include the object code at startup and then utilize any of the following methods after the document has loaded:
Joystick.getX() : returns the current Joystick X-Axis value.
Joystick.getY() : returns the current Joystick Y-Axis value.
Joystick.getZ() : returns the current Joystick Z-Axis AKA Throttle value.
Joystick.getR() : returns the current Joystick R-Axis AKA Rudder value.
Joystick.getX1() : returns the current Joystick X-Axis value mapped to the set (-1,0,1).
Joystick.getY1() : returns the current Joystick Y-Axis value mapped to the set (-1,0,1).
Joystick.getZ1() : returns the current Joystick Z-Axis value mapped to the set (-1,0,1).
Joystick.getR1() : returns the current Joystick R-Axis value mapped to the set (-1,0,1).
Joystick.getButtons() : returns the combined state of all Joystick buttons as a bit field.
Joystick.isConnected() : returns true if the Joystick is connected, otherwise false.
var Joystick = (function(){
/*
| This OOD Joystick Singleton Object is refactored from the original source code by
| cwoffenden found at: http://code.google.com/p/javascript-joystick (joystick.js)
| shared under the GNU Lesser General Public License.
| The original public property and method names now have an underscore prepended.
| Eight methods were added including getX1 and getY1 which behave simmilar to getX and
| getY, except the new methods return values that are mapped onto the set (-1,0,1).
| Finally, the additional application (flash etc) registration code has been
| removed from this object (see the original source for the removed code).
| The Joystick plugin required to run this code can be found at the same location.
+------------------------------------------------------------------------------*/
_createPlugin = function() {
var ctrlIE = document.createElement("object");
if (ctrlIE) {
try {
ctrlIE.classid = "CLSID:3AE9ED90-4B59-47A0-873B-7B71554B3C3E";
if (ctrlIE.setDevice(0) != null) {
return ctrlIE;
}
} catch (e) {
}
}
var ctrlFF = document.createElement("embed");
if (ctrlFF) {
if (navigator && navigator.plugins) {
var found = false;
for (var n = 0; n < navigator.plugins.length; n++) {
if (navigator.plugins[n].name.indexOf("Joystick") != -1) {
found = true;
break;
}
}
if (!found) {
return null;
}
}
try {
ctrlFF.type = "application/x-vnd.numfum-joystick";
ctrlFF.width = 0;
ctrlFF.height = 0;
document.body.appendChild(ctrlFF, document.body);
if (ctrlFF.setDevice(0) != null) {
return ctrlFF;
}
} catch (e) {}
document.body.removeChild(ctrlFF);
}
return null;
};
_ctl = null;
_CENTER = 32768;
_init = function() {
_ctl = _createPlugin();
};
_getX = function( /* x-axis */ ) {
return (_ctl) ? _ctl.x : _CENTER;
};
_getY = function( /* y-axis */ ) {
return (_ctl) ? _ctl.y : _CENTER;
};
_getZ = function( /* z-axis | Throttle */ ) {
return (_ctl) ? _ctl.z : _CENTER;
};
_getR = function( /* r-axis | Rudder */ ) {
return (_ctl) ? _ctl.r : _CENTER;
};
_getX1 = function() {
var x = (_ctl) ? _ctl.x : _CENTER;
return (x < 28672 || x > 36864)?(x < 28672)?-1:1:0;
};
_getY1 = function() {
var y = (_ctl) ? _ctl.y : _CENTER;
return (y < 28672 || y > 36864)?(y < 28672)?-1:1:0;
};
_getZ1 = function() {
var z = (_ctl) ? _ctl.z : _CENTER;
return (z < 28672 || z > 36864)?(z < 28672)?-1:1:0;
};
_getR1 = function() {
var r = (_ctl) ? _ctl.r : _CENTER;
return (r < 28672 || r > 36864)?(r < 28672)?-1:1:0;
};
_getA = function( /* Button-A */ ) {
return (_ctl) ? _ctl.a : false;
};
_getB = function( /* Button-B */ ) {
return (_ctl) ? _ctl.b : false;
};
_getButtons = function( /* All-Buttons BitField */ ) {
return (_ctl) ? _ctl.buttons : 0;
};
_read = function(prop, off, len) {
switch (arguments.length) {
case 0:
return null;
case 1:
off = 0;
case 2:
len = prop.length - off;
}
var ret = [];
for (var n = 0; n < len; n++) {
switch (prop[off + n]) {
case "x":
ret.push(_getX());
break;
case "y":
ret.push(_getY());
break;
case "a":
ret.push(_getA());
break;
case "b":
ret.push(_getB());
break;
case "buttons":
ret.push(_getButtons());
break;
default:
ret.push(0);
}
}
return ret;
};
_isConnected = function(){
return (_ctl) ? _ctl.isConnected() : false;
};
return {
__init:function(){_init()},
getX:function(){return _getX()},
getY:function(){return _getY()},
getZ:function(){return _getZ()},
getR:function(){return _getR()},
getX1:function(){return _getX1()},
getY1:function(){return _getY1()},
getZ1:function(){return _getZ1()},
getR1:function(){return _getR1()},
getA:function(){return _getA()},
getB:function(){return _getB()},
getButtons:function(){return _getButtons()},
read:function(){return _read()},
isConnected:function(){return _isConnected()}
}
})();
/*
| Just load the Joystick object into the page at startup and you're
| ready to go.
|
| You can remove this clunky initialzation, just remember to call
| Joystick.__init after the document body is avilable but before
| any other use of the Joystick object
+------------------------------------------------------------------------------*/
var clunkyload=(window.attachEvent)?window.attachEvent("onload",Joystick.__init):
(window.addEventListener)?window.addEventListener("load",Joystick.__init,true):
window.onload=Joystick.__init;
delete clunkyload
Here is an OOD proof of usgae for the Joystick object:
<html>
<head>
<title>
Javascript Joystick Use Example (OOD)
</title>
<script type="text/javascript" src="Joystick.js"></script>
<script type="text/javascript">
//OOD Version
var App=(function(){
/*
| This example code is refactored from the original source code found at:
| http://code.google.com/p/javascript-joystick (joystick.html)
| original public property and method names have an ubderscore prepended.
| display method and Page object added.
+------------------------------------------------------------------------------*/
var _gameLoop = function(INTERVAL){
var con = Joystick.isConnected();
if(con==false){
setTimeout("App.gameLoop()", INTERVAL);
return ("Joystick is connected: "+con);
}
var btn=" ";
var a=false;
var A = Joystick.getA();
var x = Joystick.getX1();
var y = Joystick.getY1();
var z = Joystick.getZ();
var r = Joystick.getR();
var Btn = Joystick.getButtons();
if(A==true /* Button-A */){
//addYourCode
a=true;
}
if(Btn & 1 /* Button-1 (A) */){
//addYourCode
}
if(Btn & 2 /* Button-2 */){
//addYourCode
}
if(Btn & 4 /* Button-3 */){
//addYourCode
}
if(Btn & 8 /* Button-4 */){
//addYourCode
}
if(Btn & 16 /* Button-5 */){
//addYourCode
}
if(Btn & 32 /* Button-6 */){
//addYourCode
}
if(Btn & 64 /* Button-7 */){
//addCode
}
if(Btn & 128 /* Button-8 */){
//addYourCode
}
setTimeout("App.gameLoop()", INTERVAL);
return("Joystick is connected: "+con+"<br>X:"+x+"<br>Y:"+y+"<br>BTN:"+Btn);
}
var _display = function(txt){
document.getElementById("res").innerHTML=txt;
}
return{
gameLoop:function(){return _gameLoop(50 /*Milliseconds between each frame*/)},
display:function(txt){_display(txt)}
}
})();
var Page=(function(){
var _bind=function(a /*binding object*/, b /*binding function*/, c /*function bound to*/){
var d = a[b];
a[b]=function(){
c(d(arguments));
}
return Page;
};
var _addEvent=function(el,ev,fnc){
if(el.attachEvent)
el.attachEvent("on"+ev,fnc);
else if(el.addEventListener)
el.addEventListener(ev,fnc,true);
else
el[ev]=fnc;
return Page;
};
return {
bind:function(a,b,c){return _bind(a,b,c);},
addEvent:function(el,ev,fnc){return _addEvent(el,ev,fnc);}
};
})();
Page.addEvent(window,"load",App.gameLoop).bind(App,"gameLoop",App.display);
</script>
</head>
<body>
<div id="res"></div>
<div id="res2"></div>
</body>
</html>
original code by cwoffenden link (http://code.google.com/p/javascript-joystick)
refactoring provided by rdspoons