<?xml version="1.0" encoding="UTF-8" ?>
<Module>
  <ModulePrefs author="LabPixies" author_email="labpixie.gadgets+hangman+201101171@gmail.com"
    description="__MSG_desc__"
    screenshot="http://cdn.labpixies.com/campaigns/hangman/images/screenshot.jpg"
    title="__MSG_title__" title_url="http://www.labpixies.com"
    thumbnail="http://cdn.labpixies.com/campaigns/hangman/images/thumbnail.jpg"
    height="196" render_inline="never">
    <Locale messages="http://www.labpixies.com/campaigns/hangman/i19/all_all.xml" />
    <Locale lang="es"
      messages="http://www.labpixies.com/campaigns/hangman/i19/es_all.xml" />
    <Locale lang="de"
      messages="http://www.labpixies.com/campaigns/hangman/i19/de_all.xml" />
    <Locale lang="fr"
      messages="http://www.labpixies.com/campaigns/hangman/i19/fr_all.xml" />
    <Locale lang="it"
      messages="http://www.labpixies.com/campaigns/hangman/i19/it_all.xml" />
    <Locale lang="ja"
      messages="http://www.labpixies.com/campaigns/hangman/i19/ja_all.xml" />
    <Locale lang="nl"
      messages="http://www.labpixies.com/campaigns/hangman/i19/nl_all.xml" />
    <Locale lang="pl"
      messages="http://www.labpixies.com/campaigns/hangman/i19/pl_all.xml" />
    <Locale lang="pt-PT"
      messages="http://www.labpixies.com/campaigns/hangman/i19/pt_all.xml" />
    <Locale lang="pt-BR"
      messages="http://www.labpixies.com/campaigns/hangman/i19/pt_all.xml" />
    <Locale lang="zh-CN"
      messages="http://www.labpixies.com/campaigns/hangman/i19/zh_cn_all.xml" />
    <Require feature="setprefs" />
  </ModulePrefs>
  <UserPref name="skin" datatype="hidden" default_value="" />

  <Content type="html">
<![CDATA[
<!--
  Hangman  Gadget
  Design & Code: LabPixies
  All subsequent code and resources used are proprietary of LabPixies unless directly stated otherwise.
  Copyright (C) 2008 LabPixies.
  www.labpixies.com

  This work is licensed under the Creative Commons Attribution-NonCommercial-NoDerivs 2.5 License.
  To view a copy of this license, visit http://creativecommons.org/licenses/by-nc-nd/2.5/ or
  send a letter to Creative Commons, 543 Howard Street, 5th Floor, San Francisco, California, 94105, USA.
-->
<title>Hangman</title>
<style type="text/css">
.style1{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
  color: #5e773f;
}
.style2 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  color: #FFFFFF;
}
.style3 {
  color: #d76692;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
}
.style4 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: #FFFFFF;
  text-transform: uppercase;
  xbackground-color:#cccccc;
  border:0px;
  width:13px;
  line-height:15px;
  text-valign:center;
  background:transparent;
}
.style5 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  color: #608e94;
  font-weight: bold;
  line-height: 12px;
}
.topcategory {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: bold;
  color: #FFFFFF;
  background-color: #e22974;
  border-width: 1px;
  border-style:solid;
  border-color:#FFFFFF;
}
.bottomcategory0 {
  color: #e22974;
  background-color: #FFFFFF;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-right-color: #e22974;
  border-bottom-color: #e22974;
  border-left-color: #e22974;
}
.bottomcategory1{
  background-color: #FFFFFF;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-right-color: #dc4a20;
  border-bottom-color: #dc4a20;
  border-left-color: #dc4a20;
}
.bottomcategory2{
  background-color: #FFFFFF;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-right-color: #006cb3;
  border-bottom-color: #006cb3;
  border-left-color: #006cb3;
}
.bottomcategory3{
  background-color: #FFFFFF;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-right-style: solid;
  border-bottom-style: solid;
  border-left-style: solid;
  border-right-color: #7e9d1e;
  border-bottom-color: #7e9d1e;
  border-left-color: #7e9d1e;
}
.style10_0 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #e22974; }
.style10roll_0 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  background-color: #e22974;
}
.style10_1 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #dc4a20; }
.style10roll_1 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  background-color: #dc4a20;
}
.style10_2 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #006cb3; }
.style10roll_2 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  background-color: #006cb3;
}
.style10_3 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: #7e9d1e; }
.style10roll_3{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #FFFFFF;
  background-color: #7e9d1e;
}
.endscreenbackground {
  background-color: #FFFFFF;
  border: 1px solid #e22974;
}
.style11 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  color: #e22974;
}
.style12 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-weight: bold;
  color: #000000;
}
.style13 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  color: #666666;
}
.menu {
    border-width: 1px;
    border-style: solid;
    font-size: 12px;
    font-weight: normal;
    line-height: 9px;
    padding: 0px 2px 1px 2px;
    font-family: Arial, Helvetica, sans-serif;
    cursor: pointer;
    color: #e22974;
}
.style0{
  font-size: 1px;
}
.openmessage1{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
  color: #5e773f;
}
.openmessage2{
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  color: #5e773f;
}
A:link{text-decoration : none}
A:Visited{text-decoration : none}
A:Active{text-decoration : none}

