Initial commit.

.gitignore

@@ -0,0 +1,4 @@
+.idea
+.DS_Store
+node_modules
+bower_components

README.md

@@ -0,0 +1,52 @@
+Form.io Angular UI-Grid component
+--------------------------------------------
+This library allows Form.io submission data to be rendered within a ![](http://ui-grid.info/). This introduces a new
+directive that produces a Grid view of the submission data provided the Form within Form.io
+
+```
+<formio-grid src="'https://myapp.form.io/myform'"></formio-grid>
+```
+
+This will render the Form.io Submissions like so.
+
+
+
+Installation
+===================
+You can install this library by typing the following command in your application.
+
+```
+bower install ng-formio-grid --save
+```
+
+Once you have this installed, you can add this library to your application with the following ```<script>``` tag.
+
+```
+<link rel='stylesheet' href='bower_components/ngFormioGrid/dist/ng-formio-grid.min.css' />
+<script src="bower_components/ngFormioGrid/dist/ng-formio-grid.min.js"></script>
+```
+
+You will now need to add this module within your Angular.js application declaration like so...
+
+***app.js***
+```
+angular.module('yourApp', [
+  'ngFormioGrid'
+])
+```
+
+Usage
+====================
+Now that you have the library installed, you can then do the following to add a form to your application.
+
+  - Create an account on https://form.io
+  - Create a new project.
+  - Create a Form within your project.
+  - Add some submissions to this form.
+  - You can then embed the data grid within your application using the following snippit of code.
+
+  ```<formio-grid src="'https://myapp.form.io/myform'"></formio-grid>```
+
+Enjoy!
+
+The Form.io Team!

bower.json

@@ -0,0 +1,32 @@
+{
+  "name": "ng-formio-grid",
+  "version": "0.0.1",
+  "authors": [
+    "Travis Tidwell <travis@form.io>"
+  ],
+  "main": [
+    "dist/formio-grid.js",
+    "dist/formio-grid.css"
+  ],
+  "description": "The Form.IO form renderer.",
+  "keywords": [
+    "angularjs",
+    "ionic",
+    "form"
+  ],
+  "dependencies": {
+    "angular": "^1.5.0",
+    "angular-sanitize": "^1.5.0",
+    "formio": "^1.0.0",
+    "angular-bind-html-compile": "^1.1.0",
+    "angular-ui-grid": "^3.1.0"
+  },
+  "license": "MIT",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ]
+}

dist/formio-grid.js

