仮完成バージョン(40台同期)へアップグレード。

[digital-art/ssss.git] / client.html

diff --git a/client.html b/client.html
index 588c703..21f6319 100644 (file)
--- a/client.html
+++ b/client.html
@@ -7,43 +7,14 @@
                                background:#000000;
                        }
                </style>
+               <script src="../time/servertimeutil.js"></script>
                <script src="../control/plugin.js"></script>
                <script>
                        var pcNo=0;
-                       var startTime=0;
+                       var startTime=0,launchTime=0,ptn;
                        var audioCtx,audioBuffer;
                        
-                       var score=[
-                               [
-                                       {
-                                               time:280,
-                                               fade:0,
-                                               color:"#F00"
-                                       },{
-                                               time:800,
-                                               fade:0,
-                                               color:"#FF0"
-                                       },{
-                                               time:1300,
-                                               fade:0,
-                                               color:"#0BF"
-                                       }
-                               ],[
-                                       {
-                                               time:500,
-                                               fade:0,
-                                               color:"#00F"
-                                       },{
-                                               time:1500,
-                                               fade:1,
-                                               color:"#0FF"
-                                       },{
-                                               time:2500,
-                                               fade:0,
-                                               color:"#F0F"
-                                       }
-                               ]
-                       ];
+                       var score=[[{"time":703,"color":"#0BF","fade":0},{"time":760,"color":"#000","fade":0},{"time":1148,"color":"#0BF","fade":0},{"time":1225,"color":"#000","fade":0},{"time":1600,"color":"#0BF","fade":0},{"time":1688,"color":"#000","fade":0},{"time":2125,"color":"#0BF","fade":0},{"time":2194,"color":"#000","fade":0},{"time":2539,"color":"#0BF","fade":0},{"time":2617,"color":"#000","fade":0},{"time":2911,"color":"#0BF","fade":0},{"time":2993,"color":"#000","fade":0},{"time":3272,"color":"#0BF","fade":0},{"time":3336,"color":"#000","fade":0},{"time":3707,"color":"#0BF","fade":0},{"time":3779,"color":"#000","fade":0}],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[],[]];
                        function setFade(tr){
                                document.body.style.transition="background-color "+tr+"s ease 0s";
                        }
@@ -51,8 +22,7 @@
                                document.body.style.backgroundColor=cl;
                        }
                        function nowSec(){
-                               var d=new Date();
-                               return d.getTime() ;
+                               return timeUtil.getTime() ;
                        }
                        
                        function playAudio(b){
@@ -62,9 +32,20 @@
                                s.start();
                        }
                        
+                       function launch(){
+                               playAudio(audioBuffer);
+                               startTime=nowSec();
+                               requestAnimationFrame(function(){
+                                       picogram();
+                                       requestAnimationFrame(arguments.callee);
+                               });
+                       }
+                       
                        window.addEventListener('load',function(){
                                //自分の番号を取得
                                pcNo=parseInt(location.search.slice(1))||localStorage.sshCnb||0;
+                               localStorage.sshCnb=pcNo;
+                               console.log('Client No:'+pcNo);
                                
                                //AudioContext
                                audioCtx=new AudioContext();
@@ -80,15 +61,34 @@
                                        });
                                };
                                r.send();
+                               
+                               
+                               setInterval(function(){
+                                 var q=new XMLHttpRequest();
+                                 q.open('GET','command.json?'+new Date().getTime());
+                                 q.onload=function(){
+                                   var d=JSON.parse(q.response);
+                                   if(localStorage.ssh_ssss_eventid==d.id||d.id=='dummy'){
+                                     return false;
+                                   }
+                                   localStorage.ssh_ssss_eventid=d.id;
+                                   score=JSON.parse(d.pattern);
+                                   launchTime=d.starttime;
+                                   console.log('Event received.');
+                                   console.log('Now:'+nowSec()+' , Launch:'+launchTime);
+                                   var timing=setInterval(function(){
+                                     if(nowSec()>=launchTime){
+                                       console.log('Time is came,Music Start!');
+                                       document.body.style.cursor='none';
+                                       launch();
+                                       clearInterval(timing);
+                                     }
+                                   },1000/60);
+                                 };
+                                 q.send();
+                               },2000);
                        });
-                       window.addEventListener('click',function(){
-                               playAudio(audioBuffer);
-                               startTime=nowSec();
-                               requestAnimationFrame(function(){
-                                       picogram();
-                                       requestAnimationFrame(arguments.callee);
-                               });
-                       });
+                       window.addEventListener('click',launch);
                </script>
                <script src="colorCtrl.js"></script>
        </head>