<!--
//---------------------------------------------

//  THIS CODE IS NOT APPROVED FOR USE IN/ON ANY OTHER UI ELEMENT OR PRODUCT COMPONENT.

//  Copyright (c) 2006 Microsoft Corporation.  All rights reserved.

// ----------------------------------------------
-->
<html dir=ltr xmlns:v>
<head>
<META HTTP-EQUIV="MSThemeCompatible" CONTENT="yes">
<title>Timer Gadget</title>
 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<style>
body{margin:0;border:none;width:90;height:111;cursor:default;font-family: 'Times New Roman'}
v\:*{behavior:url(#default#vml);position:absolute}
</style>
</head>

<body dir=ltr scroll=no  onload="onLoad();" UNSELECTABLE="on">
<g:background id="backg" src="assets/images/timer_small_bg.png" style="position:absolute;top:0;left:0;" />

<div  UNSELECTABLE="on" id=ph style="position:absolute">
    <v:oval id=secs p00=196 p60=347 style="width:180;height:180;left:-48;top:-152;rotation:270" stroked="f" strokecolor="silver" fillcolor="black">
        <v:path textpathok="t"/>
        <v:textpath id="secsText" on="false" string="" style="font:bold 8pt;v-text-align:left" />
    </v:oval>
    <v:oval id=mins p00=217 p60=576.5 style="width:260;height:260;left:-90;top:-200;rotation:90" strokecolor="gray" fillcolor="black">
        <v:path textpathok="t"/>
        <v:fill  opacity="0.75"/>
        <v:textpath id="minsText" on="false" string="" style="font:bold 16pt verdana;xv-text-align:letter-justify"  fitpath="t"/>
    </v:oval>
</div>
<img id=iMask  UNSELECTABLE="on" src="assets/images/timer_small_mask.gif" style="position:absolute;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='assets/images/timer_small_mask.png')"/>

<table id=tHots style="width:90;table-layout:fixed;position:absolute"  UNSELECTABLE="on" cellpadding cellspacing>
    <tr height=19><td  UNSELECTABLE="on">&nbsp;</td></tr>
    <tr height=14><td style="cursor:url(assets/images/arrow_left.cur)" onmousedown="wind(secs)">&nbsp;</td></tr>
    <tr height=11><td  UNSELECTABLE="on">&nbsp;</td></tr>
    <tr height=26><td  UNSELECTABLE="on" style="cursor:url(assets/images/arrow_left.cur)" onmousedown="wind(mins)">&nbsp;</td></tr>
    <tr height=8><td  UNSELECTABLE="on">&nbsp;</td></tr>

    <tr height=30><td align=center valign=top UNSELECTABLE="on"><span style="cursor:hand;font-size:7pt" onmousedown="reset()" UNSELECTABLE="on">&nbsp;&nbsp;&nbsp;&nbsp;</span></td></tr>
</table>
</body>

<script>

var L_SECONDS_ENUMERATION = "55...00...05...10...15...20...25...30...35...40...45...50...55...00...05";
var L_MINUTES_ENUMERATION = "55 • 00 • 05 • 10 • 15 • 20 • 25 • 30 • 35 • 40 • 45 • 50 • ";


var tmEnd=null;
var tiUnwind=null;
var tiDone=null;
var mulm=0.45;
var sw1 = false;
var wmp = null;
var selectedSound = "tada.wav";

setTimeout(reset,250);

function onLoad()
{
    wmp = new wmpClass();
    secsText.string = L_SECONDS_ENUMERATION;
    minsText.string = L_MINUTES_ENUMERATION;
    secsText.on = true;
    minsText.on = true;
    System.Gadget.settingsUI = "settings.html";
    System.Gadget.onSettingsClosed = SettingsClosed;
}

function wind(o)
{
    var dx=event.x,dr=o.rotation;
    o.setCapture();
    clearInterval(tiUnwind);
    sound();
    o.onmousemove=function(){
        o.rotation=dr-(event.x-dx)*mulm;
        if(o.rotation<o.p00)
            o.rotation=o.p00;
        else if(o.rotation>o.p60)
            o.rotation=o.p60;
        else{
            sound("wind"+o.id);
            if(o==secs)
                pos(mins,val(mins)+val(secs)/60);
        }
    }
    o.onmouseup=function(){
        o.releaseCapture();
        o.onmousemove=null;
        var w=val(mins)*60+val(secs);
        if(w>0){
            tmEnd=new Date().valueOf()+w*1000;
            tiUnwind=setTimeout(unwind);
        }else
            reset();
    }
}
function unwind(){
    var tm=(tmEnd-new Date().valueOf())/1000,
        ps=tm%60,pm=(tm/60)%100;
    if(tm>0){
        pos(secs,ps);
        pos(mins,pm);
        tiUnwind=setTimeout(unwind,100)
    }else{
        pos(secs,0);
        pos(mins,0);
        sound(selectedSound,0,stopFlash);
        tiDone=setInterval(flash,200);

    }
}
function flash(){
    with(ph.style)
        display=display==""?"none":"";
}
function stopFlash(){
    clearInterval(tiDone);
    ph.style.display="";

}

function reset()
{
    if (event)
    {
        if (event.button == 2)
        {
            return ;
        }
    }
    sound();

    clearTimeout(tiUnwind);
    if(notZero(secs)|notZero(mins))
    {
        setTimeout(reset);
    }
}

function notZero(o)
{
    var d=(parseFloat(o.p00)-parseFloat(o.rotation));
    return Math.abs(d)<2?pos(o,0):o.rotation+=d/10;
}

function pos(o,val)
{
    o.rotation=parseFloat(o.p00)+(o.p60-o.p00)/60*val;
}
function val(o)
{
    return parseInt((o.rotation-parseFloat(o.p00))*60/(o.p60-o.p00));
}
function sound(s,delay,onStop)
{
      if(s==selectedSound)
      {
            System.Sound.playSound(selectedSound);
            sw1 = true;

      }

    if(s==null)
    {
            if (sw1)
            {
                  sw1 = false;
                  stopAlarm();
            }
        return;
    }

    if (s.indexOf(".")==-1)
    {
            s= "assets\\media\\"+s+".wav";
      }

    if(s==wmp.lastUrl)
    {
           // wmp.controls.play();
           wmp.play(s);
           sw1 = true;

    }
    else
    {
        wmp.url=s;
        wmp.lastUrl=s;
    }

}


function wmpClass()
{
      this.lastUrl = "";
      this.url = "";

      this.stop = function()
      {
          System.Sound.playSound("");
      }

      this.play = function(s)
      {
          System.Sound.playSound(s);
      }
}

function stopAlarm()
{
          stopFlash();
          wmp.stop();
}

function SettingsClosed() 
{
  selectedSound = System.Gadget.Settings.read("selectedSound");
}

</script>

</html>