Name: cockpit/index.html 
1:
<!--
2:
  This file is part of CPEE.
3:
 
4:
  CPEE is free software: you can redistribute it and/or modify it under the terms
5:
  of the GNU General Public License as published by the Free Software Foundation,
6:
  either version 3 of the License, or (at your option) any later version.
7:
 
8:
  CPEE is distributed in the hope that it will be useful, but WITHOUT ANY
9:
  WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A
10:
  PARTICULAR PURPOSE.  See the GNU General Public License for more details.
11:
 
12:
  You should have received a copy of the GNU General Public License along with
13:
  CPEE (file COPYING in the main directory).  If not, see
14:
  <http://www.gnu.org/licenses/>.
15:
-->
16:
 
17:
<!DOCTYPE html>
18:
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
19:
  <head>
20:
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
21:
    <title>CPEE Cockpit</title>
22:
 
23:
    <!-- libs, do not modify -->
24:
 
25:
    <script type="text/javascript" src="lib/jquery.min.js"></script>
26:
    <script type="text/javascript" src="lib/jquery.svgdom.js"></script>
27:
    <script type="text/javascript" src="lib/jquery-ui.custom.min.js"></script>
28:
    <script type="text/javascript" src="lib/util.js"></script>
29:
    <script type="text/javascript" src="lib/printf.js"></script>
30:
    <script type="text/javascript" src="lib/strftime.min.js"></script>
31:
    <script type="text/javascript" src="lib/parsequery.js"></script>
32:
    <script type="text/javascript" src="lib/underscore.min.js"></script>
33:
    <script type="text/javascript" src="lib/jquery.caret.min.js"></script>
34:
    <script type="text/javascript" src="lib/jquery.cookie.js"></script>
35:
    <script type="text/javascript" src="lib/jquery.redraw.js"></script>
36:
 
37:
    <script type="text/javascript" src="lib/contextmenu.js"></script>
38:
    <script type="text/javascript" src="lib/wfadaptor.js"></script>
39:
    <script type="text/javascript" src="lib/ui.js"></script>
40:
 
41:
    <link rel="stylesheet" href="lib/wfadaptor.css" type="text/css"/>
42:
    <link rel="stylesheet" href="lib/contextmenu.css" type="text/css"/>
43:
    <link rel="stylesheet" href="lib/ui.css" type="text/css"/>
44:
 
45:
    <!-- custom stuff, play arround  -->
46:
 
47:
    <script type="text/javascript" src="js/ui.js"></script>
48:
    <script type="text/javascript" src="js/instance.js"></script>
49:
    <script type="text/javascript" src="js/details.js"></script>
50:
    <script type="text/javascript" src="js/parameters.js"></script>
51:
    <script type="text/javascript" src="js/wfadaptor.cpee.js"></script>
52:
    <link rel="stylesheet" href="css/ui.css" type="text/css"/>
53:
    <link rel="stylesheet" href="css/ui.css" type="text/css"/>
54:
  </head>
55:
  <body data-defaultport="9298">
56:
     <div id='disclaimer' class='hidden'>
57:
       <h1>Disclaimer</h1>
58:
 
59:
       <p>
60:
         We use reasonable care in creating and presenting the functionality
61:
         found in this demonstrator. It is provided purely for demonstration purposes
62:
         and you should seek further guidance and make independent enquiries
63:
         before relying upon it.
64:
       </p>
65:
       
66:
       <p>
67:
         All functionality included in this demonstrator is subject to change
68:
         without notice. We make no representation or warranty whatsoever
69:
         regarding the completeness, accuracy, adequacy, suitability or
70:
         operation of this demonstrator, or of the results it produces.
71:
       </p>
72:
       
73:
       <p>
74:
         We assume no responsibility for process instances created with this
75:
         demonstrator and disclaim all liability arising from negligence or
76:
         otherwise in respect of such process instances. We will not be liable
77:
         for any damages (including, without limitation, damages for any
78:
         consequential loss or loss of business opportunities or projects, or
79:
         loss of profits) howsoever arising from use of or inability to use
80:
         this demonstrator, or from any action or omission taken as a result of
81:
         using this demonstrator.
82:
       </p>
83:
       
84:
       <p>
85:
         This demonstrator was created in Austria. All liability is excluded to the extent
86:
         permitted by law including any implied terms. Any interpretation of its
87:
         content, claims or disputes (of whatever nature and not limited to contractual
88:
         issues) shall be subject to the exclusive jurisdiction of the Austrian Courts
89:
         under Austrian law.
90:
       </p>
91:
 
92:
 
93:
       <p>
94:
         All actions performed while using this demonstrator will be logged, including
95:
         the IP address of the user.
96:
       </p>
97:
 
98:
       <p>
99:
         <input id='iagree' type='checkbox'/><label for'iagree'><strong>OK, I Agree with this terms. I will be a happy person, and do no evil.</strong></label>
100:
       </p>
