Skip to content

Instantly share code, notes, and snippets.

@caraya
caraya / package.json
Created April 19, 2018 05:45 — forked from surma/package.json
Boilerplate for quick one-off TypeScript projects. Just run `npm start`
{
"name": "tsquickstart",
"version": "1.0.0",
"description": "Boilerplate for quick one-off TypeScript projects. Just run `npm start`",
"scripts": {
"init": "test -f tsconfig.json || (tsc --init -t ESNext -m ESNext && npm install)",
"start": "npm run init && concurrently \"npm run watch\" \"npm run serve\"",
"serve": "http-server",
"watch": "tsc -p . --watch",
"build": "tsc -p ."
#!/bin/env bash
echo "\n\n Checking if package.json exists"
if [ -f package.json ]
then
echo "\n\n package.json exists."
else
echo "\n\n package.json doesn't exists... creating"
npm init --yes
fi
@caraya
caraya / lettering.html
Created November 1, 2018 01:53 — forked from adactio/lettering.html
A quick'n'dirty way of doing some lettering.js stuff without jQuery.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Test</title>
<style>
.slogan span:nth-child(odd) {
color: red;
}
</style>
</head>
@caraya
caraya / README.md
Last active February 20, 2019 20:50
@caraya
caraya / article.tex
Last active February 23, 2019 19:19
Latex example to go with article
\documentclass[12pt, letterpaper, titlepage]{article}
% font size could be 10pt (default), 11pt or 12 pt
% paper size could be letterpaper (default), legalpaper, executivepaper,
% a4paper, a5paper or b5paper
% side could be oneside (default) or twoside
% columns could be onecolumn (default) or twocolumn
% graphics could be final (default) or draft
%
% titlepage could be notitlepage (default) or titlepage which
% makes an extra page for title
@caraya
caraya / README.md
Created February 24, 2019 05:16 — forked from CodingDoug/README.md
Realtime Database triggers with Cloud Functions for Firebase - source

Realtime Database triggers with Cloud Functions for Firebase - source

This gist contains the source code in my video series about Realtime Database triggers. You can watch the three parts here:

  1. Part 1 (intro, onCreate)
  2. Part 2 (onUpdate, infinite loops)
  3. Part 3 (onDelete, transactions)

index.ts contains the Cloud Functions code, and dialog.ts contains the script to run

@caraya
caraya / lazy-video-loader.js
Created March 5, 2019 22:12 — forked from benrobertsonio/lazy-video-loader.js
Lazy Loading Video Based on Connection Speed
class LazyVideoLoader {
constructor() {
this.videos = [].slice.call(document.querySelectorAll('.hero__bgvideo'));
// Abort when:
// - The browser does not support Promises.
// - There no videos.
// - If the user prefers reduced motion.
// - Device is mobile.
if (
/* Monospaced font for code samples */
@font-face {
font-family: "notomono_regular";
src: url("../fonts/notomono-regular.eot");
src: url("../fonts/notomono-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/notomono-regular.woff2") format("woff2"), url("../fonts/notomono-regular.woff") format("woff"), url("../fonts/notomono-regular.ttf") format("truetype"), url("../fonts/notomono-regular.svg#notomono_regular") format("svg");
font-weight: normal;
font-style: normal;
}
/* Regular font */
@font-face {
/* Monospaced font for code samples */
@font-face {
font-family: "notomono_regular";
src: url("../fonts/notomono-regular.eot");
src: url("../fonts/notomono-regular.eot?#iefix") format("embedded-opentype"), url("../fonts/notomono-regular.woff2") format("woff2"), url("../fonts/notomono-regular.woff") format("woff"), url("../fonts/notomono-regular.ttf") format("truetype"), url("../fonts/notomono-regular.svg#notomono_regular") format("svg");
font-weight: normal;
font-style: normal;
}
/* Regular font */
@font-face {
@caraya
caraya / displacement.html
Created March 25, 2019 23:15 — forked from akella/displacement.html
svg displacement animation
<filter id="displacement" filterUnits="objectBoundingBox">
<feTurbulence type="turbulence" baseFrequency="0.01" numOctaves="2" result="turb"/>
<feColorMatrix in="turb" result="huedturb" type="hueRotate" values="90">
<animate attributeType="XML" attributeName="values" values="0;180;360" dur="6s" repeatCount="indefinite"/>
</feColorMatrix>
<feDisplacementMap in="SourceGraphic" in2="huedturb" scale="20" result="displace" xChannelSelector="B"/>
<feOffset dx="-5" dy="-5" in="displace" result="unoffsetdisplace"/>
</filter>