mirror of
https://github.com/sartography/bpmn-js.git
synced 2025-02-17 03:16:32 +00:00
feat(example): add browser integration sample
This commit is contained in:
parent
01a5f28e2d
commit
5b5225450d
15
Gruntfile.js
15
Gruntfile.js
@ -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: {
|
watch: {
|
||||||
sources: {
|
sources: {
|
||||||
files: [ '<%= config.sources %>/**/*.js'],
|
files: [ '<%= config.sources %>/**/*.js'],
|
||||||
@ -106,7 +119,7 @@ module.exports = function(grunt) {
|
|||||||
// tasks
|
// tasks
|
||||||
|
|
||||||
grunt.registerTask('test', [ 'jasmine_node', 'karma:single' ]);
|
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' ]);
|
grunt.registerTask('auto-test', [ 'jasmine_node', 'watch:test' ]);
|
||||||
|
|
||||||
|
53
example/index.html
Normal file
53
example/index.html
Normal 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>
|
@ -48,7 +48,8 @@
|
|||||||
"karma-browserify": "~0.0.6",
|
"karma-browserify": "~0.0.6",
|
||||||
"karma-jasmine": "~0.2.0",
|
"karma-jasmine": "~0.2.0",
|
||||||
"karma-chrome-launcher": "~0.1.2",
|
"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": {
|
"dependencies": {
|
||||||
"moddle": "~0.0.1",
|
"moddle": "~0.0.1",
|
||||||
|
Loading…
x
Reference in New Issue
Block a user