IMGSRV_LIST = [
'https://img.niborea.com/pic',
'https://img.niborea.eu/pic'
];

function FindSpell(id)
{
  var left = 0;
  var right = spells.length - 1;
  while (left <= right) {
    var mid = Math.floor((left + right)/2);
    var c = spells[mid][0] - id;
    if (!c) return mid;
    else if (c < 0) left = mid + 1;
    else right = mid - 1;
  }
  return -1;
}

function GetSpellImage(id, size, width, style, extra)
{
  var html = '';
  if (userFlags&(1<<20)) {
    index = FindSpell(id);
    var itpostfix = (size&8)?((size&16)?'off':'on'):'';
    html += "<img src='"+IMGSRV+"/item/"+spells[index][3]+itpostfix+".png' style='width:"+width+"px; height:"+width+"px;"
    if (size&4) {
      html += "margin:2px;";
    }
    html += style+"'"+extra+">";
  } else {
    var itprefix = (width==50)?((size&8)?((size&16)?2:3):0):1;
    var cards_in_img = cards_per_img_x * cards_per_img_y;
    var sid = Math.floor(id / cards_in_img);
    var spos = id % cards_in_img;
    var xpos = spos % cards_per_img_x;
    var ypos = Math.floor(spos / cards_per_img_x);
    html += "<img src='"+IMGSRV+"/x.gif' style='display:inline-block; background: url("+IMGSRV+"/item_t/"+itprefix+"-"+sid+"_"+cards_modtime+".png) "+(xpos*-width)+"px "+(ypos*-width)+"px no-repeat; width:"+width+"px; height:"+width+"px;";
    if (size&4) {
      html += "margin:2px;";
    }
    html += style+"'"+extra+">";
  }
  return html;
}

function dd_allowDrop(ev)
{
  ev.preventDefault();
}

function dd_drag(ev)
{
  ev.dataTransfer.setData("Text",ev.target.id);
}

function dd_drop(ev)
{
  ev.preventDefault();
  var data=ev.dataTransfer.getData("Text");
  ServerWait(1);
  AjaxGet("ajaxspell.php?exch1="+data+"&exch2="+ev.target.id, AjaxSpell);
}

function dd_dragQ(ev,obj)
{
  var tmp = mouseCoords(ev);
  tmp.id = obj;
  ev.dataTransfer.setData("Text",JSON.stringify(tmp));
}

function dd_dropQ(ev)
{
  ev.preventDefault();
  var data = JSON.parse(ev.dataTransfer.getData("Text"));
  var tmp = mouseCoords(ev);
  data.x -= tmp.x;
  data.y -= tmp.y;
  ServerWait(1);
  AjaxGet("ajaxhero.php?qmove="+quests[data.id][0]+"&x="+data.x+"&y="+data.y, AjaxHero);
}

function GetSpellHTML(hel, id, flags, level, exptime, iselect, pct, price, price1, flags2, size, extra_pre, extra_post, x, y)
{
  if (id == -1) return '';
  index = FindSpell(id);
  if (index == -1) return '';
  var width = 50;
  if (size&1) width=25;
  var html = '';
  if (size&2) {
    if (x >= 0 && y >= 0) {
      html += "<div style='position:absolute; left:"+x+"px; top:"+y+"px;";
    } else {
      html += "<div style='position:relative;";
    }
    html += " width:"+width+"px; height:"+width+"px;'>";
  }
  html += extra_pre;
  if (flags2 & 1) {
    html += "  <div style='position: absolute; top:-55px; left:-55px; width:200px; z-index:500;' id='tutobj2'>";
    html += "    <img src='"+IMGSRV+"/tut/Roundmarkmedium.png' style='width:160px; height:160px;'><div style='position:absolute; top:60px; left:135px;'><img src='"+IMGSRV+"/tut/UniArrowLeft.gif'></div>";
    html += "  </div><div style='position:absolute; top:0px;left:0px; z-index:501;'>";
  }
  html += GetSpellImage(id, size, width, "cursor:pointer;"+((flags2&4)?"box-shadow:0px 0px 4px 2px rgba(255,155,155,0.5), inset 0px 0px 2px 2px rgba(255,155,155,0.5);":""),
     ((flags2&2)?" id='"+id+"' draggable='true' ondrop='dd_drop(event)' ondragover='dd_allowDrop(event)' ondragstart='dd_drag(event)'":"")+
     " title='' onclick='javascript:ShowCard3("+chr(34)+hel+chr(34)+", "+index+", "+flags+", "+level+", "+exptime+", "+iselect+", "+pct+", "+price+", "+price1+", "+flags2+");'");
  if (flags2 & 1) {
    html += "</div>";
  }
  html += extra_post;
  if (size&2) {
    if (level>0) {
      html += "<div class='icon_count'";
      if (level>=99) html += "style='color:#ff40ff;'";
      html += ">"+level+"</div>";
//      html += "<div class='icon_count2'>"+level+"</div>";
    }
    html += "</div>";
  }
  return html;
}

