Animating star field
A Pen by Graeme Fulton on CodePen.
Animating star field
A Pen by Graeme Fulton on CodePen.
import "./styles.css"; | |
import { useState } from "react"; | |
import { motion } from "framer-motion"; | |
export default function App() { | |
const [imageLoading, setImageLoading] = useState(true); | |
const [pulsing, setPulsing] = useState(true); | |
const imageLoaded = () => { | |
setImageLoading(false); |
/** | |
* createTerrainMatrix | |
* @TODO: create the matrix of terrains - need to add 9 bits of terrain | |
*/ | |
createTerrainMatrix:function(scene, perlinNoise){ | |
//every 100px on the z axis, add a bit of ground | |
for ( var z= 100; z > -200; z-=100 ) { | |
componentDidMount() { | |
if(typeof window!=='undefined'){ | |
/** use this to remove the button if needed | |
var oldBtn = document.getElementById('ovly-trigger') | |
if(oldBtn){ | |
oldBtn.remove() | |
} | |
**/ |
const _ = require('underscore'); | |
var unescape = require('lodash.unescape'); | |
getTwitterLink(link){ | |
if (link.indexOf('twitter.com') > -1 && link.indexOf('/status') > -1) { | |
//use twitter publish oembed thing | |
var twitterPublishUrl = 'https://publish.twitter.com/oembed?url=' + link + '&omit_script=1' | |
var meta = await fetch(twitterPublishUrl).then(res => res.json()) | |
.then(json => { return json }); | |
<!-- Script tags to resize iframe automatically --> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/iframe-resizer/4.2.11/iframeResizer.min.js"></script> | |
<script> | |
iFrameResize({ autoResize: false }, '#studentstatus') | |
</script> | |
<iframe | |
id="studentstatus" | |
src="https://studentstat.us/form" | |
style="width: 1px;min-height:600px; min-width: 100%;" |
<script type="text/javascript" src="https://makerbadge.s3.amazonaws.com/blmbadge.js"></script> | |
<script> | |
BLMBadge.init({ | |
layout:1, | |
theme:'dark', | |
promoText : 'Send a donation '+String.fromCodePoint(0x2192), | |
promoLink : 'https://minnesotafreedomfund.org/', | |
message : 'To be silent is to be complicit. Black lives matter.', | |
title : '#BlackLivesMatter' | |
}) |
<!-- html --> | |
<div> | |
<a href="#">Click me</a> | |
</div> | |
<!-- CSS --> | |
<style> | |
a{ | |
text-decoration:none; | |
color:black; |
var fabric=fabric||{version:"1.6.7"};"undefined"!=typeof exports&&(exports.fabric=fabric),"undefined"!=typeof document&&"undefined"!=typeof window?(fabric.document=document,fabric.window=window,window.fabric=fabric):(fabric.document=require("jsdom").jsdom("<!DOCTYPE html><html><head></head><body></body></html>"),fabric.document.createWindow?fabric.window=fabric.document.createWindow():fabric.window=fabric.document.parentWindow),fabric.isTouchSupported="ontouchstart"in fabric.document.documentElement,fabric.isLikelyNode="undefined"!=typeof Buffer&&"undefined"==typeof window,fabric.SHARED_ATTRIBUTES=["display","transform","fill","fill-opacity","fill-rule","opacity","stroke","stroke-dasharray","stroke-linecap","stroke-linejoin","stroke-miterlimit","stroke-opacity","stroke-width","id"],fabric.DPI=96,fabric.reNum="(?:[-+]?(?:\\d+|\\d*\\.\\d+)(?:e[-+]?\\d+)?)",fabric.fontPaths={},fabric.charWidthsCache={},fabric.devicePixelRatio=fabric.window.devicePixelRatio||fabric.window.webkitDevicePixelRatio||fabric.window.moz |
<table border="0" cellpadding="0" cellspacing="0" width="100%"> | |
<tbody> | |
<tr> | |
<td style="background-color: transparent; width: 600px;" width="600" valign="top"> | |
<!-- Image here 👇 --> | |
<img style="border-radius: 8px;" src="https://s3-us-west-1.amazonaws.com/tinify-bucket/prototypr/temp/2hnlgj"> | |
<!-- Image here 👆 --> | |
</td> | |
</tr> | |
</tbody> |