pyrlspitepaste

hld snail code

Mar 30th, 2018
740
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. =====================================================
  2. === paste the following immediately after <style> ===
  3. =====================================================
  4. #snail-container {
  5.   bottom:0;
  6.   width:100%;
  7.   position:fixed;
  8.   pointer-events:none;
  9. }
  10.  
  11. .snail {
  12.   display:none;
  13.   z-index:100;
  14.   pointer-events:auto;
  15.   position:absolute;
  16.   bottom:0;
  17. }
  18.  
  19. ===============================================
  20. === paste the rest immediately after <body> ===
  21. ===============================================
  22. <div id="snail-container">
  23.   <img src="https://i.imgur.com/hBqxGXP.gif" class="snail" id="snailidle" title="click me! double click to send me away! code by pyrlspite"/>
  24.   <img src="https://i.imgur.com/oid5qEH.gif" class="snail" id="snailmove" title="click me! double click to send me away! code by pyrlspite"/>
  25.   <img src="https://i.imgur.com/XExyMFf.png" id="snailheart" style="display:none; position:absolute; z-index:101; bottom:0; left:0; pointer-events:none;"/>
  26. </div>
  27. <!-- snail script by pyrlspite.tumblr.com -->
  28. <script>
  29. var currentsnail = "snailidle", snaildir = "right", snailpos = 0, snailcounter = 0, heartcounter = 0, heartpos = 0, snailtimer = setInterval(snailstep, 15);
  30. var snailmoveid = document.getElementById("snailmove");
  31. var snailidleid = document.getElementById("snailidle");
  32. var snailheartid = document.getElementById("snailheart");
  33. function showsnail(snail) {
  34.   document.getElementById(currentsnail).style.display = "none";
  35.   document.getElementById(snail).style.display = "block";
  36.   currentsnail = snail;
  37. }
  38. function flipsnail(dir) {
  39. if(dir == "right"){
  40.   snailmoveid.style.transform = "scaleX(1)";
  41.   snailidleid.style.transform = "scaleX(1)";
  42.   snaildir = "right";
  43. } else if(dir == "left"){
  44.   snailmoveid.style.transform = "scaleX(-1)";
  45.   snailidleid.style.transform = "scaleX(-1)";
  46.   snaildir = "left";
  47. }
  48. }
  49. snailmoveid.onclick = function() {placeheart()};
  50. snailidleid.onclick = function() {placeheart()};
  51. snailmoveid.ondblclick = function() {goodbye()};
  52. snailmoveid.ondblclick = function() {goodbye()};
  53. function placeheart() {
  54.     heartcounter = Math.floor((Math.random() * 25) + 10);
  55.     heartpos = Math.floor((Math.random() * 20) + 2);
  56.     snailheartid.style.left = (snailpos + Math.floor((Math.random() * 30) - 10)) + 'px';
  57.     snailheartid.style.bottom = heartpos + 'px';
  58.     snailheartid.style.display = "block";
  59. }
  60. function gensnaildir() {
  61.   if(Math.random() >= 0.5) {
  62.     return "left";
  63.   } else {
  64.     return "right";
  65.   }
  66. }
  67. function gensnailidle() {
  68.   if(Math.random() >= 0.5) {
  69.     return "snailidle";
  70.   } else {
  71.     return "snailmove";
  72.   }
  73. }
  74. function snailstep() {
  75. if(snailcounter == 0) {
  76.   snailcounter = Math.floor((Math.random() * 100) + 10);
  77.   flipsnail(gensnaildir());
  78.   showsnail(gensnailidle());
  79. }
  80. if(snailpos <= 0) {
  81.     flipsnail("right");
  82. }
  83. if(snailpos >= (document.getElementById("snail-container").offsetWidth - document.getElementById(currentsnail).offsetWidth)) {
  84.   flipsnail("left");
  85. }
  86. if(currentsnail == "snailidle") {
  87.     snailcounter--;
  88. } else {
  89.     if(snaildir == "left") {
  90.         snailpos--;
  91.     } else {
  92.         snailpos++;
  93.     }
  94.   snailidleid.style.left = snailpos + 'px';
  95.   snailmoveid.style.left = snailpos + 'px';
  96.   snailcounter--;
  97. }
  98. heartpos++;
  99. snailheartid.style.bottom = heartpos + 'px';
  100. heartcounter--;
  101. if(heartcounter <= 0) {
  102.     snailheartid.style.display = "none";
  103. }
  104. }
  105. function goodbye() {
  106.     clearInterval(snailtimer);
  107.     if(currentsnail == snailidle) {
  108.         showsnail(snailmove);
  109.     }
  110.     if(snaildir == "left") {
  111.         flipsnail("right");
  112.     }
  113.     snailtimer = setInterval(snailGoodbye, 5);
  114. }
  115. function snailGoodbye() {
  116.     snailpos++;
  117.     snailmoveid.style.left = snailpos + 'px';
  118.     heartpos++;
  119.     snailheartid.style.bottom = heartpos + 'px';
  120.     heartcounter--;
  121.     if(heartcounter <= 0) {
  122.         snailheartid.style.display = "none";
  123.     }
  124.     if(snailpos >= (document.getElementById("snail-container").offsetWidth)) {
  125.         clearInterval(snailGoodbye);
  126.     }
  127. }
  128. </script>
Add Comment
Please, Sign In to add comment