itch.io

Hello, I have some questions:

Can you load png images for backgrounds to videos and images created by this software?

Can you create png screen shots with avatars using this software?

Can you create transparent background screen shots (png)?

What type of video and image output can this software produce?

Can you maintain a pose file library in this software?

Thanks for creating such interesting programs.

AR

Hello, are they in pdf format?

Hello again, I was looking at some other programs and came across a feature that would be useful: having a visual format of the pictures on the left or right side with the text part going down the side or sides. This could be useful for some stories and give some variety of interfaces. Just a thought.

Argosa

Hello Hellper, 

For the music and audio effects it might be time to use mp3's exclusively for this as the patents expired and use of mp3 has no apparent cost downsides for creators. This may help keep the file size smaller. Also I have noticed many applications supporting using compressed or deflated zip files to store the data and directly un-compresses the data files for use on the fly. This may be useful if you can easily integrate it with the html.

My bad on the decision tree comments. I was trying it from the first page and it was not obvious to me it did the choices....

thanks for your software! I look forward to using the desktop app version when its ready.

Argosa

Hello, thanks for this software.... I have been looking for a basic picture and text builder for html that is simple to use...so far it has worked well. 

Do you have a way to run the application locally for offline use?

If you continue to develop this, it would be nice if you keep the base version as a option so people not needing any enhancements can depend on it. 

Of course it would be nice to be able to do more formatting, audio, video, and some simple decision tree VN like things but I love the simplicity it has now....

thanks

Thank you for the information.

Hello, thanks for this software. It can be very useful for what I would like to do. I hope you continue to develop it. The current feature set is very useful and I hope you can keep it simple for non programmer types. I am having trouble using Electron on windows. What is NPM? is there a standalone executable so I can build the template to a windows app?

You are correct I did not load the code correctly! It works good and is super fast.

My first computer language was BASIC so this is a lot of fun to mess with.

Thanks again and if you decide to declare it ready/released please add me to your list to notify.  I will add you to my Follow list.

I am interested in using it to generate some simple programs in JS to use in Tuesday JS visual novel builder....

thanks

A_R

Thanks B_M, this is fun to play with.

A_R

Hello j,

Thanks for this...BASIC is fun for me and there are lots of old basic programs that may take on new HTML5 life thanks to projects like this.

I hope you continue to develop this! 

I could not get the starfield code to run. I got a dark screen but no stars.

I was able to do some Print statements and have some nostalgia!

A_R

Hello, could you encapsulate this into a windows exe?

thanks

A_R

Hello forthebundle,

I messed with the code and it works the way DF said!

Thanks DF for your hard work and creative talents.

If you want I can send it to you vial email if you want.

A_R

Here is the changed script, just copy and paste into notepad, save as 'sketch.js' and write over a copy of the sketch.js file in the directory. Then just run the index.html file like normal:

let drawSteps = [
  function() { background(255)},
  doSkyStep,
  doStarStep,
  drawStars,
  ]

let drawIndex = drawSteps.length;

function setup() {
  let cvs = createCanvas(resolutionX, resolutionY);
  cvs.parent("container")

  skyColor = color(57, 120, 168);
  skyColor2 = color(57, 49, 75);
  skyAccentColor = color(205, 96, 147);
  skyAccentColor2 = color(142, 71, 140);
  mountainColor =  color(57, 123, 68);
  mountainColor2 = color(182, 213, 60);
  starColor = color(244, 180, 27);
  starColor2 = color(138, 235, 241);
  cloudColor = color(223, 246, 245);

  document.getElementById("skyColor1").value = skyColor.toString('#rrggbb');
  document.getElementById("skyColor2").value = skyColor2.toString('#rrggbb');
  document.getElementById("skyAccentColor1").value = skyAccentColor.toString('#rrggbb');
  document.getElementById("skyAccentColor2").value = skyAccentColor2.toString('#rrggbb');
  document.getElementById("mountainColor1").value = mountainColor.toString('#rrggbb');
  document.getElementById("mountainColor2").value = mountainColor2.toString('#rrggbb');
  document.getElementById("starColor1").value = starColor.toString('#rrggbb');
  document.getElementById("starColor2").value = starColor2.toString('#rrggbb');
  document.getElementById("cloudColor1").value = cloudColor.toString('#rrggbb');

  cols = floor(width / particleScl);
  rows = floor(height / particleScl);
}

function drawFromSeed() {
  resizeCanvas(resolutionX, resolutionY);
  cols = floor(width / particleScl);
  rows = floor(height / particleScl);

    drawIndex = 0;
}

