This is a lightweight CMS built with Angular.js, Twitter Bootstrap and Node.js.

Follow these steps when adding features to this project.

1. Textual scenario - Each story will have a textual scenario that describes what should occur.
2. GUI mock-up - Visual mock-ups of the story will show how the UI should look.
3. Storyboard - Along with the mock-ups, steps in the process will make up a storyboard.
4. Class diagram - Diagrams of how modules should be constructed.
5. Algorithm design - Textual algorithm design will explain how the implementation should work.
6. Implementation - The actual development of the code will take place.
7. Testing - Unit and e2e testing will then verify the implementation of the story.

##Authentication System

As a admin I want to have user authentication for accessing the data.

Scenario: Tom goes to the local farmers market to sell his products. Tom uses angular-cms to manage his sales and employees, he wants to user authentication to administor his content.

1. Tom sells a burger for $10, Tom needs to add the sale to his records.

• Tom opens his tablets web browser and enters the url of his cms, clicks the sign in link and is presented with a login form.
• Tom enters his email and password then clicks the login button.
• Tom is then directed to the Dashboard to add the sale.

GUI Mock-up: The following is a mock-up created from visualizing the scenario above.

Storyboard:

1. Enter valid user email address.
2. Enter user password.
3. Select "Stay signed in" checkbox.
4. Click "Sign in" button.
5. Success - Dashboard should appear after successful authentication
6. Fail - Alert dialog should appear stating the issue.

####Story: User Registration

Scenario: Tom has hired a new employee Joe, to help manage the sales of Tom’s products. Tom uses a CMS to manage his employees sales.

1. Joe needs to register his credentials so he can add new sales to Tom’s records.

• Joe opens his tablets web browser and enters the url of the cms, clicks the sign up link and is presented with a registration form.
• Joe enters his email and password, agrees to the terms then clicks the register button.
• Joe is then redirected back to the cms login page to sign in.

The following is a mock-up created from visualizing the scenario above.

Tom’s new employee Joe just sold a burger for $10, he needs to login to the CMS to add his sale.

The following is a mock-up created from visualizing the scenario above.

Storyboard:

1. Joe needs to reset his password so he can add the new sale to Tom’s records.

• Joe opens his tablets web browser and enters the url of the cms, clicks the sign in link and is presented with a login form, but Joe forgot his password. He clicks the forgot password link and is presented with a reset password form.
• Joe enters his email and clicks the reset button.
• Joe is then presented with a message to check his email and follow the reset instructions.

Tom’s new employee Joe receives an email to reset his password for the CMS.

The following is a mock-up created from visualizing the scenario above.

Storyboard:

1. Joe clicks the link in his email and his web browser opens and is presented with a reset password form.

• Joe verifies his email matches the email input, then enters his new password twice to ensure they match.
• Joe then clicks the update button to save his new password.
• Joe is then directed to the CMS sign in page to login with his new credentials.

Tom wants to login to his CMS and see a dashboard with the daily/weekly/monthly/yearly sales, he also wants to be able to quickly add a product to his catalog. He also wants a quick way to input a new sale. He also wants to be notified if a sale is incoming so he can start to process the orders.

The following is a mock-up created from visualizing the scenario above.

Tom wants to manage all of his employees information and sales, so all of Toms employees must register a new account so they can enter information, Tom wants to allow manager employees to have admin rights of content, but other employees just to be members who can only add sales. He wants to be able to manage all of the users in his CMS.

The following is a mock-up created from visualizing the scenario above.

As a admin I want to upload media, and be able to choose from exisiting media when creating content, I want to be able to upload multiple files by drag and drop.

The following is a mock-up created from visualizing the scenario above.

Model:

  defaults: 
    title:string
    size:int
    path:string
    url:string
    mimetype:string

View:

• role - admin
• route - #/admin/media
• file - /views/admin/media.html

Controller:

 $scope:
  uploaded:[] - Holds current uploaded files
  files:[] - Holds current pending files
  upload:(file) - Starts a upload
  deleteUpload:(file) - Removes a file from uploaded files.
  deleteFile:(file) - Removes a file from pending files
  clearFiles() - Removes all files from pending files.
  clearUploads - Removes all files from uploaded files
  isUploading:boolean - Whether or not a file is being uploaded.

As a user of the CMS being able to install and manage plugins that add aditional functionality to the CMS is required.

The following is a mock-up created from visualizing the scenario above.

This is the structure of a plugin.

my-plugin/
	package.json
	bower.json
	my-plugin.css
	my-plugin.js
	index.html
	partials/
		header.html
		sidebar.html
		footer.html
		content.html

