Draw on the html5 canvas using text as your medium.
A Pen by Tim Holman on CodePen.
| let isSolvable = (matrix, startPoint, endPoint) => { | |
| let nextPoints = isSolvable.getNextPoints(matrix, startPoint); | |
| for (let i=0; i < nextPoints.length; i++) { | |
| if (nextPoints[i].join(' ') === endPoint.join(' ')) { | |
| isSolvable.status = true; | |
| break; | |
| } else { | |
| isSolvable(matrix, nextPoints[i], endPoint); | |
| } |
| function sum(a,b){ | |
| return a+b; | |
| } | |
| function F(f, a){ | |
| var c = f.bind(null, a); | |
| F = function(f, b){ | |
| return c(b) | |
| } | |
| } |
| var count = (function() { | |
| var a = 0; | |
| return function(){ | |
| var args = Array.prototype.slice.call(arguments[0]); | |
| if(arguments.length !== 0){ | |
| for (var i = 0, lngth = args.length; i < lngth; i++) { | |
| a += args[i]; | |
| } | |
| } | |
| return a; |
Draw on the html5 canvas using text as your medium.
A Pen by Tim Holman on CodePen.
They just move,if they find a 'friend' they get bigger
A Pen by Antonis Kamamis on CodePen.
| window.onload = function (){ | |
| var tableCreate = function (tableRowsCols, tdWidth, tdHeight) { | |
| if (tableRowsCols < 3 || tableRowsCols % 2 === 0) { | |
| tableRowsCols += 1; | |
| } | |
| var body = document.getElementsByTagName('body')[0], | |
| table = document.createElement('table'), |
| /** | |
| * @param frames number | |
| * @return string | |
| */ | |
| function format (frameNumber) { | |
| function convertFrames (frameNumber) { | |
| frameNumber = frameNumber + Math.round(frameNumber/1000); | |
| var frames = frameNumber % 30; | |
| var seconds = (( frameNumber - frames ) / 30) % 60; |
| <link href='http://fonts.googleapis.com/css?family=Source+Code+Pro|Dorsa' rel='stylesheet' type='text/css'> | |
| <h1> | |
| <span id="drop"> | |
| <svg viewBox="0 0 24 32"> | |
| <path fill="#555555" d="M23.998,19.797c0-0.021-0.001-0.044-0.001-0.065c-0.001-0.045-0.002-0.089-0.003-0.134 C23.68,9.733,12,0,12,0S0.32,9.733,0.007,19.597c-0.001,0.045-0.003,0.089-0.004,0.134c0,0.022-0.001,0.044-0.001,0.066 C0,19.865,0,19.932,0,20c0,0.074,0.001,0.148,0.002,0.222c0,0.006,0,0.012,0,0.019C0.13,26.757,5.453,32,12,32 s11.87-5.243,11.998-11.76c0-0.007,0-0.013,0-0.019C23.999,20.147,24,20.074,24,20C24,19.932,23.999,19.865,23.998,19.797z | |
| M19.999,20.148l0,0.013c-0.041,2.103-0.892,4.073-2.395,5.548C16.099,27.186,14.109,28,12,28c-0.39,0-0.775-0.027-1.154-0.082 | |
| c4.345-2.589,7.257-7.335,7.257-12.76c0-0.608-0.037-1.208-0.108-1.797c1.258,2.311,1.939,4.463,2,6.363v0.005 | |
| c0.001,0.029,0.001,0.059,0.002,0.089l0.001,0.045C20,19.909,20,19.955,20,20C20,20.05,20,20.098,19.999,20.148z"/> | |
| </svg> | |
| </span> |
| <canvas id= "c"> </canvas> | |
| <button id="reset">new colours</button> | |
| <div id="info"> | |
| <div id="top"> | |
| <a target="_blank" id="site" href="http://lonely-pixel.com">my website</a> | |
| <a id="close" href="">close</a> | |
| </div> | |
| <p> | |
| <br> | |
| - Alter particles/groups with the GROUPS variable.<br><br> |