Skip to content

Commit 2c4c390

Browse files
committed
First public release
1 parent 8397ed8 commit 2c4c390

File tree

6 files changed

+652
-189
lines changed

6 files changed

+652
-189
lines changed

README.md

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,5 @@
11
# FlowgorithmJS
2-
[Flowgorithm (http://www.flowgorithm.org)](http://www.flowgorithm.org) is an excellent software for drawing flowcharts. The files generated by Flowgorithm (with the extension .fprg) are in an open XML format.
2+
[Flowgorithm (http://www.flowgorithm.org)](http://www.flowgorithm.org) is an excellent software for drawing flowcharts. The files generated by Flowgorithm (with the extension .fprg) use an open XML format.
33

4-
FlowgorithmJS is a **_third-party_** tool written in Javascript that can read and display one or more .fprg files on a web page.
4+
FlowgorithmJS is a **_third-party_** tool written in Javascript that can read and display one or more .fprg files on a web page using SVG format.
55

6-
7-
8-
9-
### _The software is under development. The first beta version will be published soon._

drawLocal.html

Lines changed: 61 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>FlowgorithmJS offline</title>
5+
<meta charset="utf-8">
6+
<script src="lib/jquery-3.3.1.min.js"></script>
7+
<script src="flowgorithm.js?013"></script>
8+
<script>
9+
var config = {
10+
itMode: 2
11+
};
12+
var xml;
13+
function loadFile(){
14+
var file = $('#source').get(0).files[0];
15+
var reader = new FileReader();
16+
reader.addEventListener("load",function(){
17+
xml = reader.result;
18+
config.groupInput = $("#o1").is(":checked") ? true : false;
19+
config.aH = parseInt($("#o2").val());
20+
drawFlowchartFromSource(xml,'#f',config);
21+
$('#choose').removeClass('big');
22+
$('body').addClass('view');
23+
$('title').text($('#f div.title').text());
24+
},false);
25+
if(file){
26+
reader.readAsText(file);
27+
}
28+
}
29+
</script>
30+
<style>
31+
h1{font-size:1.2em}
32+
#choose{width:100%;text-align:right;background:#eee;margin:0 0 1em}
33+
#choose label{color:#888}
34+
#choose.big{border:1px solid #ddd;padding:5em 0;text-align:center;font-size:1.2em;background:none}
35+
#choose.big #source{font-size:1.5em}
36+
body.view #chooseOption{display:none}
37+
body.view h1{float:left;font-size:1em;margin:.1em .5em}
38+
@media print{
39+
.noprint{display:none}
40+
body{margin:1.5cm;padding:0}
41+
#f div.desc{border:1px solid #333 !important;margin:0 0 .5em!important;padding:.3em !important;font-size:.9em}
42+
#f div.info{display:none}
43+
#f{page-break-inside:avoid}
44+
svg{height:900px}
45+
@page{margin:0}
46+
}
47+
</style>
48+
</head>
49+
<body>
50+
<h1 class="noprint">Flowgorithm JS Viewer</h1>
51+
<div id="choose" class="big noprint">
52+
<label for="source">Select .fprg file</label>
53+
<input type="file" onchange="loadFile()" id="source" accept=".fprg">
54+
</div>
55+
<div id="chooseOption" class="noprint">
56+
<label for="o1"><input type="checkbox" value="1" name="groupInput" id="o1" checked> Grouping consecutive input</label><br>
57+
<label for="o2">Arrows height: <input type="number" min="1" max="100" value="12" name="groupInput" id="o2"></label>
58+
</div>
59+
<div id="f"></div>
60+
</body>
61+
</html>

0 commit comments

Comments
 (0)