Merge feature/initial

Feature/settings

.editorconfig

@@ -0,0 +1,13 @@
+[*]
+charset=utf-8
+end_of_line=lf
+trim_trailing_whitespace = true
+insert_final_newline = true
+indent_style=space
+indent_size=4
+
+[*.json]
+indent_size=2
+
+[*.md]
+trim_trailing_whitespace = false

.gitattributes

@@ -0,0 +1,21 @@
+# Set the default behavior, in case people don't have core.autocrlf set.
+* text=auto
+
+# Explicitly declare text files you want to always be normalized and converted
+# to native line endings on checkout.
+*.ts text eol=lf
+*.js text eol=lf
+*.css text eol=lf
+*.scss text eol=lf
+*.json text eol=lf
+*.xml text eol=lf
+*.yml text eol=lf
+*.md text eol=lf
+*.gitattributes eol=lf
+*.gitignore eol=lf
+
+# Denote all files that are truly binary and should not be modified.
+*.png binary
+*.jpg binary
+*.gif binary
+./history

.gitignore

@@ -0,0 +1,3 @@
+dist/
+node_modules/
+localSettings.js

.travis.yml

@@ -0,0 +1,66 @@
+sudo: required
+language: node_js
+node_js:
+- '6'
+before_install:
+- npm i -g npm@latest
+- npm install grunt-cli -g
+- export CHROME_BIN=chromium-browser
+- export DISPLAY=:99.0
+- sh -e /etc/init.d/xvfb start
+- wget -q -O - http://opensource.wandisco.com/wandisco-debian.gpg | sudo apt-key add -
+- sudo sh -c 'echo "deb http://opensource.wandisco.com/debian/ wheezy svn17" > /etc/apt/sources.list.d/wandisco-subversion.list'
+- sudo apt-get -qq update
+- sudo apt-get install -y --allow-downgrades subversion=1.7.22-1+WANdisco libsvn1=1.7.22-1+WANdisco
+- svn --version
+after_success:
+- bash <(curl -s https://codecov.io/bash)
+cache:
+  directories:
+  - node_modules
+env:sudo: required
+language: node_js
+node_js:
+- "8"
+addons:
+  apt:
+    sources:
+    - google-chrome
+    packages:
+    - google-chrome-stable
+before_install:
+- npm i -g npm
+- npm install grunt-cli -g
+- wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb
+- sudo dpkg -i google-chrome*.deb
+- export CHROME_BIN=chromium-browser
+- export DISPLAY=:99.0
+- sh -e /etc/init.d/xvfb start
+- wget -q -O - http://opensource.wandisco.com/wandisco-debian.gpg | sudo apt-key add -
+- sudo sh -c "echo 'deb http://opensource.wandisco.com/debian/ wheezy svn17' > /etc/apt/sources.list.d/wandisco-subversion.list"
+- sudo apt-get -qq update
+- sudo apt-get install -y --allow-downgrades subversion=1.7.22-1+WANdisco libsvn1=1.7.22-1+WANdisco
+- svn --version
+- npm --version
+script: travis_wait 30 npm test
+after_success:
+- bash <(curl -s https://codecov.io/bash)
+cache:
+  directories:
+  - node_modules
+env:
+  global:
+  - MX_APP_NAME=signature101
+  - MX_PROJECT_ID=a48ab6ca-82a2-4b82-8286-eddd07eae0b9
+  - MX_BRANCH_NAME=trunk
+  - MX_ENVIRONMENT=Sandbox
+  - MX_USER="[email protected]"
+deploy:
+  provider: releases
+  api_key: $GITHUB_KEY
+  file_glob: true
+  file: dist/release/*
+  skip_cleanup: true
+  on:
+    repo: $TRAVIS_REPO_SLUG
+    tags: true

Gruntfile.js

@@ -0,0 +1,112 @@
+"use strict";
+const webpack = require("webpack");
+const webpackConfig = require("./webpack.config");
+const merge = require("webpack-merge");
+
+const webpackConfigRelease = webpackConfig.map(config => merge(config, {
+    devtool: false,
+    mode: "production"
+}));
+
+module.exports = function(grunt) {
+    const pkg = grunt.file.readJSON("package.json");
+    grunt.initConfig({
+
+        watch: {
+            updateWidgetFiles: {
+                files: [ "./src/**/*" ],
+                tasks: [ "webpack:develop", "compress:dist", "copy:distDeployment", "copy:mpk" ],
+                options: {
+                    debounceDelay: 250,
+                    livereload: true
+                }
+            }
+        },
+
+        compress: {
+            dist: {
+                options: {
+                    archive: "./dist/" + pkg.version + "/" + pkg.widgetName + ".mpk",
+                    mode: "zip"
+                },
+                files: [ {
+                    expand: true,
+                    date: new Date(),
+                    store: false,
+                    cwd: "./dist/tmp/src",
+                    src: [ "**/*" ]
+                } ]
+            }
+        },
+
+        copy: {
+            distDeployment: {
+                files: [ {
+                    dest: "./dist/MxTestProject/deployment/web/widgets",
+                    cwd: "./dist/tmp/src/",
+                    src: [ "**/*" ],
+                    expand: true
+                } ]
+            },
+            mpk: {
+                files: [ {
+                    dest: "./dist/MxTestProject/widgets",
+                    cwd: "./dist/" + pkg.version + "/",
+                    src: [ pkg.widgetName + ".mpk" ],
+                    expand: true
+                } ]
+            }
+        },
+
+        file_append: {
+            addSourceURL: {
+                files: [ {
+                    append: `\n\n//# sourceURL=${pkg.widgetName}.webmodeler.js\n`,
+                    input: `dist/tmp/src/${pkg.widgetName}.webmodeler.js`
+                } ]
+            }
+        },
+
+        webpack: {
+            develop: webpackConfig,
+            release: webpackConfigRelease
+        },
+
+        clean: {
+            build: [
+                "./dist/" + pkg.version + "/" + pkg.widgetName + "/*",
+                "./dist/tmp/**/*",
+                "./dist/tsc/**/*",
+                "./dist/testresults/**/*",
+                "./dist/MxTestProject/deployment/web/widgets/" + pkg.widgetName + "/*",
+                "./dist/MxTestProject/widgets/" + pkg.widgetName + ".mpk",
+                "./dist/wdio/**/*"
+            ]
+        },
+
+        checkDependencies: {
+            this: {}
+        }
+    });
+
+    grunt.loadNpmTasks("grunt-check-dependencies");
+    grunt.loadNpmTasks("grunt-contrib-clean");
+    grunt.loadNpmTasks("grunt-contrib-compress");
+    grunt.loadNpmTasks("grunt-contrib-copy");
+    grunt.loadNpmTasks("grunt-contrib-watch");
+    grunt.loadNpmTasks("grunt-webpack");
+    grunt.loadNpmTasks("grunt-file-append");
+
+    grunt.registerTask("default", [ "clean build", "watch" ]);
+    grunt.registerTask(
+        "clean build",
+        "Compiles all the assets and copies the files to the dist directory.",
+        [ "checkDependencies", "clean:build", "webpack:develop", "compress:dist", "copy:mpk" ]
+    );
+    grunt.registerTask(
+        "release",
+        "Compiles all the assets and copies the files to the dist directory. Minified without source mapping",
+        [ "checkDependencies", "clean:build", "webpack:release", "file_append", "compress:dist", "copy:mpk" ]
+    );
+    grunt.registerTask("build", [ "clean build" ]);
+};

