Saving an array as a file

wjsandbe

I have an array, called "saved", that is a collection of index numbers of objects, called "instruments". I also have a "Save" button; when pressed the "Save" button calls the Saves() function, which stores the index numbers of some objects (instruments) and stores the numbers.

What I am trying to do is then take that array and save it as a file, like json or txt file, that I can load at a later date and then use the numbers stored in the array. I have tried using saveJSON() and saveText, as well as some others, but I cannot get it to work. So how do I save an array as a type of file that I can load at a later time. Below is my code:

var saved = [];

function setup(){
  createCanvas(950, 700);
  var saver = createButton("Save");
  saver.size(width / 11, width / 11);
  saver.position(instruments[0].x - (instruments[0].r * 4), instruments[223].y + (instruments[0].r / 2));
  saver.mousePressed(Saves);
    }

    function Saves() {
  for (var i = 0; i < instruments.length; i++) {
    if (instruments[i].active === true) {
      append(saved, i);
    }
  }

GoToLoop

https://p5js.org/reference/#/p5/saveStrings

wjsandbe

using split gives me the error "29131: Uncaught TypeError: undefined is not a function"

function Saves() {
  for (var i = 0; i < instruments.length; i++) {
    if (instruments[i].active === true) {
      append(saved, i);
      var list = split(saved, ' ');
      saveStrings(list, 'saved.txt');
    }
  }
}

GoToLoop

Function split() is for turning a regular string in an array. However, variable saved is already an array! 8-X

wjsandbe

Ok I have this below, which saves a text file and gives me no errors, but when I check the text file it only reads "�w^~)�"

I also get this same result if I try to save it as json. Any ideas what's going on here?

    function Saves() {
      for (var i = 0; i < instruments.length; i++) {
        if (instruments[i].active === true) {
          append(saved, i);
          saveStrings(saved, 'saved.txt');
        }
      }

GoToLoop

Please, host your sketch at https://OpenProcessing.org/sketch/create.
This way we can check your sketch more easily.

wjsandbe

https://openprocessing.org/sketch/444316

I can't get it to work on this site though

GoToLoop

You need to remove the subfolder from the path of your ".wav" files.
Instead of var files = ["files/PianoHiC.wav"];, just var files = ["PianoHiC.wav"];.

wjsandbe

Ok there, my working sketch is up. https://openprocessing.org/sketch/444316 the text file looks different when it's saved here, but it still doesn't contain the array data.

GoToLoop

• You've got saveStrings() inside a loop! :-&
• So instead of saving once, it saves how many instruments[] are active! @-)
• And a tip: In JS, functions follow the lowerCaseNaming convention.
• So your callback function should be renamed from Save() to save(). :-B
• Here's my proposal for your save(): B-)

const FILENAME = 'indices.txt',
      LAMBDA = (acc, elem, idx) => (elem.active && acc.push(idx), acc);

function saves() {
  saveStrings(instruments.reduce(LAMBDA, []), FILENAME);
}

wjsandbe

Ok so maybe it's the P5js Editor I'm using. I added a separate function to export my saved array and in my P5js editor is still gives me a text file that only reads: "�w^~)�"

But when I changed the code in the openprocessing web editor, it saved a text file with the array and basically works perfectly.

Any ideas what this weird text "�w^~)�" means?

So I added a button, which calls the Export() function now:

    function Saves() {
      for (var i = 0; i < instruments.length; i++) {
        if (instruments[i].active === true) {
          append(saved, i);
        }
      }
    }

    function Export() {
      saveStrings(saved, 'saved.txt');
      console.log(saved);
    }

GoToLoop

I wrote another simple sketch and it also has the same problem.

"use string";

const FILENAME = 'coordinates.txt', coords = [];

function setup() {
  createCanvas(600, 400);
  background(0).noLoop();
}

function draw() {
  fill('red').rect(0, 0, width>>1, height);
  fill('blue').rect(width>>1, 0, width, height);
}

function mouseClicked(){
  if (mouseX > width>>1) {
    append(coords, mouseX);
    print(coords);
    saveStrings(coords, FILENAME);
  }
}

wjsandbe

Yes that doesn't work in my P5js Editor. Same issue just produces a text document with "�w^~)�"

GoToLoop

Ok so maybe it's the P5js Editor I'm using. Yes that doesn't work in my P5js Editor.

wjsandbe

Thank you! I had no idea I could just use my processing editor. That is fantastic! Thanks for all the help!