As a user of the CMS I want to be able to add widgets to pages of my website. I want to be able to add widgets to the dashboard as well, and enable which type of user can view those widgets.

The following is a mock-up created from visualizing the scenario above.

As a admin of the CMS I want to be able to change the public theme, I want to install themes and activate them.

The following is a mock-up created from visualizing the scenario above.

This is the structure of the themes.

my-theme/
	package.json
	bower.json
	css/
		my-theme.css
	js/
		my-theme.js
	index.html
	partials/
		header.html
		sidebar.html
		footer.html
		content.html

As a admin of the CMS I want to configure global settings, view database stats, change api and cdn locations and adjust time and date formats.

The following is a mock-up created from visualizing the scenario above.

Download the [production version][min] or the [development version][max].

To start the node server you should start the mongo instance first.

To start mongodb execute the following command:

$ sudo sh ./bin/db.sh

To start node execute the following command:

$ node server

Open up the default host localhost:8181

The server is a Node.js server that supports dynamic RESTful API calls to resource endpoints.

Base URL: http://localhost:8181/api/v2

This is an example request to authenticate against the default database.users collection.

Default users created are:

Superadmin - Access to everything.

• email: [email protected]
• pass: admin1234

Admin - Access to manage users, etc..

• email: [email protected]
• pass: admin1234

Request:

POST /api/v2/angular-cms/users/login HTTP/1.1
Host: localhost:8181
Content-Type: application/json

{ "email": "[email protected]", "password": "admin1234" }

Response:

{
    "status": true,
    "results": {
        "user": {
            "_activation": "",
            "_id": "52b25f190364e61067660a24",
            "_key": "",
            "active": true,
            "created": "2013-11-19T03:31:18.934Z",
            "email": "[email protected]",
            "groups": "admin",
            "id": 0,
            "metadata": {
                "avatar": "",
                "name": "Joe User"
            },
            "modified": "2013-11-19T03:31:18.934Z",
            "password": "b7aa9e253f709fb3710fe05300d3056186ce92f7"
        }
    }
} 

This is an example request to register a user with the default database.users collection. Passwords are hashed in SHA1 against configurations salt.

Request:

POST /api/v2/angular-cms/users/register HTTP/1.1
Host: localhost:8181
Content-Type: application/json

{ 
 "email": "[email protected]", 
 "password": "fred", 
 "metadata": { "avatar": "", "name": "Jonnie Dollas" } 
}

Response:

{
    "email": "[email protected]",
    "password": "fred",
    "metadata": {
        "avatar": "",
        "name": "Jonnie Dollas"
    }
}

GET /api/v2/angular-cms/users HTTP/1.1
Host: localhost:8181
Cache-Control: no-cache
Postman-Token: 2d8327e9-bf4d-7425-04d6-677da2b67673

POST /api/v2/angular-cms/users HTTP/1.1
Host: localhost:8181
Content-Type: application/json

{"id":0,"email":"","password":"","active":false,"groups":"visitor","_activation":"","_key":"","created":"2013-11-19T03:31:18.934Z","modified":"2013-11-19T03:31:18.934Z","metadata":{"avatar":"","name":"Joe User"}}

This is a socket server implementation for "real" time analytics and other data. This is for use with geo analytics and other backend data from the app. listen for connected clients

These are the events that this socket server dispatches.

1. cms:authorization
2. cms:client:message
3. cms:client:connect
4. cms:client:disconnect
5. cms:server:message
6. cms:server:disconnect
7. cms:server:connect
8. cms:

(Coming soon)

Themes will be installed via bower, we will have a ui for searching and installing angular-cms themes searching by tag angular-cms.

This is the structure of the themes.

my-theme/
	package.json
	bower.json
	css/
		my-theme.css
	js/
		my-theme.js
	index.html
	partials/
		header.html
		sidebar.html
		footer.html
		content.html

Plugins will be installed via bower as well, keywords angular-cms.

http://exacttarget.github.io/fuelux/#datagrid

(Coming soon)

Please don't edit files in the dist subdirectory as they are generated via Grunt. You'll find source code in the src subdirectory!

Regarding code style like indentation and whitespace, follow the conventions you see used in the source already.

While Grunt can run the included unit tests via PhantomJS, this shouldn't be considered a substitute for the real thing. Please be sure to test the test/*.html unit test file(s) in actual browsers.

First, ensure that you have the latest Node.js and npm installed.

Test that Grunt's CLI and Bower are installed by running grunt --version and bower --version. If the commands aren't found, run npm install -g grunt-cli bower. For more information about installing the tools, see the getting started with Grunt guide or bower.io respectively.

1. Fork and clone the repo.
2. Run npm install to install all build dependencies (including Grunt).
3. Run bower install to install the front-end dependencies.
4. Run grunt to grunt this project.

