jackcallister · July 22, 2020 05:57
diff --git a/index.html b/index.html
 <html>
  <head>
    <script defer src=https://cdn.jsdelivr.net/npm/p5></script>
    <script defer src=https://cdn.jsdelivr.net/npm/p5/lib/addons/p5.dom.min.js></script>
    <script defer src=https://cdn.jsdelivr.net/npm/p5/lib/addons/p5.sound.min.js></script>

    <script src="js/lib/toxiclibs.js"></script>
    <script src="vector.js"></script>
    <!-- Select which file to run -->

    <!-- <script src="render-image.js"></script> -->
    <!-- <script src="loop-traversal.js"></script> -->
  </head>
  <body>
  </body>
 </html>
diff --git a/loop-traversal.js b/loop-traversal.js
 const runway = true;
 const shouldSave = true;

 const truncation = 0.8;
 const noise = 1;

 const n = [];
 const size = 512;
 const i = 2;
 const path = "http://localhost:8000/query";

 let outputImage;
 let a = 0.0;
 let count = 0;
 let z = [];

 function setup() {
  createCanvas(1024, 1024);

  for (let i = 0; i < size; i++) {
    n[i] = new SimplexNoise(noise, -1, 1);
  }

  generateImage()
 }

 function generateImage() {
  for (let i = 0; i < size; i++) {
    z[i] = n[i].value(radians(a));
  }

  const data = {
    truncation: truncation,
    z: z,
  };

  if (runway) {
    httpPost(path, 'json', data, gotImage, gotError);
  } else {
    imageReady()
  }
 }

 function gotError(error) {
  console.error(error);
 }


 function gotImage(result) {
  outputImage = createImg(result.image, imageReady);
  outputImage.hide();
 }

 function imageReady() {
  if (runway) {
    image(outputImage, 0, 0);

    if (shouldSave) {
      save(`outputImage${nf(count, 4)}`);
    }
  }

  a += i;

  if (a <= 360) {
    setTimeout(generateImage, 100);
    console.log("Current angle:", a);
  } else {
    console.log("Finished")
  }

  count++;
 }

 // NoiseLoop is the random multi-dimensional noise needed to
 // traverse and generate images from the models latent space
 //
 // requires the toxic libs library
 //
 class SimplexNoise {
  constructor(diameter, min, max) {
    this.diameter = diameter;
    this.min = min;
    this.max = max;
    this.cx = random(1000);
    this.cy = random(1000);
  }

  value(a) {
    let xoff = map(cos(a), -1, 1, this.cx, this.cx + this.diameter);
    let yoff = map(sin(a), -1, 1, this.cy, this.cy + this.diameter);
    let r = toxi.math.noise.simplexNoise.noise(xoff,yoff);

    return map(r, -1, 1, this.min, this.max);
  }
 }
diff --git a/render-image.js b/render-image.js
 const runway = "http://localhost:8000/query"

 let outputImage;

 function setup() {
  createCanvas(512, 512)

  const data = {
    z: z,
    truncation: 0.25,
  }

  console.log("Fetching")

  httpPost(runway, 'json', data, gotImage, gotError)
 }

 function gotError(e) {
  console.log(e)
 }

 function gotImage(response) {
  outputImage = createImg(response.image, imageReady)
  outputImage.hide()
 }

 function imageReady() {
  image(outputImage, 0, 0)
  console.log("Done")
 }
