hmarron.github.io/script.js at master · hmarron/hmarron.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
var c = document.getElementById("canvas");
var ctx = c.getContext("2d");

var points = {};
var lines = {};
var background = {};
var goldenVars = {};
var canvas = {};

function updateDrawParams(){
  points.num = parseInt($("#pointsNum").val());
  points.enabled = $("#pointsEnable").is(":checked");
  points.hollow = $("#pointsHollow").is(":checked");
  points.colour = $("#pointsColour").val();
  points.radius = parseInt($("#pointsRadius").val());
  points.shadowsEnabled = $("#pointsShadowsEnable").is(":checked");
  points.shadowsSize = parseFloat($("#pointsShadowsSize").val());
  points.shadowsColour = $("#pointsShadowsColour").val();
  points.randomColours = $("#pointsRandomColours").is(":checked");

  background.colour = $("#backgroundColour").val();
  background.randomColours = $("#backgroundRandomColours").is(":checked");

  lines.enabled = $("#linesEnable").is(":checked");
  lines.colour = $("#lineColour").val();
  lines.thickness = parseInt($("#lineThickness").val());
  lines.shadowsEnabled = $("#lineShadowsEnable").is(":checked");
  lines.shadowsSize = parseFloat($("#linesShadowsSize").val());
  lines.shadowsColour = $("#linesShadowsColour").val();
  lines.randomColours = $("#linesRandomColours").is(":checked");

  goldenVars.gv1 = parseFloat($("#goldenVar1").val());
  goldenVars.gv2 = parseFloat($("#goldenVar2").val());
  goldenVars.gv3 = parseFloat($("#goldenVar3").val());
  goldenVars.gv4 = parseFloat($("#goldenVar4").val());
  goldenVars.gv5 = parseFloat($("#goldenVar5").val());

  canvas.element = document.getElementById("canvas").getContext("2d");
  canvas.canvas = document.getElementById("canvas")
  canvas.height = $("#canvasWidth").val();
  canvas.width = $("#canvasHeight").val();
  $("#canvas").attr("height",canvas.height);
  $("#canvas").attr("width",canvas.width);

  frameRate = parseInt($("#frameRate").val());
}

$( document ).ready(function() {
  updateDrawParams();
  draw(points,lines,background,goldenVars,canvas);
  $("#downloadGif").hide();
});

$("#drawButton").click(function(){
  updateDrawParams();
  draw(points,lines,background,goldenVars,canvas);
});

$("input").change(function(){
  updateDrawParams();
  draw(points,lines,background,goldenVars,canvas);
});