Another java to .js troubleshooting question ...

bulbil

Another java to .js troubleshooting question ...

in Processing with Other Languages • 9 months ago

I realize there are a number of conversion questions already floating around but I can't seem to find an existing question for my problem. Any pointers at all would be super helpful.

I'm trying to find out what part of my code javascript doesn't like. The java works fine but the .js just pulls up a blank white box that I can't debug.

My best guess is that it has to do with the RiTa library I import, the use of fonts (.vlw), the use of a data (.txt) file or the use of a class in a separate file -- though I don't know enough about the translation process to really test any of the above.

Again, any help you can throw my way would be so appreciated. Thanks!

import rita.*;
import controlP5.*;
// initializes variables / instances of classes
ControlP5 cp5;
CheckBox checkbox1, checkbox2;
Slider slider1, slider2;
boolean filterBool = false;
int sliderMin, prevMin = 0;
int sliderMax, prevMax = 11;
PFont font1, font2, font3;
State nowState;
// from kuler
color[] topColors = {color(0,114,187),
color(217,61,4),
color(18,43,59),
color(191,107,4),
color(0,36,59),
color(242,203,3),
color(4,191,173),
color(59,144,198),
color(242,226,5),
color(0,83,136)};
String[] months = {"Sep", "Nov", "Oct", "Dec", "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug"};
String[] genre = {"school", "personal", "academic", "creative"};
// consolidates the states of the checkboxes
boolean[] genreBool = {true, true};
// window settings
void setup() {
size(800, 600);
background(color(255));
smooth();
font1 = loadFont("CenturySchoolbook-Italic-48.vlw");
font2 = loadFont("ArialMT-24.vlw");
hint(ENABLE_NATIVE_FONTS);
cp5 = new ControlP5(this);
//max slider
cp5.addSlider("slider1", 0, 11, 11, 55, 425, 450, 10)
.setColorBackground(color(255))
.setColorForeground(color(0))
.setColorActive(color(0))
.setNumberOfTickMarks(12)
.setLabelVisible(false)
.showTickMarks(false)
.setSliderMode(Slider.FLEXIBLE)
;
// min slider
cp5.addSlider("slider2", 0, 11, 0, 55, 450, 450, 10)
.setColorBackground(color(255))
.setColorForeground(color(0))
.setColorActive(color(0))
.snapToTickMarks(true)
.setNumberOfTickMarks(12)
.showTickMarks(false)
.setLabelVisible(false)
.setSliderMode(Slider.FLEXIBLE)
;
// first set of checkboxes
cp5.addCheckBox("checkbox1")
.setPosition(100, 530)
.setColorBackground(color(0))
.setColorForeground(color(0))
.setColorActive(color(255))
.setSize(15, 15)
.setSpacingRow(15)
.addItem("email_school", 0)
.addItem("email_personal", 50)
.hideLabels()
.activateAll()
;
// toggles whether to apply common word filter
cp5.addToggle("toggleValue",735,35,15,15)
.setColorForeground(color(255))
.setColorBackground(color(0))
.setColorLabel(color(255))
.setColorActive(color(255))
.setLabelVisible(false)
;
// an instance of the display class, with the data file passed to it
nowState = new State("data/a2_emails2.txt");
nowState.update();
}
void backgroundElements() {
int xpos = 0;
stroke(0);
// title
fill(0);
textFont(font2, 20);
text("MY YEAR IN WORDS", 50, 50);
line(50, 60, 500, 60);
// oftenest
textFont(font2, 14);
text("OFTENEST", 75, 125);
line(75, 135, 175, 135);
// rarest
text("RAREST", 325, 125);
line(325, 135, 425, 135);
// longest
text("LONGEST", 500, 125);
line(500, 135, 600, 135);
// total
text("/ unique", 690, 545);
textAlign(RIGHT);
text("total /", 690, 570);
textAlign(LEFT);
// probability barchart
line(549, 375, 550, 200);
line(549, 376, 750, 376);
text("PROBABILITY OF OFTENEST", 550, 400);
textFont(font1,15);
fill(color(0,114,187));
text("in this range", 550, 425);
fill(color(150));
text("across whole range", 550, 440);
//bottom decorative line
line(50, 400, 500, 400);
// slider meta
fill(0);
for(int i=0; i < months.length; i++){
line(60 + xpos, 442, 60 + xpos, 437);
textFont(font2, 14);
text(months[i], 50 + xpos, 500);
xpos += 40;
}
text("max", 20, 435);
text("min", 20, 450);
// checkbox labels
text("email:", 50, 540);
text("school", 120, 540);
text("personal", 120, 570);
fill(255);
rect(100, 530, 15, 15);
rect(100, 560, 15, 15);
// decorating the filter toggle
fill(0);
textFont(font1,15);
textAlign(RIGHT);
text("exclude common", 730, 45);
text("words", 730, 60);
textAlign(LEFT);
fill(255);
rect(735,35,15,15);
}
// describes the class that involves a particular display state based on the slider and checkbox inputs
class State {
//all the variables for a single state of the display
String filename;
String longest;
int minFreq, counter, index;
int unique;
int total;
String[] topten = new String[10];
String[] rarest = new String[10];
int[] barlength = new int[10];
Float[] probsHi = new Float[10];
Float[] probsHiTtl = new Float[10];
//instantiates the handy Table class I stole from Ben Fry
Table table;
//class constructor
State(String n){
filename = n;
}
void update(){
// all the variables for each update
String [] activeGenre = {"0", "0","0","0"};
// common words based on top 100 most common words according to the Oxford Corpus (http://oxforddictionaries.com/words/the-oec-facts-about-the-language)
// words not included are those less than three letters long and the top ten most common (both sets of words are removed
// with the Python script I wrote to clean the data)
String[] igWords = {"look", "people", "will",
"was", "your", "but",
"are", "about", "not",
"from", "new", "can", "let", "edu"};
// second library of email specific words that are common
// String[] igWords2 = {"school", "love", "send",
// "wrote", "hope", "thanks",
// "http", "edu", "new", "pdf"};
// these RiConcorder instances are the core to the whole program
RiConcorder rc = new RiConcorder();
RiConcorder ttl = new RiConcorder();
// adds an ignore array
if(filterBool){
rc.setWordsToIgnore(igWords);
ttl.setWordsToIgnore(igWords);
}
table = new Table(filename);
// checks to make sure the sliderMin is not too high
sliderMin = (sliderMin > sliderMax) ? sliderMax : sliderMin;
// checks to see whether any checkboxes are checked
if(!genreBool[0] && !genreBool[1]){
for(int i = 0; i<10; i++){
topten[i] = "";
rarest[i] = "";
barlength[i] = 0;
probsHi[i] = 0.0;
probsHiTtl[i] = 0.0;
}
unique = 0;
total = 0;
longest = "";
}else{
// resets the longest word
longest = " ";
// sets the active genres according to the checked boxes
for(int i = 0; i < 2; i++){
if(genreBool[i]){activeGenre[i] = genre[i];}
}
// this is the heart of it, nested loops to test for active month and genre states
for (int i = 0; i < table.getRowCount(); i++){
// creates an RiConcorder for every word to get total probabilities later
ttl.addWord(table.getString(i,4));
for(int k = sliderMin; k <= sliderMax; k++){
// the range of months active
if(table.getString(i,2).contains(months[k])){
// the active genres
if(table.getString(i,0).contains(activeGenre[0]) || table.getString(i,0).contains(activeGenre[1])){
longest = (longest.length() < table.getString(i,4).length()) ? table.getString(i,4) : longest;
rc.addWord(table.getString(i,4));
}
}
}}
// gets the top ten most common words
topten = rc.getMostCommonTokens(10);
// the top ten least common according to the RiConcorder algorithm
rarest = rc.getLeastCommonTokens(10);
// totals
total = rc.totalCount();
unique = rc.uniqueCount();
// sets the frequencies and probabilities for the top ten
for (int i = 0; i < 10; i++){
barlength[i] = rc.getCount(topten[i]);
probsHi[i] = rc.getProbability(topten[i]);
probsHiTtl[i] = ttl.getProbability(topten[i]);
}
// clears the model
rc.clear();
ttl.clear();
// for(int i = 0; i < activeGenre.length; i++){activeGenre[i] = "";}
}}
// uses the update values to draw elements
void display() {
int ypos = 0;
int xpos = 0;
// draws top ten most frequently used words from the selected subset and time range
fill(0);
for (int i = 0; i < 10; i++){
textFont(font1,15);
text(nowState.topten[i],75, 163 + ypos);
ypos += 20;
}
// draws longest
fill(0);
textFont(font1,15);
text(nowState.longest, 500, 163);
// draws rarest
ypos = 0;
for (int i = 0; i < 10; i++){
text(nowState.rarest[i],325, 163 + ypos);
ypos += 20;
}
// draws total
textAlign(RIGHT);
text(nowState.unique, 680, 545);
textAlign(LEFT);
// draws uniqe total
text(nowState.total, 700, 570);
// draws frequency bars
ypos = 0;
for (int i = 0; i < nowState.barlength.length; i++){
fill(topColors[i]);
noStroke();
rect(150, 150 + ypos,nowState.barlength[i]/5, 15);
ypos += 20;
}
// draws the probability bars in this range
xpos = 0;
for(int i = 0; i < nowState.probsHi.length-1; i++){
fill(topColors[i]);
float x1 = 560 + xpos;
float y1 = 375 - (probsHi[i] * 3000);
rect(x1, y1, 10, 375 - y1);
xpos += 20;
}
// for the whole range
xpos = 0;
for(int i = 0; i < nowState.probsHiTtl.length-1; i++){
fill(150);
float x1 = 565 + xpos;
float y1 = 375 - (probsHiTtl[i] * 3000);
rect(x1, y1, 10, 375 - y1);
xpos += 20;
}
}}
// function that updates in case slider values change -- because of quirks in the ControlP5 library
// necessary in order to get the sliders to dynamically refresh the display
void slideUpdate(){
if (prevMax != sliderMax || prevMin != sliderMin){nowState.update();}
prevMin = sliderMin;
prevMax = sliderMax;
}
//sets sliderMax from slider1
void slider1(int a){
sliderMax = a;
slideUpdate();
}
//sliderMin from slider2
public void slider2(int a){
sliderMin = a;
slideUpdate();
}
//sets the booleans for active genres -- makes more sense when I had the other set of checkboxes active
void checkbox1(float[] a) {
genreBool[0] = (a[0] == 1.0) ? true : false;
genreBool[1] = (a[1] == 1.0) ? true : false;
nowState.update();
}
//whether or not to filter common words
void toggleValue(boolean theFlag) {
filterBool = theFlag;
nowState.update();
}
void draw() {
background(255);
backgroundElements();
nowState.display();
}

Replies(3)

GoToLoop

Re: Another java to .js troubleshooting question ...

9 months ago

import rita.*;
import controlP5.*;

Just looking at those imports, I can say for sure that controlP5 is a Java exclusive library currently!

It needs to be rewritten to JavaScript to use it there!!!

PhiLho

Re: Another java to .js troubleshooting question ...

9 months ago

Yes, same for Rita.
Processing code using third party library will not work in JS.
That's why dropping the applets was an unfortunate decision (but then, running applets is problematic, too!).

bulbil

Re: Another java to .js troubleshooting question ...

9 months ago

Thanks so much -- super helpful ... I'll look for a replacement library.

Top Reply