/////////////////////////////////////////////////////////////////////////////
//
// Gladiator Components
//
// http://www.gladiatorweb.com
//
// (c) 2006 by Edward H. Trager . All Rights Reserved
//
// NAME: gladiatorIndicator.js
//
// AUTHOR: Edward H. Trager
//
// LAST UPDATE: 2006.11.01
//
// NOTE: SEE "LICENSE" FILE FOR LICENSING TERMS
//
//////////////////////////////////////////////////////////////////////////////
//
//
//
var GLADIATOR_INDICATOR_INCLUDED=true;
if(typeof GLADIATOR_CORE_INCLUDED == 'undefined') alert('NOTA BENE: "gladiatorIndicator.js" REQUIRES "gladiatorCore.js"!');
// DISABLE CHECKING SVG -- THIS IS AN IE WORK-AROUND:
//if(typeof GLADIATOR_SVG_INCLUDED == 'undefined') alert('NOTA BENE: "gladiatorIndicator.js" REQUIRES "gladiatorSVG.js"!');
function gWaitIndicator(parentNode){
// Explicitly initialize the window dimesions for browsers like Opera:
DIMENSIONS.init();
var _self = this;
// CREATE THE INDICATOR CANVAS:
var _canvas = document.createElementNS(NS.xhtml,"div");
_canvas.setAttribute("class","gWaitIndicator");
var _width = 64;
var _height = 64;
var _padding= 12;
var _animationInterval = 70;
var _spokeCount=11;
//
// POSITION is a global convenience enumeration object in gladiatorCore.js:
//
var _horizontalPosition=POSITION.center;
var _verticalPosition =POSITION.center;
//
// ADD SVG:
//
var _svg = new gSVG();
_svg.drawHeader(_width,_height);
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.addContent('');
_svg.drawFooter();
_svg.render(_canvas);
//
// set position based on DIMENSIONS:
//
_canvas.style.width = _width + "px";
_canvas.style.height = _height + "px";
//
// Place in center:
//
_position();
//
// add to DOM:
//
if(parentNode){
parentNode.appendChild(_canvas);
}else{
var bodyRef = document.getElementsByTagName("body").item(0);
bodyRef.appendChild(_canvas);
}
var _rotArray = new Array();
for(var i=0;i<_spokeCount;i++){
_rotArray[i] = document.getElementById("rot"+padWithZeros(i,2));
}
var _index=0;
////////////////////
//
// PRIVATE METHODS
//
////////////////////
//
// position()
//
function _position(){
if( _horizontalPosition > 0 ){
//
// If the horizontal pos. is greater than
// zero (POSITION.center==0), then
// interpret as a fixed position:
//
_canvas.style.left = _horizontalPosition + "px";
}else{
//
// Treat as a symbolic position:
//
switch(_horizontalPosition){
case POSITION.center:
_canvas.style.left = DIMENSIONS.horizontalCenter - 0.5*_width + "px";
break;
case POSITION.left:
_canvas.style.left = _padding + "px";
break;
case POSITION.right:
_canvas.style.left = DIMENSIONS.width - _padding - _width + "px";
break;
}
}
if( _verticalPosition > 0 ){
//
// If the vertical pos. is greater than
// zero (POSITION.center==0), then
// interpret as a fixed position:
//
_canvas.style.top = _verticalPosition + "px";
}else{
//
// Treat as a symbolic position:
//
switch(_verticalPosition){
case POSITION.center:
_canvas.style.top = DIMENSIONS.verticalCenter - 0.5*_height + "px";
break;
case POSITION.top:
_canvas.style.top = _padding + "px";
break;
case POSITION.bottom:
_canvas.style.top = DIMENSIONS.height - _padding - _height + "px";
break;
}
}
}
//
// paint:
//
function _paint(){
// Paint rot spokes:
var i=_index;
_rotArray[i].setAttribute("class","color0");
i++; if(i>=_spokeCount) i=0;
_rotArray[i].setAttribute("class","colorA");
i++; if(i>=_spokeCount) i=0;
_rotArray[i].setAttribute("class","colorB");
i++; if(i>=_spokeCount) i=0;
_rotArray[i].setAttribute("class","colorC");
i++; if(i>=_spokeCount) i=0;
_rotArray[i].setAttribute("class","colorD");
//i++; if(i>=_spokeCount) i=0;
// Increment index:
_index++;
if(_index>=_spokeCount) _index=0;
}
var _intervalId=false;
//
// animate:
//
var _animate=false;
this.animate = function(animateOrNot){
// No state change?
if(animateOrNot == _animate) return;
// Get here if state change:
_animate = animateOrNot;
if(_animate){
_intervalId = window.setInterval(_paint,_animationInterval);
}else{
if(_intervalId) window.clearInterval(_intervalId);
_intervalId=false;
}
}
////////////////////
//
// PUBLIC METHODS
//
////////////////////
var _show;
//
// show:
//
this.show = function(showIt){
// No state change?
if(showIt == _show) return;
// Get here if state change:
_show=showIt;
if(_show){
_canvas.style.display="block";
_self.animate(true);
}else{
_self.animate(false);
_canvas.style.display="none";
}
}
//
// setPosition():
//
// => If horizontal and vertical are symbolic constants
// from the POSITION enumeration object, then the relative position
// is set, possibly using _padding.
// => Otherwise, if horizontal and vertical are numerals greater than
// zero ( POSITION.center == 0 ), then the position is set to a fixed
// position in pixels.
//
this.setPosition = function(horizontal,vertical){
// Set the symbolic positioning:
_horizontalPosition = horizontal;
_verticalPosition = vertical;
// Make it take effect:
_position();
}
//
// setPadding():
//
this.setPadding = function(padding){
_padding = padding;
}
//
// Initially hide from view:
//
_self.show(false);
///////////////////
//
// EVENT HANDLERS:
//
///////////////////
//
// reposition the indicator whenver the window is resized:
//
window.addEventListener("resize",_position,false);
}