<?xml version="1.0" encoding="UTF-8"?>
<Module>      
<ModulePrefs author="Vitaly Yakubovich" author_email="yakubovich.vv@gmail.com" author_location="Murmansk, Russian Federation"
 title="Anime Clock"  description="Welcome to the magical world of Anime! Add 'Anime Clock' to your page iGoogle or Orkut." screenshot="http://hosting.gmodules.com/ig/gadgets/file/102334288166000724935/ggscreenshot.png" thumbnail="http://hosting.gmodules.com/ig/gadgets/file/102334288166000724935/ggthumbnail.png" title_url="http://sites.google.com/site/mysupergadget/" directory_title="Anime Clock" width="230" height="230"> 
<Require feature="setprefs" />  
</ModulePrefs>
<UserPref name="skin_id" datatype="hidden" />

<Content type="html">
<![CDATA[
<!--&nbsp;ALm6fM0dUy+3CyBDJKQgqPeNo5ygjAFPPgAaooCpTWqWdCBne1vsGHx/jwjANLqJ8G6huo/IbgCORLsTxCTrW9oTZ7jOlVKniWNToE6i8DHfbCwoZczQ6lciIbqvTYCODvDAHjOv8ZtM5pnSPnlvIgTWvUxV9lvTsZ2ivjf2+f0LjyxzWbkagQU=&nbsp;-->  
     <script type="text/javascript">
          var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
          document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
     </script>
     <script type="text/javascript">
     try {
          var pageTracker = _gat._getTracker("UA-11100396-3");
          pageTracker._trackPageview();
         } catch(err) {}
    </script>  
    <script TYPE="text/javascript">
    var my_clock;    
    var prefs =  new gadgets.Prefs();    
 
    function Clock() {
    var canvas, my_canvas, colorIndex;
	this.init = function() {
                
   		canvas = document.getElementById("cv");	
                canvas.style.visibility = "visible";	
		my_canvas = canvas.getContext("2d");

                this.loadSettings();  
                this.setLayout();              		
		setInterval('my_clock.repaintClock();',100);		
	}
	this.draw = function() {		 
		my_canvas.save();	
		var now = new Date();
		var sec = now.getSeconds();
		var minute = now.getMinutes();
		var hr  = now.getHours();
		if (hr<=12)
                {
			hr = (hr-12);
		}
		my_canvas.rotate(-(Math.PI/2));	
		//HOURS
		my_canvas.save();
		my_canvas.rotate(hr*(Math.PI/6) + (Math.PI/360)*minute + (Math.PI/21600)*sec);
	        if (colorIndex == 1) 
			my_canvas.strokeStyle = "#ff00ff";
		if ((colorIndex == 2) || (colorIndex == 3))
		    my_canvas.strokeStyle = "#33ff33";
		if (colorIndex == 4) 
			my_canvas.strokeStyle = "#e2ebdd";
		
		my_canvas.lineWidth = 6;
		my_canvas.beginPath();
		my_canvas.moveTo(8,0);
		my_canvas.lineTo(48,0);
		my_canvas.stroke();
		my_canvas.closePath();
		my_canvas.restore();
		//MUNUTES
		my_canvas.save();
		my_canvas.rotate( (Math.PI/30)*minute + (Math.PI/1800)*sec);
	        if (colorIndex == 1)
		    my_canvas.strokeStyle = "#ff33ff";
		if ((colorIndex == 2) || (colorIndex == 3))
			my_canvas.strokeStyle = "#00ff00";
		if (colorIndex == 4) 
			my_canvas.strokeStyle = "white";
		my_canvas.lineWidth = 5;
		my_canvas.beginPath();
		my_canvas.moveTo(7,0);
		my_canvas.lineTo(64,0);
		my_canvas.stroke();
		my_canvas.closePath();
		my_canvas.restore();		
		//SECOND
		my_canvas.save();
		my_canvas.rotate(sec * Math.PI/30);
		my_canvas.strokeStyle = "white";
		my_canvas.lineWidth = 2;
		my_canvas.beginPath();
		my_canvas.moveTo(7,0);
		my_canvas.lineTo(75,0);
		my_canvas.stroke();
		my_canvas.closePath();	
		my_canvas.restore();		
		my_canvas.restore();
	}	
	this.repaintClock = function() {
	    my_canvas.save();
	    my_canvas.clearRect(0,0,200,196);
	    my_canvas.translate(101,97);
	    my_clock.draw();
	    my_canvas.restore();
    }
	this.setLayout = function() {
	    var x = document.getElementById("my_table").offsetLeft;	
	    var y = document.getElementById("my_table").offsetWidth;
	    var new_x = x+(y-canvas.offsetWidth)/2;
	    var new_x_poz = new_x +"px";
	    canvas.style.top =  "8px";
	    canvas.style.left =  new_x_poz;
	    canvas.style.visibility = "visible";

	}
	this.my_onclick = function() {
          
		colorIndex = colorIndex +1;
		if (colorIndex == 5)
		colorIndex = 1;
                prefs.set("skin_id",colorIndex);
		this.loadSettings();
 	}	
	this.loadSettings = function() {		
  	        colorIndex = prefs.getInt("skin_id");
        	if (colorIndex==0)
  		  colorIndex = 1;
 		var my_url = "http://hosting.gmodules.com/ig/gadgets/file/102334288166000724935/sm38-1_"+colorIndex+".jpg";
		canvas.style.backgroundImage = 'url('+my_url+')';      
	}
}
function setupAnimation() 
{	
	var my_doc = document.getElementById("cv");
	if (my_doc.getContext) {
		my_clock = new Clock();
		my_clock.init();				
	} 
	else {
		setTimeout('setupAnimation() ',200);		
	}				
}
</script>
<style type="text/css">
	body,html {
		margin: 0;
		padding: 0;
	}
</style>

<center>
  <table id="my_table" border="0" cellpadding="0" width="220" height="200" cellspacing="0">
    <tr height="200" style="height:200px;">
	<td id="anchor1" width="220" height="200" colspan="2">
          <div  style="height:8px">
               </div>
          <canvas  id="cv" style="border-style:ridge; visibility:hidden; position:absolute; top:0px; left:0px;"  width="200" height="196">
          </canvas>
        </td>
    </tr> 
    <tr style="height:26px;">
        <td width="220" align="center">
          <table border="0" cellpadding="0" cellspacing="0">
            <tr> 
               <td>   
               <center>
               <div style="height:14px"> </div>
               <div title="Click!" onmouseover='javascript:style.backgroundImage = "url(http://hosting.gmodules.com/ig/gadgets/file/102334288166000724935/button2_1.jpg)"'  onmouseout='javascript:style.backgroundImage = "url(http://hosting.gmodules.com/ig/gadgets/file/102334288166000724935/button1_1.jpg)"'  onclick="my_clock.my_onclick()" style="background:url(http://hosting.gmodules.com/ig/gadgets/file/102334288166000724935/button1_1.jpg); border-style:none; width:160px; height:16px;">   
	       </div>               
                 
            </center>                
           </td>
	    </tr>
 	  </table>
	</td>
   </tr>                      
  </table>
            
<!-- Load clock -->
<div style="width:220px;">
<script type="text/javascript" >
_IG_RegisterOnloadHandler(function() {			
				setupAnimation();
			             }
		         );
</script>
</div>
</center>      
]]>
</Content>
</Module> 


