Skip to content

Instantly share code, notes, and snippets.

View blackslate's full-sized avatar

James Newton blackslate

74 followers · 2 following
View GitHub Profile
@blackslate
blackslate / Drag Module
Last active January 9, 2022 12:24
/**
* This gist provides a simple solution for dragging an HTML element
* with a mouse or on a touch screen. It includes a fix for an issue
* specific to React.
*
* See [plain js implementation](https://github.com/blackslate/draggable/)
* [demo](https://blackslate.github.io/draggable/)
*
* See [React implementation](https://github.com/blackslate/draggable-react/)
* [demo](https://blackslate.github.io/draggable-react/)
@blackslate
blackslate / webDevEnv.md
Last active April 11, 2021 04:00
Setting up a web development environment on Ubuntu

Setting up your laptop for web development

Nautilus

Guided Tour

Open a Terminal window

  • Ctrl-Alt-T
  • Right click in desktop window; choose Open In Terminal
@blackslate
blackslate / gist:aae4f000d54083f55e0b
Last active December 5, 2015 01:08
Trackball inset to control a perspective camera
<!-- Demo: http://codepen.io/anon/pen/MKWrOr -->
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r73/three.js"></script>
<style>
body {
margin: 0;
@blackslate
blackslate / gist:b6d55a9bec416abccc54
Last active December 4, 2015 19:16
Trackball Camera
<!-- Demo: http://lexogram.com/clara/trackballCamera/ -->
<!DOCTYPE html>
<html>
<head>
<title>THREE.JS WORLD</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r73/three.js"></script>
<style>
body {
@blackslate
blackslate / gist:46cf06ecdbf719e5c311
Created November 27, 2015 15:20
THREE.Ray.prototype.closestPointToRay
THREE.Ray.prototype.closestPointToRay = function (that, details) {
// that: THREE.Ray()
// details: (optional) object
// { pointOnThisRay: <THREE.Vector3>
// , pointOnThatRay: <THREE.Vector3>
// , midPoint: <THREE.Vector3>
// , distanceBetweenClosestPoints: <float>
// }
// For an explanation of the vector mathematics, see:
// http://morroworks.com/Content/Docs/Rays%20closest%20point.pdf
@blackslate
blackslate / gist:695cf7e76348c4948db7
Last active July 29, 2021 20:30
Demo of using project() and unproject() to drag an object parallel to the camera plane
<!DOCTYPE html>
<html>
<head>
<title>THREE.JS WORLD</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r73/three.js"></script>
<style>
body {
/* set margin to 0 and overflow to hidden, to
use the complete page */
@blackslate
blackslate / gist:fc1bc4a48d0fa5981870
Created November 26, 2015 17:03
Demo of using cameraToWorld matrix
<!DOCTYPE html>
<html>
<head>
<title>THREE.JS WORLD</title>
<script type="text/javascript" src="../thirdparty/three.js"></script>
<style>
body {
/* set margin to 0 and overflow to hidden, to
use the complete page */
@blackslate
blackslate / Demo of dragging objects along an axis
Created November 25, 2015 20:18
<!DOCTYPE html>
<html>
<head>
<title>THREE.JS WORLD</title>
<script type="text/javascript" src="thirdparty/three.js"></script>
<style>
body {
/* set margin to 0 and overflow to hidden, to
use the complete page */
@blackslate
blackslate / gist:41c5c851446d746ecae0
Last active November 23, 2015 22:24
Demo of Annotation trigger("click") issue #5935
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Pixipedia</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script>window.lightningjs||function(c){function g(b,d){d&&(d+=(/\?/.test(d)?"&":"?")+"lv=1");c[b]||function(){var i=window,h=document,j=b,g=h.location.protocol,l="load",k=0;(function(){function b(){a.P(l);a.w=1;c[j]("_load")}c[j]=function(){function m(){m.id=e;return c[j].apply(m,arguments)}var b,e=++k;b=this&&this!=i?this.id||0:0;(a.s=a.s||[]).push([e,b,arguments]);m.then=function(b,c,h){var d=a.fh[e]=a.fh[e]||[],j=a.eh[e]=a.eh[e]||[],f=a.ph[e]=a.ph[e]||[];b&&d.push(b);c&&j.push(c);h&&f.push(h);return m}; return m};var a=c[j]._={};a.fh={};a.eh={};a.ph={};a.l=d?d.replace(/^\/\//,(g=="https:"?g:"http:")+"//"):d;a.p={0:+new Date};a.P=function(b){a.p[b]=new Date-a.p[0]};a.w&&b();i.addEventListener?i.addEventListener(l,b,!1):i.attachEvent("on
@blackslate
blackslate / RoomDoorKey.adoc
Last active August 26, 2015 20:03 — forked from nawroth/GraphGist-syntax.adoc

Maze with locked doors

In this gist model of the maze, you can reach room D by following the path A→B→C→A, picking up the key for room D in room B. However it is not possible to reach room F, since the key to room F is in room E, and the key to room E is in room D, and there is no way back from room D to room A, so room E is inaccessible. (Finding the HIDDEN door from room D to room C would make this possible.)

Demo Maze

Is it possible to create queries which take into account the keys that can be picked up on the way? For example:

  • Is it possible to get from room X to room Y?