diff --git a/vector.js b/vector.js
 // A random vector
 let a = [0.1570424851249445,-0.00930223739804439,0.09665338781946935,-0.13744003173286196,0.2661037764228993,-0.10809057329596446,0.14144476927056848,0.1156590114028924,0.05965564930870183,0.21410647537832217,0.06156228052992989,-0.11033606498871622,0.0536812657728192,-0.14805334244668328,0.15488531334431085,-0.20863852959184648,-0.1436478069525566,0.14717713532000565,0.18044591799833534,0.03432810664641639,0.07759884537590592,-0.09216001723532034,0.055736312105388215,0.01500773314873402,-0.26897682591231137,0.10278557511704281,0.15811951301126292,0.10305986214605643,0.13473371219382033,-0.02399640125572547,0.0862007462922163,0.13632146612047455,0.14221215434699222,0.08075904250169925,-0.0047801523399748705,0.10831481201571709,0.15124713036346607,-0.03749191406592449,-0.07378671918734375,0.022274618846198455,-0.17566324343467837,0.05312531321702316,-0.03780160517575226,-0.022954141760896496,-0.07180359812200543,0.02377528083175913,0.19826127896477042,-0.022252748785277353,0.2526896187756327,0.15524605390084534,-0.1015736823098464,0.035883631042362876,0.0472754900137057,-0.11584852975551481,0.14413220215162958,-0.10055275132725583,0.16120673804807115,0.1635837380295327,0.2445867590114436,-0.11263776720111533,-0.19145652034751012,0.03616497811926054,-0.017620579352512183,0.12310205053581356,0.026032471038255223,-0.18826779787643153,0.009627474034359637,0.04664763145645848,-0.08489146096769604,0.07152405850980895,-0.30512144227728,0.07022720731565543,-0.07956327765603774,0.1118290951308089,-0.023814371404590997,0.02688069360915679,0.14861043136163604,-0.40407204896356835,0.09929651637005066,0.2792622586561429,0.14683446800858121,0.11011466508884882,0.01518751160890272,0.008638186622383373,0.1908328288858452,0.03685319004160767,0.02535548176846584,0.36994739798148485,0.0548015708657941,-0.09787190004978985,-0.003400818228266593,0.1235693551908946,0.012386954267067998,0.09757250725480077,-0.0018892806837041143,0.22425133307932366,-0.05666564334538329,-0.07882684689802237,0.15411159709743139,-0.041141238360441576,0.22828010870226886,0.11476822850155195,-0.052630010229391226,-0.089956666136396,0.03442356113462171,-0.1782277838092386,-0.0821920896552048,-0.010419805560756376,0.007781175055350711,0.19417127271824977,-0.12212305590374484,0.033035393992271816,-0.12423917528760274,0.20394552843124505,-0.10927829147503584,0.08264029070671039,0.013971259990163964,0.20533318174017046,0.002422901605018804,-0.013663445113715377,0.09352571659000938,0.03764875420651076,0.02939201718874711,-0.1263469922813515,-0.2341922689974319,-0.055213785322866346,0.06127873257705439,0.13251221279135167,-0.05350028975546764,-0.06103149580120786,0.08448408726964682,0.16364249614345344,-0.013064430885885676,-0.053138489424954416,-0.05840922965476117,0.10683308232969899,-0.03434450498866781,-0.042936666904487705,0.10171793186564711,0.15133348566671873,-0.09365747494570373,-0.14613324119876403,0.09559829526633562,-0.08292087409653703,-0.09014885785361329,0.2285358374953316,0.3824688786855066,0.21931694892789222,0.053983812258340466,0.12454381790858415,0.1358079857257285,-0.16056373602520374,0.18459053020720467,-0.09148712062304286,-0.02161499524483755,0.2009422375260163,0.1423284747592725,-0.011227638588844707,0.06124900510436058,-0.058078057511077245,-0.14849745710844722,0.0973015082431644,0.017005034973004034,-0.04589051421668916,0.0686486498820525,0.0007298433120298126,0.14487989028418236,0.20357232298007766,-0.10065144393436931,0.10566187624379411,0.05525430133011009,-0.020392400102540648,-0.29594691164374565,0.11437392734353069,-0.024169361231503986,-0.08326307927098009,-0.0006619298454862074,-0.0746922855781541,0.0038762519821885196,-0.15259251837895546,0.12271797745944885,0.02180736368524303,-0.19595325515910972,-0.14039941764805983,0.21445271369633634,0.08656935942109001,0.06574068505289186,-0.09960081737404505,0.03297334057198714,-0.09396585663714471,-0.007694352891059665,-0.03471184491566764,0.11710979791426399,0.11360189594158562,-0.24875498383041056,0.05167783862232546,0.08645520476491042,0.028206489394786025,-0.15939728443292453,0.2070209580624629,0.0255411364929254,0.1252009237158449,-0.03917240536976143,0.16081330145104727,-0.18089952919608496,0.037447239331727035,-0.21528569514396545,0.047605071124473146,-0.05288956756006505,-0.09947415816680114,0.08467423965768484,0.11969595474169557,0.09764045683617287,0.003660557783836872,0.19855107512132747,-0.004656048182587365,0.15576914459928354,0.09720904079623988,0.13807713548067804,-0.05746899727090426,0.14491336365147048,0.21222104325137475,-0.19722446484866318,0.0787251625771677,0.1594288453739965,0.0804427567465919,0.2165973139069209,0.05546630761805607,-0.2175743393742815,0.07987213264421589,-0.19343334390716058,0.05570947820841677,-0.024983430746518417,0.023330414248710143,-0.22185974209019782,-0.08727880001702865,-0.20974240932705646,-0.15977343955313136,0.2793256642347294,0.0925882288841772,-0.11294539077441987,-0.04042121626345334,0.12821660531292828,0.08561056101741872,0.17997884977402123,-0.024511409008930857,-0.18744954720539603,0.07067460946749636,-0.24439620944596058,-0.08275882224034027,-0.016731020213509484,-0.2458109889554655,0.025051297116539376,0.15715513541547407,-0.008279854761070304,-0.0006919396397871425,-0.028831186325094613,-0.19594886642297024,-0.0697234962294001,-0.19009880499684212,0.14639519849436117,-0.06488159486413628,0.015224740373061575,-0.16207446317773708,-0.054506189727878594,-0.01549372713981139,0.07770061822968875,0.14254459114916576,0.14345511327914662,-0.13547106817307908,0.11173403628316485,-0.08191887177058872,-0.11493084495560271,0.014226247969212229,0.01227186273779227,-0.0740948647148207,0.09194741261565871,0.07513797831198066,0.014054769225337629,-0.25562257196118165,-0.10870178832542483,0.07194699633781823,0.044319770617962884,-0.06016239055977379,-0.04627684556064451,0.030839200317523047,-0.10547321386078874,-0.11874755426380626,0.009690135568609516,-0.17916604196742225,0.08432457359281316,0.0676773076153947,0.07105287550671745,0.1416868661025062,0.1647499828225319,0.0236348855162793,-0.0856497980644848,-0.003589145030504004,0.03537429532964913,0.0612594666441688,-0.01148142771749942,0.2875874343948591,0.11200192869314005,0.0738845503738079,0.14202480434664308,0.015283501939981521,0.15198536893980066,0.02637831492888848,-0.12809374319430386,-0.00385912570979937,0.08596592322917825,-0.035135233126810175,0.07802384502295456,-0.1629115574708807,0.04523614060846771,0.10305861458558979,0.015920981806101964,0.0892603811842673,-0.05299307459900154,0.0859596512724926,-0.12059357653657508,0.12061668572167414,-0.05713761563032599,-0.0032422306537034096,0.02213056212835918,0.04658292858109713,0.21757019755289236,-0.008164313210895252,-0.03295194202617233,0.09904611727555596,0.06548440552812174,0.136652809610782,-0.035837929489961305,-0.06304336790029053,-0.09143927677095091,0.11629900563315912,-0.20024354371012948,0.09831198116443522,-0.17467621003635972,0.11547985349905522,0.11514843505972247,0.2706240598002634,0.1049793696594045,-0.09803781399351473,-0.09217789171167222,-0.049478137447065654,-0.0011340300000331448,-0.12150341813860915,-0.0939999876921671,0.16120556978466746,-0.12984530573886385,0.07425751013562418,-0.10825251592852635,0.054948798742492325,-0.061431870812260744,-0.10181613875950635,0.26503312802989487,0.23808360543968918,0.04890995222053006,-0.1858966642912338,-0.10346796511470242,-0.1987302738075083,0.037446947733758465,-0.11069505153942534,0.06458363296213421,-0.045987360102213534,-0.012105085446531952,0.24312690108364884,-0.32323661625096994,0.19823195682615397,0.1524533926455841,0.24896384027484977,-0.20592583703932904,0.09439873833941961,0.03919093889821216,0.014094550664385051,-0.06454455648845465,0.030907683860532355,0.11579660406605063,-0.1218240923203232,-0.014860705484439365,-0.008838348619364098,0.05797351189756965,0.09711353520601007,-0.14285624472406483,0.02566846104573537,0.10956642379909282,-0.2025883645298891,0.024541594587216758,-0.07510142193799715,-0.0741831109285341,-0.14958729856643582,0.0032177305202014117,0.08674499285462614,-0.1712051150013727,-0.07347934220004995,0.15135366834417308,0.204166884170691,0.15030035109937806,0.08775687114712707,0.23873161065973608,-0.1569764909625489,0.03283784006867602,-0.027491525996213996,0.013327495454752314,-0.010863015748491293,0.045682823539745274,0.20005760079809665,0.08630639992529547,0.05506012239983957,0.01003405773039028,0.09337302611699323,0.025456685660434006,0.04884648911326259,0.2838275973150759,0.09194379493853225,-0.027749164746615516,-0.10444115798606919,-0.007552001454692547,0.0033309043796931753,-0.15118434842463943,-0.07080961227482964,-0.14131957184163363,-0.15444130525355326,-0.09265879726980543,-0.05878904437645674,0.09457064170649307,0.21230104830073346,-0.085478021237884,0.018533566039421967,0.26704241330686473,0.21334029331697157,0.17548321434862338,-0.2777144484857128,-0.10524580691484797,-0.24397379378310902,-0.06621796317951636,-0.2379940066605315,-0.009727726455006986,0.007980557733216348,-0.1436749252543561,0.17826879236244575,-0.09930330492635048,-0.07768237940711786,-0.12251783269106928,0.03708100390078416,-0.07005096198691779,0.028064864478122523,0.033747525023122164,-0.04229596012779739,0.09675136705520362,-0.020049778382564058,-0.06454809303406786,0.046611866768557955,0.1431272252200494,0.09700035142308004,-0.04727415056452444,0.1365231075962876,0.068097571478863,0.04600421655866388,-0.02372789524273687,-0.19694958578588356,0.11928388053979133,0.059536099484033655,-0.04390983123474275,-0.12395401808038169,0.015157822756143184,0.019315224283331545,-0.05896776575663912,-0.056117403156153,0.05108424652915125,-0.015611231252914729,-0.12660177987070534,-0.05184061694616224,-0.12424640974873177,0.19742398363638822,0.1328683312990071,-0.06613640361620078,0.193660531794031,-0.1240142795667702,-0.02383050033091911,0.07023341382843006,0.15584575606132262,0.04704417212987845,-0.19667058603416104,-0.04079025475993653,-0.008524206290228,-0.01281219589196815,0.06249442502050728,0.0327032017958207,-0.11688752688454296,0.24531075334258223,0.06296234037789411,0.017748980362457437,0.040362696855249874,0.06957128882153199,0.10129221766511234,-0.05463313491674836,0.10856510682861173,0.15417150434389523,0.18842595217402971,0.14982915290936052,-0.0842836685788028,-0.08391061091412347,-0.16290240526719935,0.014617053758846851,0.030616064456697116,0.07105841803875895,0.012654815050184624,-0.05148460527106491,0.027953601950619893,0.06318521433138041]
	<html>
	<head>
	<script defer src=https://cdn.jsdelivr.net/npm/p5></script>
	<script defer src=https://cdn.jsdelivr.net/npm/p5/lib/addons/p5.dom.min.js></script>
	<script defer src=https://cdn.jsdelivr.net/npm/p5/lib/addons/p5.sound.min.js></script>

	<script src="js/lib/toxiclibs.js"></script>
	<script src="vector.js"></script>
	<!-- Select which file to run -->

	<!-- <script src="render-image.js"></script> -->
	<!-- <script src="loop-traversal.js"></script> -->
	</head>
	<body>
	</body>
	</html>
	const runway = true;
	const shouldSave = true;

	const truncation = 0.8;
	const noise = 1;

	const n = [];
	const size = 512;
	const i = 2;
	const path = "http://localhost:8000/query";

	let outputImage;
	let a = 0.0;
	let count = 0;
	let z = [];

	function setup() {
	createCanvas(1024, 1024);

	for (let i = 0; i < size; i++) {
	n[i] = new SimplexNoise(noise, -1, 1);
	}

	generateImage()
	}

	function generateImage() {
	for (let i = 0; i < size; i++) {
	z[i] = n[i].value(radians(a));
	}

	const data = {
	truncation: truncation,
	z: z,
	};

	if (runway) {
	httpPost(path, 'json', data, gotImage, gotError);
	} else {
	imageReady()
	}
	}

	function gotError(error) {
	console.error(error);
	}


	function gotImage(result) {
	outputImage = createImg(result.image, imageReady);
	outputImage.hide();
	}

	function imageReady() {
	if (runway) {
	image(outputImage, 0, 0);

	if (shouldSave) {
	save(`outputImage${nf(count, 4)}`);
	}
	}

	a += i;

	if (a <= 360) {
	setTimeout(generateImage, 100);
	console.log("Current angle:", a);
	} else {
	console.log("Finished")
	}

	count++;
	}

	// NoiseLoop is the random multi-dimensional noise needed to
	// traverse and generate images from the models latent space
	//
	// requires the toxic libs library
	//
	class SimplexNoise {
	constructor(diameter, min, max) {
	this.diameter = diameter;
	this.min = min;
	this.max = max;
	this.cx = random(1000);
	this.cy = random(1000);
	}

	value(a) {
	let xoff = map(cos(a), -1, 1, this.cx, this.cx + this.diameter);
	let yoff = map(sin(a), -1, 1, this.cy, this.cy + this.diameter);
	let r = toxi.math.noise.simplexNoise.noise(xoff,yoff);

	return map(r, -1, 1, this.min, this.max);
	}
	}
	const runway = "http://localhost:8000/query"

	let outputImage;

	function setup() {
	createCanvas(512, 512)

	const data = {
	z: z,
	truncation: 0.25,
	}

	console.log("Fetching")

	httpPost(runway, 'json', data, gotImage, gotError)
	}

	function gotError(e) {
	console.log(e)
	}

	function gotImage(response) {
	outputImage = createImg(response.image, imageReady)
	outputImage.hide()
	}

	function imageReady() {
	image(outputImage, 0, 0)
	console.log("Done")
	}