diff --git a/.bowerrc b/.bowerrc
index 1be75bff..8a3ec3e3 100644
--- a/.bowerrc
+++ b/.bowerrc
@@ -1,3 +1,3 @@
{
- "directory" : "src/bower_components"
-}
\ No newline at end of file
+ "directory" : "ignored_bower_components"
+}
diff --git a/.gitignore b/.gitignore
index 2e72d47f..1568214d 100644
--- a/.gitignore
+++ b/.gitignore
@@ -14,8 +14,8 @@ logs
results
node_modules
-bower_components
+ignored_bower_components
*.sublime-workspace
# build folder
.grunt
-.tmp
\ No newline at end of file
+.tmp
diff --git a/.jshintrc b/.jshintrc
index 1f1e9ab8..bc589be1 100644
--- a/.jshintrc
+++ b/.jshintrc
@@ -2,14 +2,18 @@
// Details: https://github.com/victorporof/Sublime-JSHint#using-your-own-jshintrc-options
// Example: https://github.com/jshint/jshint/blob/master/examples/.jshintrc
// Documentation: http://www.jshint.com/docs/
- "browser": false,
+ "browser": true,
"devel": true,
"esnext": true,
+ "globals": {
+ "app": true,
+ "angular": false
+ },
"globalstrict": true,
"quotmark": true,
"smarttabs": true,
"trailing": true,
"undef": true,
"unused": "vars",
- "node": true
+ "node": false
}
\ No newline at end of file
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 2aaf8bbe..b98373ac 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,4 +1,20 @@
Version numbers correspond to `bower.json` version
+
+# Latest (maybe 0.1.0)
+
+## Backward compatible changes:
+
+## Internal Changes
+
+- Moved all demo-only related files to a demo folder and added a symbolic link to src and bower_components so when it's deployed the src and bower_components go with it. This will also allow us to make a symlink in the test directory when it's created.
+- Separated out the src folder into three sub folders: `common`, `bootstrap`, and `vanilla`. The build takes `bootstrap` and `vanilla` and builds them separately. They each build with `common`. There is also a separate file for setting up the default template mapping with their types and this is excluded for the `no-templates` build. The final output is: `formly.js`, `formly.bootstrap.js`, and `formly.vanilla.js`. Adding other styles will be very easy. It also should make it possible for us to have directive templates (funcationality for a field).
+- Removed bower_components from git ignore because it's sort of insanity to have to install it every time... Especially when it's needed for the demo. Could name the symlink different... But not worth it I think...
+
+## Breaking changes:
+
+- Added no-template build that builds to `formly.js` and changed vanilla build to `formly.vanilla.js`.
+
+
# 0.0.16
- The password field no longer uses whitespace trimming.
@@ -67,4 +83,4 @@ Added `template` property on fields. Allows devs to have one-liner templates. Ma
## Bug Fixes
-## Breaking Changes
\ No newline at end of file
+## Breaking Changes
diff --git a/Gruntfile.js b/Gruntfile.js
index 90be15b2..2bec2f78 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -1,12 +1,15 @@
'use strict';
-module.exports = function(grunt) {
+var _ = require('lodash-node');
- // Project configuration.
- grunt.initConfig({
+module.exports = function(grunt) {
+ require('load-grunt-tasks')(grunt);
+ require('time-grunt')(grunt);
+ var config = {
pkg: grunt.file.readJSON('package.json'),
formlyConfig: {
hostname: 'localhost', // change to 0.0.0.0 to listen on all connections
base: 'src',
+ demo: 'demo',
port: 4000,
livereloadport: 35701
},
@@ -15,126 +18,22 @@ module.exports = function(grunt) {
options: {
hostname: '<%= formlyConfig.hostname %>',
port: '<%= formlyConfig.port %>',
- base: '<%= formlyConfig.base %>',
+ base: '<%= formlyConfig.demo %>',
livereload: '<%= formlyConfig.livereloadport %>'
}
}
},
'gh-pages': {
options: {
- base: '<%= formlyConfig.base %>'
+ base: '<%= formlyConfig.demo %>'
},
src: ['**']
},
clean: {
- build: ['.tmp/**/*'],
- dist: ['dist/**/*']
- },
- copy: {
- vanilla: {
- files: [
- {
- expand: true,
- cwd: '<%= formlyConfig.base %>/',
- src: ['directives/formly*.*', 'modules/formly*.*', 'providers/formly*.*', '!.jshintrc'],
- dest: '.tmp/'
- }
- ]
- },
- bootstrap: {
- files: [
- {
- expand: true,
- cwd: '<%= formlyConfig.base %>/',
- src: ['directives/formly*.js', 'directives/bootstrap/formly*.html', 'modules/formly*.*', 'providers/formly*.*', '!.jshintrc'],
- dest: '.tmp/'
- }
- ]
- },
- deploy: {
- files: [{
- expand: true,
- cwd: '.tmp/dist',
- src: ['formly*.*'],
- dest: 'dist/'
- }]
- }
- },
- concat: {
- build: {
- // specifing files so that they are added in this order
- src: ['.tmp/modules/formly*.js', '.tmp/directives/formly*.js', '.tmp/providers/formly*.js', '.tmp/formly*.js'],
- dest: '.tmp/formly.js'
- }
- },
- uglify: {
- vanilla: {
- src: '.tmp/dist/formly.js',
- dest: '.tmp/dist/formly.min.js'
- },
- bootstrap: {
- src: '.tmp/dist/formly.bootstrap.js',
- dest: '.tmp/dist/formly.bootstrap.min.js'
- },
- options: {
- mangle: true,
- sourceMap: true
- }
- },
- ngtemplates: {
- vanilla: {
- cwd: '.tmp/',
- src: [
- 'directives/formly*.html'
- ],
- dest: '.tmp/formly-templates.js',
- options: {
- module: 'formly.render',
- htmlmin: {
- collapseBooleanAttributes: true,
- collapseWhitespace: true,
- removeAttributeQuotes: true,
- removeComments: true, // Only if you don't use comment directives!
- removeEmptyAttributes: true,
- removeRedundantAttributes: false, //removing this as it can removes properties that can be used when styling
- removeScriptTypeAttributes: true,
- removeStyleLinkTypeAttributes: true
- }
- }
- },
- bootstrap: {
- cwd: '.tmp/',
- src: [
- 'directives/bootstrap/formly*.html'
- ],
- dest: '.tmp/formly-templates.js',
- options: {
- module: 'formly.render',
- url: function(url) {
- return url.replace('bootstrap/', '');
- },
- htmlmin: {
- collapseBooleanAttributes: true,
- collapseWhitespace: true,
- removeAttributeQuotes: true,
- removeComments: true, // Only if you don't use comment directives!
- removeEmptyAttributes: true,
- removeRedundantAttributes: false, //removing this as it can removes properties that can be used when styling
- removeScriptTypeAttributes: true,
- removeStyleLinkTypeAttributes: true
- }
- }
- }
+ build: ['.tmp/**/*', 'dist/**/*']
},
- ngmin: {
- vanilla: {
- src: '.tmp/formly.js',
- dest: '.tmp/dist/formly.js'
- },
- bootstrap: {
- src: '.tmp/formly.js',
- dest: '.tmp/dist/formly.bootstrap.js'
- }
+ jshint: {
+ src: ['src/**/*.js']
},
watch: {
livereload: {
@@ -143,20 +42,108 @@ module.exports = function(grunt) {
livereload: '<%= formlyConfig.livereloadport %>'
}
}
+ },
+
+ copy: {
+ deploy: {
+ expand: true,
+ cwd: '.tmp/',
+ src: '**/*-built/**/*.*',
+ dest: 'dist/',
+ flatten: true,
+ filter: 'isFile',
+ }
+ },
+ ngtemplates: {},
+ concat: {},
+ ngAnnotate: {},
+ uglify: {}
+ };
+
+ // targets build config (because they're pretty much identical)
+ var targets = ['vanilla', 'bootstrap', 'no-template'];
+
+ _.each(targets, function(target) {
+ var tmp = '.tmp/' + target;
+ var noTemplates = target === 'no-template';
+
+ var preBuiltDest = tmp + '-build-prep';
+ var builtDest = tmp + '-built';
+
+ var templatesFile = preBuiltDest + '/formly-templates.js';
+ var targetFilename = 'formly.' + target;
+ if (noTemplates) {
+ targetFilename = 'formly';
}
+ var concatFile = builtDest + '/' + targetFilename + '.js';
+ var uglifyFile = builtDest + '/' + targetFilename + '.min.js';
+
+ var commonCopyPatterns = ['**/*.*']
+ if (noTemplates) {
+ commonCopyPatterns.push('!**/formly-template-config.js');
+ }
+
+ config.copy[target] = {
+ files: [
+ {
+ expand: true,
+ cwd: '<%= formlyConfig.base %>/',
+ src: [target + '/**/*.*'],
+ dest: preBuiltDest
+ },
+ {
+ expand: true,
+ cwd: '<%= formlyConfig.base %>/common',
+ src: commonCopyPatterns,
+ dest: preBuiltDest
+ }
+ ]
+ };
+
+ config.ngtemplates[target] = {
+ cwd: preBuiltDest + '/' + target + '/',
+ src: [
+ 'fields/**/*.html'
+ ],
+ dest: templatesFile,
+ options: {
+ module: 'formly.render',
+ htmlmin: {
+ collapseBooleanAttributes: true,
+ collapseWhitespace: true,
+ removeAttributeQuotes: true,
+ removeComments: true,
+ removeEmptyAttributes: true,
+ removeRedundantAttributes: false,
+ removeScriptTypeAttributes: true,
+ removeStyleLinkTypeAttributes: true
+ }
+ }
+ };
+
+ config.concat[target] = {
+ src: [preBuiltDest + '/modules/**/*.js', preBuiltDest + '/**/*.js'],
+ dest: concatFile
+ };
+
+ config.ngAnnotate[target] = {
+ src: concatFile,
+ dest: concatFile
+ };
+ config.uglify[target] = {
+ src: concatFile,
+ dest: uglifyFile,
+ options: {
+ mangle: true,
+ sourceMap: true
+ }
+ };
});
- // Load the plugin that provides the "uglify" task.
- grunt.loadNpmTasks('grunt-contrib-concat');
- grunt.loadNpmTasks('grunt-contrib-connect');
- grunt.loadNpmTasks('grunt-contrib-copy');
- grunt.loadNpmTasks('grunt-contrib-clean');
- grunt.loadNpmTasks('grunt-contrib-uglify');
- grunt.loadNpmTasks('grunt-gh-pages');
- grunt.loadNpmTasks('grunt-angular-templates');
- grunt.loadNpmTasks('grunt-ngmin');
- grunt.loadNpmTasks('grunt-contrib-watch');
+
+ // Pass config to grunt
+ grunt.initConfig(config);
grunt.registerTask('publish', [
'gh-pages'
@@ -167,29 +154,24 @@ module.exports = function(grunt) {
'watch'
]);
- grunt.registerTask('build', [
- 'clean:dist',
- 'build:vanilla',
- 'build:bootstrap'
- ]);
+ _.each(targets, function(target) {
+ grunt.registerTask('build:' + target, [
+ 'copy:' + target,
+ 'ngtemplates:' + target,
+ 'concat:' + target,
+ 'ngAnnotate:' + target,
+ 'uglify:' + target
+ ]);
+ });
- grunt.registerTask('build:vanilla', [
- 'clean:build',
- 'copy:vanilla',
- 'ngtemplates:vanilla',
- 'concat:build',
- 'ngmin:vanilla',
- 'uglify:vanilla',
- 'copy:deploy'
- ]);
- grunt.registerTask('build:bootstrap', [
- 'clean:build',
- 'copy:bootstrap',
- 'ngtemplates:bootstrap',
- 'concat:build',
- 'ngmin:bootstrap',
- 'uglify:bootstrap',
- 'copy:deploy'
- ]);
-};
\ No newline at end of file
+ var buildTasks = _.map(targets, function(target) {
+ return 'build:' + target;
+ });
+ buildTasks.unshift('clean:build');
+ buildTasks.push('copy:deploy');
+
+ grunt.registerTask('build', buildTasks);
+
+ grunt.registerTask('default', ['build']);
+};
diff --git a/README.md b/README.md
index 46e09676..b0e2d34a 100644
--- a/README.md
+++ b/README.md
@@ -1,8 +1,10 @@
## Formly
Formly for Angular is an AngularJS module which has directives to help customize and render JSON based forms. The directive originated from a need to allow our users to create surveys and distribute them easily. Currently we've can render the form data from JSON and assign a model to form so we can receive the submitted data.
+```html
+```
### Demo : http://Nimbly.github.io/angular-formly/
@@ -21,15 +23,19 @@ See `bower.json` and `index.html` in the `master` branch for a full list / more
`$ bower install angular-formly --save`
- Include the javascript file in your index.html, Formly comes in the following flavors:
- - Vanilla: no fancy styling, just plain html
+ - No templates: you provide all your custom templates using the `formlyTemplateProvider`
``
+ - Vanilla: no fancy styling, just plain html
+
+ ``
+
- Bootstrap: bootstrap compatible forms, form-groups, etc.
``
- - DIY: You can create your own templates with `formlyTemplateProvider`! Use any of the builds above and override all the templates or just the ones you need.
+ - DIY: Regardless of which flavor you use, you can create your own templates with `formlyTemplateProvider`. Use any of the builds above and override all the templates or just the ones you need.
- Add 'formly' as a required module to your angular app, usually in `app.js`:
`var app = angular.module('app', ['ng', 'ui.router', 'formly']);`
diff --git a/bower.json b/bower.json
index 442accd2..a2ca0bdd 100644
--- a/bower.json
+++ b/bower.json
@@ -25,12 +25,12 @@
"tests"
],
"dependencies": {
- "angular": "~1.2.10"
+ "angular": "~1.2.22"
},
"devDependencies": {
- "angular-ui-router": "#0.2.8-bowratic-tedium",
- "angular-highlightjs": "~0.2.1",
+ "angular-ui-router": "~0.2.10",
+ "angular-highlightjs": "~0.3.0",
"highlightjs": "~8.0.0",
- "bootstrap": "~3.1.1"
+ "bootstrap": "~3.2.0"
}
}
diff --git a/src/app.js b/demo/app.js
similarity index 73%
rename from src/app.js
rename to demo/app.js
index 170bc7e8..785c7b38 100644
--- a/src/app.js
+++ b/demo/app.js
@@ -20,6 +20,17 @@ app.config(function($stateProvider, $urlRouterProvider, $locationProvider, forml
templateUrl: 'views/home.html',
controller: 'home'
});
+
+ // Normally wouldn't have to worry about this,
+ // but we need to specify it because we're not using a built version.
+ var fields = [
+ 'textarea', 'radio', 'select', 'number', 'checkbox',
+ 'password', 'hidden', 'email', 'text'
+ ];
+ angular.forEach(fields, function(field) {
+ formlyTemplateProvider.setTemplateUrl(field, 'src/bootstrap/fields/formly-field-' + field + '.html');
+ });
+
if (usingCustomTypeTemplates) {
formlyTemplateProvider.setTemplateUrl('text', 'views/custom-field-text.html');
// or
@@ -27,21 +38,8 @@ app.config(function($stateProvider, $urlRouterProvider, $locationProvider, forml
radio: 'views/custom-field-radio.html',
checkbox: 'views/custom-field-checkbox.html'
});
- } else {
- // using bootstrap cause vanilla is ugly, normally you would use the included prebuilt bootstrap file
- formlyTemplateProvider.setTemplateUrl({
- textarea: 'directives/bootstrap/formly-field-textarea.html',
- radio: 'directives/bootstrap/formly-field-radio.html',
- select: 'directives/bootstrap/formly-field-select.html',
- number: 'directives/bootstrap/formly-field-number.html',
- checkbox: 'directives/bootstrap/formly-field-checkbox.html',
- password: 'directives/bootstrap/formly-field-password.html',
- hidden: 'directives/bootstrap/formly-field-hidden.html',
- email: 'directives/bootstrap/formly-field-email.html',
- text: 'directives/bootstrap/formly-field-text.html'
- });
}
-
+
formlyOptionsProvider.setOption('uniqueFormId', 'defaultUniqueId');
// or
formlyOptionsProvider.setOption({
diff --git a/demo/bower_components b/demo/bower_components
new file mode 120000
index 00000000..bad2eef1
--- /dev/null
+++ b/demo/bower_components
@@ -0,0 +1 @@
+../ignored_bower_components/
\ No newline at end of file
diff --git a/src/index.html b/demo/index.html
similarity index 71%
rename from src/index.html
rename to demo/index.html
index c190bf31..9aa613f4 100644
--- a/src/index.html
+++ b/demo/index.html
@@ -16,8 +16,8 @@
Loading...
-
-
@@ -36,11 +36,13 @@
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-