101:
       <p>
102:
        <button id='icontinue' disabled='disabled'>Continue</button>
103:
       </p>
104:
    </div>
105:
       
106:
 
107:
    <!-- The following six are templates that get used during ui generation, change them carefully -->
108:
    <table id="dat_template_pair" class='hidden'> <!--{{{-->
109:
      <tr class="pair">
110:
        <td class='del'><a href='' tabindex='-1' title='Delete Item (Ctrl-D)'>✖</a></td>
111:
        <td class='pname'><input pattern="[a-zA-Z][a-zA-Z0-9_]*" placeholder='fill in name...' type='text' class='pair_name' value=''/></td>
112:
        <td class='sep'>⇒</td>
113:
        <td class='pvalue'><input placeholder='fill in value...' class='pair_value' value=''/></td>
114:
      </tr>
115:
    </table> <!--}}}-->
116:
    <table id="prop_template_sizer" class='hidden'> <!--{{{-->
117:
      <tr class='sizer'>
118:
        <td class='del'></td>
119:
        <td class='pname'></td>
120:
        <td class='sep'></td>
121:
        <td class='value'></td>
122:
      </tr>
123:
    </table> <!--}}}-->
124:
    <table id="prop_template_input" class='hidden'> <!--{{{-->
125:
      <tr>
126:
        <td class='cname' colspan='2'><strong class="prop_name"></strong></td>
127:
        <td class='sep'>⇒</td>
128:
        <td class='value'><input type="text" class="prop_value" value=""/></td>
129:
      </tr>
130:
    </table> <!--}}}-->
131:
    <table id="prop_template_readonly" class='hidden'> <!--{{{-->
132:
      <tr>
133:
        <td class='cname' colspan='2'><strong class="prop_name"></strong></td>
134:
        <td class='sep'>⇒</td>
135:
        <td class='value'><input type="text" readonly='readonly' class="prop_value" value=""/></td>
136:
      </tr>
137:
    </table> <!--}}}-->
138:
    <table id="prop_template_area" class='hidden'> <!--{{{-->
139:
      <tr>
140:
        <td class='cname' colspan='2'><strong class="prop_name"></strong></td>
141:
        <td class='sep'>⇒</td>
142:
        <td class='value'><textarea rows='3' class="prop_value"></textarea></td>
143:
      </tr>
144:
    </table> <!--}}}-->
145:
    <table id="prop_template_header" class='hidden'> <!--{{{-->
146:
      <tr class='header'>
147:
        <td colspan='4'><strong class="header_value"></strong> <button title='Ctrl-N while editing entry'>New</button></td>
148:
      </tr>
149:
    </table> <!--}}}-->
150:
    <table id="prop_template_line" class='hidden'> <!--{{{-->
151:
      <tr>
152:
        <td class='cname' colspan='2'></td>
153:
        <td class='sep'>⇒</td>
154:
        <td class='value'><em class="line_main"></em><em>:</em> <span class='line_text'></span></td>
155:
      </tr>
156:
    </table> <!--}}}-->
157:
    <table id="prop_template_select" class='hidden'> <!--{{{-->
158:
      <tr>
159:
        <td class='cname' colspan='2'><strong class="prop_name"></strong></td>
160:
        <td class='sep'>⇒</td>
161:
        <td class='value'><select class="prop_value"></select></td>
162:
      </tr>
163:
    </table> <!--}}}-->
164:
 
165:
    <div class="tabbed" id="instance">
166:
      <table class="tabbar">
167:
        <tr>
168:
          <td class="tab switch"                            ><h1></h1></td>
169:
          <td class="tab"                 id="tabnew"       ><h1>New</h1></td>
170:
          <td class="tab inactive hidden" id="tabinstance"  ><h1>Instance</h1></td>
171:
          <td class="tab inactive hidden" id="tabexecution" ><h1>Execution</h1></td>
172:
          <td class="tabbehind"><input name="current-instance" type="text" value="" readonly='readonly' style='display:none'/><a id='current-instance'></a></td>
173:
        </tr>
174:
        <tr class="border hidden"><td colspan="5"></td></tr>
175:
      </table>
176:
      <div class="tabbelow">
177:
        <div id="areanew"> <!--{{{-->
178:
          <table class='layout'>
179:
          <tr>
180:
            <td>Base Url:</td>
181:
            <td><input name="base-url" type="text" value=""/></td>
182:
            <td><button name="base">create new instance</button></td>
183:
          </tr>
184:
          <tr>
185:
            <td>Instance Url:</td>
186:
            <td><input name="instance-url" type="text" value=""/></td>
187:
            <td><button name="instance">monitor instance</button></td>
188:
          </tr>
189:
          </table>
190:
        </div> <!--}}}-->
