Commit 96908d34 authored by Adam Procter's avatar Adam Procter 💩

initial commit

parent f7f32bdd
<p>Copyright (c) HTML5 Boilerplate</p>
<p>Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the &quot;Software&quot;), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies
of the Software, and to permit persons to whom the Software is furnished to do
so, subject to the following conditions:</p>
<p>The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.</p>
<p>THE SOFTWARE IS PROVIDED &quot;AS IS&quot;, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.</p>
/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
/*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
html,
button,
input,
select,
textarea {
color: #222;
}
html {
font-size: 1em;
line-height: 1.4;
}
/*
* Remove text-shadow in selection highlight: h5bp.com/i
* These selection rule sets have to be separate.
* Customize the background color to match your design.
*/
::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}
::selection {
background: #b3d4fc;
text-shadow: none;
}
/*
* A better looking default horizontal rule
*/
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}
/*
* Remove the gap between images, videos, audio and canvas and the bottom of
* their containers: h5bp.com/i/440
*/
audio,
canvas,
img,
video {
vertical-align: middle;
}
/*
* Remove default fieldset styles.
*/
fieldset {
border: 0;
margin: 0;
padding: 0;
}
/*
* Allow only vertical resizing of textareas.
*/
textarea {
resize: vertical;
}
/* ==========================================================================
Browse Happy prompt
========================================================================== */
.browsehappy {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
}
/* ==========================================================================
Author's custom styles
========================================================================== */
/* ==========================================================================
Helper classes
========================================================================== */
/*
* Image replacement
*/
.ir {
background-color: transparent;
border: 0;
overflow: hidden;
/* IE 6/7 fallback */
*text-indent: -9999px;
}
.ir:before {
content: "";
display: block;
width: 0;
height: 150%;
}
/*
* Hide from both screenreaders and browsers: h5bp.com/u
*/
.hidden {
display: none !important;
visibility: hidden;
}
/*
* Hide only visually, but have it available for screenreaders: h5bp.com/v
*/
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
/*
* Extends the .visuallyhidden class to allow the element to be focusable
* when navigated to via the keyboard: h5bp.com/p
*/
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}
/*
* Hide visually and from screenreaders, but maintain layout
*/
.invisible {
visibility: hidden;
}
/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* `contenteditable` attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
*/
.clearfix:before,
.clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.clearfix:after {
clear: both;
}
/*
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
.clearfix {
*zoom: 1;
}
/* ==========================================================================
EXAMPLE Media Queries for Responsive Design.
These examples override the primary ('mobile first') styles.
Modify as content requires.
========================================================================== */
@media only screen and (min-width: 35em) {
/* Style adjustments for viewports that meet the condition */
}
@media print,
(-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {
/* Style adjustments for high resolution devices */
}
/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */
@media print {
* {
background: transparent !important;
color: #000 !important; /* Black prints faster: h5bp.com/s */
box-shadow: none !important;
text-shadow: none !important;
}
a,
a:visited {
text-decoration: underline;
}
a[href]:after {
content: " (" attr(href) ")";
}
abbr[title]:after {
content: " (" attr(title) ")";
}
/*
* Don't show links for images, or javascript/internal links
*/
.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}
thead {
display: table-header-group; /* h5bp.com/t */
}
tr,
img {
page-break-inside: avoid;
}
img {
max-width: 100% !important;
}
@page {
margin: 0.5cm;
}
p,
h2,
h3 {
orphans: 3;
widows: 3;
}
h2,
h3 {
page-break-after: avoid;
}
}
/*! normalize.css v1.1.3 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block;*display:inline;*zoom:1}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}html,button,input,select,textarea{font-family:sans-serif}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em;margin:.83em 0}h3{font-size:1.17em;margin:1em 0}h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.67em;margin:2.33em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}blockquote{margin:1em 40px}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}p,pre{margin:1em 0}code,kbd,pre,samp{font-family:monospace,serif;_font-family:'courier new',monospace;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:before,q:after{content:'';content:none}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ul,nav ol{list-style:none;list-style-image:none}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure{margin:0}form{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle}button,input{line-height:normal}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;*overflow:visible}button[disabled],html input[disabled]{cursor:default}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;*height:13px;*width:13px}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0}
\ No newline at end of file
favicon.ico

766 Bytes

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<link rel='stylesheet' href='css/main.css'>
<link rel='stylesheet' href='css/normalize.min.css'>
</head>
<body>
<!-- Add your site or application content here -->
<div id="app">
{{ msg }}
</div>
<script src='js/vue.js'></script>
<script src='js/svg.js'></script>
<script src='js/draggy.js'></script>
<script src='js/connectable.js'></script>
<script src='js/main.js'></script>
</body>
</html>
"use strict";
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
(function e(t, n, r) {
function s(o, u) {
if (!n[o]) {
if (!t[o]) {
var a = typeof require == "function" && require;if (!u && a) return a(o, !0);if (i) return i(o, !0);var f = new Error("Cannot find module '" + o + "'");throw f.code = "MODULE_NOT_FOUND", f;
}var l = n[o] = { exports: {} };t[o][0].call(l.exports, function (e) {
var n = t[o][1][e];return s(n ? n : e);
}, l, l.exports, e, t, n, r);
}return n[o].exports;
}var i = typeof require == "function" && require;for (var o = 0; o < r.length; o++) {
s(r[o]);
}return s;
})({ 1: [function (require, module, exports) {
var Id = require("idy"),
SetOrGet = require("set-or-get"),
IterateObject = require("iterate-object"),
Deffy = require("deffy");var _connections = {},
_betweenTwoBubbles = {},
container = null,
markers = null;function connectable(options, elmTarget) {
var con = {};if (elmTarget === undefined) {
elmTarget = options;options = {};
}container = options.container || container;var elmSource = this;markers = options.markers || markers;options.k = options.k || 100;options.kk = options.kk || 10;var marker = markers.marker(10, 10),
markerId = "triangle-" + Id(),
line = container.path().attr("marker-end", "url(#" + markerId + ")").fill("none");marker.attr({ id: markerId, viewBox: "0 0 10 10", refX: "0", refY: "5", markerUnits: "strokeWidth", markerWidth: "4", markerHeight: "5" });marker.path().attr({ d: "M 0 0 L 10 5 L 0 10 z" });var sPos = {},
tPos = {};con.source = elmSource;con.target = elmTarget;con.line = line;con.marker = marker;SetOrGet(_connections, con.source.id(), []).push(con);SetOrGet(_connections, con.target.id(), []).push(con);SetOrGet(_betweenTwoBubbles, { toString: function toString() {
var ids = [con.source.id(), con.target.id()],
id1 = ids.join("->"),
id2 = ids.reverse().join("->");con._ = con.id = id1;if (_betweenTwoBubbles[id2]) {
con._ = id2;return id2;
}con.id = id1;return id1;
} }, []).push(con);con.computeLineCoordinates = function (cons) {
var output = [],
l = cons.length;IterateObject(cons, function (con, i) {
var sT = con.source.transform(),
tT = con.target.transform(),
sB = con.source.bbox(),
tB = con.target.bbox(),
x1 = sT.x + sB.width / 2,
y1 = sT.y + sB.height / 2,
x2 = tT.x + tB.width / 2,
y2 = tT.y + tB.height / 2,
cx = (x1 + x2) / 2,
cy = (y1 + y2) / 2,
dx = Math.abs((x1 - x2) / 2),
dy = Math.abs((y1 - y2) / 2),
dd = null,
out = { x1: x1, y1: y1, x2: x2, y2: y2, ex: x1, ey: y1 };if (i !== (l - 1) / 2) {
dd = Math.sqrt(dx * dx + dy * dy);out.ex = cx + dy / dd * options.k * (i - (l - 1) / 2);out.ey = cy - dx / dd * options.k * (i - (l - 1) / 2);
}output.push(out);
});return output;
};if (options.padEllipse) {
con.computeLineCoordinates = function (cons) {
var output = [],
l = cons.length;IterateObject(cons, function (con, i) {
var elmS = con.source.node.querySelector("ellipse") || con.source.node.querySelector("circle"),
elmT = con.target.node.querySelector("ellipse") || con.target.node.querySelector("circle"),
xR1,
xR2,
yR1,
yR2,
sT = con.source.transform(),
tT = con.target.transform(),
sB = con.source.bbox(),
tB = con.target.bbox();if (elmS.tagName === "circle") {
xR1 = yR1 = parseFloat(elmS.getAttribute("r"));xR2 = yR2 = parseFloat(elmT.getAttribute("r"));
} else {
xR1 = parseFloat(elmS.getAttribute("rx"));yR1 = parseFloat(elmS.getAttribute("ry"));xR2 = parseFloat(elmT.getAttribute("rx"));yR2 = parseFloat(elmT.getAttribute("ry"));
}var sx = sT.x + xR1 / 2,
sy = sT.y + yR1 / 2,
tx = tT.x + xR2 / 2,
ty = tT.y + yR2 / 2,
dx = tx - sx,
dy = ty - sy,
d = Math.sqrt(dx * dx + dy * dy),
ux = dx / d,
uy = dy / d,
cx1 = sx + xR1 * ux,
cy1 = sy + yR1 * uy,
cx2 = sx + (d - xR2 - 5) * ux,
cy2 = sy + (d - yR2 - 5) * uy;var x1 = cx1 + xR1 / 2,
y1 = cy1 + yR1 / 2,
x2 = cx2 + xR2 / 2,
y2 = cy2 + yR2 / 2;var cx = (x1 + x2) / 2,
cy = (y1 + y2) / 2,
dd = null,
out = { x1: x1, y1: y1, x2: x2, y2: y2, ex: x1, ey: y1 };if (isNaN(out.x1)) {
out.x1 = sT.x + xR1 * 2;out.y1 = sT.y + yR1 / 2;out.x2 = sT.x;out.y2 = out.y1;out.ex = (out.x1 + out.x2) / 2;out.ey = out.y1 - options.kk * (i + 1);
} else {
dx = Math.abs((x1 - x2) / 2);dy = Math.abs((y1 - y2) / 2);if (i !== (l - 1) / 2) {
dd = Math.sqrt(dx * dx + dy * dy);out.ex = cx + dy / dd * options.k * (i - (l - 1) / 2);out.ey = cy - dx / dd * options.k * (i - (l - 1) / 2);
}
}output.push(out);
});return output;
};
}elmSource.cons = elmSource.cons || [];elmSource.cons.push(con);con.update = function () {
var cons = Deffy(_betweenTwoBubbles[con._], []),
results = con.computeLineCoordinates(cons);IterateObject(results, function (r, i) {
cons[i].line.plot("M" + r.x1 + " " + r.y1 + " Q" + r.ex + " " + r.ey + " " + r.x2 + " " + r.y2);
});
};con.update();elmSource.on("dragmove", con.update);elmTarget.on("dragmove", con.update);con.setLineColor = function (color, c) {
c = c || this;c.line.stroke(color);c.marker.fill(color);
};return con;
}if (typeof SVG === "function") {
SVG.extend(SVG.Element, { connectable: connectable });
} else if ((typeof window === "undefined" ? "undefined" : _typeof(window)) === "object") {
throw new Error("SVG.js is not loaded but it is required.");
}module.exports = connectable;
}, { deffy: 2, idy: 4, "iterate-object": 5, "set-or-get": 6 }], 2: [function (require, module, exports) {
var Typpy = require("typpy");function Deffy(input, def, options) {
if (typeof def === "function") {
return def(input);
}options = Typpy(options) === "boolean" ? { empty: options } : { empty: false };if (options.empty) {
return input || def;
}if (Typpy(input) === Typpy(def)) {
return input;
}return def;
}module.exports = Deffy;
}, { typpy: 3 }], 3: [function (require, module, exports) {
function Typpy(input, target) {
if (arguments.length === 2) {
return Typpy.is(input, target);
}return Typpy.get(input, true);
}Typpy.is = function (input, target) {
return Typpy.get(input, typeof target === "string") === target;
};Typpy.get = function (input, str) {
if (typeof input === "string") {
return str ? "string" : String;
}if (null === input) {
return str ? "null" : null;
}if (undefined === input) {
return str ? "undefined" : undefined;
}if (input !== input) {
return str ? "nan" : NaN;
}return str ? input.constructor.name.toLowerCase() : input.constructor;
};module.exports = Typpy;
}, {}], 4: [function (require, module, exports) {
function Idy(length) {
length = length || 10;return Math.random().toString(35).substr(2, length);
}module.exports = Idy;
}, {}], 5: [function (require, module, exports) {
function IterateObject(obj, fn) {
var i = 0,
keys = [];if (Array.isArray(obj)) {
for (; i < obj.length; ++i) {
if (fn(obj[i], i, obj) === false) {
break;
}
}
} else {
keys = Object.keys(obj);for (; i < keys.length; ++i) {
if (fn(obj[keys[i]], keys[i], obj) === false) {
break;
}
}
}
}module.exports = IterateObject;
}, {}], 6: [function (require, module, exports) {
var Deffy = require("deffy");function SetOrGet(input, field, def) {
return input[field] = Deffy(input[field], def);
}module.exports = SetOrGet;
}, { deffy: 7 }], 7: [function (require, module, exports) {
arguments[4][2][0].apply(exports, arguments);
}, { dup: 2, typpy: 8 }], 8: [function (require, module, exports) {
arguments[4][3][0].apply(exports, arguments);
}, { dup: 3 }] }, {}, [1]);
\ No newline at end of file
(function() {
SVG.extend(SVG.Element, {
/**
* draggy
* Makes an element draggable.
*
* @name draggy
* @function
* @param {Object|Function} constraint An object containing the
* constraint values or a function which gets the `x` and `y` values
* and returns a boolean or an object containing the `x` and `y`
* boolean values.`false` skips moving while `true` allows it.
* @return {SVG} The SVG element.
*/
draggy: function (constraint) {
var start
, drag
, end
, element = this
;
// Remove draggable if already present
if (typeof this.fixed === "function") {
this.fixed();
}
// Ensure constraint object
constraint = constraint || {};
// Start dragging
start = function(event) {
var parent = this.parent(SVG.Nested) || this.parent(SVG.Doc);
event = event || window.event;
// Invoke any callbacks
if (element.beforedrag) {
element.beforedrag(event);
}
// Get element bounding box
var box = element.bbox();
if (element instanceof SVG.G) {
box.x = element.x();
box.y = element.y();
} else if (element instanceof SVG.Nested) {
box = {
x: element.x()
, y: element.y()
, width: element.width()
, height: element.height()
};
}
// Store event
element.startEvent = event;
// Store start position
element.startPosition = {
x: box.x
, y: box.y
, width: box.width
, height: box.height
, zoom: parent.viewbox().zoom
, rotation: element.transform("rotation") * Math.PI / 180
};
// Add while and end events to window
SVG.on(window, "mousemove", drag);
SVG.on(window, "touchmove", drag);
SVG.on(window, "mouseup", end);
SVG.on(window, "touchend", end);
// Invoke any callbacks
element.node.dispatchEvent(new CustomEvent("dragstart", {
detail: {
event: event
, delta: {
x: 0
, y: 0
}
}
}));
// Prevent selection dragging
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}