function GetSpellInfoHTML(hel, id, exptime, size, flags)
{
  return GetSpellHTML(hel, id, flags, 0, exptime, -1, -1, 0, 0, 0, size, '', '', -1, -1);
}

function RenderSpell(hel, id, flags, level, exptime, iselect, pct, price, price1, flags2, size, extra_pre, extra_post, x, y)
{
  document.write(GetSpellHTML(hel, id, flags, level, exptime, iselect, pct, price, price1, flags2, size, extra_pre, extra_post, x, y));
}

function GetSpellsHTML(list, prefix, postfix, hel, flags, level, exptime, iselect, pct, price, price1, flags2, size, extra_pre, extra_post, x, y)
{
  var html = '';
  for(var i = 0; i < list.length; ++i) {
    if (prefix) html += prefix;
    html += GetSpellHTML(hel, list[i], flags, level, exptime, iselect, pct, price, price1, flags2, size, extra_pre, extra_post, x, y);
    if (postfix) html += postfix;
  }
  return html;
}

function RenderSpells(list, prefix, postfix, hel, flags, level, exptime, iselect, pct, price, price1, flags2, size, extra_pre, extra_post, x, y)
{
  document.write(GetSpellsHTML(list, prefix, postfix, hel, flags, level, exptime, iselect, pct, price, price1, flags2, size, extra_pre, extra_post, x, y));
}

function GetParametrizedSpellsHTML(list, hel)
{
  var html = '';
  for(var i = 0; i < list.length; ++i) {
    if (list[i].length>1) {
      html += GetSpellHTML(hel, list[i][0], list[i][1], list[i][2], list[i][3], list[i][4], list[i][5], 0, 0, list[i][6], 2, '', '', list[i][7], list[i][8]);
    }
  }
  return html;
}

