-[ModularAdmin](http://modularcode.github.io/modular-admin-html/) is an open source dashboard theme built in a modular way. That makes it extremely easy to scale, modify and maintain.
+**[ModularAdmin](http://modularcode.github.io/modular-admin-html/)** is an open source **dashboard theme** built in a modular way. That makes it easy to scale, modify and maintain. This project is proudly supported by Agile Metrics by Screenful (*instant visual dashboards for Trello | Jira | Asana | Pivotal Tracker | Github*)
#### Heads up for the ModularAdmin v2!
@@ -27,14 +25,14 @@ We're working hard on version 2, which is a complete rewrite.
> **Note:** If you don't want to re-build the project, you may just clone this branch directly ```https://github.com/modularcode/modular-admin-html/tree/gh-pages```
-### 1. [Download ZIP](https://github.com/modularcode/modular-admin-html/releases) or Git Clone
+### 1. [Download ZIP](https://github.com/modularcode/modular-admin-html/releases/latest) or Git Clone
```
git clone https://github.com/modularcode/modular-admin-html.git
```
### 2. Build the project
-The cloned/downloaded repository doesn't contain prebuilt version of the project and you need to build it. You need to have [NodeJs](https://nodejs.org/en/) with npm. You also need to have [Bower](http://bower.io/) installed globally.
+The cloned/downloaded repository doesn't contain prebuilt version of the project and you need to build it. You need to have [NodeJs](https://nodejs.org/en/) (v4+) with npm (v2.15+) installed.
Install npm dependencies
@@ -42,11 +40,6 @@ Install npm dependencies
npm install
```
-Install bower dependencies
-```
-bower install
-```
-
Build the project and start local web server
```
npm start
@@ -66,14 +59,31 @@ You can also [run the project in docker](#running-in-docker) th
## Folder Structure
```
-├── bower_components/ # vendor libraries installed by bower
-├── build/ # app build tasks and tools
-├── node_modules/ # node dependencies
-├── dist/ # compiled result
-├── src/ # source files
-│── bower.json # bower configuration file
-└── package.json # npm configuration file
+├── build/ # app build tasks and tools
+├── config/ # build configs and paths definitions
+├── dist/ # compiled result
+├── node_modules/ # node dependencies
+├── src/ # source files
+└── package.json # npm configuration file
+```
+
+#### ```config/``` folder
+
+This folder contains application build configurations and paths definitions.
+For **adding/removing NPM dependencies** you need to **manually define the paths** in `config/index.js` file after the module installation.
+
+#### ```build/``` folder
+
+This folder contains files related to our application compilation. That can be styles preprocessing (LESS,SASS,PostCSS) and template engine compilation, script file concatenation and minification and other related tasks.
+
```
+├── tasks/ # tasks folder
+| └── {different tasks} # each file represents a single build task
+├── utils/ # some utils
+└── gulpfile.js # main build file for gulp build system
+
+```
+
#### ```src/``` folder
@@ -116,21 +126,7 @@ This file structuring makes our app file organization very semantic and scalable
```
-#### ```build/``` folder
-This folder contains files related to our application compilation. That can be styles preprocessing (LESS,SASS,PostCSS) and template engine compilation, script file concatenation and minification and other related tasks.
-
-```
-├── paths/ # application file paths
-| ├── app.js # application file paths
-| └── vendor.js # 3-rd party plugins paths
-├── tasks/ # tasks folder
-| └── {different tasks} # each file represents a single build task
-├── utils/ # some utils
-├── config.js # build configs
-└── gulpfile.js # main build file for gulp build system
-
-```
#### ```dist/``` folder
@@ -225,10 +221,6 @@ Layouts can also have contexts and parent layouts.
If you need more advanced layouting with multiple content blocks at the same time you can use [handlebar-layouts](https://www.npmjs.com/package/handlebars-layouts) helper approach, which is also available out of the box.
-#### Vendor files
-
-In addition to application files, there are also third party plugin files (e.g. Bootstrap). They are managed by using [Bower](http://bower.io/). Usually vendor libraries consist from scripts, styles and assets (images, fonts). The build system will concatenate and copy all the script and style files accordingly to ```dist/js/vendor.js``` and ```dist/css/vendor.css```. It also will copy all assets to the ```dist/assets/``` folder.
-
## Running in Docker
diff --git a/bower.json b/bower.json
deleted file mode 100644
index a0734c6d..00000000
--- a/bower.json
+++ /dev/null
@@ -1,86 +0,0 @@
-{
- "name": "modular-admin-html",
- "version": "1.2.0",
- "devDependencies": {},
- "dependencies": {
- "animate.css": "~3.4.0",
- "font-awesome": "~4.7.0",
- "jquery": "~2.1.4",
- "jquery-flot": "~0.8.3",
- "flot.tooltip": "~0.8.5",
- "jquery-validation": "~1.14.0",
- "jquery.sparkline": "http://omnipotent.net/jquery.sparkline/2.1.2/jquery.sparkline.js",
- "jqvmap": "~1.4.0",
- "metisMenu": "~2.0.3",
- "morrisjs": "~0.5.1",
- "nprogress": "~0.2.0",
- "quill": "~0.20.1",
- "responsive-bootstrap-toolkit": "~2.5.0",
- "Sortable": "~1.4.2",
- "tether": "~1.3.7",
- "tinycolor": "~1.2.1",
- "dropzone": "~4.2.0",
- "jquery-touchswipe": "^1.6.18",
- "jquery.browser": "^0.1.0",
- "popper.js": "^1.12.3",
- "bootstrap": "v4.0.0-beta"
- },
- "overrides": {
- "bootstrap": {
- "main": [
- "dist/css/bootstrap.css",
- "dist/css/bootstrap-theme.css",
- "dist/js/bootstrap.js"
- ]
- },
- "font-awesome": {
- "main": [
- "./css/font-awesome.css",
- "./fonts/*"
- ]
- },
- "jquery-flot": {
- "main": [
- "jquery.flot.js",
- "jquery.flot.resize.js",
- "jquery.flot.pie.js",
- "jquery.flot.time.js"
- ]
- },
- "flot.tooltip": {
- "main": "js/jquery.flot.tooltip.js"
- },
- "jqvmap": {
- "main": [
- "dist/jqvmap.css",
- "dist/jquery.vmap.js",
- "dist/maps/jquery.vmap.world.js"
- ]
- },
- "animate.css": {
- "main": "animate.css"
- },
- "Sortable": {
- "main": [
- "Sortable.js",
- "jquery.binding.js"
- ]
- },
- "quill": {
- "main": [
- "dist/quill.js",
- "dist/quill.base.css",
- "dist/quill.snow.css"
- ]
- },
- "dropzone": {
- "main": [
- "dist/dropzone.css",
- "dist/dropzone.js"
- ]
- },
- "raphael": {
- "main": "raphael.js"
- }
- }
-}
diff --git a/build/config.js b/build/config.js
deleted file mode 100644
index da96398e..00000000
--- a/build/config.js
+++ /dev/null
@@ -1,10 +0,0 @@
-var path = require('path');
-
-module.exports = {
- rootDir: "../", // Root dir
- srcDir: path.resolve("../src"), // Source files
- destDir: path.resolve("../dist"), // Build destination
- bowerDir: "../bower_components", // Bower dir
- npmDir: "../node_modules", // Npm dir
- port: 4000
-};
\ No newline at end of file
diff --git a/build/gulpfile.js b/build/gulpfile.js
index 92727a0c..db152e47 100644
--- a/build/gulpfile.js
+++ b/build/gulpfile.js
@@ -10,12 +10,8 @@ var utils = require('./utils/utils');
* Configs And Paths
*********************************************/
-var config = require('./config');
-
-var paths = {
- app: require('./paths/app'),
- vendor: require('./paths/vendor')
-};
+var config = require('../config/');
+var paths = config.paths;
/********************************************
@@ -86,8 +82,8 @@ gulp.task('deploy', ['build'], function() {
// // Run this task for development
gulp.task('develop', [
'build',
- 'watch',
+ 'watch',
'connect'
]);
-gulp.task('default', ['develop']);
\ No newline at end of file
+gulp.task('default', ['develop']);
diff --git a/build/paths/app.js b/build/paths/app.js
deleted file mode 100644
index ef7db8fe..00000000
--- a/build/paths/app.js
+++ /dev/null
@@ -1,101 +0,0 @@
-var path = require('path');
-
-var config = require('../config');
-
-var rootDir = config.rootDir;
-var srcDir = config.srcDir;
-var destDir = config.destDir;
-
-/***********************************************
-* Application script files
-************************************************/
-
- /*
- Specifiing the source this way means:
-
- "take all .js files except /_main/main.js file
- and then take /_main/main.js file"
-
- This ensures that main.js file is loaded in the end.
- Ignore context.js files.
- */
-
- exports.scripts = [
- srcDir + "/config.js",
- srcDir + "/**/!(_context|config|main|*-helper)*.js",
- srcDir + "/main.js",
- "!" + srcDir + "/_vendor/**"
- ];
-
-/***********************************************
-* Application style files
-************************************************/
-
- exports.styles = [
- srcDir + "/_main.scss",
- srcDir + "/**/!(_main|_variables|*-theme)*.scss",
- ];
-
-/***********************************************
-* Application theme files
-************************************************/
-
- exports.themes = srcDir + "/**/*-theme.scss";
-
-/***********************************************
-* Application template files
-************************************************/
-
- /*
- All template files in application.
- Those should registered as handlebars partials
- in order to use feature like includes or layouts
- */
-
- exports.templates = srcDir + "/**/*.hbs";
-
-/***********************************************
-* Application page files
-************************************************/
-
- /*
- Each page file represents a page which will be rendered into .html page.
- Pages can extend layouts.
-
- */
-
- exports.pages = srcDir + "/**/*-page.hbs";
-
-/***********************************************
-* Application layout files
-************************************************/
-
- /*
- Layouts are used for "wrapping" the content of individual pages with common elements,
- such as the and footer sections, which usually contain necessities
- such as and