topical media & game development

topical media & game development
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _
#javascript-processing-example-basic-data-charactersstrings.htm / htm

  <!DOCTYPE html>
  <html><head>
  <script src="javascript-processing-example-processing.js"></script>
  <script src="javascript-processing-example-init.js"></script>
  <link rel="stylesheet" href="javascript-processing-example-style.css">
  </head><body><h1><a href="http://ejohn.org/blog/processingjs/">Processing.js</a></h1>
  <h2>CharactersStrings</h2>
  
  <p>Click on the image to give it focus and then type letters to
  shift the location of the image. 
  Characters are typographic symbols such as A, d, and %.  
  The character datatype, abbreviated as char, stores letters and 
  symbols in the Unicode format, a coding system developed to support 
  a variety of world languages. Characters are distinguished from other
  symbols by putting them between single quotes ('P'). 
  A string is a sequence of characters. A string is noted by surrounding 
  a group of letters with double quotes ("Processing"). 
  Chars and strings are most often used with the keyboard methods, 
  to display text to the screen, and to load images or files.</p>
  
  <p><a href="http://processing.org/learning/basics/charactersstrings.html"><b>Original Processing.org Example:</b> CharactersStrings</a><br>
  <script type="application/processing">
  PImage frog;
  PFont fontA;
  int lettersize = 90;
  int xoffset;
  char letter;
  
  void setup() 
  {
    size(200, 200);
    fontA = loadFont("Arial"); 
    textFont(fontA); 
    textSize(lettersize);
      
    // The String datatype must be capitalized because it is a complex datatype.
    // A String is actually a class with its own methods, some of which are
    // featured below.
    String name= "rathausFrog";
    String extension = ".jpg";
    int nameLength = name.length();
    println("The length of " + name + " is " + nameLength + ".");
    name = name.concat(extension);
    nameLength = name.length();
    println("The length of " + name + " is " + nameLength + ".");
  
    // The parameter for the loadImage() method must be a string
    // This line could also be written "frog = loadImage("rathausFrog.jpg");
    frog = loadImage(name);
  }
  
  void draw() 
  {
    background(51); // Set background to dark gray
    
    image(frog, xoffset, 0);
    
    // Draw an X
    line(0, 0, width, height);  
    line(0, height, width, 0); 
    
    // Get the width of the letter
    int letterWidth = int(fontA.width(letter) * lettersize);
        
    // Draw the letter to the center of the screen
    text(letter, width/2-letterWidth/2, height/2);
  }
  
  void keyPressed()
  {
    // The variable "key" always contains the value of the most recent key pressed.
    // If the key is an upper or lowercase letter between 'A' and 'z'
    // the image is shifted to the corresponding value of that key
    if(key >= 'A' && key <= 'z') {
      letter = char(key);
      // Scale the values to numbers between 0 and 100
      float scale = 100.0/57.0;
      int temp = int((key - 'A') * scale);
      // Set the offset for the image
      xoffset = temp;
      println(key);
    }
  }
  </script><canvas width="200" height="200"></canvas></p>
  <div style="overflow: hidden; height: 0px; width: 0px;"><img src="javascript-processing-example-rathausFrog.jpg" id="rathausFrog.jpg"></div>
  
  <pre><b>// All Examples Written by <a href="http://reas.com/">Casey Reas</a> and <a href="http://benfry.com/">Ben Fry</a>
  // unless otherwise stated.</b>
  PImage frog;
  PFont fontA;
  int lettersize = 90;
  int xoffset;
  char letter;
  
  void setup() 
  {
    size(200, 200);
    fontA = loadFont("Arial"); 
    textFont(fontA); 
    textSize(lettersize);
      
    // The String datatype must be capitalized because it is a complex datatype.
    // A String is actually a class with its own methods, some of which are
    // featured below.
    String name= "rathausFrog";
    String extension = ".jpg";
    int nameLength = name.length();
    println("The length of " + name + " is " + nameLength + ".");
    name = name.concat(extension);
    nameLength = name.length();
    println("The length of " + name + " is " + nameLength + ".");
  
    // The parameter for the loadImage() method must be a string
    // This line could also be written "frog = loadImage("rathausFrog.jpg");
    frog = loadImage(name);
  }
  
  void draw() 
  {
    background(51); // Set background to dark gray
    
    image(frog, xoffset, 0);
    
    // Draw an X
    line(0, 0, width, height);  
    line(0, height, width, 0); 
    
    // Get the width of the letter
    int letterWidth = int(fontA.width(letter) * lettersize);
        
    // Draw the letter to the center of the screen
    text(letter, width/2-letterWidth/2, height/2);
  }
  
  void keyPressed()
  {
    // The variable "key" always contains the value of the most recent key pressed.
    // If the key is an upper or lowercase letter between 'A' and 'z'
    // the image is shifted to the corresponding value of that key
    if(key &gt;= 'A' &amp;&amp; key &lt;= 'z') {
      letter = char(key);
      // Scale the values to numbers between 0 and 100
      float scale = 100.0/57.0;
      int temp = int((key - 'A') * scale);
      // Set the offset for the image
      xoffset = temp;
      println(key);
    }
  }</pre>
  
  </body></html>
[] readme course(s) preface I 1 2 II 3 4 III 5 6 7 IV 8 9 10 V 11 12 afterthought(s) appendix reference(s) example(s) resource(s) _
You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.