function FightTable(code, flags)
{
  var rstr = '';
  rstr +="<table border='0' cellspacing='0' cellpadding='1' style='text-align:right; font-weight: normal; margin:0px 10px;";
  if (flags & 1) rstr +=" float: left;";
  else rstr +=" float: left;";
  rstr +="'>\n";
  rstr +="<tr style='text-align:center;'><td rowspan='2'>&nbsp;</td><td colspan='2' style='width:70px;'>"+GetImageHTML(IMGSRV+"/mailhero.jpg", "", "")+"</td><td colspan='2' style='width:70px;'>"+GetImageHTML(IMGSRV+"/mailquest.jpg", "", "")+"</td></tr>";
  rstr +="<tr style='text-align:center;'><td>"+GetImageHTML(IMGSRV+"/mailattack.jpg", "", "")+"</td><td>"+GetImageHTML(IMGSRV+"/maildefense.jpg", "", "")+"</td><td>"+GetImageHTML(IMGSRV+"/mailattack.jpg", "", "")+"</td><td>"+GetImageHTML(IMGSRV+"/maildefense.jpg", "", "")+"</td></tr>";
  var j = 0;
  while(code) {
    var spellid = parseInt(code);
    code = strstr(code, ":").substr(1);
    var index = FindSpell(spellid);
    var atk1 = parseInt(code), atk2=0;
    code = strstr(code, ",").substr(1);
    var def1 = parseInt(code), def2=0;
    if (code.indexOf(',')>=0 && code.indexOf('|')>code.indexOf(',')) {
      code = strstr(code, ",").substr(1);
      atk2 = parseInt(code);
      code = strstr(code, ",").substr(1);
      def2 = parseInt(code);
    } else {
      if (atk1 < 0) { atk2 = atk1; atk1 = 0;}
      if (def1 < 0) { def2 = def1; def1 = 0;}
    }
    if (flags & 2) {
      var tmp = atk2;
      atk2 = atk1;
      atk1 = tmp;
      tmp = def2;
      def2 = def1;
      def1 = tmp;
    }
    code = strstr(code, "|").substr(1);
    if (index == -1) continue;
    var html;
    if (j & 1) {
      html = "<tr>";
    } else {
      html = "<tr style='background: #384838;'>";
    }
    html += "<td onclick='javascript:ShowCard(\"bstat\", "+spellid+", 0, 0, -2, -1, -1000);'>";
    html += GetSpellImage(spellid,0,25,"","");
    //html += GetImageHTML(IMGSRV+"/item/"+spells[index][3]+".png", '', "style='width:25px; height:25px;'");
    html += "</td>";
    html += "<td style='color:#00ff00'>"
    if (atk1>0) html += "+";
    html += atk1;
    html += "%</td><td style='color:#00ff00'>";
    if (def1>0) html += "+";
    html += def1;
    html += "%</td><td style='color:#ff0000'>";
    if (atk2>0) html += "+";
    html += atk2;
    html += "%</td><td style='color:#ff0000'>";
    if (def2>0) html += "+";
    html += def2;
    html += "%</td>";
    html += "</tr>";
    rstr +=html;
    ++j;
  }
  rstr +="</table>\n";
  return rstr;
}

function FightDisp(data)
{
  var rstr = '';
  var killed = strstr(data, "/", 1);
  data = strstr(data, "/").substr(1);
  var cast = strstr(data, "/", 1);
  var cast2 = strstr(data, "/").substr(1);
  var extra = strstr(cast2, "/");
  var flags = 0;
  if (extra) {
    flags = parseInt(extra.substr(1));
    cast2 = strstr(cast2, "/",1);
  }
  rstr +="<div style='position:relative; clear: both; background: #304030; border-top: 2px solid #203020; padding-top:2px;'>\n";
  rstr += FightTable(cast, 0 | flags);
  rstr += FightTable(cast2, 1 | flags);
  rstr +="<div style='float:left'>";
  while(killed) {
    var index = parseInt(killed);
    killed = strstr(killed, ":").substr(1);
    var cnt = parseInt(killed);
    killed = strstr(killed, ",").substr(1);
    var tcnt = parseInt(killed);
    killed = strstr(killed, "|").substr(1);
    var html = "<div style='margin: 1px;'>";
    html += "<table border='0' style='width: 120px; height: 50px; font-weight:normal; text-align:center;'><tr>";
    html += "<td style='width:50px;' onclick='javascript:ShowCreature("+index+", "+chr(34)+"bstat"+chr(34)+");'>"+GetImageHTML(IMGSRV+"/unit/"+units[index][3]+".png", '', '')+"</td>";
    html += "<td><span style='color:#00ff00'>"+tcnt+"</span><hr><span style='color:#ff0000'>-"+cnt+"</span></td>";
    html += "</tr></table>";
    html += "</div>";
    rstr +=html;
  }
  rstr +="</div>";
  rstr +="<div style='clear:both; height: 1px;'>&nbsp;</div>\n";
  return rstr;
}

