API tools faq
paste
pyrlspitepaste

hld snail code

pyrlspitepaste
Mar 30th, 2018
755
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 3.96 KB | None | 0 0
raw download clone embed print report
  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
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!