From 0b766216669a849a44850a2fd634660e2659abb9 Mon Sep 17 00:00:00 2001 From: Jason Woofenden Date: Mon, 20 Jul 2015 12:26:18 -0400 Subject: [PATCH 1/1] looks like crayon --- auto.coffee | 18 ++++++++++++++++++ styl.styl | 5 +++-- 2 files changed, 21 insertions(+), 2 deletions(-) diff --git a/auto.coffee b/auto.coffee index ee3d133..8a9033e 100644 --- a/auto.coffee +++ b/auto.coffee @@ -217,6 +217,24 @@ init = -> svg.setAttribute 'viewBox', "0 0 #{width} #{height}" $svg = $ svg $container.append $svg + filter = document.createElementNS svg_ns, 'filter' + filter.setAttribute 'id', 'crayon' + filter.setAttribute 'filterUnits', 'userSpaceOnUse' + filter.setAttribute 'x', '-5%' + filter.setAttribute 'y', '-5%' + filter.setAttribute 'height', '110%' + filter.setAttribute 'width', '110%' + filter_inner = document.createElementNS svg_ns, 'feTurbulence' + filter_inner.setAttribute 'baseFrequency', '.3' + filter_inner.setAttribute 'numOctaves', '2' + filter_inner.setAttribute 'type', 'fractalNoise' + filter.appendChild filter_inner + filter_inner = document.createElementNS svg_ns, 'feDisplacementMap' + filter_inner.setAttribute 'scale', '6' + filter_inner.setAttribute 'xChannelSelector', 'R' + filter_inner.setAttribute 'in', 'SourceGraphic' + filter.appendChild filter_inner + svg.appendChild filter tool_buttons = tutorial: default: true, factory: TutorialTool diff --git a/styl.styl b/styl.styl index c5b6d5c..367744b 100644 --- a/styl.styl +++ b/styl.styl @@ -6,14 +6,15 @@ svg path fill: none stroke: #8c8c8c - stroke-width: 3 + stroke-width: 5 stroke-linecap: butt stroke-linejoin: round stroke-miterlimit: 4 stroke-opacity: 1 stroke-dasharray: none + filter: url(#crayon) /.crayon_mockup.delete_tool svg path:hover - stroke-width: 5 + stroke-width: 7 stroke: #f00 .button display: inline-block -- 1.7.10.4