File: /home/harmonyg/www/test/index1.html
<HTML lang="en-US" dir="ltr">
<HEAD>
<META charset="UTF-8">
<META content="IE=10.000" http-equiv="X-UA-Compatible">
<META name="description" content="">
<META name="keywords" content="">
<TITLE>MAG</TITLE>
<style type="text/css">
html, body {
height: 100%;
width:100%;
margin: 0;
}
td {
border: 1px solid black;
margin: 0;
padding: 0;
}
</style>
<!--link href="themes/9/js-image-slider.css" rel="stylesheet" type="text/css" /-->
<!--script src="themes/9/js-image-slider.js" type="text/javascript"></script-->
<!--LINK href="css/style.css" rel="stylesheet" type="text/css" media="all"-->
<link rel='stylesheet' id='prettyphoto-css' href='css/prettyPhoto.css?ver=2.5.6' type='text/css' media='screen' />
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'></script>
<script type='text/javascript' src='js/jquery-1.6.1.min.js?ver=1.6.1'></script>
<script type='text/javascript' src='js/jquery.prettyPhoto.js?ver=2.5.6'></script>
<SCRIPT type="text/javascript" charset="utf-8">
var globPage=1;
var globCount;
var element_Element = [];
var element_Apparatus = [];
var element_Group = [];
var element_GroupName = [];
var element_RussianGroupName = [];
var element_ElementNN = [];
var element_Russian = [];
var element_Difficulty = [];
var element_Picture = [];
var element_Sign = [];
var element_Gymnast = [];
var element_GymnastRussianName = [];
var element_VLink = [];
var appSelected;
var pageSelected;
var grpSelected;
var diffSelected;
/* <![CDATA[ */
jQuery(document).ready(function($) {
$.ajax({
type: "GET",
url: "ElementMAG224_mod.xml",
dataType: "xml",
success: function(xml) {
var ii=0;
$(xml).find('ElementMAG').each(function(){
element_Element[ii]= $(this).find('Element').text();
element_Apparatus[ii]= $(this).find('Apparatus').text();
element_Group[ii]= $(this).find('Group').text();
element_GroupName[ii]= $(this).find('GroupName').text();
element_RussianGroupName[ii]= $(this).find('RussianGroupName').text();
element_ElementNN[ii]= $(this).find('ElementNN').text();
element_Russian[ii]= $(this).find('Russian').text();
element_Difficulty[ii]= $(this).find('Difficulty').text();
element_Picture[ii]= $(this).find('Picture').text();
element_Sign[ii]= $(this).find('Sign').text();
element_Gymnast[ii]= $(this).find('Gymnast').text();
element_GymnastRussianName[ii]= $(this).find('GymnastRussianName').text();
element_VLink[ii]= $(this).find('VLink').text();
ii+=1;
});
globCount = ii;
showSet();
}
});
});
/* ]]> */
$(function () {
$('#testclick').click(function(){
appSelected = $('#selApp').val();
globPage=1;
//$('#selPage').val();
grpSelected = $('#selGrp').val();
//var row1;
//var col1;
//var test2;
//var test3;
//var str2;
//var str5;
//var str1="";
//var str2="";
//str2+=pageSelected;
showSet();
});
});
$(function () {
$('#selGrp').change(function(){
appSelected = $('#selApp').val();
globPage=1;
//$('#selPage').val();
grpSelected = $('#selGrp').val();
showSet();
});
});
$(function () {
$('#selApp').change(function(){
appSelected = $('#selApp').val();
globPage=1;
//$('#selPage').val();
grpSelected = $('#selGrp').val();
showSet();
});
});
function showSet() {
appSelected = $('#selApp').val();
pageSelected = globPage;
//$('#selPage').val();
grpSelected = $('#selGrp').val();
//clean the table first
for (var col1 = 1;col1 <= 6; col1++) {
for (var row1 = 1;row1 <= 4; row1++) {
NN1=(pageSelected-1)*24+(row1-1)*6+col1;
str3="REGION_" + row1 + "_" + col1;
document.getElementById(str3).innerHTML = NN1+".";
}
}
//------------------------------------
for (var ie = 0;ie < globCount; ie++) {
if(element_Apparatus[ie]==appSelected && element_Group[ie]==grpSelected) {
for (var col1 = 1;col1 <= 6; col1++) {
for (var row1 = 1;row1 <= 4; row1++) {
NN1=(pageSelected-1)*24+(row1-1)*6+col1;
str3="REGION_" + row1 + "_" + col1;
str5 = NN1+".";
if(element_ElementNN[ie]==NN1) {
if(element_Element[ie]=="") {
str5 = element_ElementNN[ie]+".";
}
else
{
str5="";
if(element_VLink[ie]!="") str5+= "<a href='"+element_VLink[ie]+"' rel='prettyPhoto' >";
str5+= element_ElementNN[ie];
if(element_VLink[ie]!="") str5+= "</a>";
str5+= ". "+element_Element[ie]+"<br/>"; //+memberSet("Element")+"<br/>"
if(element_Picture[ie]!="") str5+= "<img height='35%' src='img/"+element_Picture[ie]+"'/>";
if(element_Sign[ie]!="") str5+= "<br/><img height=20 src='img/"+element_Sign[ie]+"'/>";
if(element_Apparatus[ie]=="VT") str5+= "<br/>"+element_Difficulty[ie];
}
document.getElementById(str3).innerHTML = str5;
document.getElementById("REGION_0_2").innerHTML = element_GroupName[ie];
}
}
}
}
}
//------------------------------------
$("a[rel^='prettyPhoto']").prettyPhoto({
animationSpeed: 'fast',
showTitle: true,
allowresize: false,
counter_separator_label: '/',
theme: 'light_rounded',
autoplay: false,
overlay_gallery: false,
hideflash: false,
modal: false,
social_tools: false
});
}
function prevPage() {
if (globPage>1) globPage-=1;
//document.getElementById('selPage').value=globPage;
showSet();
}
function nextPage() {
globPage+=1;
//document.getElementById('selPage').value=globPage;
pageSelected=globPage;
var test1=0;
for (var ie = 0;ie < globCount; ie++) {
if(element_Apparatus[ie]==appSelected && element_Group[ie]==grpSelected) {
for (var col1 = 1;col1 <= 6; col1++) {
for (var row1 = 1;row1 <= 4; row1++) {
NN1=(pageSelected-1)*24+(row1-1)*6+col1;
if(element_ElementNN[ie]==NN1) {
if(element_Element[ie]!="") test1=1;
}
}
}
}
}
if (test1!=0) {
showSet();
}
else {
globPage-=1;
}
}
</SCRIPT>
</HEAD>
<BODY class="home page page-id-8 page-template-default">
<DIV class="hfeed" id="wrapper">
<DIV id="header">
<DIV id="branding" role="banner"></DIV><!-- #branding -->
<DIV id="car">
<div class="slides">
<div id="sliderFrame">
<div id="slider">
</div>
</div>
</DIV>
</DIV><!-- #car-->
Apparatus:
<SELECT id="selApp" NAME="selApp">
<OPTION VALUE="FX" SELECTED>FX
<OPTION VALUE="PH">PH
<OPTION VALUE="RG">RG
<OPTION VALUE="VT">VT
<OPTION VALUE="PB">PB
<OPTION VALUE="HB">HB
</SELECT>
Group:
<SELECT id="selGrp" NAME="selGrp">
<OPTION VALUE="I" SELECTED>I
<OPTION VALUE="II">II
<OPTION VALUE="III">III
<OPTION VALUE="IV">IV
<OPTION VALUE="V">V
</SELECT>
<!--Page: -->
<input name='button' type='submit' value='Back' onClick='prevPage()'/>
<!--SELECT id="selPage" NAME="selPage" onClick='showSet()'>
<OPTION VALUE=1 SELECTED>1
<OPTION VALUE=2>2
<OPTION VALUE=3>3
<OPTION VALUE=4>4
<OPTION VALUE=5>5
<OPTION VALUE=6>6
<OPTION VALUE=7>7
<OPTION VALUE=8>8
<OPTION VALUE=9>9
</SELECT-->
<input name='button' type='submit' value='Next' onClick='nextPage()'/>
<!--Difficulty:
<SELECT id='selDiff' NAME='selDiff'>
<OPTION VALUE="All" SELECTED>All
<OPTION VALUE="A">A
<OPTION VALUE="B">B
<OPTION VALUE="C">C
<OPTION VALUE="D">D
<OPTION VALUE="E">E
<OPTION VALUE="F">F
<OPTION VALUE="G">G
<OPTION VALUE="N">Named
</SELECT-->
<!--input type="button" value="Show" id="testclick"/--> <span id="main_test"></span>
</DIV><!-- #header-->
<!--div id="main_table"></div-->
<table width = "100%" height = "97%">
<tr id='app_color' style='color: #D27A23;'>
<td width = "15%" height="2%">
<div style="height:100%;width:100%;position:relative;">
<div style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;">A=0,1</div>
</div>
</td>
<td width = "15%" height="2%">
<div style="height:100%;width:100%;position:relative;">
<div style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;">B=0,2</div>
</div>
</td>
<td width = "15%" height="2%">
<div style="height:100%;width:100%;position:relative;">
<div style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;">C=0,3</div>
</div>
</td>
<td width = "15%" height="2%">
<div style="height:100%;width:100%;position:relative;">
<div style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;">D=0,4</div>
</div>
</td>
<td width = "15%" height="2%">
<div style="height:100%;width:100%;position:relative;">
<div style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;">E=0,5</div>
</div>
</td>
<td width = "15%" height="2%">
<div style="height:100%;width:100%;position:relative;">
<div style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;">F=0,6</div>
</div>
</td>
</tr>
<tr><td colspan="6" height="2%" style="background-color: orange;color: white;">
<div style="height:100%;width:100%;position:relative;"><div id="REGION_0_2" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;">Test</div></div>
</td></tr>
<tr>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_1_1" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_1_2" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_1_3" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_1_4" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_1_5" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_1_6" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
</tr>
<tr>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_2_1" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_2_2" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_2_3" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_2_4" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_2_5" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_2_6" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
</tr>
<tr>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_3_1" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_3_2" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_3_3" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_3_4" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_3_5" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_3_6" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
</tr>
<tr>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_4_1" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_4_2" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_4_3" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_4_4" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_4_5" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
<td width = "15%" height="20%">
<div style="height:100%;width:100%;position:relative;">
<div id="REGION_4_6" style="height:100%;overflow:auto;width:100%;white-space:wrap;position:absolute;"></div>
</div>
</td>
</tr>
</table>
</DIV><!-- #wrapper-->
</BODY>