function FightNumbers(data1, data2)
{
  var rstr = '';
  rstr +="<table border='1' cellspacing='0' cellpadding='2' style='text-align:center; font-weight: bold; margin:0px 10px;'>\n";
  rstr +="<tr><td rowspan='2'>&nbsp;</td><td colspan='2'>"+GetImageHTML(IMGSRV+"/mailhero.jpg", "", "")+"</td><td colspan='2'>"+GetImageHTML(IMGSRV+"/mailquest.jpg", "", "")+"</td></tr>";
  rstr +="<tr><td>"+GetImageHTML(IMGSRV+"/mailattack.jpg", "", "")+"</td><td>"+GetImageHTML(IMGSRV+"/maildefense.jpg", "", "")+"</td><td>"+GetImageHTML(IMGSRV+"/mailattack.jpg", "", "")+"</td><td>"+GetImageHTML(IMGSRV+"/maildefense.jpg", "", "")+"</td></tr>";
  rstr +="<tr><td>Hrdina</td>";
  for(var i = 0; i< 4; i ++) {
    rstr +="<td>"+data1[i]+"</td>";
  }
  rstr +="</tr><tr><td>Náhoda</td>";
  for(var i = 0; i< 4; i ++) {
    var delta = Math.round((data2[i]-data1[i])/(data1[i]?data1[i]:1)*1000)/10;
    if (data2[i]<data1[i]) {
      rstr +="<td style='color:#ff0000'>"+delta+"%</td>";
    } else {
      rstr +="<td style='color:#00ff00'>+"+delta+"%</td>";
    }
  }
  rstr +="</tr><tr><td>Quest</td>";
  for(var i = 0; i< 4; i ++) {
    rstr +="<td>"+data2[i]+"</td>";
  }
  rstr +="</tr></table>";
  return rstr;
}

function ReportReplace(str)
{
  if (str.indexOf('~') == -1) return str;
  var tokens = str.split('~');
  var status = 0;
  var rstr = '';
  var cnt = 0;
  var id = 0;
  for(var i = 0; i < tokens.length; ++i) {
    if (status) {
      status = 0;
      switch(tokens[i].substr(0,1)) {
      case 'r': // resource
        id = 1 * tokens[i].substr(1,1);
        cnt = 1 * tokens[i].substr(2);
        rstr += "<span class='hq_rew'>"+resourceDesc[id][0]+" <img src="+chr(34)+IMGSRV+"/"+resourceDesc[id][1]+chr(34)+" title="+chr(34)+resourceDesc[id][0]+chr(34)+">&nbsp;"+cnt+"</span>";
        break;
      case 's': // spell
        id = 1 * tokens[i].substr(1);
        rstr += GetSpellHTML('bstat', id, 0, 0, -2, -1, -1000, 0, 0, 0, 1, '', '', -1, -1);
        break;
      case 'p': // prestiz
        cnt = 1 * tokens[i].substr(1);
        rstr += "<span class='hq_rew'>Prestíž <img src='"+IMGSRV+"/prestige.png' title='Prestíž'>&nbsp;"+cnt+"</span>";
        break;
      case 'w': // vitazne body
        cnt = 1 * tokens[i].substr(1);
        rstr += "<span class='hq_rew'>Víťazné body <img src='"+IMGSRV+"/winpt.png' title='Víťazné body'>&nbsp;"+cnt+"</span>";
        break;
      case 'e': // skusenosti
        cnt = 1 * tokens[i].substr(1);
        rstr += "<span class='hq_rew'>"+cnt+" skúseností</span>";
        break;
      }
    } else {
      status = 1;
      rstr += tokens[i];
    }
  }
  return rstr;
}