@@ -0,0 +1,137 @@
+(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
+"use strict";
+angular.module('ngFormioGrid', [
+    'formio',
+    'ngSanitize',
+    'ui.grid',
+    'ui.grid.pagination',
+    'angular-bind-html-compile'
+])
+.filter('formioTableView', [
+    'Formio',
+    'formioComponents',
+    '$interpolate',
+    function(
+        Formio,
+        formioComponents,
+        $interpolate
+    ) {
+        return function(value, component) {
+            var componentInfo = formioComponents.components[component.type];
+            if (!componentInfo.tableView) return value;
+            if (component.multiple && (value.length > 0)) {
+                var values = [];
+                angular.forEach(value, function(arrayValue) {
+                    values.push(componentInfo.tableView(arrayValue, component, $interpolate));
+                });
+                return values;
+            }
+            return componentInfo.tableView(value, component, $interpolate);
+        };
+    }
+])
+.directive('formioGrid', function() {
+    return {
+        restrict: 'E',
+        replace: true,
+        scope: {
+            src: '=',
+            query: '=?',
+            columns: '=?'
+        },
+        template: '<div><div ui-grid="gridOptions" ui-grid-pagination class="grid"></div></div>',
+        controller: [
+            'Formio',
+            'formioComponents',
+            'FormioUtils',
+            '$scope',
+            function(
+                Formio,
+                formioComponents,
+                FormioUtils,
+                $scope
+            ) {
+                var formio = null;
+                var paginationOptions = {
+                    pageNumber: 1,
+                    pageSize: 25
+                };
+
+                if (angular.isUndefined($scope.query)) {
+                    $scope.query = {};
+                }
+
+                var getPage = function() {
+                    if (!formio) { return; }
+                    if (paginationOptions.pageSize) {
+                        $scope.query.limit = paginationOptions.pageSize;
+                    }
+                    if (paginationOptions.pageNumber) {
+                        $scope.query.skip = (paginationOptions.pageNumber - 1) * paginationOptions.pageSize;
+                    }
+                    formio.loadSubmissions({params: $scope.query}).then(function(submissions) {
+                        $scope.gridOptions.totalItems = submissions.serverCount;
+                        $scope.gridOptions.data = submissions;
+                    });
+                };
+
+                $scope.gridOptions = {
+                    paginationPageSizes: [25, 50, 75],
+                    paginationPageSize: paginationOptions.pageSize,
+                    useExternalPagination: true,
+                    enableSorting: false,
+                    columnDefs: [],
+                    data: [],
+                    onRegisterApi: function(gridApi) {
+                        $scope.gridApi = gridApi;
+                        gridApi.pagination.on.paginationChanged($scope, function (newPage, pageSize) {
+                            paginationOptions.pageNumber = newPage;
+                            paginationOptions.pageSize = pageSize;
+                            getPage();
+                        });
+                    }
+                };
+
+                // Load a new grid view.
+                var loadGrid = function() {
+                    if (!$scope.src) { return; }
+                    formio = new Formio($scope.src);
+                    formio.loadForm().then(function(form) {
+                        $scope.gridOptions.columnDefs = [];
+                        $scope.gridOptions.columnDefs.push({
+                            name: '',
+                            field: '_id',
+                            width: 35,
+                            cellTemplate: '<a class="btn btn-sm btn-default" ng-click="$emit(\'rowView\', row.entity)"><span class="glyphicon glyphicon-share-alt" aria-hidden="true"></span></a>'
+                        });
+                        FormioUtils.eachComponent(form.components, function(component) {
+                            if (
+                                ($scope.columns && ($scope.columns.indexOf(component.key) !== -1)) ||
+                                (!$scope.columns && component.input && component.tableView)
+                            ) {
+                                $scope.gridOptions.columnDefs.push({
+                                    component: component,
+                                    name: component.label,
+                                    field: 'data.' + component.key,
+                                    cellTemplate: '<div class="ui-grid-cell-contents" bind-html-compile="COL_FIELD | formioTableView:this.col.colDef.component"></div>'
+                                });
+                            }
+                        });
+                    });
+
+                    getPage();
+                };
+
+                $scope.$on('reloadGrid', function(event, src, query) {
+                    $scope.src = src;
+                    $scope.query = query;
+                    loadGrid();
+                });
+
+                loadGrid();
+            }
+        ]
+    };
+});
+
+},{}]},{},[1]);

gulp/eslint.js

@@ -0,0 +1,8 @@
+module.exports = function(gulp, plugins) {
+  return function () {
+    return gulp.src(['src/**/*.js'])
+      .pipe(plugins.eslint())
+      .pipe(plugins.eslint.format())
+      .pipe(plugins.eslint.failAfterError());
+  };
+};

gulp/scripts.js

@@ -0,0 +1,22 @@
+var path = require('path');
+module.exports = function(gulp, plugins) {
+
+  return function() {
+    var bundle = plugins.browserify({
+      entries: './src/formio-grid.js',
+      debug: false
+    });
+
+    return bundle
+      .bundle()
+      .pipe(plugins.source('formio-grid.js'))
+      .pipe(gulp.dest('dist/'))
+      .pipe(plugins.rename('formio-grid.min.js'))
+      .pipe(plugins.streamify(plugins.uglify()))
+      .pipe(gulp.dest('dist/'))
+      .on('error', function(err){
+        console.log(err);
+        this.emit('end');
+      });
+  };
+};

gulp/styles.js

@@ -0,0 +1,8 @@
+module.exports = function(gulp, plugins) {
+    return function () {
+        return gulp.src(['bower_components/angular-ui-grid/ui-grid.css'])
+            .pipe(plugins.cssnano())
+            .pipe(plugins.rename('ng-formio-grid.min.css'))
+            .pipe(gulp.dest('dist'));
+    };
+};