</style>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<!--[if IE 6]>
<script type="text/javascript">
  try {//IE fix, causes it to automatically cache background image
    document.execCommand("BackgroundImageCache", false, true);
  }
  catch(e){
  }
</script>
<![endif]-->
<script type="text/javascript">
  var $lp=jQuery.noConflict();
  var _gadgetID=61;

  var prefs = new gadgets.Prefs();
  var IMAGES_BASE = 'http://cdn.labpixies.com/campaigns/hangman/';

  var g_category="cat_0";
  var g_skin=2;
  var str_list;
  var num_in_list;
  var g_str="";
  var str_len="";
  var usr_str;
  var wrong_num=0;
  var errors;   //errors Array
  var used_letters;
  var tries_num;
  var is_finished=true;
  var is_loss="";
  var menu_enable=true;
  var first_game=true;
  var url = "";
  var is_hint;
  var g_is_jason_finished = 0;
  var used_hint;

  //preload image
  var img_0 = new Image();

  //Arrays holding colors to be used when switching skin  [pink,orange,blue,green]
  var usr_str_colors=['#5e773f','#30691f','#594b40','#000000'];
  var menu_items_reg_colors=['#FFFFFF','#cfebc0','#FFFFFF','#494949'];
  var menu_items_roll_colors=['#5e773f','#214916','#0a6100','#dc4a20'];
  var titles_colors=['#d76692','#afe3f4','#5f7d95','#6b8300'];
  var letter_colors=['#FFFFFF','#FFFFFF','#FFFFFF','#52504f'];
  var categories_colors=['#e22974','#dc4a20','#006cb3','#7e9d1e'];
  var wrong_colors=['#608e94','#2e7289','#5f7d95','#6a6765'];
  var finish_colors=['#e22974','#dc4a20','#006cb3','#7e9d1e'];

  function lp_getAbsoluteTop(el)
  {
    return $lp('#'+el).offset().top;
  }

  function lp_getAbsoluteLeft(el)
  {
    return $lp('#'+el).offset().left;
  }

  function get_image(src)
  {
    return gadgets.io.getProxyUrl(IMAGES_BASE + src);
  }

  function load_images()
  {
   $lp('.transparent').attr('src',get_image('images/transparent.gif'));

   $lp('#flickr').attr('src',get_image('images/end_logos/flickr.gif'));
   $lp('#amazon').attr('src',get_image('images/end_logos/amazon.gif'));
   $lp('#ebay').attr('src',get_image('images/end_logos/ebay.gif'));
   $lp('#google').attr('src',get_image('images/end_logos/google.gif'));
   $lp('#imdb').attr('src',get_image('images/end_logos/imdb.gif'));
   $lp('#youtube').attr('src',get_image('images/end_logos/youtube.gif'));
  }

  function init(){

    //get saved skin from prefs
    if (prefs.getString('skin').length > 0 ) {
      g_skin = gadgets.util.unescapeString(prefs.getString('skin'))*1;
    }
    else{
      g_skin = 2;
    }
    setSkin();
    load_images();

    //setting and displaying openning title
    document.getElementById("openning_title").style.top=lp_getAbsoluteTop("main_table")+111+"px";
    document.getElementById("openning_title").style.left=lp_getAbsoluteLeft("main_table")+8+"px";
    document.getElementById("openning_title").style.display="";

    document.onkeyup=onKeyHandle;
    window.onresize=adjustPos;
    setRandomCategory();
  }

  //adjusting boxes position on window resizing
  function adjustPos(){
    document.getElementById("openning_title").style.top=lp_getAbsoluteTop("main_table")+111+"px";
    document.getElementById("openning_title").style.left=lp_getAbsoluteLeft("main_table")+8+"px";
    document.getElementById("categories_box").style.top=lp_getAbsoluteTop("main_table")+14+"px";
    document.getElementById("categories_box").style.left=lp_getAbsoluteLeft("main_table")+14+"px";
    document.getElementById("game_finished_box").style.top=lp_getAbsoluteTop("main_table")+11+"px";
    document.getElementById("game_finished_box").style.left=lp_getAbsoluteLeft("main_table")+72+"px";
  }

  // Getting the category strings with the js file url
  function getJson(url){

    var c=document.getElementsByTagName("head")[0];
    var d=document.createElement("script");
    d.type="text/javascript";
    d.charset="utf-8";
    d.defer="defer";
    d.src=url;
    var f=function(){
      var j=d.parentNode;
      j.removeChild(d);
      delete d;
    };
    var g=function(j){
      var s=(j?j:window.event).target?(j?j:window.event).target:(j?j:window.event).srcElement;
      if(s.readyState=="loaded"||s.readyState=="complete"){
        f();
        return;
      }
    };
    if(navigator.product=="Gecko"){
      d.onload=f;
    }else{
      d.onreadystatechange=g;
    }
    c.appendChild(d)
  }


   //Invokes when a loading a new category js, insert the strings to the str_list
  function callbackfunc(result) {

    if (!result)
      return;
    str_list = result;

    g_is_jason_finished = 1;
  }


   //Setting a new game
  function new_game(){
    if (!menu_enable || (str_list==null)) return;

    //If this is the first game played then need to choose a random category
    if (first_game){
      document.getElementById("openning_title").style.display = "none";
      first_game=false;
    }

    //Choosing randomely a new str
    num_in_list=str_list.length;
    var chosen=(Math.floor(Math.random()*num_in_list));
    g_str=str_list[chosen];
    str_len=g_str.length;
    //Setting the number of wrongs and tries to zero
    wrong_num=0;
    tries_num=0;
    is_finished=false;
    menu_enable=true;
    is_loss=false;
    is_hint=false;
    used_hint=false;

    //Clearing the relevant arrays
    usr_str=new Array(22);
    errors=new Array(10);
    used_letters=new Array(26);

    //clearing the wrong letters pyramid
    for (j=1;j<11;j++){
      document.getElementById("wrong_"+j).innerHTML='&nbsp;';
    }

    //Setting the usr_str with _ or spaces at the right places.
    for (i=0;i<g_str.length;i++){
      if (g_str.charAt(i)==' ') usr_str[i]='&nbsp;';
      else usr_str[i]='<u>&nbsp;&nbsp;</u>';
    }

    //invokes the displayStr function to display the usr_str on the screen, setting the backgroun and the hangman to the initial state
    displayStr();
    document.getElementById("main_table").style.background='url('+gadgets.io.getProxyUrl('http://cdn.labpixies.com/campaigns/hangman/images/'+g_skin+'/background.gif')+')';
    document.getElementById("pixie").src=get_image('images/transparent.gif');

    //nir - show input
    document.getElementById("td_input").innerHTML = '<input type="text" id="letterInput" class="style4"  maxlength="1" size="1" value="" />';
    document.getElementById("letterInput").style.color=letter_colors[g_skin];
    document.getElementById("letterInput").focus();

    //set focus
    document.getElementById("letterInput").focus();
  }


   // Chooses and sets a random category
  function setRandomCategory(){
    var catStr="";
    var randomCat=(Math.floor(Math.random()*8));
    changeCategories(randomCat);
    saveCategory();
    if (g_category=="cat_0") catStr="__MSG_cat_movie__";
    if (g_category=="cat_1") catStr="__MSG_cat_books__";
    if (g_category=="cat_2") catStr="__MSG_cat_celebs__";
    if (g_category=="cat_3") catStr="__MSG_cat_athleets__";
    if (g_category=="cat_4") catStr="__MSG_cat_box__";
    if (g_category=="cat_5") catStr="__MSG_cat_time__";
    if (g_category=="cat_6") catStr="__MSG_cat_tv__";
    if (g_category=="cat_7") catStr="__MSG_cat_countries__";
    //alert("this is the category "+catStr);

    document.getElementById("category_dec").innerHTML='__MSG_curr_category__ '+catStr;
  }

   // Opens  the categories/finish box (by id)
  function openBox(box_id){

    //setting boxes place on the screen
    document.getElementById("categories_box").style.top=lp_getAbsoluteTop("main_table")+14+"px";
    document.getElementById("categories_box").style.left=lp_getAbsoluteLeft("main_table")+14+"px";
    document.getElementById("game_finished_box").style.top=lp_getAbsoluteTop("main_table")+11+"px";
    document.getElementById("game_finished_box").style.left=lp_getAbsoluteLeft("main_table")+72+"px";

    //checking if menu is enabled and its not the special case of finish box that need to be opened by itself
    if (!menu_enable && box_id!='game_finished') return;
    if (first_game) document.getElementById("openning_title").style.display = "none";
        document.getElementById(box_id+"_box").style.display = "";
    menu_enable = false;
    }

   // Closes the categories/finish box (by id)
  function closeBox(box_id){
    document.getElementById(box_id+"_box").style.display = "none";
    menu_enable = true;

    //nir - show input
    document.getElementById("td_input").innerHTML = '<input type="text" id="letterInput" class="style4"  maxlength="1" size="1" value="" />';
  }


  //Displays the hint on the screen and makes all the operations needed when the user choose to take a hint (increase the wrong number, changing the hangman display etc)
  function showHint(){
    //The hint option is available only when the game is not finished
    if (is_finished || !menu_enable || used_hint) return;

    //We are currently giving a hint, if the game will be over we want to know that it was a hint
    is_hint=true;

    //getting a random hint
    var hint=findHint();
    //raising a flag-->only one hint per game
    used_hint=true;
    //Hint was found, increasing the wrong number and number of tries, inserting the  hint to the used letters array, refreshing the current state and the usr_str
    wrong_num++
    document.getElementById("wrong_"+wrong_num).innerHTML='*';
    used_letters[tries_num]=hint;
    tries_num++;
    isMatch(hint);   //to add it and display the str and check for win
    showPixie();

    //Special case, needs to check if the hint cause to losing the game
    isLoss();

    is_hint=false;
  }


  // Seacrh for a random available hint in the string
  function findHint(){
    var hint_found;
    var hint_index;

    //While a hint was not found
    while (!hint_found) {
      hint_found=true;

      //Searching for a possible random hint
      hint_index=(Math.floor(Math.random()*(str_len)));

        //if the found hint is a space then searching again
        if (g_str.charAt(hint_index)==' ') {
          hint_found=false;
        }
        //Checking if the hint is already inserted by the user, if it was-searching for a new hint
        for (j=0;j<tries_num;j++){
          if (g_str.charAt(hint_index)==used_letters[j]){
            hint_found=false;
          }
        }
    }
    return g_str.charAt(hint_index);
  }



  // Changes the current category
  function changeCategories(id){
    document.getElementById(g_category).className = "style10_"+g_skin;
    g_category=("cat_"+id);
    document.getElementById(g_category).className = "style10roll_"+g_skin;
  }


    // Saving the new category and starting a new game.
  function saveCategory(){
    //getting the strings
    url = "http://cdn.labpixies.com/campaigns/hangman/"+g_category+".js"; //the full url to the website

    g_is_jason_finished = 0;
    getJson(url);
    closeBox('categories');

    wait_for_jason();
  }

  //wating till jason is loaded
  function wait_for_jason(){

    if(g_is_jason_finished==0){
      setTimeout(wait_for_jason,500);
    }
    else{
      if (document.getElementById("openning_title").style.display=="none")
        new_game();
    }
  }


  //  Displays the user's string on the screen
  function displayStr(){
    var str_display="";
    //Going throught the usr_str array and buliding the HTML code to represent the current ust_str on the screen.
    for (var i=0;i<str_len;i++){
      str_display = str_display + "<td width='9' align='center' class='style1'>" + usr_str[i] + "</td>";
    }
    document.getElementById("str_td").innerHTML='<table><tr>' + str_display +'</tr></table>';
  }


  //  handling user's keyboard input
  function onKeyHandle(e){
    if (first_game || is_finished) return;
    var keynum;
    if(!e)
      var e=window.event;
    if(e.keyCode){
      keynum=e.keyCode; //safari
    }
    else if(e.which){    //firefox
      keynum = e.which;
    }

    //getting the user's input
    var letter=document.getElementById("letterInput").value;

    //Making sure the character is a valid letter and wasn't inserted before
    if(letter!="" && ((letter>='a' && letter<='z') || (letter>='A' && letter<='Z'))){

      letter=letter.toUpperCase();

      if(keynum == 13){   //if key is enter
        if (!isUsed(letter)){
          //inserts the letter to the used letters array and checks to see if there is a match with the str
          used_letters[tries_num]=letter;
          tries_num++;
          isMatch(letter);
          //clearing the input box (preparing for next guess
          if (!is_finished) document.getElementById("letterInput").value="";
          return false;
        }
        else {
          document.getElementById("letterInput").value="";
        }
      }
    }
    //If the letter isn't valid, clearing the input box immediately
    else{
      document.getElementById("letterInput").value="";
    }
    e.stoppropagation?e.stoppropagation():e.cancelBubble=true;return false;
  }



  // Checks if the user hadn't tried the given letter before
  function isUsed(letter){

    //Checking if the letter is already in the used_letters list
    for (var i=0;i<tries_num;i++){
      if (letter==used_letters[i]){
        return true;
      }
    }
    return false;
  }


  //Searching for the letter withing the expression
  function isMatch(letter){
    var is_wrong=true;

    //going throught the string and searching for the given letter, if it was found, changing is_wrong to false (the user was right)
    for (var i=0;i<str_len;i++){
      if (g_str.charAt(i)==letter){
        usr_str[i]=letter;
        is_wrong=false;
      }
    }

    //Wrong
    if (is_wrong==true){
      errors[wrong_num]=letter;
      wrong_num++;
      document.getElementById("wrong_"+wrong_num).innerHTML=letter;
      showPixie();
      isLoss();
    }
    //Right
    else{
      displayStr();
      //the if takes care of a special case when user lost when getting a hint that solved the str
      if (wrong_num!=10) isWin();
    }
  }

  //shows the next stage of the pixie
  function showPixie(){
    document.getElementById("pixie").src=get_image('images/'+g_skin+'/0'+wrong_num+'.gif');
  }

  //Checking if the user lose the game
  function isLoss(){
    //If the user did guessed 10 characters wrong then the game is over.
    if(wrong_num==10){
      menu_enable = false;
      is_finished=true;
      is_loss=true;
      //makes a delay before opening the finish box, in order to let the final gif time to be shown
      setTimeout('openFinishBox("loss")', 2500);
      //openFinishBox("loss");
      return true;
    }
    //set focus
    if(document.getElementById("letterInput"))
      document.getElementById("letterInput").focus();
  }


  //Checking if the user won the game
  function isWin(){

    var is_matching;

    //Checking to see if all the str character where inserted by the user
    //going through all the string letters and check if they appear in the usr used_letters
    for (var i=0; i<str_len; i++){

      //skeeping str spaces
      if (g_str.charAt(i)!=' '){
        is_matching=false;

        //going through the user's input and searching for a match
        for (var j=0; j<tries_num; j++){
          if (g_str.charAt(i)==used_letters[j]){
            is_matching=true;
          }
        }
        //if is_matching still false then the game isn't finish (there is at least one character in the string that the user didn't insert)
        if (is_matching==false) {
          //set focus
          document.getElementById("letterInput").focus();
          return;
        }
      }
    }
    //if we got till here then the user inserted all the str characters and won the game
    openFinishBox("win");
    is_finished=true;
  }


  // Opens the finish box and setting its values
  function openFinishBox(result){

    //nir - hide cursor
    document.getElementById("td_input").innerHTML = "&nbsp;";

    //Setting the title according to the game state (loss/win)
    if (result=="win") document.getElementById("finish_title").innerHTML="__MSG_very_nice__";
    else document.getElementById("finish_title").innerHTML="__MSG_answer__";

    //Setting the answer to the current string
    document.getElementById("reveal_str").innerHTML=g_str;

    //Setting the search links to the current string
    setSearchLinks();

    //opening the finish box
    openBox('game_finished');

  }


  // Setting the different search link to the current string
  function setSearchLinks () {
    var currLink="";
    //replacing spaces with + in str
    var strAsParam=g_str.replace(/ /, "+");

    //setting flickr link
    currLink='http://www.flickr.com/search/?q='+strAsParam;
    document.getElementById("flickr_link").href=currLink;

    //setting  amazon link
    currLink='http://www.amazon.com/s/ref=nb_ss_gw/103-6119297-6066227?url=search-alias%3Daps&field-keywords='+strAsParam;
    document.getElementById("amazon_link").href=currLink;

    //setting  ebay link
    currLink='http://search.ebay.com/search/search.dll?from=R40&_trksid=m37&satitle='+strAsParam+'&category0=';
    document.getElementById("ebay_link").href=currLink;

    //setting  google link
    currLink='http://www.google.com/search?hl=en&q='+strAsParam+'&btnG=Google+Search';
    document.getElementById("google_link").href=currLink;

    //setting  imdb link
    currLink='http://www.imdb.com/find?s=all&q='+strAsParam+'&x=0&y=0';
    document.getElementById("imdb_link").href=currLink;

    //setting youTube link
    currLink='http://www.youtube.com/results?search_query='+strAsParam+'&search=Search';
    document.getElementById("youtube_link").href=currLink;
  }

  // Changing the skin
  function changeSkin() {
    //If the game is finished and the user lost we don't want to allow changing skin because it will cause to the gidd animation.
    if(!menu_enable) return;

    if (is_finished && !first_game) {
      new_game();
      changeSkin();
      return;
    }

    //setting the skin to be the next skin
    g_skin=(g_skin+1)%4;

    setSkin();
  }

  function setSkin(){

    //setting back image and usr_str style
    document.getElementById("main_table").style.background='url('+gadgets.io.getProxyUrl('http://cdn.labpixies.com/campaigns/hangman/images/'+g_skin+'/background.gif')+')';
    document.getElementById("str_td").style.color=usr_str_colors[g_skin];
    //No mistakes so far=no pixie display=no need to change
    if(wrong_num!=0) showPixie();
    //Setting wrong and enter letter titles style
    document.getElementById("wrong_lbl").style.color=titles_colors[g_skin];
    document.getElementById("enter_lbl").style.color=titles_colors[g_skin];

    //setting menu items style
    document.getElementById("newgame_lbl").style.color=menu_items_reg_colors[g_skin];
    document.getElementById("hint_lbl").style.color=menu_items_reg_colors[g_skin];
    document.getElementById("skin_lbl").style.color=menu_items_reg_colors[g_skin];
    document.getElementById("categories_lbl").style.color=menu_items_reg_colors[g_skin];

    //changing openning style
    document.getElementById("click_title").style.color=usr_str_colors[g_skin];
    document.getElementById("category_dec").style.color=usr_str_colors[g_skin];

    //Setting input style
    document.getElementById("letterInput").style.color=letter_colors[g_skin];

    //Setting Wrong style
    for (var i=1; i<11; i++){
      document.getElementById("wrong_"+i).style.color=wrong_colors[g_skin];
    }

    //setting categories box style
    for (var i=0; i<8; i++){
      document.getElementById("cat_"+i).className="style10_"+g_skin;
      document.getElementById("star_"+i).className="style10_"+g_skin;
    }
    document.getElementById(g_category).className = "style10roll_"+g_skin;
    document.getElementById("categories_save").style.color=categories_colors[g_skin];
    document.getElementById("top_category").style.background=categories_colors[g_skin];
    document.getElementById("bottom_category").className='bottomcategory'+g_skin;

    //Setting finish box style
    document.getElementById("end_box").style.borderColor=finish_colors[g_skin];
    document.getElementById("finish_title").style.color=finish_colors[g_skin];
    document.getElementById("finish_close").style.color=finish_colors[g_skin];

    //set focus
    document.getElementById("letterInput").focus();

    //save current skin to prefs
    prefs.set("skin",g_skin+'');

    //preload for the last image
    img_0.src= 'images/'+g_skin+'/010.gif';

  }


  // Handles mouse over menu item
  function g_mouseOver(id){
    if (id=='hint' && used_hint) {
      document.getElementById("hint_lbl").innerHTML='used ';
      document.getElementById("hint_lbl").style.color='#FF0000';
    }
    else document.getElementById(id+"_lbl").style.color=menu_items_roll_colors[g_skin];
  }


  //Handles mouse out menu item
  function g_mouseOut(id){
    if (id=='hint'){
      document.getElementById("hint_lbl").innerHTML='__MSG_hint__ ';
      document.getElementById("hint_lbl").style.color=menu_items_reg_colors[g_skin];
    }
    document.getElementById(id+"_lbl").style.color=menu_items_reg_colors[g_skin];
  }

