sartography
/
bpmn-js
mirror of https://github.com/sartography/bpmn-js.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat(example): add browser integration sample

This commit is contained in:
Nico Rehwaldt 2014-03-11 16:24:31 +01:00
parent 01a5f28e2d
commit 5b5225450d
3 changed files with 69 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
Gruntfile.js
View File

@ -78,6 +78,19 @@ module.exports = function(grunt) {
}
}
},
copy: {
samples: {
files: [
// copy sample files
{
expand: true,
cwd: '<%= config.samples %>/',
src: ['*.{js,css,html,png}'],
dest: '<%= config.dist %>/<%= config.samples %>'
}
]
}
},
watch: {
sources: {
files: [ '<%= config.sources %>/**/*.js'],
@ -106,7 +119,7 @@ module.exports = function(grunt) {
// tasks
grunt.registerTask('test', [ 'jasmine_node', 'karma:single' ]);
grunt.registerTask('build', [ 'browserify' ]);
grunt.registerTask('build', [ 'browserify', 'copy:samples' ]);
grunt.registerTask('auto-test', [ 'jasmine_node', 'watch:test' ]);

53
example/index.html Normal file
View File

@ -0,0 +1,53 @@
<html>
<head>
<title>bpmn-js demo</title>
</head>
<body>
<div id="drop-zone">Drop files here</div>
<output id="list"></output>
<script src="../bpmn.js"></script>
<script>
var BpmnModel = require('BpmnModel');
</script>
<script>
function handleFileSelect(evt) {
evt.stopPropagation();
evt.preventDefault();
var files = evt.dataTransfer.files; // FileList object.
// files is a FileList of File objects. List some properties.
var output = [];
for (var i = 0, f; f = files[i]; i++) {
var reader = new FileReader();
reader.onload = function(e) {
var xml = e.target.result;
BpmnModel.fromXML(xml, 'bpmn:Definitions', function(err, result) {
var resultAsJson = JSON.stringify(result, null, ' ');
document.getElementById('list').innerHTML = resultAsJson;
});
};
reader.readAsText(f);
}
}
function handleDragOver(evt) {
evt.stopPropagation();
evt.preventDefault();
evt.dataTransfer.dropEffect = 'copy'; // Explicitly show this is a copy.
}
// Setup the dnd listeners.
var dropZone = document.getElementById('drop-zone');
dropZone.addEventListener('dragover', handleDragOver, false);
dropZone.addEventListener('drop', handleFileSelect, false);
</script>
</html>

3
package.json
View File

@ -48,7 +48,8 @@
"karma-browserify": "~0.0.6",
"karma-jasmine": "~0.2.0",
"karma-chrome-launcher": "~0.1.2",
"karma-phantomjs-launcher": "~0.1.2"
"karma-phantomjs-launcher": "~0.1.2",
"grunt-contrib-copy": "~0.5.0"
},
"dependencies": {
"moddle": "~0.0.1",