# Desperate for Help, due in 2 days! Beginner & Confused, Rotating STRING text

**URL:** <https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692>\
**Category:** Coding Questions\
**Tags:** homework\
**Created:** [July 17, 2020, 10:07pm UTC](https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692 "2020-07-17T22:07:06Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sugar](https://avatars.discourse-cdn.com/v4/letter/s/6a8cbe/32.png) [@Sugar](https://discourse.processing.org/u/Sugar)\
**Post date:** [July 17, 2020, 10:07pm UTC](https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692/1 "2020-07-17T22:07:06Z")

</div>

Hi there,

I am an Intern to an artist, and I have 0 experience coding, and frankly, I’m hating every second of it. But I have been tasked for Monday **(July 20th 2020)** to create a code for the show where the words “Press” and “Record” circle one another in opposite directions around the edge of a circle, one on the outer edge and one on the inner. Picture like a CD - PRESS is circling counter-clockwise off of the CD, while RECORD is circling clockwise printed on the CD. Both following the outer edge of the CD.

I have found some code online from some of you lovely people and using the Processing Tutorials I have been able to create a code where they are on the same line, circling in the same direction. I cannot for the life of me understand how to do this with 2 lines of spinning text. I thought it would be as straight forward as coping the code and changing the varibles but it is obviously not that simple. Any and all help is appreicated. Here is the code I have;

```auto
String message = "PRESS RECORD";

 
PFont zigBlack;
 
float r = 100;
float angVel = -TWO_PI / 360;
float ang;
 
void setup() {
  size(1024, 768);
  zigBlack = createFont("tahoma.ttf", 40);
  textFont(zigBlack);
  textAlign(CENTER);
  smooth();
}
 
void draw() {
 background(0);
 circleText();
 
  stroke(255, 255, 255);
 fill(0, 0, 0);
 ellipse(512, 384, 200, 200);
 
 stroke(255, 255, 255);
 fill(0, 0, 0);
 ellipse(512, 384, 20, 20);
 

 
}
 
void circleText(){
  pushMatrix();
  translate(width/2, height/2);
  rotate(ang);
  ang -= angVel - 0.038;
  //33 rpm is 0.038, 45 is 0.057
 
  noFill();
  noStroke();
  ellipse(0, 0, r*2, r*2);
 
  float arclength = 0;
 
  for (int i = 0; i < message.length (); i ++ ) {
    char currentChar = message.charAt(i);
    float w = textWidth(currentChar);
    arclength += w/2;
    float theta = PI + arclength / r;
    pushMatrix();
    translate(r*cos(theta), r*sin(theta));
    rotate(theta + PI/2);
    fill(255);
    text(currentChar, 0, 0);
    popMatrix();
    arclength += w/2;
  }
  popMatrix();
}

```

---

<div class="post-metadata">

**Author:** ![kfrajer](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/kfrajer/32/196_2.png) [@kfrajer](https://discourse.processing.org/u/kfrajer)\
**Post date:** [July 18, 2020, 12:17pm UTC](https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692/2 "2020-07-18T12:17:35Z")

</div>

This would be my approach using your code. Good luck!

Kf

```java
final int TEXT_SIZE=16;
final String msgOut = "PRESS";
final String msgIn = "RECORD";

//PFont zigBlack;

float r = 100;
float angVel;
//float ang;

TextRotator press;
TextRotator record;

void setup() {
  size(1024, 768);
  //zigBlack = createFont("tahoma.ttf", 40);
  //textFont(zigBlack);
  textAlign(CENTER);
  textSize(TEXT_SIZE);
  smooth();

  angVel = -TWO_PI / 360 - 0.038;
  //33 rpm is 0.038, 45 is 0.057

  press=new TextRotator(msgOut, angVel, r, color(255));
  record=new TextRotator(msgIn, -angVel, r-TEXT_SIZE, color(144));
}

void draw() {
  background(0);

  stroke(255, 255, 255);
  fill(0, 0, 0);
  ellipse(512, 384, 200, 200);

  stroke(255, 255, 255);
  fill(0, 0, 0);
  ellipse(512, 384, 20, 20);

  press.circleText();
  record.circleText();
}

class TextRotator {

  String text;
  float angularSpeed;
  color textColor;
  float radialOffset;

  protected float ang;

  TextRotator(String msg, float aSpeed, float radPos, color tColor) {
    text=msg;
    angularSpeed=aSpeed;
    radialOffset=radPos;
    textColor=tColor;
  }

  void circleText() {

    pushMatrix();  
    translate(width/2, height/2);
    rotate(ang);
    fill(textColor);

    ang += angularSpeed; 
    float arclength = 0;

    for (int i = 0; i < text.length (); i++ ) {
      char currentChar = text.charAt(i);
      float w = textWidth(currentChar);
      arclength += w/2;
      float theta = PI + arclength / radialOffset;
      pushMatrix();
      translate(radialOffset*cos(theta), radialOffset*sin(theta));
      rotate(theta + PI/2);      
      text(currentChar, 0, 0);
      popMatrix();
      arclength += w/2;
    }
    popMatrix();
  }
}

```

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [July 18, 2020, 1:38pm UTC](https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692/3 "2020-07-18T13:38:07Z")

</div>

without a class

```auto
String message1 = "PRESS";
String message2 = "RECORD";

PFont zigBlack;

float r1 = 100;
float r2 = 68;
float angVel = -TWO_PI / 360;
float ang1, ang2;

void setup() {
  size(1024, 768);
  zigBlack = createFont("ARIAL.FLW", 40);
  textFont(zigBlack);
  textAlign(CENTER);
  smooth();
}

void draw() {
  background(0);

  stroke(255, 255, 255);
  fill(0, 0, 0);
  ellipse(512, 384, 200, 200);

  stroke(255, 255, 255);
  fill(0, 0, 0);
  ellipse(512, 384, 20, 20);

  circleText1();
  circleText2();
}

void circleText1() {
  pushMatrix();
  translate(width/2, height/2);
  rotate(ang1);
  ang1 -= angVel - 0.038;
  //33 rpm is 0.038, 45 is 0.057

  noFill();
  noStroke();
  ellipse(0, 0, r1*2, r1*2);

  float arclength = 0;

  for (int i = 0; i < message1.length (); i ++ ) {
    char currentChar = message1.charAt(i);
    float w = textWidth(currentChar);
    arclength += w/2;
    float theta = PI + arclength / r1;
    pushMatrix();
    translate(r1*cos(theta), r1*sin(theta));
    rotate(theta + PI/2);
    fill(255);
    text(currentChar, 0, 0);
    popMatrix();
    arclength += w/2;
  }
  popMatrix();
}

void circleText2() {
  pushMatrix();
  translate(width/2, height/2);
  rotate(ang2);
  ang2 += angVel - 0.038;
  //33 rpm is 0.038, 45 is 0.057

  noFill();
  noStroke();
  ellipse(0, 0, r2*2, r2*2);

  float arclength = 0;

  for (int i = 0; i < message2.length (); i ++ ) {
    char currentChar = message2.charAt(i);
    float w = textWidth(currentChar);
    arclength += w/2;
    float theta = PI + arclength / r2;
    pushMatrix();
    translate(r2*cos(theta), r2*sin(theta));
    rotate(theta + PI/2);
    fill(255);
    text(currentChar, 0, 0);
    popMatrix();
    arclength += w/2;
  }
  popMatrix();
}

```

---

<div class="post-metadata">

**Author:** ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)\
**Post date:** [July 18, 2020, 1:46pm UTC](https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692/4 "2020-07-18T13:46:33Z")

</div>

Hello,

> [@Sugar](#):
>
> I am an Intern to an artist, and I have 0 experience coding,

Processing as a great tool for artists! You will learn to code with experience.

> [@Sugar](#):
>
> and frankly, I’m hating every second of it.

Get over it and focus on the work.

Please format your code as a courtesy to the community:  
[https://discourse.processing.org/faq#format-your-code](https://discourse.processing.org/faq#format-your-code)

`:)`

---

<div class="post-metadata">

**Author:** ![mokauno](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/mokauno/32/8045_2.png) [@mokauno](https://discourse.processing.org/u/mokauno)\
**Post date:** [July 18, 2020, 5:19pm UTC](https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692/5 "2020-07-18T17:19:47Z")

</div>

Hello,  
first, for a 0 experience programmer, you made a great work. Coding can be very difficult, and your exercise is not an easy one.  
second, being a programmer is also sometimes being a lazy man. You have to find the easiest way to do your work. So, if I had to do this work, I would just create two _bitmaps_ and rotate them on the screen… Is it allowed ? You said you have to rotate words, not necessary strings, so…

---

<div class="post-metadata">

**Author:** ![Sugar](https://avatars.discourse-cdn.com/v4/letter/s/6a8cbe/32.png) [@Sugar](https://discourse.processing.org/u/Sugar)\
**Post date:** [July 18, 2020, 7:13pm UTC](https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692/6 "2020-07-18T19:13:25Z")

</div>

Oh my gosh thank you so much. I was actually really close! I just wasn’t understanding how to differentiate the 2 different circleTexts. I knew I was missing something like a number or some sort of variable. Thank you so so much again!

---

<div class="post-metadata">

**Author:** ![Sugar](https://avatars.discourse-cdn.com/v4/letter/s/6a8cbe/32.png) [@Sugar](https://discourse.processing.org/u/Sugar)\
**Post date:** [July 18, 2020, 7:26pm UTC](https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692/7 "2020-07-18T19:26:47Z")

</div>

Thank you so much, apologizes about the formatting, hopefully I’ve fixed this.

As for “get over it”, I have exactly 0 experience, so this was frustrating and not helpful.

Thanks

: )

---

<div class="post-metadata">

**Author:** ![qewer3322](https://avatars.discourse-cdn.com/v4/letter/q/e19adc/32.png) [@qewer3322](https://discourse.processing.org/u/qewer3322)\
**Post date:** [July 18, 2020, 7:56pm UTC](https://discourse.processing.org/t/desperate-for-help-due-in-2-days-beginner-confused-rotating-string-text/22692/8 "2020-07-18T19:56:28Z")

</div>

Also take a look at these recources if you want to get started with processing. I’m also new and these help every day.

links stolen from @glv 's posts 😄

- The Processing _website_ has references, examples, tutorials, etc.  
[https://processing.org/](https://processing.org/)
- The Processing PDE (IDE) has lots to offer!  
An exploration of the tabs will reveal what is available; libraries, tools and local examples there.
- The Coding Train  
[https://www.youtube.com/channel/UCvjgXvBlbQiydffZU7m1\_aw](https://www.youtube.com/channel/UCvjgXvBlbQiydffZU7m1_aw)  
[https://thecodingtrain.com/](https://thecodingtrain.com/)
- Happy Coding  
[Processing Tutorials - Happy Coding](https://happycoding.io/tutorials/processing/)
- The source code can give insight if you are adventurous:  
[GitHub - processing/processing: Source code for the Processing Core and Development Environment (PDE)](https://github.com/processing/processing)  
Many of the Processing functions are here:  
[processing/core/src/processing/core/PApplet.java at master · processing/processing · GitHub](https://github.com/processing/processing/blob/master/core/src/processing/core/PApplet.java)
- The Processing Foundation  
[https://processingfoundation.org/](https://processingfoundation.org/)  
Check out the tabs.  
In the education tab, there is a reference to the Coding Train.
- And the Internet. `:)`

Also if you have more specific questions you can search with google in this format:  
“processing (insert your question/problem/error message)”