add js implementation of generator

image_gen.py

@@ -34,10 +34,12 @@ def cos3x(value):
 
 def gen_rnd_colors():
     grc = lambda: random.randint(0, 255)
-    t1, t2, t3 = grc(), grc(), grc()
-    c1 = (t1 + 50, t2 + 50, t3 + 0, 255)
-    c2 = (t1 + 0, t2 + 50, t3 + 50, 255)
-    c3 = (t1 + 50, t2 + 0, t3 + 50, 255)
+    r, g, b = grc(), grc(), grc()
+    c1 = (r + 50, g + 50, b + 0, 255)
+    c2 = (r + 0, g + 50, b + 50, 255)
+    c3 = (r + 50, g + 0, b + 50, 255)
+
+    print(c1, c2, c3)
 
     return [c1, c2, c3]
 
@@ -118,25 +120,36 @@ def gen_img(type=1):
     return new_image
 
 
-def get_increment():
-    f = open('increment')
-    inc = f.read()
-    f.close()
-    # print("Last increment = " + inc)
-    return inc
+def check_file(fn):
+    try:
+        open(fn, "r")
+        return True
+    except (IOError, OSError) as e:
+        print("Error: " + str(e))
+        return False
+
+
+def get_counter():
+    if check_file("counter"):
+        f = open('counter')
+        cnt = f.read()
+        f.close()
+        return cnt
+    # print("Last counter = " + inc)
+
 
 
-def set_increment(value):
-    f = open('increment', 'w')
+def set_counter(value):
+    f = open('counter', 'w')
     f.write(value)
     f.close()
 
 
 def save_image(image, file=None):
     if file is None:
-        inc = get_increment()
-        image_file_name = 'new_image' + str(inc) + '.png'
-        set_increment(str(int(inc) + 1))
+        cnt = get_counter()
+        image_file_name = 'new_image' + str(cnt) + '.png'
+        set_counter(str(int(cnt) + 1))
     else:
         image_file_name = file
 

js/imagegen.js

@@ -0,0 +1,142 @@
+function getRandomFloat(min, max) {
+  return Math.random() * (max - min) + min;
+}
+
+function getRandomInteger(min, max) {
+  return Math.floor(Math.random() * (max - min)) + min;
+}
+
+function getRange(start, end, step = 1) {
+  var arr = [];
+  for (var j = start; j <= end; j += step) {
+    arr.push(j);
+  }
+  return arr;
+}
+
+function getRandomColors() {
+        var r = getRandomInteger(0,255);
+        var g = getRandomInteger(0,255);
+        var b = getRandomInteger(0,255);
+
+        var dr, dg, db = 0
+
+        if(r > 200) {dr = -50; } else {dr = 50;}
+        if(g > 200) {dg = -50; } else {dg = 50;}
+        if(b > 200) {db = -50; } else {db = 50;}
+
+        c1 = "rgba(" + (r + dr) + ", " + (g + dg) + ", " + b + ",1)";
+        c2 = "rgba(" + (r + dr) + ", " + g + ", " + (b + db) + ",1)";
+        c3 = "rgba(" + r + ", " + (g + dg) + ", " + (b + db) + ",1)";
+
+     console.log([c1,c2,c3])
+        return [c1,c2,c3];
+}
+
+
+function shuffle(array) {
+  var currentIndex = array.length,
+    temporaryValue, randomIndex;
+
+  // While there remain elements to shuffle...
+  while (0 !== currentIndex) {
+
+    // Pick a remaining element...
+    randomIndex = Math.floor(Math.random() * currentIndex);
+    currentIndex -= 1;
+
+    // And swap it with the current element.
+    temporaryValue = array[currentIndex];
+    array[currentIndex] = array[randomIndex];
+    array[randomIndex] = temporaryValue;
+  }
+
+  return array;
+}
+
+function sinx(value) {
+  return 2 * Math.sin(value / 2);
+}
+
+function cosx(value) {
+
+  return 2 * Math.cos(value / 2);
+}
+
+function sin3x(value) {
+  return 2 * Math.sin(3 * value / 4);
+}
+
+function cos3x(value) {
+  return 2 * Math.cos(3 * value / 4);
+}
+
+function genImage() {
+  var canvas = document.getElementById('canvas');
+  if (canvas.getContext) {
+    var ctx = canvas.getContext('2d');
+    var img_w = canvas.width;
+    var img_h = canvas.height;
+
+    var clrs = getRandomColors();
+    var clr1 = 'red';
+    var clr2 = 'blue';
+    var clr3 = 'green';
+
+    var square_size = 50;
+    var sc_n = 6;
+    var type = 1;
+    var rnd_min_size = 50;
+    var rnd_max_size = 80;
+
+    ctx.fillStyle = clrs[0];
+    ctx.fillRect(0, 0, img_w, img_h);
+
+    var points = [];
+
+    for (var xa = 0; xa <= img_w + rnd_min_size; xa += 0.8 * rnd_min_size) {
+      for (var ya = 0; ya <= img_h; ya += 0.8 * rnd_min_size) {
+        var rnd_x_shift = getRandomInteger(-5, 5);
+        var rnd_y_shift = getRandomInteger(-5, 5);
+        var y = 0;
+        xa += rnd_x_shift;
+        for (var cnt in getRange(0, 4)) {
+          rnd = getRandomInteger(0, 4);
+          if (rnd == 0)
+            y += sinx(xa);
+          else if (rnd == 1)
+            y += cosx(xa);
+          else if (rnd == 2)
+            y += sin3x(xa);
+          else if (rnd == 3)
+            y += cos3x(xa);
+        }
+        y += ya;
+        y += rnd_y_shift;
+        points.push([xa, y])
+      }
+    }
+
+    for (var p in shuffle(points)) {
+      var x0 = points[p][0]
+      var y0 = points[p][1];
+
+      for (var sc = 6; sc > 0; sc--) {
+        var dx = square_size / 2 / (sc_n - 1) * sc;
+        var dy = square_size / 2 / (sc_n - 1) * sc;
+
+        if (sc % 2 == 1) {
+          ctx.fillStyle = clrs[1];
+        } else {
+          ctx.fillStyle = clrs[2];
+        }
+        //console.log("x" + sc + " = " + (x0 - dx) + " | y" + sc + " = " + (y0 -dy) + " | width" + sc + " = " + dss);
+        if (type = 1) {
+          ctx.fillRect(x0 - dx, y0 - dy, 2 * dx, 2 * dy);
+        } else if (type = 2) {
+          ctx.fillRect(x0 - dx, y0 - dy, 2 * dx, 2 * dy);
+        }
+      }
+    }
+  }
+}

js/index.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <title>ImageGenerator</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+</head>
+
+<body onload="genImage();">
+
+    <canvas id="canvas" width="640" height="480"></canvas>
+
+    <script src="imagegen.js"></script>
+
+</body>
+
+</html>