function QuestResDisp(u1, o1, u2, o2, ur1, or1, ur2, or2, res, rew, qs, exp)
{
  var rstr = '';
  var img = IMGSRV+'/quest/backquest';
  if (res & 4) {
    img += 'samial';
  }
  rstr +="<div style='position:relative; border: 0px solid #A5A573; background: #000000 url("+img+".jpg) 0px 0px no-repeat; padding: 10px; width: 598px; color: #F5E9B5;'>";
  rstr +="<div style='float: right; padding: 5px; margin:0px; width:238px;'>";
  rstr +="<table cellspacing='0' cellpadding='0' border='0' style='width:240px; font-weight:normal; color: #C0B889;'>";
  rstr +="<tr><td>&nbsp;</td><td>Útok</td><td>Obrana</td></tr>";
  rstr +="<tr><td style='color:#B8F4F4'>Hrdina</td><td>"+u1+"</td><td>"+o1+"</td></tr>";
  var pu1 = Math.round((ur1-u1)/(u1?u1:1)*1000)/10;
  var po1 = Math.round((or1-o1)/(o1?o1:1)*1000)/10;
  var c1 = 'F20000', c2 ='F20000';
  if (pu1 >= 0) {
    c1 = '76FE82';
    pu1 = '+'+pu1;
  }
  if (po1 >= 0) {
    c2 = '76FE82';
    po1 = '+'+po1;
  }
  rstr +="<tr><td>Náhoda</td><td style='color: #"+c1+";'>"+pu1+"%</td><td style='color: #"+c2+";'>"+po1+"%</td></tr>";
  rstr +="<tr style='color:#B8F4F4; font-weight: bold;'><td>&nbsp;</td><td>"+ur1+"</td><td>"+or1+"</td></tr>";
  rstr +="<tr><td colspan='3'>&nbsp;</td></tr>";
  rstr +="<tr><td style='color:#B8F4F4'>Quest</td><td>"+u2+"</td><td>"+o2+"</td></tr>";
  var pu1 = Math.round((ur2-u2)/(u2?u2:1)*1000)/10;
  var po1 = Math.round((or2-o2)/(o2?o2:1)*1000)/10;
  var c1 = 'F20000', c2 ='F20000';
  if (pu1 >= 0) {
    c1 = '76FE82';
    pu1 = '+'+pu1;
  }
  if (po1 >= 0) {
    c2 = '76FE82';
    po1 = '+'+po1;
  }
  rstr +="<tr><td>Náhoda</td><td style='color: #"+c1+";'>"+pu1+"%</td><td style='color: #"+c2+";'>"+po1+"%</td></tr>";
  rstr +="<tr style='color:#FF9680; font-weight: bold;'><td>&nbsp;</td><td>"+ur2+"</td><td>"+or2+"</td></tr>";
  rstr +="</table></div>";
  rstr +="<div style='margin-top:80px;'>";
  if (res & 4) {
    if (res & 1) {
      rstr +="<div class='hq_win'>Hrdina vyhrá quest !</div>";
    } else {
      rstr +="<div class='hq_los'>Hrdina prehrá quest !</div>";
      rstr +="<div class='hq_die'>S pravdepodobnosťou "+exp+"% zomrie.</div>";
    }
  } else {
    if (res & 1) {
      rstr +="<div class='hq_win'>Hrdina zvíťazil !</div>";
    } else {
      rstr +="<div class='hq_los'>Hrdina prehral !</div>";
    }
    if (res & 2) {
      rstr +="<div class='hq_die'>Hrdina pri boji zomrel.</div>";
    }
  }
  // rozbijeme string a nahradime resource a kuzla
  rstr +="<br>";
  qs = ReportReplace(qs);
  rew = ReportReplace(rew);
  if (rew.length) {
    rstr +="<div>Získal si: <span class='hq_rew'>"+rew+"</span></div>";
  }
  if (qs.length) {
    rstr +="<div>"+qs+"</div>";
  }
  if (!(res & 4)) {
    rstr +="<div>Hrdina spolu získal <span class='hq_rew'>"+exp+" skúseností</span>.</div>";
  }
  rstr +="<div style='clear:both; height:1px; line-height:1px;'></div></div>";
  rstr +="</div>";
  return rstr;
}

