gonzopi

git clone https://git.tarina.org/gonzopi
Log | Files | Refs | README | LICENSE

index.html (13886B)


      1 $def with (films, cameras, menu, selected,name,scene,shot,take,str,randhash,thumb,vumetermessage,func,filmfolder)
      2 
      3 <script>
      4 function Get(yourUrl){
      5         var Httpreq = new XMLHttpRequest(); // a new request
      6         Httpreq.open("GET",yourUrl,false);
      7         Httpreq.send(null);
      8         return Httpreq.responseText;          
      9 }
     10 (function($$)
     11 {
     12     $$(document).ready(function()
     13     {
     14         var refreshtime = 1000;
     15         var oldrefreshtime = 100;
     16         idleTime = 0;
     17         //Increment the idle time counter every second.
     18         var idleInterval = setInterval(timerIncrement, 1000);
     19         function timerIncrement()
     20         {
     21             idleTime++;
     22             if (idleTime > 1)
     23             {
     24                 refreshtime = 1000;
     25             }
     26             if (oldrefreshtime != refreshtime)
     27             {
     28                 refreshtime = 500;
     29             }
     30             else
     31             {
     32                 refreshtime = 100;
     33             }
     34             oldrefreshtime = refreshtime;
     35         }
     36 
     37         $$.ajaxSetup(
     38         {
     39             cache: false,
     40             beforeSend: function() {
     41                 $$('#content').hide();
     42                 $$('#loading').show();
     43             },
     44             complete: function() {
     45                 $$('#loading').hide();
     46                 $$('#content').show();
     47             },
     48             success: function() {
     49                 $$('#loading').hide();
     50                 $$('#content').show();
     51             }
     52         });
     53 
     54         var myFunction = function(){
     55                 refresh();
     56                 console.log(refreshtime);
     57                 clearInterval(interval);
     58                 interval = setInterval(myFunction, refreshtime);
     59         }
     60         var interval = setInterval(myFunction, refreshtime);
     61     });
     62 
     63     function refresh(){
     64         var $$container = $$("#menu2");
     65         $$container.load('/static/menu.html');
     66         $$.ajax({
     67             method: "GET",
     68             type: "Content-type",
     69             url:"/api",
     70             success: function(result) {
     71             },
     72             error: function(result) {
     73             console.log('error', result);
     74             }
     75         })
     76     }
     77     $$(this).on('keydown', function (event) {
     78         idleTime = 0;
     79         refreshtime = 10;
     80     });
     81 })(jQuery);
     82 
     83 $$(document).on('keydown', function (event) {
     84     console.log('error', event.which);
     85     if (event.which == 37) {
     86         $$('#LEFT').trigger('click');
     87     } else if (event.which == 39) {
     88         $$('#RIGHT').trigger('click');
     89     } else if (event.which == 38) {
     90         $$('#UP').trigger('click');
     91     } else if (event.which == 40) {
     92         $$('#DOWN').trigger('click');
     93     } else if (event.which == 33) {
     94         $$('#RECORD').trigger('click');
     95     } else if (event.which == 32) {
     96         $$('#RECORD').trigger('click');
     97     } else if (event.which == 34) {
     98         $$('#RETAKE').trigger('click');
     99     } else if (event.which == 9) {
    100         $$('#VIEW').trigger('click');
    101     } else if (event.which == 46) {
    102         $$('#DELETE').trigger('click');
    103     } else if (event.which == 13) {
    104         $$('#MIDDLE').trigger('click');
    105     } else if (event.which == 97) {
    106         $$('#CAMERA0').trigger('click');
    107     } else if (event.which == 98) {
    108         $$('#CAMERA1').trigger('click');
    109     } else if (event.which == 99) {
    110         $$('#CAMERA2').trigger('click');
    111     } else if (event.which == 100) {
    112         $$('#CAMERA3').trigger('click');
    113     } else if (event.which == 101) {
    114         $$('#CAMERA4').trigger('click');
    115     } else if (event.which == 102) {
    116         $$('#CAMERA5').trigger('click');
    117     } else if (event.which == 103) {
    118         $$('#CAMERA6').trigger('click');
    119     } else if (event.which == 104) {
    120         $$('#CAMERA7').trigger('click');
    121     } else if (event.which == 105) {
    122         $$('#CAMERA8').trigger('click');
    123     } else if (event.which == 106) {
    124         $$('#CAMERA9').trigger('click');
    125     } else if (event.which == 229) {
    126         $$('#CAMERA0').trigger('click');
    127     } else if (event.which == 98) {
    128         $$('#CAMERA1').trigger('click');
    129     } else if (event.which == 99) {
    130         $$('#CAMERA2').trigger('click');
    131     } else if (event.which == 100) {
    132         $$('#CAMERA3').trigger('click');
    133     } else if (event.which == 101) {
    134         $$('#CAMERA4').trigger('click');
    135     } else if (event.which == 102) {
    136         $$('#CAMERA5').trigger('click');
    137     } else if (event.which == 103) {
    138         $$('#CAMERA6').trigger('click');
    139     } else if (event.which == 104) {
    140         $$('#CAMERA7').trigger('click');
    141     } else if (event.which == 105) {
    142         $$('#CAMERA8').trigger('click');
    143     } else if (event.which == 106) {
    144         $$('#CAMERA9').trigger('click');
    145     } else if (event.which == 77) {
    146         $$('#MOVE').trigger('click');
    147     } else if (event.which == 67) {
    148         $$('#COPY').trigger('click');
    149     } else if (event.which == 80) {
    150         $$('#PASTE').trigger('click');
    151     }
    152 });
    153 </script>
    154 connected 
    155 <pre>use keyboard to control</pre>
    156 $for i in cameras:
    157     $i
    158 <br>
    159 <div id="controller">
    160 <a id="VIEW">VIEW</a> <a id="UP">UP</a> <a id="RECORD">RECORD</a><br>
    161 <a id="LEFT">LEFT</a> <a id="MIDDLE">MIDDLE</a> <a id="RIGHT">RIGHT</a><br>
    162 <a id="DELETE">DELETE</a> <a id="DOWN">DOWN</a> <a id="RETAKE">RETAKE</a><br>
    163 </div>
    164 <div id="controller2">
    165 <a id="CAMERA0">CAM1</a> <a id="CAMERA1">CAM2</a> <a id="CAMERA2">CAM3</a><br>
    166 <a id="CAMERA3">CAM4</a> <a id="CAMERA4">CAM5</a> <a id="CAMERA5">CAM6</a><br>
    167 </div>
    168 <div id="controller3">
    169 <a id="MOVE">MOVE</a> <a id="COPY">COPY</a> <a id="PASTE">PASTE</a><br>
    170 </div>
    171 
    172 <div id="menu2" style="margin:0 auto; width:99%" ></div>
    173 <div id="menu" style="margin:0 auto; width:99%">
    174 </div>
    175 <br>
    176 <br>
    177 <input></input>
    178 
    179 $if thumb != '':
    180     $ picture= '/'+filmfolder + name + "/scene" + str(scene).zfill(3) + "/shot" + str(shot).zfill(3) + "/picture" + str(take).zfill(3) + ".jpeg"
    181 $else:
    182     $ picture= '/'+filmfolder + name + "/scene" + str(scene).zfill(3) + "/shot" + str(shot).zfill(3) + "/take" + str(take).zfill(3) + ".jpeg"
    183 
    184 
    185 $ take_link='/'+filmfolder + name + "/scene" + str(scene).zfill(3) + "/shot" + str(shot).zfill(3) + "/take" + str(take).zfill(3) + ".mp4"
    186 $ scene_link='/'+filmfolder + name + "/scene" + str(scene).zfill(3) + "/scene.mp4"
    187 $ film_link='/'+filmfolder + name + "/" +name+ ".mp4"
    188 $if thumb != '':
    189     $if selected == 0:
    190         <a href='$film_link'><img width="80%" src="$picture?$randhash"/></a><br>
    191     $elif selected == 1:
    192         <a href='$scene_link'><img width="80%" src="$picture?$randhash"/></a><br>
    193     $elif selected > 1:
    194         <a href='$take_link'><img width="80%" src="$picture?$randhash"/></a><br>
    195     <br>
    196 
    197 <script>
    198 $$('#CAMERA0').on('click', function () {
    199     $$.ajax({
    200     method: "GET",
    201     type: "Content-type",
    202     url:"/api?func=camera0",
    203     success: function(result) {
    204     },
    205     error: function(result) {
    206     console.log('error', result);
    207     }
    208 })
    209 });
    210 $$('#CAMERA1').on('click', function () {
    211     $$.ajax({
    212     method: "GET",
    213     type: "Content-type",
    214     url:"/api?func=camera1",
    215     success: function(result) {
    216     },
    217     error: function(result) {
    218     console.log('error', result);
    219     }
    220 })
    221 });
    222 $$('#CAMERA2').on('click', function () {
    223     $$.ajax({
    224     method: "GET",
    225     type: "Content-type",
    226     url:"/api?func=camera2",
    227     success: function(result) {
    228     },
    229     error: function(result) {
    230     console.log('error', result);
    231     }
    232 })
    233 });
    234 $$('#CAMERA3').on('click', function () {
    235     $$.ajax({
    236     method: "GET",
    237     type: "Content-type",
    238     url:"/api?func=camera3",
    239     success: function(result) {
    240     },
    241     error: function(result) {
    242     console.log('error', result);
    243     }
    244 })
    245 });
    246 $$('#CAMERA4').on('click', function () {
    247     $$.ajax({
    248     method: "GET",
    249     type: "Content-type",
    250     url:"/api?func=camera4",
    251     success: function(result) {
    252     },
    253     error: function(result) {
    254     console.log('error', result);
    255     }
    256 })
    257 });
    258 $$('#CAMERA5').on('click', function () {
    259     $$.ajax({
    260     method: "GET",
    261     type: "Content-type",
    262     url:"/api?func=camera5",
    263     success: function(result) {
    264     },
    265     error: function(result) {
    266     console.log('error', result);
    267     }
    268 })
    269 });
    270 $$('#CAMERA6').on('click', function () {
    271     $$.ajax({
    272     method: "GET",
    273     type: "Content-type",
    274     url:"/api?func=camera6",
    275     success: function(result) {
    276     },
    277     error: function(result) {
    278     console.log('error', result);
    279     }
    280 })
    281 });
    282 $$('#CAMERA7').on('click', function () {
    283     $$.ajax({
    284     method: "GET",
    285     type: "Content-type",
    286     url:"/api?func=camera7",
    287     success: function(result) {
    288     },
    289     error: function(result) {
    290     console.log('error', result);
    291     }
    292 })
    293 });
    294 
    295 $$('#LEFT').on('click', function () {
    296     $$.ajax({
    297     method: "GET",
    298     type: "Content-type",
    299     url:"/api?func=left",
    300     success: function(result) {
    301     },
    302     error: function(result) {
    303     console.log('error', result);
    304     }
    305 })
    306 });
    307 $$('#RIGHT').on('click', function () {
    308     $$.ajax({
    309     method: "GET",
    310     type: "Content-type",
    311     url:"/api?func=right",
    312     success: function(result) {
    313     },
    314     error: function(result) {
    315     console.log('error', result);
    316     }
    317 })
    318 });
    319 $$('#DOWN').on('click', function () {
    320     $$.ajax({
    321     method: "GET",
    322     type: "Content-type",
    323     url:"/api?func=down",
    324     success: function(result) {
    325     },
    326     error: function(result) {
    327     console.log('error', result);
    328     }
    329 })
    330 });
    331 $$('#UP').on('click', function () {
    332     $$.ajax({
    333     method: "GET",
    334     type: "Content-type",
    335     url:"/api?func=up",
    336     success: function(result) {
    337     },
    338     error: function(result) {
    339     console.log('error', result);
    340     }
    341 })
    342 });
    343 $$('#RECORD').on('click', function () { 
    344     $$.ajax({
    345     method: "GET",
    346     type: "Content-type",
    347     url:"/api?func=record",
    348     success: function(result) {
    349     },
    350     error: function(result) {
    351     console.log('error', result);
    352     }
    353 })
    354 });
    355 $$('#RETAKE').on('click', function () { 
    356     $$.ajax({
    357     method: "GET",
    358     type: "Content-type",
    359     url:"/api?func=retake",
    360     success: function(result) {
    361     },
    362     error: function(result) {
    363     console.log('error', result);
    364     }
    365 })
    366 });
    367 $$('#DELETE').on('click', function () { 
    368     $$.ajax({
    369     method: "GET",
    370     type: "Content-type",
    371     url:"/api?func=delete",
    372     success: function(result) {
    373     },
    374     error: function(result) {
    375     console.log('error', result);
    376     }
    377 })
    378 });
    379 $$('#VIEW').on('click', function () { 
    380     $$.ajax({
    381     method: "GET",
    382     type: "Content-type",
    383     url:"/api?func=view",
    384     success: function(result) {
    385     },
    386     error: function(result) {
    387     console.log('error', result);
    388     }
    389 })
    390 });
    391 $$('#MIDDLE').on('click', function () { 
    392     $$.ajax({
    393     method: "GET",
    394     type: "Content-type",
    395     url:"/api?func=middle",
    396     success: function(result) {
    397     },
    398     error: function(result) {
    399     console.log('error', result);
    400     }
    401 })
    402 });
    403 $$('#CAMERA0').on('click', function () {
    404     $$.ajax({
    405     method: "GET",
    406     type: "Content-type",
    407     url:"/api?func=camera0",
    408     success: function(result) {
    409     },
    410     error: function(result) {
    411     console.log('error', result);
    412     }
    413 })
    414 });
    415 $$('#CAMERA1').on('click', function () { 
    416     $$.ajax({
    417     method: "GET",
    418     type: "Content-type",
    419     url:"/api?func=camera1",
    420     success: function(result) {
    421     },
    422     error: function(result) {
    423     console.log('error', result);
    424     }
    425 })
    426 });
    427 $$('#CAMERA2').on('click', function () { 
    428     $$.ajax({
    429     method: "GET",
    430     type: "Content-type",
    431     url:"/api?func=camera2",
    432     success: function(result) {
    433     },
    434     error: function(result) {
    435     console.log('error', result);
    436     }
    437 })
    438 });
    439 $$('#CAMERA3').on('click', function () { 
    440     $$.ajax({
    441     method: "GET",
    442     type: "Content-type",
    443     url:"/api?func=camera3",
    444     success: function(result) {
    445     },
    446     error: function(result) {
    447     console.log('error', result);
    448     }
    449 })
    450 });
    451 $$('#CAMERA4').on('click', function () { 
    452     $$.ajax({
    453     method: "GET",
    454     type: "Content-type",
    455     url:"/api?func=camera4",
    456     success: function(result) {
    457     },
    458     error: function(result) {
    459     console.log('error', result);
    460     }
    461 })
    462 });
    463 $$('#CAMERA5').on('click', function () { 
    464     $$.ajax({
    465     method: "GET",
    466     type: "Content-type",
    467     url:"/api?func=camera5",
    468     success: function(result) {
    469     },
    470     error: function(result) {
    471     console.log('error', result);
    472     }
    473 })
    474 });
    475 $$('#CAMERA6').on('click', function () { 
    476     $$.ajax({
    477     method: "GET",
    478     type: "Content-type",
    479     url:"/api?func=camera6",
    480     success: function(result) {
    481     },
    482     error: function(result) {
    483     console.log('error', result);
    484     }
    485 })
    486 });
    487 $$('#CAMERA7').on('click', function () { 
    488     $$.ajax({
    489     method: "GET",
    490     type: "Content-type",
    491     url:"/api?func=camera7",
    492     success: function(result) {
    493     },
    494     error: function(result) {
    495     console.log('error', result);
    496     }
    497 })
    498 });
    499 $$('#CAMERA8').on('click', function () { 
    500     $$.ajax({
    501     method: "GET",
    502     type: "Content-type",
    503     url:"/api?func=camera8",
    504     success: function(result) {
    505     },
    506     error: function(result) {
    507     console.log('error', result);
    508     }
    509 })
    510 });
    511 $$('#CAMERA9').on('click', function () { 
    512     $$.ajax({
    513     method: "GET",
    514     type: "Content-type",
    515     url:"/api?func=camera9",
    516     success: function(result) {
    517     },
    518     error: function(result) {
    519     console.log('error', result);
    520     }
    521 })
    522 });
    523 $$('#MOVE').on('click', function () { 
    524     $$.ajax({
    525     method: "GET",
    526     type: "Content-type",
    527     url:"/api?func=move",
    528     success: function(result) {
    529     },
    530     error: function(result) {
    531     console.log('error', result);
    532     }
    533 })
    534 });
    535 $$('#COPY').on('click', function () { 
    536     $$.ajax({
    537     method: "GET",
    538     type: "Content-type",
    539     url:"/api?func=copy",
    540     success: function(result) {
    541     },
    542     error: function(result) {
    543     console.log('error', result);
    544     }
    545 })
    546 });
    547 $$('#PASTE').on('click', function () { 
    548     $$.ajax({
    549     method: "GET",
    550     type: "Content-type",
    551     url:"/api?func=paste",
    552     success: function(result) {
    553     },
    554     error: function(result) {
    555     console.log('error', result);
    556     }
    557 })
    558 });
    559 
    560 </script>
    561