191:
        <div id="areainstance" class="inactive"> <!--{{{-->
192:
          <table class='compact'>
193:
            <tbody class='loadsave'>
194:
              <tr>
195:
                <td><select title='a testset includes various setting, subscriptions and a model' name="testset-names"></select></td>
196:
                <td><button title='a testset includes various setting, subscriptions and a model' name="loadtestset">load from testset</button></td>
197:
                <td rowspan='3'><button title='a testset includes various setting, subscriptions and a model' name="savetestset">save testset</button><a id="savetestset" href="" download=""></a></td>
198:
                <td rowspan='3'><button title='a testset includes various setting, subscriptions and a model' name="savesvg">save svg graph</button><a id="savesvg" href="" download=""></a></td>
199:
              </tr>
200:
              <tr>
201:
                <td><input title='a testset includes various setting, subscriptions and a model' type='file' id='testsetfile'/></td>
202:
                <td><button title='a testset includes various setting, subscriptions and a model' name="loadtestsetfile">load from testset</button></td>
203:
              </tr>
204:
              <tr>
205:
                <td><input title='a standalone process model is only loadable if the currently loaded testset sucessfully prepared the current instance for the type of model' type='file' id='modelfile'/></td>
206:
                <td><button title='a standalone process model is only loadable if the currently loaded testset sucessfully prepared the current instance for the type of model' name="loadmodelfile">load model</button></td>
207:
              </tr>
208:
            </tbody>
209:
          </table>
210:
        </div> <!--}}}-->
211:
        <div id="areaexecution" class='inactive'> <!--{{{-->
212:
          <table class='compact'>
213:
            <tbody class='debug'>
214:
              <tr>
215:
                <td>Debugging:</td>
216:
                <td><input type="checkbox" name="votecontinue"/></td>
217:
              </tr>
218:
            </tbody>  
219:
            <tbody class='exe'>
220:
              <tr>
221:
                <td>Execution State:</td>
222:
                <td id='state'></td>
223:
              </tr>
224:
              <tr>
225:
                <td>Continue:</td>
226:
                <td id='votes'></td>
227:
              </tr>
228:
            </tbody>
229:
          </table>
230:
        </div> <!--}}}-->
231:
      </div>
232:
    </div>
233:
 
234:
    <div class="tabbed hidden" id='parameters'>
235:
      <table class="tabbar">
236:
        <tr>
237:
          <td class="tab switch"                       ><h1></h1></td>
238:
          <td class="tab"          id="tabdataelements"><h1>Data Elements</h1></td>
239:
          <td class="tab inactive" id="tabendpoints"   ><h1>Endpoints</h1></td>
240:
          <td class="tabbehind"><button title='Ctrl-N while editing entry'>New</button><button title='Ctrl-S while editing entry'>Save</button></td>
241:
        </tr>
242:
        <tr class="border hidden"><td colspan="4"></td></tr>
243:
      </table>
244:
      <div class="tabbelow">
245:
        <div id="areadataelements"> <!--{{{-->
246:
          <table id="dat_dataelements"></table>
247:
        </div> <!--}}}-->
248:
        <div id="areaendpoints" class='inactive'> <!--{{{-->
249:
          <table id="dat_endpoints"></table>
250:
        </div> <!--}}}-->
251:
        <span id='handle1' class="ui-resizable-handle ui-resizable-s">drag to resize</span>
252:
      </div>
253:
    </div>
254:
 
255:
    <div id="main" class="tabbed rest hidden">
256:
      <table class="tabbar">
257:
        <tr>
258:
          <td class="tabbefore"></td>
259:
          <td class="tab"          id="tabdetails"><h1>Graph</h1></td>
260:
          <td class="tab inactive" id="tabdsl"    ><h1>Description</h1></td>
261:
          <td class="tab inactive" id="tablog"    ><h1>Log</h1></td>
262:
          <td class="tabbehind"><button title='Ctrl-S while editing entry'>Save</button></td>
263:
        </tr>
264:
        <tr class="border hidden"><td colspan="3"></td></tr>
265:
      </table>
266:
      <table class="tabbelow columns" id="areadetails">
267:
        <tr>
268:
          <td id='graphcolumn'> <!--{{{-->
269:
            <div class='column'>
270:
              <svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:x="http://www.w3.org/1999/xlink" id='graphcanvas' width='1' height='1'></svg>
271:
            </div>
272:
          </td> <!--}}}-->
273:
          <td id="detailcolumn"> <!--{{{-->
274:
            <span id='handle2' class="ui-resizable-handle ui-resizable-w">drag to resize</span>
275:
            <div class='column'>
276:
              <table id="dat_details"></table>
277:
            </div>
278:
          </td> <!--}}}-->
279:
        </tr>
280:
      </table>
281:
      <div id="areadsl" class="tabbelow inactive"></div>
282:
      <div id="arealog" class="tabbelow inactive"> <!--{{{-->
283:
        <table id="dat_log" class="layout">
284:
        </table>
285:
      </div> <!--}}}-->
286:
    </div>
287:
 
288:
  </body>
289:
</html>