1
|
<%@page contentType="text/html" pageEncoding="UTF-8"%>
|
2
|
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
|
3
|
|
4
|
<!DOCTYPE html>
|
5
|
<html>
|
6
|
<head>
|
7
|
<meta charset="utf-8">
|
8
|
|
9
|
<link rel="stylesheet" href="css/main.css">
|
10
|
|
11
|
<script src="js/libs/jquery-1.8.3.js"></script>
|
12
|
<script src="old/js/diagram.js"></script>
|
13
|
<script src="old/js/user.js"></script>
|
14
|
|
15
|
<title>IMiGEr</title>
|
16
|
</head>
|
17
|
|
18
|
<body>
|
19
|
<div class="wrapper">
|
20
|
<header class="header" id="header">
|
21
|
<img src="images/logo.png" class="header-logo" alt="logo of University of West Bohemia" title="University of West Bohemia">
|
22
|
|
23
|
<h2 class="header-title">Interactive Multimodal Graph Explorer</h2>
|
24
|
|
25
|
<jsp:include page="logged_user.jsp" />
|
26
|
|
27
|
<nav class="navbar" id="navigation"></nav>
|
28
|
</header>
|
29
|
|
30
|
<main class="upload-content">
|
31
|
<jsp:include page="logged_user_menu.jsp" />
|
32
|
|
33
|
<div class="upload-forms">
|
34
|
<c:if test="${not empty errorMessage}">
|
35
|
<p class="errorMessage">${errorMessage}</p>
|
36
|
</c:if>
|
37
|
|
38
|
<h3>Upload components:</h3>
|
39
|
|
40
|
<form name="uploadForm" action="upload-files" method="post" enctype="multipart/form-data">
|
41
|
<div class="form-field">
|
42
|
<input type="file" name="uploads[]" class="hidden" id="fileUpload" multiple>
|
43
|
|
44
|
<button type="button">
|
45
|
<label for="fileUpload">Browse files</label>
|
46
|
</button>
|
47
|
|
48
|
<label for="fileUpload" id="fileCounter"></label>
|
49
|
</div>
|
50
|
|
51
|
<input type="submit" value="Upload">
|
52
|
</form>
|
53
|
|
54
|
<hr class="verticalSeparator">
|
55
|
|
56
|
<% if (request.getParameter("diagram_id") != null) { %>
|
57
|
<form name="diagramForm" action="graph?diagram_id=<%= request.getParameter("diagram_id") %>&diagram_hash=<%= request.getParameter("diagram_hash") %>" method="post">
|
58
|
<input type="hidden" name="diagram_id" value="<%= request.getParameter("diagram_id") %>">
|
59
|
|
60
|
<%
|
61
|
if (request.getSession().getAttribute("logged_user_id") != null &&
|
62
|
request.getAttribute("diagram_user_id") != null &&
|
63
|
request.getAttribute("diagram_user_id").toString().compareTo(request.getSession().getAttribute("logged_user_id").toString()) == 0 ) { %>
|
64
|
|
65
|
<div class="form-field">
|
66
|
<label for="diagramName">Edit diagram name:</label><br>
|
67
|
<input type="text" name="diagram_name" id="diagramName" value="${diagram_name}">
|
68
|
</div>
|
69
|
|
70
|
<div class="form-field">
|
71
|
<label for="publicDiagram">Public diagram:</label><br>
|
72
|
<input type="checkbox" name="public_diagram" id="publicDiagram" value="1" ${diagram_public_checked}>
|
73
|
</div>
|
74
|
|
75
|
<% } else if (request.getSession().getAttribute("logged_user_id") != null) { %>
|
76
|
<div class="form-field">
|
77
|
<label for="diagramName">Edit diagram name:</label><br>
|
78
|
<input type="text" name="diagram_name" id="diagramName" value="${diagram_name}">
|
79
|
</div>
|
80
|
|
81
|
<div class="form-field">
|
82
|
<label for="copyDiagram">Copy diagram:</label><br>
|
83
|
<input type="checkbox" name="copy_diag" id="copyDiagram" value="1">
|
84
|
</div>
|
85
|
<% } %>
|
86
|
|
87
|
<% } else { %>
|
88
|
<form name="diagramForm" action="graph" method="post">
|
89
|
<% if (request.getSession().getAttribute("logged_user") == "1" ) { %>
|
90
|
<div class="form-field">
|
91
|
<label for="diagramName">Diagram name:</label><br>
|
92
|
<input type="text" name="diagram_name" id="diagramName">
|
93
|
</div>
|
94
|
|
95
|
<div class="form-field">
|
96
|
<label for="publicDiagram">Public diagram:</label><br>
|
97
|
<input type="checkbox" name="public_diagram" id="publicDiagram" value="1" ${diagram_public_checked}>
|
98
|
</div>
|
99
|
<% } %>
|
100
|
<% } %>
|
101
|
|
102
|
<!--
|
103
|
<div class="form-field">
|
104
|
<label for="framework">Choose framework:</label><br>
|
105
|
<select name="framework" id="framework">
|
106
|
<option value="osgi">OSGi</option>
|
107
|
<option value="ejb3">EJB3</option>
|
108
|
<option value="sofa2">SOFA2</option>
|
109
|
</select>
|
110
|
</div>
|
111
|
-->
|
112
|
|
113
|
<input type="submit" value="Start visualization" ${not empty componentNames ? "" : "disabled='disabled'"}>
|
114
|
</form>
|
115
|
|
116
|
<c:if test="${not empty componentNames}">
|
117
|
<hr class="verticalSeparator">
|
118
|
|
119
|
<h3>Uploaded components:</h3>
|
120
|
|
121
|
<ul id="uploadedComponent">
|
122
|
<%
|
123
|
if (request.getParameter("diagram_id") == null) {
|
124
|
request.setAttribute("url_diagram_id", "");
|
125
|
%>
|
126
|
<li id="deleteAll">Delete all <a href="delete-components"><img src="images/button_cancel.png" alt="delete" class="imgDelete"/></a></li>
|
127
|
<%
|
128
|
} else {
|
129
|
request.setAttribute("url_diagram_id", "&diagram_id="+ request.getParameter("diagram_id") + "&diagram_hash="+ request.getParameter("diagram_hash"));
|
130
|
}
|
131
|
%>
|
132
|
<c:forEach items="${componentNames}" var="componentName">
|
133
|
<li id="${componentName}">${componentName}
|
134
|
<% if (request.getParameter("diagram_id") == null || ( request.getSession().getAttribute("logged_user_id") != null &&
|
135
|
request.getAttribute("diagram_user_id") != null &&
|
136
|
request.getAttribute("diagram_user_id").toString().compareTo(request.getSession().getAttribute("logged_user_id").toString()) == 0 )) { %>
|
137
|
<a href="delete-component?name=${componentName}<%= request.getAttribute("url_diagram_id") %>"><img src="images/button_cancel.png" alt="delete" class="imgDelete"/></a></li>
|
138
|
<% } %>
|
139
|
</c:forEach>
|
140
|
</ul>
|
141
|
</c:if>
|
142
|
</div>
|
143
|
</main>
|
144
|
</div>
|
145
|
|
146
|
<script>
|
147
|
var fileUploadField = document.getElementById('fileUpload');
|
148
|
var fileCounter = document.getElementById('fileCounter');
|
149
|
|
150
|
fileUploadField.addEventListener('change', function() {
|
151
|
var message = this.files.length === 1 ? '1 file selected.' : (this.files.length + ' files selected.');
|
152
|
fileCounter.innerText = message;
|
153
|
});
|
154
|
</script>
|
155
|
</body>
|
156
|
</html>
|