LICENSE

@@ -186,7 +186,7 @@
       same "printed page" as the copyright notice for easier
       identification within third-party archives.
 
-   Copyright [yyyy] [name of copyright owner]
+   Copyright 2018 Mendix B.V.
 
    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.

README.md

@@ -1,2 +1,45 @@
-# Signature
-Signature
+## Signature
+A signature pad for capturing signatures.  
+The widget implements bezier curves and velocity for the smooth drawing of the signature.
+
+## Features
+* Record signature in a mendix database  
+* Customizable pen color and pen size 
+* Toggle attribute to delete signature and reset the canvas
+
+## Configuration
+Add the widget to a dataview.
+
+## Demo project
+[https://signature101.mxapps.io](https://signature101.mxapps.io)
+
+## Usage
+
+* Add the **Has signature** attribute to toggle when clearing the canvas.  
+![Canvas](/assets/signature-attribute.png)
+
+* Under the pen tab, you can customize your own pen size by choosing the different pen types, the pen color.  
+![Pen](/assets/signature-pen.png)
+
+* Run the application  
+* After signing on the canvas the **Has signature** attribute is toggled to show that the canvas has a signature, you can toggle to **no** inorder to clear the signature
+![Data source](/assets/signature-image.png)
+
+### Properties
+* **Pen** | **color** - HTML color code of the pen.
+* **Show background grid** - When set to yes, a grid is shown in the background of the writable area.
+* **Cell width** - The width of a grid cell in (px).
+* **Cell height** - The height of a grid cell in (px).
+* **Line color** - HTML color code of the grid lines
+* **Line width** - Width of grid line border in pixels
+* Under the **common tab**, custom CSS Style properties can be set for responsive design, when width and height are a percentage. For example:
+    - min-width: 200px;
+    - max-width: 600px;
+    - min-height: 200px;
+    - max-height: 600px;
+
+## Compatibility
+The widget is usable and works smoothly in Google chrome, Internet explorer. 
+
+## Development  
+See [here](/development.md)

development.md

@@ -0,0 +1,68 @@
+# Development and contribution
+Prerequisite: Install git, node package manager, webpack CLI, grunt CLI, Karma CLI
+
+To contribute, fork and clone.
+
+    > git clone https://github.com/mendixlabs/signature.git
+
+The code is in typescript. Use a typescript IDE of your choice, like Visual Studio Code or WebStorm.
+
+To set up the development environment, run:
+
+    > npm install
+
+Create a folder named `dist` in the project root.
+
+Create a Mendix test project in the dist folder and rename its root folder to `dist/MxTestProject`. Changes to the widget code shall be automatically pushed to this test project.
+Or get the test project from [https://github.com/mendixlabs/signature/releases/latest](https://github.com/mendixlabs/signature/releases/latest)
+
+To automatically compile, bundle and push code changes to the running test project, run:
+
+    > npm start
+
+To run the project unit tests with code coverage, results can be found at `dist/testresults/coverage/index.html`, run:
+
+    > npm run test:unit
+
+Run the unit test continuously during development:
+
+    > npm run test:dev
+
+Run the end to end test during development:
+
+    > npm run test:e2e:dev
+
+## Scripts
+While developing, you will probably rely mostly on `npm start`; however, there are additional scripts at your disposal:
+
+|`npm run <script>`|Description|
+|------------------|-----------|
+|`start`|Build the project and monitor source and config for changes and rebuild.|
+|`test`|Runs lint, build, unit tests with Karma and generates a coverage report, deploy and run e2e test|
+|`test:dev`|Runs Karma and watches for changes to re-run tests; does not generate coverage reports.|
+|`test:unit`|Runs unit tests with Karma and generates a coverage report.|
+|`test:e2e`|Runs end 2 end tests with remote.|
+|`test:e2e:dev`|Runs end 2 end tests with locally on localhost:8080|
+|`deploy`|Use latest widget build to update the Mendix project update the application to Mendix node.|
+|`build:prod`|Build widget optimized for production|
+|`build:dev`|Build widget optimized for debugging.|
+|`lint`|Lint all `.js` files.|
+|`lint:fix`|Lint and fix all `.ts` files.|
+
+# CI and remote testing
+To enable the continues integration services.
+Copy the `node_modules/mendix-widget-build-script/dist/localSettings.js`
+ to your project root, and update the settings to run the update deployment from local source.
+
+**Do not forget** to exclude this file in the `.gitignore` as it contains sensitive data.
+```
+exports.settings = {
+    appName: "appName",
+    key: "xxxxxxxx-xxxx-xxxx-xxxxx-xxxxxxxxxxxx",
+    password: "secret",
+    projectId: "xxxxxxxx-xxxx-xxxx-xxxxx-xxxxxxxxxxxx",
+    user: "[email protected]"
+};
+```
+
+More information about the [Mendix widget build script](https://github.com/FlockOfBirds/mendix-widget-build-script).