Assuming that you don't see any red, you're ready to go. Just be sure to run grunt after making any changes, to ensure that nothing is broken.

1. Create a new branch, please don't work in your master branch directly.
2. Add failing tests for the change you want to make. Run grunt to see the tests fail.
3. Fix stuff.
4. Run grunt to see if the tests pass. Repeat steps 2-4 until done.
5. Open test/*.html unit test file(s) in actual browser to ensure tests pass everywhere.
6. Update the documentation to reflect any changes.
7. Push to your fork and submit a pull request. This is a lightweight CMS built with Angular.js, Twitter Bootstrap and Node.js.

(Coming soon)

Current work in progress diagrams.

• Start: Tom goes to the local farmers market to sell his products. Tom uses a CMS to manage his sales.
• Step 1: Tom sells a burger for $10, Tom needs to add the sale to his records.
• Step 2: Tom opens his tablets web browser and enters the url of his cms, clicks the sign in link and is presented with a login form.
• Step 3: Tom enters his email and password then clicks the login button.
• Step 4: Tom is then directed to the Dashboard to add the sale.

• Start: Tom has hired a new employee Joe, to help manage the sales of Tom’s products. Tom uses a CMS to manage his employees sales.
• Step 1: Joe needs to register his credentials so he can add new sales to Tom’s records.
• Step 2: Joe opens his tablets web browser and enters the url of the cms, clicks the sign up link and is presented with a registration form.
• Step 3: Joe enters his email and password, agrees to the terms then clicks the register button.
• Step 4: Joe is then redirected back to the cms login page to sign in.

• Start: Tom’s new employee Joe just sold a burger for $10, he needs to login to the CMS to add his sale.
• Step 1: Joe needs to reset his password so he can add the new sale to Tom’s records.
• Step 2: Joe opens his tablets web browser and enters the url of the cms, clicks the sign in link and is presented with a login form, but Joe forgot his password. He clicks the forgot password link and is presented with a reset password form.
• Step 3: Joe enters his email and clicks the reset button.
• Step 4: Joe is then presented with a message to check his email and follow the reset instructions.

• Start: Tom’s new employee Joe receives an email to reset his password for the CMS.
• Step 1: Joe clicks the link in his email and his web browser opens and is presented with a reset password form.
• Step 2: Joe verifies his email matches the email input, then enters his new password twice to ensure they match.
• Step 3: Joe then clicks the update button to save his new password.
• Step 4: Joe is then directed to the CMS sign in page to login with his new credentials.

View

role - admin route - #/admin/dashboard file - /views/admin/dashboard.html

Model:

  defaults: 
    title:string
    size:int
    path:string
    url:string
    mimetype:string

View:

• role - admin
• route - #/admin/media
• file - /views/admin/media.html

Controller:

 $scope:
  uploaded:[] - Holds current uploaded files
  files:[] - Holds current pending files
  upload:(file) - Starts a upload
  deleteUpload:(file) - Removes a file from uploaded files.
  deleteFile:(file) - Removes a file from pending files
  clearFiles() - Removes all files from pending files.
  clearUploads - Removes all files from uploaded files
  isUploading:boolean - Whether or not a file is being uploaded.

Download the [production version][min] or the [development version][max].

(Coming soon)

Please don't edit files in the dist subdirectory as they are generated via Grunt. You'll find source code in the src subdirectory!

Regarding code style like indentation and whitespace, follow the conventions you see used in the source already.

While Grunt can run the included unit tests via PhantomJS, this shouldn't be considered a substitute for the real thing. Please be sure to test the test/*.html unit test file(s) in actual browsers.

First, ensure that you have the latest Node.js and npm installed.

Test that Grunt's CLI and Bower are installed by running grunt --version and bower --version. If the commands aren't found, run npm install -g grunt-cli bower. For more information about installing the tools, see the getting started with Grunt guide or bower.io respectively.

1. Fork and clone the repo.
2. Run npm install to install all build dependencies (including Grunt).
3. Run bower install to install the front-end dependencies.
4. Run grunt to grunt this project.

Assuming that you don't see any red, you're ready to go. Just be sure to run grunt after making any changes, to ensure that nothing is broken.

1. Create a new branch, please don't work in your master branch directly.
2. Add failing tests for the change you want to make. Run grunt to see the tests fail.
3. Fix stuff.
4. Run grunt to see if the tests pass. Repeat steps 2-4 until done.
5. Open test/*.html unit test file(s) in actual browser to ensure tests pass everywhere.
6. Update the documentation to reflect any changes.
7. Push to your fork and submit a pull request.