2014-03-11 15:24:31 +00:00
|
|
|
<html>
|
|
|
|
|
<head>
|
|
|
|
|
<title>bpmn-js demo</title>
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<div id="drop-zone">Drop files here</div>
|
|
|
|
|
<output id="list"></output>
|
|
|
|
|
|
2014-03-13 10:21:03 +00:00
|
|
|
<div class="canvas"></div>
|
|
|
|
|
|
2014-03-11 15:24:31 +00:00
|
|
|
<script src="../bpmn.js"></script>
|
|
|
|
|
|
|
|
|
|
<script>
|
2014-03-13 10:21:03 +00:00
|
|
|
var bpmn = require('bpmn');
|
|
|
|
|
var Model = require('bpmn/Model');
|
2014-03-11 15:24:31 +00:00
|
|
|
</script>
|
2014-03-13 10:21:03 +00:00
|
|
|
|
|
|
|
|
|
2014-03-11 15:24:31 +00:00
|
|
|
<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.
|
|
|
|
|
for (var i = 0, f; f = files[i]; i++) {
|
|
|
|
|
|
|
|
|
|
var reader = new FileReader();
|
|
|
|
|
|
|
|
|
|
reader.onload = function(e) {
|
|
|
|
|
|
|
|
|
|
var xml = e.target.result;
|
|
|
|
|
|
2014-03-13 10:21:03 +00:00
|
|
|
Model.fromXML(xml, 'bpmn:Definitions', function(err, definitions) {
|
|
|
|
|
if (err) {
|
|
|
|
|
console.error(err);
|
|
|
|
|
} else {
|
|
|
|
|
console.log(definitions);
|
|
|
|
|
}
|
2014-03-11 15:24:31 +00:00
|
|
|
});
|
2014-03-13 10:21:03 +00:00
|
|
|
|
|
|
|
|
/*renderer.renderXML(xml, function(err) {
|
|
|
|
|
console.log('diagram rendererd');
|
|
|
|
|
});*/
|
2014-03-11 15:24:31 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
|
|
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>
|
