SHARE
TWEET

Untitled

a guest Jul 15th, 2019 69 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. //empty ledge dont need to set the size in javascript it handles growing it accordingle
  2. var ledge = [];
  3. //this will change the rendor size play with the numbers here!
  4. const SCALE = 4;
  5.  
  6. //I needed to create these to get it on the website the way I wanted
  7. var cnv;
  8. var canvasDiv;
  9.  
  10. //this is part of the processing library we define this function
  11. // and the processing library calls it to initialize stuff
  12. function setup() {
  13.  
  14.   //set up to fit in HTML DIV how come it only works when I have an ID of test?
  15.   //this was the only way I could figure out how to make it work this attaches it to the
  16.   //div in the index.html
  17.   canvasDiv = createDiv();
  18.   canvasDiv.id("waterCanvas");
  19.   canvasDiv.parent("waterCanvasDiv");
  20.  
  21.   //processing library that you can draw on
  22.   cnv = createCanvas(canvasDiv.size().width, 400);
  23.   //contained in the div created above
  24.   cnv.parent("waterCanvas");
  25.   //initialize array the size changes by the scale to fit in the width
  26.   for(var i = 0; i<width/(8*SCALE);i++){
  27.     ledge[i] = new Drop((i*8*SCALE)+((width%(8*SCALE))/2), SCALE);
  28.   }
  29.  
  30. }
  31.  
  32. //this is another processing function to define
  33. // that gets called 60 frames a second
  34. function draw() {
  35.     //reverse color scheme on button click
  36.     if(mouseIsPressed){
  37.       background(133);
  38.     }else {
  39.       background(0);
  40.     }
  41.  
  42.  
  43.   addDrop();
  44.  
  45.   for(var i = 0; i< ledge.length; i++){
  46.     ledge[i].render();
  47.   }
  48.  
  49.   update();
  50. }
  51.  
  52. // TODO: this should shrink the length of the ledge array
  53. function windowResized() {
  54.   resizeCanvas(canvasDiv.size().width, 400);
  55. }
  56.  
  57. //I only use one ledge array and each section be of a specific type
  58. //but this is jsut an easy way to get started. I could use this logic just for ledge
  59. //when it converts to a drip or a splash I should just push it on a list  and iterate the list
  60. // and pop stuff off the list when end of life... oh well later maybe.
  61. function update(){
  62.   var s = ledge.length;
  63.  
  64.   //converts Drips to Splashes
  65.   for(var i = 0; i < s; i++){
  66.     if ((ledge[i] instanceof Drip) && ledge[i].hitBottom()){
  67.       ledge[i] = new Splash(ledge[i].getX(), SCALE);
  68.     }
  69.  
  70.     //converts splashes back to Drops
  71.     if ((ledge[i] instanceof Splash) && ledge[i].isComplete()){
  72.       ledge[i] = new Drop((i*8*SCALE)+((width%(8*SCALE))/2), SCALE);
  73.     }
  74.  
  75.   }
  76. }
  77.  
  78. // this will add a random drop  to a part of the ledge if it is of type Drop than
  79. //we will add the water. :)
  80. function addDrop(){
  81.   var i = int(random(0, ledge.length));
  82.  
  83.   if (ledge[i] instanceof Drop){
  84.     if(ledge[i].addWater()){
  85.       ledge[i] = new Drip(ledge[i].getX()+ (8*SCALE)/2, SCALE);
  86.     }
  87.   }
  88. }
RAW Paste Data
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!
 
Top