</script>

<center>
  <div style='height:10px;font-size:1px;'></div>
  <table valign="top" id="main_table" style="width:280px;" height="160" border="0" cellpadding="0" cellspacing="0" >
    <tr>
      <td colspan="3" style="width:280px; height:5px; font-size:1px; line-height:1px;"></td>
    </tr>
    <tr height="149">
      <td style="width:5px; font-size:1px; line-height:1px;"></td>
      <td style="height:149px; width:265px;" align="left" valign="top">
        <table width="265" height="149" cellpadding="0" cellspacing="0">
          <tr>
            <td height="109">
              <table width="265" height="109" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="129"><img id="pixie" class="transparent" width="129" height="109" border="0" alt="pixie"/></td>
                  <td width="72" height="109" valign="top">
                    <table height="109" width="72" border="0" cellspacing="0" cellpadding="0">
                      <tr>
                        <td class="style3" id="enter_lbl" style="height:20px;">__MSG_enter_letter__</td>
                      </tr>
                      <tr><td style="height:30px; font-size:1px; line-height:1px;"></td></tr>
                      <tr>
                        <td style="height:19px;" align="center" valign="top">
                          <table width="72" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                              <td style="width:19px; font-size:1px; line-height:1px;"></td>
                              <td id="td_input" style="height:19px; width:13px;">
                                <input type="text" id="letterInput" class="style4" maxlength="1" size="1" value="" />
                              </td>
                              <td style="width:40px; font-size:1px; line-height:1px;"></td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                      <tr><td height="40" class="style0">&nbsp;</td></tr>
                    </table>
                  </td>
                  <td width="69">
                    <table width="69" border="0" cellspacing="0" cellpadding="0">
                      <tr>
                        <td height="20" id="wrong_lbl" align="center" class="style3">__MSG_wrong__</td>
                      </tr>
                      <tr>
                        <td height="89">
                          <table width="69" height="89" border="0" cellpadding="0" cellspacing="0">
                            <tr>
                              <td height="12">
                                <table width="69" height="12" border="0" cellpadding="0" cellspacing="0">
                                  <tr width="69" height="12">
                                    <td align="center" width="18" height="12" class="style5" id="wrong_1">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5" id="wrong_2">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5" id="wrong_3">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5" id="wrong_4">&nbsp;</td>
                                  </tr>
                                </table>
                              </td>
                            </tr>
                            <tr>
                              <td height="12">
                                <table width="69" height="12" border="0" cellpadding="0" cellspacing="0">
                                  <tr width="69" height="12">
                                    <td align="center" width="9" height="12" class="style5">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5" id="wrong_5">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5" id="wrong_6">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5" id="wrong_7">&nbsp;</td>
                                    <td align="center" width="9" height="12" class="style5">&nbsp;</td>
                                  </tr>
                                </table>
                              </td>
                            </tr>
                            <tr>
                              <td height="12">
                                <table width="69" height="12" border="0" cellpadding="0" cellspacing="0">
                                  <tr width="69" height="12">
                                    <td align="center" width="18" height="12" class="style5">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5" id="wrong_8">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5" id="wrong_9">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5">&nbsp;</td>
                                  </tr>
                                </table>
                              </td>
                            </tr>
                            <tr>
                              <td height="12">
                                <table width="69" height="12" border="0" cellpadding="0" cellspacing="0">
                                  <tr width="69" height="12">
                                    <td width="26" height="12" class="style5">&nbsp;</td>
                                    <td align="center" width="17" height="12" class="style5" id="wrong_10">&nbsp;</td>
                                    <td width="26" height="12" class="style5">&nbsp;</td>
                                  </tr>
                                </table>
                              </td>
                            </tr>
                            <tr>
                              <td width="69" height="41" class="style0">&nbsp;</td>
                            </tr>
                          </table>
                        </td>
                      </tr>
                    </table>
                  </td>
                </tr>
              </table>
            </td>
          </tr>
          <tr>
            <td width="265" height="20" align="center" >
              <table border="0" cellspacing="0" cellpadding="0" align="center">
                <tr>
                  <td id="str_td" class="style1" align="center">
                    <table>
                      <tr>
                        <td class="style1">&nbsp;</td>
                      </tr>
                    </table>
                  </td>
                </tr>
              </table>
            </td>
          </tr>
          <tr>
            <td height="20" align="center">
              <table height="20" width="264" border="0" cellspacing="0" cellpadding="0">
                <tr>
                  <td width="66" align="center"><a id="newgame_lbl" style="cursor:pointer;" href="javascript:void(0);" onClick="new_game();" class="style2" onMouseOver="g_mouseOver('newgame')" onMouseOut="g_mouseOut('newgame')">__MSG_new_game__ </a></td>
                  <td width="66" align="center"><a id="hint_lbl" style="cursor:pointer;" href="javascript:void(0);" onClick="showHint();" class="style2" onMouseOver="g_mouseOver('hint')" onMouseOut="g_mouseOut('hint')">__MSG_hint__ </a></td>
                  <td width="66" align="left"><a id="skin_lbl" style="cursor:pointer;" href="javascript:void(0);" onClick="changeSkin();" class="style2" onMouseOver="g_mouseOver('skin')" onMouseOut="g_mouseOut('skin')">__MSG_change_skin__ </a></td>
                  <td width="66" align="center"><a id="categories_lbl" style="cursor:pointer;" href="javascript:void(0);" onClick="openBox('categories');" class="style2" onMouseOver="g_mouseOver('categories')" onMouseOut="g_mouseOut('categories')">__MSG_categories__ </a></td>
                </tr>
              </table>
            </td>
          </tr>
        </table>
      </td>
      <td style="width:5px; font-size:1px; line-height:1px;"></td>
    </tr>
    <tr>
      <td colspan="3" style="width:280px; height:6px; font-size:1px; line-height:1px;"></td>
    </tr>
  </table>

  <table id="categories_box" style="position:absolute; display:none;" width="250" height="134" border="0" cellspacing="0" cellpadding="0">
    <tr height="24" width="250" align="center">
      <td id="top_category" height="24" width="250" align="center" class="topcategory">__MSG_choose_cat__</td>
    </tr>
    <tr width="250" height="106">
      <td id="bottom_category" width="250" height="106" valign="top" align="center" class="bottomcategory0">
        <table width="250" height="106"  border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td width="10" height="106" class="style0">&nbsp;</td>
            <td width="230" height="106">
              <table width="230" height="106" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <td height="64">
                    <table width="230" height="64" border="0" cellspacing="0" cellpadding="0" style="margin:0px;padding:0px;">
                      <tr>
                        <td id="star_0" width="8" height="16" align="left" class="style10_0">&#8226;</td>
                        <td height="16" width="100" align="left"><a id="cat_0" href="javascript:void(0);" onClick="changeCategories(0);" class="style10roll_0">__MSG_cat_movie__</a></td>
                        <td id="star_1" width="8" height="16" align="left" class="style10_0">&#8226;</td>
                        <td height="16" width="114" align="left"><a id="cat_1" href="javascript:void(0);" onClick="changeCategories(1);" class="style10_0">__MSG_cat_books__</a></td>
                      </tr>
                      <tr>
                        <td id="star_2" width="8" height="16" align="left" class="style10_0">&#8226;</td>
                        <td height="16" width="100" align="left"><a id="cat_2" href="javascript:void(0);" onClick="changeCategories(2);" class="style10_0">__MSG_cat_celebs__</a></td>
                        <td id="star_3" width="8" height="16" align="left" class="style10_0">&#8226;</td>
                        <td height="16" width="114" align="left"><a id="cat_3" href="javascript:void(0);" onClick="changeCategories(3);" class="style10_0">__MSG_cat_athleets__</a></td>
                      </tr>
                      <tr>
                        <td id="star_4" width="8" height="16" align="left" class="style10_0">&#8226;</td>
                        <td height="16" width="100" align="left"><a id="cat_4" href="javascript:void(0);" onClick="changeCategories(4);" class="style10_0">__MSG_cat_box__</a></td>
                        <td id="star_5" width="8" height="16" align="left" class="style10_0">&#8226;</td>
                        <td height="16" width="114" align="left"><a id="cat_5" href="javascript:void(0);" onClick="changeCategories(5);" class="style10_0">__MSG_cat_time__</a></td>
                      </tr>
                      <tr>
                        <td id="star_6" width="8" height="16" align="left" class="style10_0">&#8226;</td>
                        <td height="16" width="100" align="left"><a id="cat_6" href="javascript:void(0);" onClick="changeCategories(6);" class="style10_0">__MSG_cat_tv__</a></td>
                        <td id="star_7" width="8" height="16" align="left" class="style10_0">&#8226;</td>
                        <td height="16" width="114" align="left"><a id="cat_7" href="javascript:void(0);" onClick="changeCategories(7);" class="style10_0">__MSG_cat_countries__</a></td>
                      </tr>
                    </table>
                  </td>
                </tr>
                <tr>
                  <td width="230" height="24" valign="top">
                    <table width="230" height="24" border="0" cellpadding="0" cellspacing="0" style="margin:0px;padding:0px;">
                      <tr style="margin:0px;padding:0px;" width="230">
                        <td align="center" height="20" width="230">
                          <span id="categories_save" onclick="saveCategory();" class="menu">__MSG_save__</span>
                        </td>
                      </tr>
                    </table>
                  </td>
                </tr>
              </table>
            </td>
            <td width="10" height="106" class="style0">&nbsp;</td>
          </tr>
        </table>
      </td>
    </tr>
  </table>
  <table id="game_finished_box" style="position:absolute; display:none;" width="135" height="136" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <td id="end_box" width="135" height="136" align="center" class="endscreenbackground">
      <table width="125" border="0" cellspacing="0" cellpadding="0">
        <tr>
          <td width="125" height="18" align="center" id="finish_title" class="style11">&nbsp;</td>
        </tr>
        <tr>
          <td id="reveal_str" width="125" height="32" align="center" class="style12"></td>
        </tr>
          <tr>
              <td height="16" width="125" align="center" class="style13">__MSG_view_term__</td>
          </tr>
          <tr>
          <td height="18" width="125">
            <table width="125" height="18" border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td height="18" width="7" class="style0">&nbsp;</td>
                    <td height="18" width="111" align="center"><a id="flickr_link" href="" target="_blank"><img id="flickr" style="cursor:pointer;" border="0" width="37" height="18"/></a></td>
                <td height="18" width="111" align="center"><a id="amazon_link" href="" target="_blank"><img id="amazon" style="cursor:pointer;" border="0" width="37" height="18" /></a></td>
                <td height="18" width="111" align="center"><a id="ebay_link" href="" target="_blank"><img id="ebay" style="cursor:pointer;" border="0" width="37" height="18" /></a></td>
                <td height="18" width="7" class="style0">&nbsp;</td>
              </tr>
            </table>
          </td>
          </tr>
        <tr>
          <td height="18" width="125">
            <table width="125" height="18" border="0" cellpadding="0" cellspacing="0">
              <tr>
                <td height="18" width="7" class="style0">&nbsp;</td>
                <td height="18" width="111" align="center"><a id="google_link" href="" target="_blank"><img id="google" style="cursor:pointer;" border="0" width="37" height="18" /></a></td>
                <td height="18" width="111" align="center"><a id="imdb_link" href="" target="_blank"><img id="imdb" style="cursor:pointer;" border="0" width="37" height="18" /></a></td>
                <td height="18" width="111" align="center"><a id="youtube_link" href="" target="_blank"><img id="youtube" style="cursor:pointer;" border="0" width="37" height="18" /></a></td>
                <td height="18" width="7" class="style0">&nbsp;</td>
              </tr>
            </table>
          </td>
          </tr>
        <tr>
          <td height="8" class="style0">&nbsp;</td>
        </tr>
          <tr>
              <td align="center" height="24" width="125">
            <span id="finish_close" onclick="closeBox('game_finished');" class="menu">__MSG_close__</span>
          </td>
          </tr>
        <tr>
          <td height="2" class="style0">&nbsp;</td>
        </tr>
      </table>
    </td>
    </tr>
  </table>
  <table id="openning_title" style="position:absolute; display:none;" height="27" width="265"  border="0" cellspacing="0" cellpadding="0">
    <tr width="265" height="14">
      <td width="265" height="14" id="click_title" class="openmessage1" align="center">__MSG_click_new__</td>
    </tr>
    <tr width="265" height="13">
      <td id="category_dec" width="265" height="13" class="openmessage2" align="center">__MSG_curr_category__ <td>
    </tr>
  </table>
</center>
<!-- LP footer -->
<div>
  <script type="text/javascript">
    var mMENU = gadgets.io.getProxyUrl("http://cdn.labpixies.com/infra/js/lp_footer.js");
    document.write('<scr'+'ipt type="text/javascript" src="'+mMENU+'"></scr'+'ipt>');
  </script>
</div>
<script type="text/javascript">
//setTimeout(init,1000);
gadgets.util.registerOnLoadHandler(init);
</script>

]]></Content>
</Module>

