psbolden’s gists

psbolden / gist:f42c85becc0d95c815d04645dd955f88

Created March 8, 2017 20:12

d3plus text wrapping example

	Source: https://bl.ocks.org/davelandry/a39f0c3fc52804ee859a

	<!DOCTYPE html>
	<meta charset="utf-8">

	<script src="//d3plus.org/js/d3.js"></script>
	<script src="//d3plus.org/js/d3plus.js"></script>

	<style>

psbolden / gist:c5b2c0a09d2956f5bacd61a6730f8c43

Created March 7, 2017 16:52

download fabric canvas to url with name

	http://stackoverflow.com/questions/20032214/recreate-fabric-js-canvas-and-export-as-an-image

	function download(url,name){
	// make the link. set the href and download. emulate dom click
	$('<a>').attr({href:url,download:name})[0].click();
	}
	function downloadFabric(canvas,name){
	// convert the canvas to a data url and download it.
	download(canvas.toDataURL(),name+'.png');
	}

psbolden / html

Created February 16, 2017 17:59

fabric.js set text

psbolden / css

Created February 16, 2017 17:10

Fabric.js Text Editor

psbolden / gist:d27c0ac9b6cba6821b35e2ea1eecdee0

Created February 16, 2017 16:58

fabric.js delete selected object

	Source: http://jsfiddle.net/beewayne/z0qn35Lo/

	HTMl
	____

	<canvas id="paper" width="400" height="400" style="border:1px solid #ccc"></canvas>

	<button id="select">Selection mode</button>
	<button id="draw">Drawing mode</button>
	<button id="delete">Delete selected object(s)</button>

psbolden / gist:f331f2921ce0c751586b8f1ac93faaf0

Created February 16, 2017 16:56

fabric.js make object(s) unselectable

	Source: http://stackoverflow.com/questions/33831088/fabric-canvas-make-my-1st-object-always-unselectable?rq=1

	//lowest object unselectable
	var objectx = canvas.getObjects();
	objectx[0].selectable = false;

	//highest object unselectable
	var objectx = canvas.getObjects();
	objectx[objectx.length - 1].selectable = false;

psbolden / gist:49fa36c71fe72fff7ef7a7bb61c0d1c9

Created February 16, 2017 16:51

Fabric JS to SVG, PNG, Object

	Source:

	HTML
	_____

	<canvas id="c" width="300" height="300"></canvas>


	CSS
	_____

psbolden / gist:e1a2dcd11d1e15843efe0521b057e76e

Created February 16, 2017 16:41

fabric.js change text font

	Source: http://stackoverflow.com/questions/32395416/fabric-canvas-font-style-change-after-added

	HTML
	_____

	<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.5.0/fabric.min.js"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
	<label>Select Font:</label>
	<select name="FontStyleNumber" id="FontStyleNumber">
	<option value="Times New Roman">Times New Roman</option>

psbolden / gist:498bf976404279a53deed9603ee3cba8

Created February 14, 2017 21:51

fabric.js ungrouping and grouping items

	source: http://stackoverflow.com/questions/30904999/grouping-and-ungrouping-fabric-js-objects


	var canvas = new fabric.Canvas('paper',{
	isDrawingMode: true
	});
	$("#select").click(function(){
	canvas.isDrawingMode = false;
	});
	$("#draw").click(function(){

psbolden / gist:f14a31a1035bcb52fb7f7249ed31216c

Created February 10, 2017 18:56

invoking a lambda function from the browser - example

	source: http://docs.aws.amazon.com/sdk-for-javascript/v2/developer-guide/browser-invoke-lambda-function-full.html


	<!doctype html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>Emoji Slots</title>
	<link href="emojislots.css" rel="stylesheet" type="text/css">
	<script src="https://sdk.amazonaws.com/js/aws-sdk-2.7.20.min.js"></script>