tiger.js 3.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
  1. /* jshintbrowser: true */
  2. var fingerMatch = {
  3. tiger: 2,
  4. fly: 1
  5. };
  6. var fingers, score;
  7. var nextSymbol, currentSymbol, running;
  8. var startEvent, endEvent;
  9. var timerStart, timerLength;
  10. var shareDesc;
  11. timerLength = 15000; // 15s
  12. function g( id ) {
  13. return document.getElementById( id );
  14. }
  15. //g( 'start' ).onclick = start;
  16. function start() {
  17. $("#layer2").hide();
  18. $("#layer3").show();
  19. g( 'teach' ).style.display = 'none';
  20. g( 'start' ).style.display = 'none';
  21. g( 'share' ).style.display = 'none';
  22. //g( 'more' ).style.display = 'none';
  23. g( 'game' ).style.display = 'block';
  24. g( 'timer' ).style.display = 'block';
  25. g('score').innerHTML = '战果:0';
  26. g( 'timer' ).innerHTML = '15,00';
  27. score = 0;
  28. fingers = 0;
  29. timerStart = 0;
  30. nextSymbol = generate();
  31. next();
  32. running = true;
  33. document.title = '父亲节到了,抢礼物送给老爸!';
  34. }
  35. function stop() {
  36. var shareDesc = '父亲节到了,给老爸抢礼物,我抢到了'+score+'个,快来挑战我吧!';
  37. running = false;
  38. g( 'timer' ).innerHTML = "00,00";
  39. document.title = shareDesc;
  40. $(".layer4_result").html('给老爸抢礼物,好厉害抢到 <strong> ' + score + '</strong> 个!牛叉~')
  41. $("#layer3").hide();
  42. $("#layer4").show();
  43. }
  44. function next() {
  45. currentSymbol = nextSymbol;
  46. nextSymbol = generate();
  47. update();
  48. }
  49. function generate() {
  50. return Math.random() > 0.5 ? 'red' : 'green';
  51. }
  52. function update() {
  53. g( 'current' ).src = 'img/'+currentSymbol + '.png';
  54. g('next').src = 'img/' + nextSymbol + '.png';
  55. }
  56. function slash( color, duration ) {
  57. duration = duration || 100;
  58. g( 'slash' ).style.background = color;
  59. g( 'slash' ).style.webkitAnimationDuration = duration + 'ms';
  60. g( 'slash' ).classList.add( 'play' );
  61. setTimeout( function () {
  62. g( 'slash' ).classList.remove( 'play' );
  63. }, duration );
  64. }
  65. function clock() {
  66. var ellapsed = +new Date() - timerStart;
  67. var left = ( timerLength - ellapsed ) / 1000;
  68. if ( left <= 0 ) {
  69. stop();
  70. } else if ( running ) {
  71. g( 'timer' ).innerHTML = left.toFixed( 2 );
  72. setTimeout( clock );
  73. }
  74. }
  75. if ( 'ontouchstart' in document.body ) {
  76. startEvent = 'touchstart';
  77. endEvent = 'touchend';
  78. } else {
  79. startEvent = 'mousedown';
  80. endEvent = 'mouseup';
  81. }
  82. g( 'game' ).addEventListener( startEvent, function ( e ) {
  83. e.preventDefault();
  84. if ( !running ) return;
  85. fingers += e.touches ? e.touches.length : 1;
  86. //console.log(fingers);
  87. if ( !timerStart ) {
  88. timerStart = +new Date();
  89. clock();
  90. }
  91. } );
  92. g( 'game' ).addEventListener( endEvent, function ( e ) {
  93. e.preventDefault();
  94. if ( !running || !fingers ) return;
  95. if ( ( fingers > 1 && currentSymbol == 'red' ) ||
  96. ( fingers == 1 && currentSymbol == 'green' ) ) {
  97. fingers = 0;
  98. next();
  99. g( 'score' ).innerHTML = '战果:' + ( ++score );
  100. slash( 'red' );
  101. g( 'current' ).style.webkitTransform = ( score % 2 ) ? 'scale(-1, 1)' : '';
  102. } else {
  103. slash( 'red', 3000 );
  104. stop();
  105. }
  106. fingers = 0;
  107. } );
  108. //g( 'game' ).addEventListener( 'contextmenu', function ( e ) {
  109. // e.preventDefault();
  110. //} );
  111. //g( 'share' ).onclick = function () {
  112. //
  113. // g( 'share-mask' ).style.display = 'block';
  114. //
  115. //};
  116. //if (endgame.env.ee) {
  117. // g( 'share' ).style.display = 'none';
  118. //}
  119. //g( 'share-mask' ).addEventListener( startEvent, function () {
  120. // g( 'share-mask' ).style.display = 'none';
  121. //} );
  122. function more() {
  123. window.location.href = v;
  124. }