function SpyTable(code1, code2, flags)
{
  var rstr = '';
  rstr +="<table border='0' cellspacing='2' cellpadding='1' style='text-align:right; font-weight: normal; margin:0px 10px; float: left;'>\n";
  if (0==flags) {
    rstr +="<tr style='text-align:center;'><td rowspan='2'>&nbsp;</td><td colspan='2' style='width:70px;'>"+GetImageHTML(IMGSRV+"/world/spionazhero.jpg", "", "")+"</td></tr>";
    rstr +="<tr style='text-align:center;'><td>Špionáž</td><td>Náročnosť</td></tr>";
  } else {
    rstr +="<tr style='text-align:center;'><td rowspan='2'>&nbsp;</td><td colspan='2' style='width:70px;'>"+GetImageHTML(IMGSRV+"/world/spionazenemy.jpg", "", "")+"</td></tr>";
    rstr +="<tr style='text-align:center;'><td>Kontrašpionáž</td><td>Náročnosť</td></tr>";
  }
  var code = code1;
  var j = 0, f = 0;
  while(f < 2) {
    if (code.length==0) {
      f ++;
      if (f > 1) break;
      code = code2;
      if (code.length==0) break;
    }
    var spellid = parseInt(code);
    code = strstr(code, "/").substr(1);
    var index = FindSpell(spellid);
    var val = parseInt(code);
    code = strstr(code, "|").substr(1);
    if (index == -1) continue;
    var html;
    if (j & 1) {
      html = "<tr style='background: #384838;'>";
    } else {
      html = "<tr>";
    }
    html += "<td>"+GetSpellHTML('bstat', spellid, 0, 0, -2, -1, -1000, 0, 0, 0, 1, '', '', -1, -1)+"</td>";
    if (f) html += "<td>&nbsp;</td>";
    if (flags==0 && f==0 && val >= 0) {
      html += "<td style='color:#00ff00'>"
    } else if ((flags || f) && val < 0) {
      html += "<td style='color:#00ff00'>"
    } else {
      html += "<td style='color:#ff0000'>"
    }
    if (val>0) html += "+";
    html += val;
    html += "</td>";
    if (!f) html += "<td>&nbsp;</td>";
    html += "</tr>";
    rstr +=html;
    ++j;
  }
  rstr +="</table>\n";
  return rstr;
}

function SpyDisp(home1, home2, enemy1, enemy2)
{
  var rstr ="<div style='position:relative; clear: both; background: #304030; border-top: 2px solid #203020; padding-top:2px;'>\n";
  rstr += SpyTable(home1, home2, 0);
  rstr += SpyTable(enemy1, enemy2, 1);
  rstr +="<div style='clear:both; height: 1px;'>&nbsp;</div>\n";
  rstr +="</div>";
  return rstr;
}