function doCloudStep() {
  let clouds = makeCloudCircles();
  drawCloudCircles(clouds);
  let cloudParticles = [];

  for (cloud of clouds) {
      let p = new StarParticle();
      p.position = createVector(cloud.x, cloud.y )
      p.previousPosition = p.position.copy()
      p.targetColor = lerpColor(skyColor, skyColor2, random(0,1));

      p.spread = 10;
      cloudParticles.push(p);
  }

  let cloudField = makeCloudField();
  drawField(cloudField, cloudParticles, 20)
}

function doSkyStep() {
  drawBackground();

  let skyField = makeSkyField();
  let skyParticles = [];

  for (var x = -40; x < width; x += particleScl) {
    for (var y = -40; y < height; y += particleScl) {

      let p = new Particle();
      p.pos = createVector(x, y)
      p.previousPosition = createVector(x, y)
      skyParticles.push(p);
    }
  }

 drawField(skyField, skyParticles, 40);
}

function doStarStep() {
  let circles = makeStarCircles();
  let starParticles = [];

  for (c of circles) {
    let rScl = c.r* 0.5;
        for(let j = 0; j < floor(c.r * 0.35);j++) {
            let p = new StarParticle();
            p.position = createVector(random(c.x - rScl, c.x + rScl), random(c.y - rScl, c.y + rScl))
      p.previousPosition = p.position.copy();
      p.targetColor = lerpColor(starColor, starColor2, random(0,1));
            starParticles.push(p);  
        }
  }

  let starField = makeStarField(circles);
  drawField(starField, starParticles, 20)
}

function draw() {
  if (drawIndex < drawSteps.length) {
    drawSteps[drawIndex]();
    drawIndex ++;
  }
}

function drawStars() {
  for(let i = 0; i < 500; i++) {
    strokeWeight(random(0.3, 5.0));
    stroke(255, 255, 255, random(0, 255));
    var h = random(0, 30) * random(4, 30);
    point(random(0, width), h);
  }
}

function drawCloudCircles(clouds) {
  noStroke();
  for (cloud of clouds) {
    let c = lerpColor(cloud.c, skyColor, random(0.0, 1.0))
    fill(c)
    circle(cloud.x, cloud.y, cloud.r)
  }
}

function drawBackground() {
  strokeWeight(mountainDetail*1.5);
  for(let y = 0; y < height; y+= mountainDetail) {
    stroke(lerpColor(skyColor2, skyColor, y/height * random(0.7, 1.3)));
    line(0, y, width, y)
  }
  noStroke();
  for(let y = 0; y < height; y+= 5) {
    if (random(0, 100) > 95) {
      let c = lerpColor(skyColor, skyAccentColor, random(0, 1))
      fill(c)
      circle(random(0, width), y, random(100, 200))
    }

    if (random(0, 100) > 95) {
      let c = lerpColor(skyColor, skyAccentColor2, random(0, 1))
      fill(c)
      circle(random(0, width), y, random(100, 200))
    }
  }
}

function drawMountain(distance) {
  let mountainHeight = height - mountainStart;
  let particles = [];
  let renderer = createGraphics(width, height);
  let iters = 30 - distance * 2 - random(0, 10);
  let lRenderers = [];

  for(let x = 0; x < width + mountainDetail; x+=mountainDetail) {
    let n = noise(x*0.001 * (distance/.7), distance*50);
    let heighestPoint = (mountainHeight * 0.85) + (distance/10.0)*mountainHeight + mountainStart;
    let altitude = n*(mountainHeight * 0.85) + (distance/10.0)*mountainHeight + mountainStart ;

    renderer.strokeWeight(mountainDetail*2);
    for (let y = altitude; y < height + mountainDetail; y+=mountainDetail) {

      let c = lerpColor(mountainColor, mountainColor2, pow(y/(heighestPoint-150), 7));
      c = lerpColor(skyColor, c, pow(distance/5.0, 2.0))

      renderer.stroke(c);
      renderer.point(x,y);
    }

    if (random(0, 100) > 20 * (5 - mountainDetail)) {
      let yy = random(0, 50)
      noStroke();
      fill(red(cloudColor), green(cloudColor), blue(cloudColor), random(50, 150));
      circle(x, altitude + yy, random(10, 40));
        let p = new StarParticle();
      p.position = createVector(x, altitude + yy)
      p.previousPosition = p.position.copy();
      p.maxSteps = iters + floor(random(-10, 5));
      p.targetColor = skyColor2;
      p.spread = 9.0;
      p.colorMerge = 0.98;
      particles.push(p);
    }
  }

 
  let cloudField = makeCloudField();
    drawField(cloudField, particles, iters + 5, skyColor)
  image(renderer, 0, 0);

  for (l of lRenderers) {
    image(l, 0, 0);
  }
}

Hello RW and FC,

I am interested in this also and look forward to further development. Thanks for your hard work and creative abilities!

A_R