diff --git a/.deploy/manifest-dev.yml b/.deploy/manifest-dev.yml
index b8d2f37..7340339 100644
--- a/.deploy/manifest-dev.yml
+++ b/.deploy/manifest-dev.yml
@@ -7,4 +7,6 @@ applications:
command: node ./node_modules/.bin/pancake && npm run build && node src/index.js
env:
NODE_ENV: development
- NODE_MODULES_CACHE: false
\ No newline at end of file
+ NODE_MODULES_CACHE: false
+ services:
+ - ups-chameleon
\ No newline at end of file
diff --git a/.deploy/manifest-prod.yml b/.deploy/manifest-prod.yml
index 3226f7f..9f6257e 100644
--- a/.deploy/manifest-prod.yml
+++ b/.deploy/manifest-prod.yml
@@ -8,4 +8,6 @@ applications:
env:
NODE_ENV: production
routes:
- - route: designsystem.gov.au/chameleon
\ No newline at end of file
+ - route: designsystem.gov.au/chameleon
+ services:
+ - ups-chameleon
\ No newline at end of file
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 733532b..e6b2311 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,2 @@
-# 0.2.1
-- Sanitised user input
-
-# 0.2.0
+# 1.0.0
- 🎉 Initial release
\ No newline at end of file
diff --git a/README.md b/README.md
index 8a9954e..3fd9073 100644
--- a/README.md
+++ b/README.md
@@ -2,34 +2,68 @@
> Interactive colour template previews for the Design System.
+Chameleon allows users to change and share different colour palettes using the Australian Government Design System. It is a server that takes query parameters altering the appearance of the template.
+
+You can access it through a user interface at [https://designsystem.gov.au/templates/home/customise](https://designsystem.gov.au/templates/home/customise) if you want to use it locally you can follow the instructions below.
+
## Install
+
+Clone chameleon into a local directory:
+```
+git clone git@github.com:govau/chameleon.git
+```
+
+Make sure you are in your cloned directory and install the dependencies:
+
```node
npm install
```
-Then run `npm start` or `npm watch` to start the server.
+Then run `npm run start` or `npm run watch`.
## Getting started
-Some information.
+Once the server is running you should be able to connect to it with [http://localhost:3000/chameleon](http://localhost:3000/chameleon).
+
+Chameleon looks like a full page template using the Australian Government Design System. It has multiple templates in the `/templates` directory. You can access the templates by navigating to the url [http://localhost:3000/chameleon/content](http://localhost:3000/chameleon/content).
+
+To change the colours you can add a query parameter. [http://localhost:3000/chameleon/content?action=red&background=#eee](http://localhost:3000/chameleon/content?action=red&background=#eee).
+
+Using query parameters you can modify the templates and share them. The supported query parameters are:
+ - `text`, the default text colour
+ - `action`, the interactive colour used on buttons and links
+ - `focus`, the focus colour when interactive elements receive focus
+ - `background`, the background colour
+ - `textDark`, dark variation of the text colour
+ - `actionDark`, dark variation of the action colour
+ - `focusDark`, dark variation of the focus colour
+ - `backgroundDark`, dark variation of the background colour
+
+
+## How it works
+
+The server [expressjs](https://expressjs.com/ ) reads the data from the HTML files based on the URL. If there are valid query parameters it generates a new stylesheet and replaces the `
-
In the basic page section
-
+
Basic page
diff --git a/test/unit/index.spec.js b/test/unit/index.spec.js
index 82e4bd6..806c5b4 100644
--- a/test/unit/index.spec.js
+++ b/test/unit/index.spec.js
@@ -18,6 +18,7 @@ const It = Mocha.it;
const CreateStyles = require( '../../src/style' );
const GenerateHTML = require( '../../src/html' );
const { Autoprefix } = require( '../../src/style' );
+const { ColorMapToString, ParseRequestPath} = require( '../../src/slack' );
/**
* CreateStyles tests
@@ -223,4 +224,41 @@ Describe( 'Autoprefixer()', () => {
Expect( css ).to.equal( prefixedCss );
});
+});
+
+
+/**
+ * Slack tests
+ */
+Describe( 'ColorMapToString()', () => {
+ It( 'Should return the correct string given a valid request query', ( done ) => {
+ const expressRequestQuery = {
+ action: 'purple',
+ background: 'red'
+ }
+ Expect( ColorMapToString( expressRequestQuery ) ).to.equal( '\n`action`: #800080\n`background`: #FF0000' )
+ done();
+ });
+
+ It( 'Should return "the default palette." given empty request query', ( done ) => {
+ Expect( ColorMapToString( {} ) ).to.equal( 'the default palette.' )
+ done();
+ });
+});
+
+Describe( 'ParseRequestPath()', () => {
+ It( 'Should return the homepage template when requesting /chameleon', ( done ) => {
+ Expect( ParseRequestPath( '/chameleon' ) ).to.equal( 'homepage' )
+ done();
+ });
+
+ It( 'Should return the homepage template when requesting /chameleon/', ( done ) => {
+ Expect( ParseRequestPath( '/chameleon/' ) ).to.equal( 'homepage' )
+ done();
+ });
+
+ It( 'Should return the basic template when requesting /chameleon/basic', ( done ) => {
+ Expect( ParseRequestPath( '/chameleon/basic' ) ).to.equal( 'basic' )
+ done();
+ });
});
\ No newline at end of file
- 
+ 