function SpyResDisp(spy, contra, diff, rnd, res, qs, rew, home1, home2, enemy1, enemy2)
{
  var rstr = '';
  rstr +="<div style='position:relative; border: 0px solid #A5A573; background: #000000 url("+IMGSRV+"/backspy.jpg) 0px 0px no-repeat; padding: 10px; width: 598px; color: #F5E9B5;'>";
  rstr +="<div style='float: right; padding: 5px; margin:0px; width:238px;'>";
  rstr +="<table cellspacing='0' cellpadding='0' border='0' style='width:240px; font-weight:normal; color: #C0B889;'>";
  rstr +="<tr><td colspan='2' style='font-weight:bold; font-size:16px; text-align:center;'>Hodnoty špionáže</td></tr>";
  rstr +="<tr><td>Špionáž</td><td style='font-weight:bold; color:#76FE82;'>"+spy+"</td></tr>";
  rstr +="<tr><td>Kontrašpionáž</td><td style='font-weight:bold; color:#f20000;'>"+contra+"</td></tr>";
  rstr +="<tr><td>Náročnosť</td><td style='font-weight:bold; color:#f20000;'>"+diff+"</td></tr>";
  var c1 = (rnd>0)?'76FE82':'f20000';
  rstr +="<tr><td>Náhoda</td><td style='font-weight:bold; color:#"+c1+";'>"+rnd+"</td></tr>";
  var numres = spy - contra - diff + rnd;
  rstr +="<tr><td colspan='2'>&nbsp;</td></tr>";
  rstr +="<tr style='font-weight:bold;'><td>Výsledok</td><td>"+numres+"</td></tr>";
  rstr +="</table></div>";
  rstr +="<div style='margin-top:80px;'>";
  if (res & 1) {
    rstr +="<div class='hq_win'>Špionáž bola úspešná !</div>";
  } else {
    rstr +="<div class='hq_los'>Špionáž skončila fiaskom !</div>";
  }
  if (res & 2) {
    rstr +="<div class='hq_die'>Hrdina pri špionáži zomrel !</div>";
  }
  // rozbijeme string a nahradime resource a kuzla
  rstr +="<br>";
  qs = ReportReplace(qs);
  rew = ReportReplace(rew);
  if (rew.length) {
    rstr +="<div>Získal si: <span class='hq_rew'>"+rew+"</span></div>";
  }
  if (qs.length) {
    rstr +="<div>"+qs+"</div>";
  }
  rstr +="<div style='clear:both; height:1px; line-height:1px;'></div></div>";
  rstr +="</div>";
  return rstr + SpyDisp(home1, home2, enemy1, enemy2);
}

function HTMLBigButton(text, onclick, css, id, style)
{
  if (!(userFlags & 1073741824)) css += "_mini";

  return "<div class='"+css+"'"+((typeof id != "undefined")?" id='"+id+"'":'')+(onclick?" onclick=\"javascript:"+onclick+"\"":"")+((typeof style != "undefined")?" style='"+style+"'":'')+"><span style='height:100%;'></span><span>"+text+"</span></div>";
}

function HTMLMiniButtons()
{
  return (userFlags & 1073741824)?"":"_mini";
}

var keyframeprefix = '';

function findPrefix(property)
{
  property = property.toLowerCase();
  if (property.charAt(0) == '-') {
    var parts = property.split('-');
    if (parts[2] == 'animation') { keyframeprefix = '-'+parts[1]+'-'; return 1; }
  }
  return 0;
}

{
  var style = getComputedStyle(document.documentElement, null);
  if(style.length > 0) {
    for(var i=0; i<style.length; i++) {
      if (findPrefix(style[i])) break;
    }
  } else {
    for(var property in style) {
      if (findPrefix(property)) break;
    }
  }
}

function AddStyle(style)
{
  var si = -1;
  if (document.styleSheets && document.styleSheets.length) {
    for(var i = 0; i < document.styleSheets.length; ++i) {
      if (document.styleSheets[i].href == null) {
        si = i;
        break;
      }
    }
  }
  if (si != -1) {
      document.styleSheets[si].insertRule(style, 0);
  } else {
    var s = document.createElement('style');
    s.innerHTML = style;
    document.getElementsByTagName('head')[0].appendChild(s);
  }
}

function CreateAnimation(name, image, width, height, frames, fps)
{
  var w = width * frames;
  var keyframes = '@' + keyframeprefix + 'keyframes '+name+' { '+
                    'from {background-position: 0px;}'+
                    'to {background-position: -'+w+'px;}'+
                  '}';
  AddStyle(keyframes);
  var sec = frames / fps;
  var cls = '.'+name+' { width: '+width+'px; height: '+height+'px; background-image: url("'+image+'"); background-repeat:no-repeat;' +
           keyframeprefix +'animation: '+name+' '+sec+'s steps('+frames+') infinite; margin: 0px auto; }';
  AddStyle(cls);
}