gulp/watch.js

@@ -0,0 +1,39 @@
+var path = require('path');
+module.exports = function(gulp, plugins) {
+
+  return function() {
+    var bundle = plugins.browserify({
+      entries: './src/formio.js',
+      debug: true
+    });
+
+    bundle.transform({
+      global: true
+    }, 'uglifyify');
+
+    var build = function() {
+      return bundle
+        .bundle()
+        .pipe(plugins.source('formio.js'))
+        .pipe(plugins.rename('formio.min.js'))
+        .pipe(gulp.dest('dist/'))
+        .on('error', function(err){
+          console.log(err);
+          this.emit('end');
+        });
+    };
+
+    bundle = plugins.watchify(bundle);
+    bundle.on('update', function(files) {
+      console.log('Changed files: ', files.map(path.relative.bind(path, process.cwd())).join(', '));
+      console.log('Rebuilding dist/formio.js...');
+      build();
+    });
+    bundle.on('log', function(msg) {
+      console.log(msg);
+    });
+
+    return build();
+  };
+
+};

gulpfile.js

@@ -0,0 +1,16 @@
+'use strict';
+var gulp = require('gulp');
+var plugins = require('gulp-load-plugins')();
+plugins.source = require('vinyl-source-stream');
+plugins.browserify = require('browserify');
+plugins.watchify = require('watchify');
+plugins.runSeq = require('run-sequence');
+gulp.task('clean', require('del').bind(null, ['dist']));
+gulp.task('eslint', require('./gulp/eslint')(gulp, plugins));
+gulp.task('scripts', require('./gulp/scripts')(gulp, plugins));
+gulp.task('styles', require('./gulp/styles')(gulp, plugins));
+gulp.task('build', function(cb) {
+  plugins.runSeq(['clean', 'eslint'], 'scripts', 'styles', cb)
+});
+gulp.task('watch', require('./gulp/watch')(gulp, plugins));
+gulp.task('default', ['watch']);

package.json

@@ -0,0 +1,52 @@
+{
+  "name": "formio",
+  "version": "1.0.0",
+  "description": "The form redering engine behind Form.IO.",
+  "main": "dist/formio.min.js",
+  "scripts": {
+    "test": "node test/test"
+  },
+  "author": "",
+  "license": "ISC",
+  "devDependencies": {
+    "brfs": "^1.4.1",
+    "browserify": "^12.0.1",
+    "del": "^1.1.1",
+    "eslint-config-formio": "^0.1.0",
+    "gulp": "^3.9.1",
+    "gulp-cssnano": "^2.1.0",
+    "gulp-eslint": "^1.1.1",
+    "gulp-load-plugins": "^0.9.0",
+    "gulp-rename": "^1.2.2",
+    "gulp-streamify": "^1.0.2",
+    "gulp-uglify": "^1.5.1",
+    "karma": "^0.13.10",
+    "node-qunit-phantomjs": "^1.2.1",
+    "run-sequence": "^1.1.5",
+    "strictify": "^0.2.0",
+    "uglifyify": "^3.0.1",
+    "vinyl-source-stream": "^1.1.0",
+    "watchify": "^3.4.0"
+  },
+  "dependencies": {
+    "angular": "^1.4.8",
+    "angular-moment": "^1.0.0-beta.3",
+    "angular-sanitize": "^1.4.8",
+    "angular-ui-bootstrap": "^0.14.3",
+    "angular-ui-mask": "^1.6.6",
+    "angular-ui-select": "^0.12.100",
+    "bootstrap": "^3.3.6",
+    "bootstrap-ui-datetime-picker": "^2.0.1",
+    "formio-utils": "^0.1.5",
+    "formiojs": "git+https://github.com/formio/formio.js.git",
+    "jquery": "^2.1.4",
+    "ng-file-upload": "^10.1.11",
+    "signature_pad": "^1.5.2"
+  },
+  "browserify": {
+    "transform": [
+      "strictify",
+      "brfs"
+    ]
+  }
+}