/README.md

  1CSS FilterLab
  2=====
  3
  4Supported Browsers
  5-----
  6
  7CSS FilterLab uses CSS Filters, an exciting web technology that's becoming available in more and more browsers.
  8Check out [Can I Use](http://caniuse.com/css-filters) for availability information.
  9
 10Articles about FilterLab
 11-----
 12
 13[Introducing CSS FilterLab](http://www.adobe.com/devnet/html5/articles/css-filterlab.html) by Razvan Caliman at Adobe
 14
 15[CSS FilterLab Detailed Walkthrough](http://blattchat.com/2012/10/02/css-filterlab/) from Alan Greenblatt's blog
 16
 17Note: These articles mention CSS Custom Filters, an experimental technology no longer available in CSS FilterLab.
 18
 19Contributing to FilterLab
 20-----
 21Pull requests are reviewed and accepted.
 22
 23Check out our [contributing page](CONTRIBUTING.md) for more info.
 24
 25Running FilterLab Locally
 26-----
 27
 28### Git Submodules
 29
 30The CodeMirror library is linked as a git submodule.
 31After you clone the project on your machine you'll need to setup the submodules and pull in their code.
 32
 33<pre>
 34cd ./path/to/css/filterlab/
 35$ git submodule update --init
 36</pre>
 37
 38### Build
 39
 40CSS FilterLab uses [Grunt.js](http://gruntjs.com/) to concatenate and minify JavaScript & CSS resources. [Grunt.js](http://gruntjs.com/) is build on nodejs, so if you don't have it already installed, go to [node.js website](http://nodejs.org/) and follow the instructions to install it. After that use the command line node package manager to install grunt.js:
 41
 42<pre>
 43$ sudo npm install -g grunt
 44</pre>
 45
 46The grunt.js project file uses other node.js modules. To quicly install all the required libraries run "npm install" in the project folder.
 47
 48<pre>
 49cd ./path/to/css/filterlab/
 50$ sudo npm install
 51</pre>
 52
 53You also need to make sure you have Ruby & Sass installed.  If you're on OS X or Linux you probably already have them installed.  Try <code>ruby -v</code> in your terminal.  When you've confirmed you have Ruby installed, run <code>sudo gem install sass</code> to get Sass.
 54
 55To build CSS FilterLab, you need to run the "grunt" command line tool in the project folder. This will generate the "dist/" folder.
 56
 57<pre>
 58cd ./path/to/css/filterlab/
 59$ grunt
 60</pre>
 61
 62### File System Access
 63
 64CSS FilterLab requires XHR access, but that doesn't work very well when loaded from file:// URLs. For that reason running CSS FilterLab requires serving it from a server. The easiest way to do that on a Mac would be to use python's simple server:
 65
 66<pre>
 67cd [./path/to/css/filterlab]/dist/
 68python -m SimpleHTTPServer
 69</pre>
 70
 71Open [http://localhost:8000](http://localhost:8000) in your browser.
 72
 73Legal
 74----
 75
 76Notices, terms and conditions pertaining to third party software are located at [http://www.adobe.com/go/thirdparty/](http://www.adobe.com/go/thirdparty/) and incorporated by reference herein.
 77
 78### jQuery
 79
 80Copyright 2012 jQuery Foundation and other contributors [http://jquery.com/](http://jquery.com/)
 81
 82[MIT license](https://github.com/jquery/jquery/blob/master/MIT-LICENSE.txt)
 83
 84### jQuery UI
 85
 86Copyright (c) 2012 Paul Bakaus, [http://jqueryui.com/](http://jqueryui.com/)
 87
 88[MIT license](http://jquery-ui.googlecode.com/svn/tags/latest/MIT-LICENSE.txt)
 89
 90### ANGLE
 91
 92Copyright (c) 2002-2011 The ANGLE Project Authors. All rights reserved.
 93Use of this source code is governed by a BSD-style license that can be
 94found in the LICENSE file.
 95
 96This JavaScript library was automatically generated from the [ANGLE project](http://code.google.com/p/angleproject/) 
 97using [emscripten](https://github.com/kripken/emscripten)
 98 
 99For more information go to [ANGLE.js](https://github.com/adobe/angle.js)
100
101### CodeMirror
102
103Copyright (C) 2012 by Marijn Haverbeke <marijnh@gmail.com>
104
105[MIT License](http://codemirror.net/LICENSE)