front_idill/src/index.html
changeset 79 9eff85166868
parent 77 205409da0f32
equal deleted inserted replaced
78:52277fe2279c 79:9eff85166868
    33     
    33     
    34     <body>
    34     <body>
    35         <!-- Scripts principaux. -->
    35         <!-- Scripts principaux. -->
    36         <script type="text/javascript">
    36         <script type="text/javascript">
    37             function loadMenu(textElements)
    37             function loadMenu(textElements)
    38 			{
    38             {
    39 				//Si on est sur une tablette, on passe directement dans le mode d'interaction tablette.
    39                 //Si on est sur une tablette, on passe directement dans le mode d'interaction tablette.
    40 				if('ontouchstart' in document.documentElement)
    40                 if('ontouchstart' in document.documentElement)
    41 				{
    41                 {
    42 					window.location.replace('./index_souris.html');
    42                     window.location.replace('./index_souris.html');
    43 				}
    43                 }
    44 				
    44                 
    45 				var form = "<div id='choice'><p id='caution'>" + textElements.caution + "</p><input id='MI' type='button' /><br ><input id='KI' type='button' /></div>";
    45                 var form = "<div id='choice'><p id='caution'>" + textElements.caution + "</p><input id='MI' type='button' /><br ><input id='KI' type='button' /></div>";
    46 				
    46                 
    47 				$('body').css({
    47                 $('body').css({
    48 				'background-image': 'url("./img/background.png")',
    48                 'background-image': 'url("./img/background.png")',
    49 				'background-repeat': 'repeat'
    49                 'background-repeat': 'repeat'
    50 				});
    50                 });
    51 				$('body').append(form);
    51                 $('body').append(form);
    52 				
    52                 
    53 				$('#caution').css(
    53                 $('#caution').css(
    54 				{
    54                 {
    55 					color: '#FFF',
    55                     color: '#FFF',
    56 					'font-size': '20px'
    56                     'font-size': '20px'
    57 				});
    57                 });
    58 				$('#MI').attr('value', textElements.mouse);
    58                 $('#MI').attr('value', textElements.mouse);
    59 				$('#MI').css(
    59                 $('#MI').css(
    60 				{
    60                 {
    61 					'padding': '30px',
    61                     'padding': '30px',
    62 					'font-size': '20px'
    62                     'font-size': '20px'
    63 				
    63                 
    64 				}).click(function()
    64                 }).click(function()
    65 				{
    65                 {
    66 					window.location.replace('./index_souris.html');
    66                     window.location.replace('./index_souris.html');
    67 				});
    67                 });
    68 				$('#KI').attr('value', textElements.kinect);
    68                 $('#KI').attr('value', textElements.kinect);
    69 				$('#KI').css(
    69                 $('#KI').css(
    70 				{
    70                 {
    71 					'padding': '30px',
    71                     'padding': '30px',
    72 					'font-size': '20px'
    72                     'font-size': '20px'
    73 				}).click(function()
    73                 }).click(function()
    74 				{
    74                 {
    75 					window.location.replace('./index_kinect.html');
    75                     window.location.replace('./index_kinect.html');
    76 				});
    76                 });
    77 				
    77                 
    78 				$('#choice').css(
    78                 $('#choice').css(
    79 				{
    79                 {
    80 					position: 'absolute',
    80                     position: 'absolute',
    81 					width: '60%'
    81                     width: '60%'
    82 				});
    82                 });
    83 				$('#choice').css(
    83                 $('#choice').css(
    84 				{
    84                 {
    85 					left: ($(window).width() - $('#choice').width()) / 2,
    85                     left: ($(window).width() - $('#choice').width()) / 2,
    86 					'text-align': 'center',
    86                     'text-align': 'center',
    87 					top: ($(window).height() - $('#choice').height()) / 2
    87                     top: ($(window).height() - $('#choice').height()) / 2
    88 				});
    88                 });
    89 			}
    89             }
    90 			
    90             
    91             //Si la page a chargé, on charge le menu de sélection de mode.
    91             //Si la page a chargé, on charge le menu de sélection de mode.
    92             $(document).ready(function ()
    92             $(document).ready(function ()
    93             {
    93             {
    94 				//Langues gérées.
    94                 //Langues gérées.
    95 				var langs = ["fr", "en"];
    95                 var langs = ["fr", "en"];
    96 				var lang = navigator.language;
    96                 var lang = navigator.language;
    97 				
    97                 
    98 				//Si la langue n'est pas gérée, on met l'anglais pas défaut.
    98                 //Si la langue n'est pas gérée, on met l'anglais pas défaut.
    99 				if(langs.indexOf(lang) == -1)
    99                 if(langs.indexOf(lang) == -1)
   100 				{
   100                 {
   101 					lang = "en";
   101                     lang = "en";
   102 				}
   102                 }
   103 				
   103                 
   104 				var path = 'lang/' + lang + '.json';
   104                 var path = 'lang/' + lang + '.json';
   105 				var textElements;
   105                 var textElements;
   106 				$.getJSON(path, function(data)
   106                 $.getJSON(path, function(data)
   107 				{
   107                 {
   108 					textElements = data.choice;
   108                     textElements = data.choice;
   109 					console.log(textElements);
   109                     console.log(textElements);
   110 					loadMenu(textElements);
   110                     loadMenu(textElements);
   111 				});
   111                 });
   112             });
   112             });
   113         </script>
   113         </script>
   114     </body>
   114     </body>
   115 </html>
   115 </html>