Browse Source

working on edit form

Signed-off-by: Stephan Richter <s.richter@srsoftware.de>
main
Stephan Richter 6 months ago
parent
commit
733b5a06a4
  1. 88
      de.srsoftware.cal.web/src/main/resources/edit.html
  2. 2
      de.srsoftware.cal.web/src/main/resources/index.html
  3. 30
      de.srsoftware.cal.web/src/main/resources/occ.css
  4. 11
      de.srsoftware.cal.web/src/main/resources/script/edit.js

88
de.srsoftware.cal.web/src/main/resources/edit.html

@ -4,9 +4,95 @@ @@ -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>

2
de.srsoftware.cal.web/src/main/resources/index.html

@ -6,7 +6,7 @@ @@ -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>

30
de.srsoftware.cal.web/src/main/resources/occ.css

@ -1,5 +1,5 @@ @@ -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{ @@ -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

@ -0,0 +1,11 @@ @@ -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 = '';
}
}
Loading…
Cancel
Save