working on edit form
Signed-off-by: Stephan Richter <s.richter@srsoftware.de>
This commit is contained in:
@@ -4,9 +4,95 @@
|
||||
<title>SRSoftware OpenCloudCal</title>
|
||||
<link rel="stylesheet" href="occ.css" />
|
||||
<script src="/static/script/common.js"></script>
|
||||
<script src="/static/script/event.js"></script>
|
||||
<script src="/static/script/edit.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Create new event</h1>
|
||||
<div class="form">
|
||||
<fieldset>
|
||||
<legend>basic data</legend>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Event title</th>
|
||||
<td>
|
||||
<input type="text" name="title" class="required" placeholder="Name of the Event" />
|
||||
</td>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Location</th>
|
||||
<td>
|
||||
<input type="text" name="location" class="required" placeholder="Address"/>
|
||||
</td>
|
||||
<th rowspan="4">
|
||||
<textarea name="description" id="description" placeholder="Describe the event"></textarea>
|
||||
</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Start</th>
|
||||
<td>
|
||||
<input type="datetime-local" name="start" class="required" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>End</th>
|
||||
<td>
|
||||
<input type="datetime-local" name="start"/>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Keywords</th>
|
||||
<td>
|
||||
<input type="text" name="tags-input" id="tags-input" placeholder="Press Enter to add" onkeyup="tagKeyPress(event)" />
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" id="taglist"></td>
|
||||
</tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>extended data</legend>
|
||||
<table>
|
||||
<tr>
|
||||
<th>Coordinates</th>
|
||||
<td>
|
||||
<input type="text" name="coords" placeholder="latitude, longitude">
|
||||
</td>
|
||||
<td></td>
|
||||
<th>Map</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Links</th>
|
||||
<td>
|
||||
<input type="url" name="link-url" placeholder="http://example.com/info" />
|
||||
</td>
|
||||
<td>
|
||||
<button>add</button>
|
||||
</td>
|
||||
<td rowspan="4">
|
||||
Map goes here
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" id="link-list">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Attachments/Images</th>
|
||||
<td>
|
||||
<input type="url" name="image-url" placeholder="http://example.com/ad.jpg"/>
|
||||
</td>
|
||||
<td>
|
||||
<button>add</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2" id="attachment-list">
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</fieldset>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@@ -6,7 +6,7 @@
|
||||
<script src="/static/script/common.js"></script>
|
||||
<script src="/static/script/index.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<body class="index">
|
||||
<nav />
|
||||
<div>
|
||||
<h1>Event List</h1>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
tr:hover td,
|
||||
tr:hover th{
|
||||
.index tr:hover td,
|
||||
.index tr:hover th{
|
||||
background-color: khaki;
|
||||
}
|
||||
|
||||
@@ -71,6 +71,28 @@ tr.head{
|
||||
background: white;
|
||||
}
|
||||
|
||||
table#eventlist{
|
||||
table#eventlist{
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.form table{
|
||||
width: 100%;
|
||||
}
|
||||
.form tr>:nth-child(1){
|
||||
width: 120px;
|
||||
}
|
||||
|
||||
.form tr>:nth-child(2){
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
.form textarea{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
min-height: 120px;
|
||||
}
|
||||
|
||||
.required{
|
||||
border: 1px solid brown;
|
||||
border-radius: 2px;
|
||||
}
|
||||
11
de.srsoftware.cal.web/src/main/resources/script/edit.js
Normal file
11
de.srsoftware.cal.web/src/main/resources/script/edit.js
Normal file
@@ -0,0 +1,11 @@
|
||||
function tagKeyPress(e){
|
||||
var input = e.target;
|
||||
if (e.keyCode == 13){
|
||||
var list = document.getElementById('taglist');
|
||||
var btn = document.createElement('button');
|
||||
btn.innerHTML = input.value;
|
||||
list.appendChild(btn);
|
||||
list.appendChild(document.createTextNode(' '));
|
||||
input.value = '';
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user