thingalings

.fantarc

@@ -0,0 +1,6 @@
+module.exports = {
+    ports: {
+        test: 1234,
+        live: 3000
+    }
+}

.gitignore

@@ -1,2 +1,4 @@
 
 node_modules
+dest/*
+!dest/.gitexists

app.js

@@ -0,0 +1,6 @@
+const app = require('./src/express.js');
+const config = require('./.fantarc');
+
+app.listen(config.ports.live, () =>
+	console.log(`Listening on port ${config.ports.live}!`)
+);

assets/css.css

@@ -5,7 +5,6 @@ x-fanta {
 	position: relative;
 	-webkit-mask: url(./can-mask.png) no-repeat center;
 	-webkit-mask-size: contain;
-	filter: saturate(1.5);
 }
 
 x-fanta:after {
@@ -27,41 +26,39 @@ x-logo > * {
 }
 
 x-logo {
-		width: 1000px;
-		height: 1000px;
-		display: block;
-		position: absolute;
-		top: 0;
-		left: 0;
-		right: 0;
-		bottom: 0;
-		margin: auto;
-		transform: rotate(-7deg) scale(1.2) translateX(-1%);
+	width: 1000px;
+	height: 1000px;
+	display: block;
+	position: absolute;
+	top: 0;
+	left: 0;
+	right: 0;
+	bottom: 0;
+	margin: auto;
+	transform: rotate(-7deg) scale(1.2) translateX(-1%);
 }
 
-x-label{
-    color: white;
-    font-size: 60px;
-    text-transform: capitalize;
-    font-family: arial rounded mt bold;
-    text-align: center;
-    display: inline-block;
-    right: 40%;
-    left: 10%;
-    top: 65%;
-    line-height: 1.5;
-    /* width: 60%; */
-    z-index: 10;
-    /* background: red; */
+x-label {
+	color: white;
+	font-size: 60px;
+	text-transform: capitalize;
+	font-family: arial rounded mt bold;
+	text-align: center;
+	display: inline-block;
+	right: 40%;
+	left: 10%;
+	top: 65%;
+	line-height: 1.5;
+	z-index: 10;
 }
 
-x-label span{
-	background: #77B94C;
-	padding: .1em .5em;
+x-label span {
+	background: #77b94c;
+	padding: 0.1em 0.5em;
 	display: inline-block;
-	margin-left: -.25em;
-	margin-right: -.225em;
-	margin-bottom: .1em;
+	margin-left: -0.25em;
+	margin-right: -0.225em;
+	margin-bottom: 0.1em;
 }
 
 body {
@@ -71,6 +68,7 @@ body {
 	align-items: center;
 	justify-content: center;
 	position: absolute;
+	filter: saturate(1.75);
 }
 
 x-fanta .logo {

assets/fetch.js

@@ -6,6 +6,7 @@ const fetcher = async () => {
 
 const go = async () => {
 	const data = await fetcher();
+	const rotation = 5 - Math.random()*10;
 
 	document.querySelector('x-fanta x-label').innerHTML =
 		data.product
@@ -14,7 +15,11 @@ const go = async () => {
 			.map(_=>`<span>${_}</span>`)
 			.join('');
 	document.querySelector('x-fanta .edible').src = `/emoji/${data.edible}.svg`;
-	document.querySelector('x-fanta').style.backgroundColor = `rgba(${data.hero._rgb.join()})`;
-	document.querySelector('body').style.backgroundColor = `rgba(${data.palette[0]._rgb.join()})`;
+	document.querySelector('x-fanta').attributeStyleMap.set('background-color',`rgb(${data.hero._rgb.join()})`);
+	document.querySelector('x-fanta').attributeStyleMap.set('transform',`rotate(${rotation}deg)`);
+	document.querySelector('body').attributeStyleMap.set('background-color',`rgb(${data.palette[0]._rgb.join()})`);
+
+	console.log(JSON.stringify(data));
+
 }
 go();

bin/make-screenshot.js

@@ -0,0 +1,44 @@
+const server = require('../src/express.js');
+const config = require('../.fantarc');
+const puppeteer = require('puppeteer');
+const path = require('path');
+
+const outPath = path.resolve(__dirname, '..', 'dest', 'screenie.png');
+
+const startServer = () =>
+	new Promise(rt => {
+		server.listen(
+			config.ports.test,
+			rt(`http://localhost:${config.ports.test}`)
+		);
+	});
+
+const takeScreenshot = async url => {
+	const browser = await puppeteer.launch({
+		args: ['--no-sandbox'],
+		ignoreHTTPSErrors: true,
+	});
+	const page = await browser.newPage();
+
+	return new Promise((yay, nay) => {
+		page.on('console', async msg => {
+			try {
+				const log = JSON.parse(msg.text());
+				if (!log.product) {
+					throw new Error('invalid fanta');
+				}
+				await page.screenshot({ path: outPath, type: 'png' });
+				await browser.close();
+				yay(log);
+			} catch (e) {
+				nay([e, msg]);
+			}
+		});
+		Promise.all([
+			page.setViewport({ width: 4400, height: 2500 }),
+			page.goto(url),
+		]);
+	});
+};
+
+module.exports = () => startServer().then(url => takeScreenshot(url));

bin/tweet.js

@@ -0,0 +1,10 @@
+const getFanta = require('./make-screenshot');
+
+getFanta()
+	.then(log => {
+		console.log(log);
+		process.exit();
+	})
+	.catch(err => {
+		throw err;
+	});