Moved images from wekan.github.io to docs
BIN
docs/Backup/Rclone/minio1.png
Normal file
|
After Width: | Height: | Size: 50 KiB |
BIN
docs/Backup/Rclone/minio2.png
Normal file
|
After Width: | Height: | Size: 117 KiB |
BIN
docs/Backup/Rclone/wekan-admin-panel.png
Normal file
|
After Width: | Height: | Size: 58 KiB |
BIN
docs/Backup/nosqlbooster-basic-connection.png
Normal file
|
After Width: | Height: | Size: 32 KiB |
BIN
docs/Backup/nosqlbooster-ssh-tunnel.png
Normal file
|
After Width: | Height: | Size: 29 KiB |
BIN
docs/Backup/nosqlbooster.png
Normal file
|
After Width: | Height: | Size: 276 KiB |
BIN
docs/Browsers/chromium-edge-install-pwa.png
Normal file
|
After Width: | Height: | Size: 6.2 KiB |
BIN
docs/Browsers/manybrowser.png
Normal file
|
After Width: | Height: | Size: 1 MiB |
BIN
docs/Databases/ToroDB-PostgreSQL/ToroDB.png
Normal file
|
After Width: | Height: | Size: 283 KiB |
BIN
docs/Date/day_of_week_start_1.png
Normal file
|
After Width: | Height: | Size: 22 KiB |
BIN
docs/Date/day_of_week_start_2.png
Normal file
|
After Width: | Height: | Size: 20 KiB |
BIN
docs/DragDrop/dragdrop/mobile-drag-drop.png
Normal file
|
After Width: | Height: | Size: 27 KiB |
BIN
docs/DragDrop/multidrag/img/round-blue-old.gif
Normal file
|
After Width: | Height: | Size: 1 KiB |
BIN
docs/DragDrop/multidrag/img/round-blue.gif
Normal file
|
After Width: | Height: | Size: 883 B |
469
docs/DragDrop/multidrag/index.html
Normal file
|
|
@ -0,0 +1,469 @@
|
|||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
|
||||
<html lang="en" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
|
||||
<head>
|
||||
<title>WeKan ® - MultiDrag at InteractJS.io</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="maximum-scale=1.0,width=device-width">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="application-name" content="WeKan ®">
|
||||
<meta name="msapplication-TileColor" content="#00aba9">
|
||||
<meta name="theme-color" content="#fff">
|
||||
<style>
|
||||
/* VML for IE */
|
||||
v\:* {
|
||||
behavior: url(#default#VML);
|
||||
}
|
||||
|
||||
#drag-1, #drag-2, #drag-3, #drag-4, #drag-5,
|
||||
#drag-6, #drag-7, #drag-8, #drag-9, #drag-10 {
|
||||
color: white;
|
||||
/* margin: 1rem 0 0 1rem; */
|
||||
touch-action: none;
|
||||
user-select: none;
|
||||
transform: translate(0px, 0px);
|
||||
cursor: move;
|
||||
border-radius: 25px;
|
||||
padding: 20px;
|
||||
/* background GIF produces dithered background at Amiga IBrowse, so better to use
|
||||
table background color to get solid color
|
||||
background:url("img/round-blue.gif") top left no-repeat; */
|
||||
outline: none; /* Remove default browser focus outline */
|
||||
transition: border-color 0.3s ease, box-shadow 0.3s ease; /* Smooth transitions */
|
||||
}
|
||||
|
||||
/* At active card at, show red border and shadow on focus*/
|
||||
#drag-1:focus, #drag-2:focus, #drag-3:focus,
|
||||
#drag-4:focus, #drag-5:focus, #drag-6:focus,
|
||||
#drag-7:focus, #drag-8:focus, #drag-9:focus,
|
||||
#drag-10:focus {
|
||||
border-color: #f00; /* Red border on focus */
|
||||
box-shadow: 0 0 0 5px rgba(255, 0, 0, 0.5); /* Red shadow on focus */
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
|
||||
/* top + 130px is next position +20 ... background-color: #5e98c2; */
|
||||
#drag-1 { position: absolute; top: 300px; left: 10px;}
|
||||
#drag-2 { position: absolute; top: 430px; left: 10px;}
|
||||
#drag-3 { position: absolute; top: 560px; left: 10px; }
|
||||
#drag-4 { position: absolute; top: 690px; left: 10px;}
|
||||
#drag-5 { position: absolute; top: 820px; left: 10px;}
|
||||
#drag-6 { position: absolute; top: 300px; left: 260px; }
|
||||
#drag-7 { position: absolute; top: 430px; left: 260px; }
|
||||
#drag-8 { position: absolute; top: 560px; left: 260px; }
|
||||
#drag-9 { position: absolute; top: 690px; left: 260px; }
|
||||
#drag-10 { position: absolute; top: 820px; left: 260px; }
|
||||
|
||||
.draggable {
|
||||
touch-action: none;
|
||||
}
|
||||
|
||||
.redlines {
|
||||
position: fixed; /* or position: absolute */
|
||||
top: 440px;
|
||||
left: 150px;
|
||||
width: 50px;
|
||||
height: 2px;
|
||||
pointer-events: none; /* so that below cards can be clicked */
|
||||
}
|
||||
</style>
|
||||
|
||||
<script src="js/interact.js"></script>
|
||||
<style type="text/css">
|
||||
#drop_file_zone {
|
||||
background-color: #EEE;
|
||||
border: #999 5px dashed;
|
||||
width: 290px;
|
||||
height: 200px;
|
||||
padding: 8px;
|
||||
font-size: 18px;
|
||||
}
|
||||
#drag_upload_file {
|
||||
width:50%;
|
||||
margin:0 auto;
|
||||
}
|
||||
#drag_upload_file p {
|
||||
text-align: center;
|
||||
}
|
||||
#drag_upload_file #selectfile {
|
||||
display: none;
|
||||
}
|
||||
#oneboard {
|
||||
min-height: 100px;
|
||||
border: 1px solid black;
|
||||
padding: 2px;
|
||||
border-radius: 10px 10px 10px 10px;
|
||||
}
|
||||
body {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
background-color: #dfdfdf;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<br>
|
||||
|
||||
<br>
|
||||
|
||||
<h2>MultiDrag test, for future version of <a href="https://wekan.github.io">WeKan Open Source kanban</a></h2>
|
||||
|
||||
<p>This MultiDrag test uses <a href="https://interactjs.io">https://interactjs.io</a> drag drop</p>
|
||||
|
||||
<p>Features:</p>
|
||||
|
||||
<ul>
|
||||
<li>Newest browsers, MultiDrag: Touchscreen, you can drag many cards at once with each finger.
|
||||
Use case: Many users can drag their own card at big touch screen. Or one user can drag many cards.
|
||||
There is not any kanban software with MultiDrag feature yet.
|
||||
</li>
|
||||
<li>Ladybird, OneDrag: Touchscreen, drag only one card at once. Is it possible to get MultiDrag?</li>
|
||||
<li>Legacy Browsers: Uses HTML4 tables, and GIF image for rounded corners, to be visible at Netsurf and Amiga IBrowse.
|
||||
No drag drop features, so there will be buttons to move cards.
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<!-- Background GIF produces dithered background at Amiga IBrowse,
|
||||
so better to use table background color to get solid color:
|
||||
table background="img/round-blue.gif" => table bgcolor="#5e98c2"
|
||||
But this causes card to not have rounded corners at Netsurf and Amiga IBrowse.
|
||||
So, to have rounded corners at Netsurf and Amiga IBrowse, use background GIF.
|
||||
|
||||
valid_colors = ['white', 'green', 'yellow', 'orange', 'red', 'purple', 'blue', 'sky', 'lime', 'pink', 'black',
|
||||
'silver', 'peachpuff', 'crimson', 'plum', 'darkgreen', 'slateblue', 'magenta', 'gold', 'navy',
|
||||
'gray', 'saddlebrown', 'paleturquoise', 'mistyrose', 'indigo']
|
||||
|
||||
|
||||
<table bgcolor="#5e98c2"
|
||||
-->
|
||||
|
||||
<table bgcolor="blue" tabindex="1" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-1" class="draggable"
|
||||
border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="white" face="arial">
|
||||
<b>At touchscreen</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<br>
|
||||
|
||||
<table bgcolor="green" tabindex="2" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-2" class="draggable" border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="white" face="arial">
|
||||
<b>Drag many at once</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<br>
|
||||
|
||||
<table bgcolor="red" tabindex="3" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-3" class="draggable" border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="white" face="arial">
|
||||
<b>Visible at Netsurf</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody></table>
|
||||
|
||||
<br>
|
||||
|
||||
<table bgcolor="yellow" tabindex="4" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-4" class="draggable" border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="black" face="arial">
|
||||
<b>and Amiga IBrowse</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
|
||||
<table bgcolor="gray" tabindex="5" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-5" class="draggable" border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="white" face="arial">
|
||||
<b>For all browsers</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
|
||||
<table bgcolor="black" tabindex="6" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-6" class="draggable" border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="white" face="arial">
|
||||
<b>And all screen sizes</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
|
||||
<table bgcolor="cyan" tabindex="7" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-7" class="draggable" border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="black" face="arial">
|
||||
<b>And all OS</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
|
||||
<table bgcolor="pink" tabindex="8" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-8" class="draggable" border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="black" face="arial">
|
||||
<b>And CPUs</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
|
||||
<table bgcolor="orange" tabindex="9" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-9" class="draggable" border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="black" face="arial">
|
||||
<b>At Earth</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
|
||||
<table bgcolor="lightblue" tabindex="10" style="border-collapse: collapse;" width="200" height="80"
|
||||
border="0" padding="0" spacing="0" id="drag-10" class="draggable" border-collapse="collapse">
|
||||
<tbody><tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="40" valign="middle" align="top">
|
||||
<font size="1" color="black" face="arial">
|
||||
<b>And Space</b>
|
||||
<p></p></font>
|
||||
</td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
<tr border="0" padding="0" spacing="0">
|
||||
<td width="20" height="20"></td>
|
||||
<td width="160" height="20"></td>
|
||||
<td width="20" height="20"></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<br>
|
||||
|
||||
<div class="redlines">
|
||||
<svg height="210" width="500">
|
||||
<line x1="0" y1="0" x2="270" y2="150" style="stroke:rgb(255,0,0);stroke-width:2" />
|
||||
</svg>
|
||||
<v:group coordorigin="0 0" coordsize="500 210" style="width:500px;height:210px;">
|
||||
<v:line from="0,0" to="270,150" strokecolor="red" strokeweight="2pt" />
|
||||
</v:group>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
// target elements with the "draggable" class
|
||||
interact('.draggable')
|
||||
.draggable({
|
||||
// Disabled inertia, because it restricted area where to drag card,
|
||||
// and returned card to wrong position.
|
||||
// enable inertial throwing
|
||||
//inertia: true, // This is default. Trying to disable it.
|
||||
inertia: false,
|
||||
// keep the element within the area of it's parent. // This is default. Trying to disable it.
|
||||
/*
|
||||
modifiers: [
|
||||
interact.modifiers.restrictRect({
|
||||
restriction: 'parent',
|
||||
endOnly: true
|
||||
})
|
||||
],
|
||||
*/
|
||||
// enable autoScroll
|
||||
autoScroll: true,
|
||||
|
||||
listeners: {
|
||||
// call this function on every dragmove event
|
||||
move: dragMoveListener,
|
||||
|
||||
// call this function on every dragend event
|
||||
end (event) {
|
||||
var textEl = event.target.querySelector('p')
|
||||
|
||||
textEl && (textEl.textContent =
|
||||
'moved ' +
|
||||
(Math.sqrt(Math.pow(event.pageX - event.x0, 2) +
|
||||
Math.pow(event.pageY - event.y0, 2) | 0))
|
||||
.toFixed(0) + 'px from ' +
|
||||
'x' + event.x0.toFixed(0) + '=>' + event.pageX.toFixed(0) +
|
||||
', y' + event.y0.toFixed(0) + '=>' + event.pageY.toFixed(0));
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
function dragMoveListener (event) {
|
||||
var target = event.target
|
||||
// keep the dragged position in the data-x/data-y attributes
|
||||
var x = (parseFloat(target.getAttribute('data-x')) || 0) + event.dx
|
||||
var y = (parseFloat(target.getAttribute('data-y')) || 0) + event.dy
|
||||
|
||||
// translate the element
|
||||
target.style.transform = 'translate(' + x + 'px, ' + y + 'px)'
|
||||
|
||||
// update the posiion attributes
|
||||
target.setAttribute('data-x', x)
|
||||
target.setAttribute('data-y', y)
|
||||
}
|
||||
|
||||
// this function is used later in the resizing and gesture demos
|
||||
window.dragMoveListener = dragMoveListener
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
7609
docs/DragDrop/multidrag/js/interact.js
Normal file
47
docs/DragDrop/multidrag/list1.html
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>To Do</title>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
background: #f4f4f4;
|
||||
}
|
||||
.card {
|
||||
background: white;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.list-title {
|
||||
font-weight: bold;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="list-title">To Do</div>
|
||||
<div class="card">Card 1</div>
|
||||
<div class="card">Card 2</div>
|
||||
<div class="card">Card 3</div>
|
||||
<div class="card">Card 4</div>
|
||||
<div class="card">Card 5</div>
|
||||
<div class="card">Card 6</div>
|
||||
<div class="card">Card 7</div>
|
||||
<div class="card">Card 8</div>
|
||||
<div class="card">Card 9</div>
|
||||
<div class="card">Card 10</div>
|
||||
<div class="card">Card 11</div>
|
||||
<div class="card">Card 12</div>
|
||||
<div class="card">Card 13</div>
|
||||
<div class="card">Card 14</div>
|
||||
<div class="card">Card 15</div>
|
||||
<div class="card">Card 16</div>
|
||||
<div class="card">Card 17</div>
|
||||
<div class="card">Card 18</div>
|
||||
<div class="card">Card 19</div>
|
||||
<div class="card">Card 20</div>
|
||||
</body>
|
||||
</html>
|
||||
47
docs/DragDrop/multidrag/list2.html
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>To Do</title>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
background: #f4f4f4;
|
||||
}
|
||||
.card {
|
||||
background: white;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.list-title {
|
||||
font-weight: bold;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="list-title">To Do</div>
|
||||
<div class="card">Card 1</div>
|
||||
<div class="card">Card 2</div>
|
||||
<div class="card">Card 3</div>
|
||||
<div class="card">Card 4</div>
|
||||
<div class="card">Card 5</div>
|
||||
<div class="card">Card 6</div>
|
||||
<div class="card">Card 7</div>
|
||||
<div class="card">Card 8</div>
|
||||
<div class="card">Card 9</div>
|
||||
<div class="card">Card 10</div>
|
||||
<div class="card">Card 11</div>
|
||||
<div class="card">Card 12</div>
|
||||
<div class="card">Card 13</div>
|
||||
<div class="card">Card 14</div>
|
||||
<div class="card">Card 15</div>
|
||||
<div class="card">Card 16</div>
|
||||
<div class="card">Card 17</div>
|
||||
<div class="card">Card 18</div>
|
||||
<div class="card">Card 19</div>
|
||||
<div class="card">Card 20</div>
|
||||
</body>
|
||||
</html>
|
||||
47
docs/DragDrop/multidrag/list3.html
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>To Do</title>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
background: #f4f4f4;
|
||||
}
|
||||
.card {
|
||||
background: white;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.list-title {
|
||||
font-weight: bold;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="list-title">To Do</div>
|
||||
<div class="card">Card 1</div>
|
||||
<div class="card">Card 2</div>
|
||||
<div class="card">Card 3</div>
|
||||
<div class="card">Card 4</div>
|
||||
<div class="card">Card 5</div>
|
||||
<div class="card">Card 6</div>
|
||||
<div class="card">Card 7</div>
|
||||
<div class="card">Card 8</div>
|
||||
<div class="card">Card 9</div>
|
||||
<div class="card">Card 10</div>
|
||||
<div class="card">Card 11</div>
|
||||
<div class="card">Card 12</div>
|
||||
<div class="card">Card 13</div>
|
||||
<div class="card">Card 14</div>
|
||||
<div class="card">Card 15</div>
|
||||
<div class="card">Card 16</div>
|
||||
<div class="card">Card 17</div>
|
||||
<div class="card">Card 18</div>
|
||||
<div class="card">Card 19</div>
|
||||
<div class="card">Card 20</div>
|
||||
</body>
|
||||
</html>
|
||||
47
docs/DragDrop/multidrag/list4.html
Normal file
|
|
@ -0,0 +1,47 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>To Do</title>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
background: #f4f4f4;
|
||||
}
|
||||
.card {
|
||||
background: white;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.list-title {
|
||||
font-weight: bold;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="list-title">To Do</div>
|
||||
<div class="card">Card 1</div>
|
||||
<div class="card">Card 2</div>
|
||||
<div class="card">Card 3</div>
|
||||
<div class="card">Card 4</div>
|
||||
<div class="card">Card 5</div>
|
||||
<div class="card">Card 6</div>
|
||||
<div class="card">Card 7</div>
|
||||
<div class="card">Card 8</div>
|
||||
<div class="card">Card 9</div>
|
||||
<div class="card">Card 10</div>
|
||||
<div class="card">Card 11</div>
|
||||
<div class="card">Card 12</div>
|
||||
<div class="card">Card 13</div>
|
||||
<div class="card">Card 14</div>
|
||||
<div class="card">Card 15</div>
|
||||
<div class="card">Card 16</div>
|
||||
<div class="card">Card 17</div>
|
||||
<div class="card">Card 18</div>
|
||||
<div class="card">Card 19</div>
|
||||
<div class="card">Card 20</div>
|
||||
</body>
|
||||
</html>
|
||||
29
docs/DragDrop/multidrag/lists.html
Normal file
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<title>Kanban Board</title>
|
||||
<style>
|
||||
.kanban-container {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
margin: 0;
|
||||
padding: 10px;
|
||||
}
|
||||
.list-frame {
|
||||
flex: 1;
|
||||
margin: 0 10px;
|
||||
border: 1px solid #ccc;
|
||||
height: 95vh;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="kanban-container">
|
||||
<iframe src="list1.html" class="list-frame" frameborder="0"></iframe>
|
||||
<iframe src="list2.html" class="list-frame" frameborder="0"></iframe>
|
||||
<iframe src="list3.html" class="list-frame" frameborder="0"></iframe>
|
||||
<iframe src="list4.html" class="list-frame" frameborder="0"></iframe>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
BIN
docs/DragDrop/screenshot-drag1.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
docs/DragDrop/screenshot-drag2.png
Normal file
|
After Width: | Height: | Size: 7.1 KiB |
BIN
docs/DragDrop/screenshot-drag3.png
Normal file
|
After Width: | Height: | Size: 5.4 KiB |
BIN
docs/DragDrop/screenshot-drag4.png
Normal file
|
After Width: | Height: | Size: 4.3 KiB |
BIN
docs/Features/Cover/cover-and-attachment.png
Normal file
|
After Width: | Height: | Size: 139 KiB |
BIN
docs/Features/CustomFields/custom-field-1.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
docs/Features/CustomFields/custom-field-2.png
Normal file
|
After Width: | Height: | Size: 17 KiB |
BIN
docs/Features/CustomFields/custom-field-3.png
Normal file
|
After Width: | Height: | Size: 27 KiB |
BIN
docs/Features/CustomFields/custom-field-4.png
Normal file
|
After Width: | Height: | Size: 21 KiB |
BIN
docs/Features/CustomFields/custom-field-5.png
Normal file
|
After Width: | Height: | Size: 20 KiB |
BIN
docs/Features/CustomFields/custom-field-6.png
Normal file
|
After Width: | Height: | Size: 18 KiB |
BIN
docs/Features/IFTTT/how_to_work_with_rules.gif
Normal file
|
After Width: | Height: | Size: 101 KiB |
BIN
docs/Features/IFTTT/ifttt_main_dialog.PNG
Normal file
|
After Width: | Height: | Size: 10 KiB |
BIN
docs/Features/IFTTT/ifttt_new_rule_trigger_board.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
docs/Features/IFTTT/ifttt_new_rule_trigger_card.PNG
Normal file
|
After Width: | Height: | Size: 17 KiB |
BIN
docs/Features/IFTTT/ifttt_new_rule_trigger_checklist.PNG
Normal file
|
After Width: | Height: | Size: 19 KiB |
BIN
docs/Features/IFTTT/main_menu-ifttt.png
Normal file
|
After Width: | Height: | Size: 5 KiB |
1
docs/Features/IFTTT/readme.md
Normal file
|
|
@ -0,0 +1 @@
|
|||
This folder contains pictures and gifs for the ifttt feature
|
||||
BIN
docs/Features/IFTTT/rules.png
Normal file
|
After Width: | Height: | Size: 25 KiB |
BIN
docs/Features/Markdown/markdown.png
Normal file
|
After Width: | Height: | Size: 146 KiB |
BIN
docs/Features/SubTasks/subtask-workaround-part1.png
Normal file
|
After Width: | Height: | Size: 8.2 KiB |
BIN
docs/Features/SubTasks/subtask-workaround-part2.png
Normal file
|
After Width: | Height: | Size: 20 KiB |
BIN
docs/Features/WipLimit/screenshot-wip-limit.png
Normal file
|
After Width: | Height: | Size: 9.5 KiB |
BIN
docs/Features/WipLimit/wekan-wip-limit.png
Normal file
|
After Width: | Height: | Size: 119 KiB |
BIN
docs/Features/allow-private-boards-only.png
Normal file
|
After Width: | Height: | Size: 25 KiB |
BIN
docs/Features/delete-board-part1.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
docs/Features/delete-board-part2.png
Normal file
|
After Width: | Height: | Size: 4.6 KiB |
BIN
docs/Features/multiline/multiline1.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
docs/Features/multiline/multiline2.png
Normal file
|
After Width: | Height: | Size: 53 KiB |
BIN
docs/Features/multiline/multiline3.png
Normal file
|
After Width: | Height: | Size: 49 KiB |
BIN
docs/Features/screenshot-board-menu.png
Normal file
|
After Width: | Height: | Size: 6.2 KiB |
BIN
docs/Features/screenshot-boards.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
docs/Features/screenshot-filter.png
Normal file
|
After Width: | Height: | Size: 35 KiB |
BIN
docs/Features/screenshot-keyboard-shortcuts.png
Normal file
|
After Width: | Height: | Size: 104 KiB |
BIN
docs/Features/screenshot-multi-selection.png
Normal file
|
After Width: | Height: | Size: 206 KiB |
BIN
docs/Features/screenshot-muted-watch.png
Normal file
|
After Width: | Height: | Size: 54 KiB |
BIN
docs/Features/screenshot-public-board.png
Normal file
|
After Width: | Height: | Size: 40 KiB |
BIN
docs/Features/screenshot-restore-board.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
docs/Features/screenshot-star-board.png
Normal file
|
After Width: | Height: | Size: 19 KiB |
BIN
docs/Features/screenshot-v0.9.jpeg
Normal file
|
After Width: | Height: | Size: 140 KiB |
BIN
docs/Features/screenshot.png
Normal file
|
After Width: | Height: | Size: 278 KiB |
26
docs/ImportExport/CSV/board-import.csv
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
Title,Description,Stage,Owner,Members,Labels,Due Date,start date,finish date,created at,updated at
|
||||
Test card 1,Test description 1,Stage 1,testuser1,testuser1 testuser2,Marketing-blue,05/06/2020,03/20/2020,05/03/2020,03/20/2020,05/03/2020
|
||||
Test card 2,Test description 2,Stage 3,testuser1,testuser1 testuser2,Engineering ,05/11/2020,04/15/2020,05/12/2020,04/14/2020,04/14/2020
|
||||
Test card 3,Test description 3,Stage 2,testuser1,testuser1,Marketing,,03/23/2020,04/24/2020,03/21/2020,03/21/2020
|
||||
Test card 4,Test description 4,Stage 4,testuser1,testuser3 bryanmutai,Sales,05/08/2020,03/04/2020,,02/24/2020,02/24/2020
|
||||
Test card 5,Test description 5,Stage 1,testuser1,,Marketing,,03/10/2020,,03/11/2020,03/13/2020
|
||||
Test card 6,Test description 6,Stage 3,testuser1,,Sales,,03/06/2020,04/03/2020,03/02/2020,03/02/2020
|
||||
Test card 7,Test description 7,Stage 4,testuser1,testuser1,Accounting,05/20/2020,04/13/2020,05/06/2020,04/03/2020,05/03/2020
|
||||
Test card 8,Test description 8,Stage 2,testuser1,testuser2 testuser3,Sales,05/09/2020,03/13/2020,05/10/2020,02/23/2020,02/23/2020
|
||||
Test card 9,Test description 9,Stage 4,testuser1,,Sales,,03/17/2020,04/01/2020,03/07/2020,03/07/2020
|
||||
Test card 10,Test description 10,Stage 1,testuser1,testuser3,Engineering-red,05/10/2020,03/14/2020,,03/14/2020,03/14/2020
|
||||
Test card 11,Test description 11,Stage 4,testuser1,,,05/21/2020,03/24/2020,,03/24/2020,03/24/2020
|
||||
Test card 12,Test description 12,Stage 3,testuser1,testuser2,Sales Support,05/17/2020,03/19/2020,05/04/2020,03/19/2020,03/19/2020
|
||||
Test card 13,Test description 13,Stage 1,testuser1,,Sales Support,05/27/2020,03/25/2020,06/04/2020,03/25/2020,03/28/2020
|
||||
Test card 14,Test description 14,Stage 3,testuser1,testuser1 testuser3,,05/22/2020,03/03/2020,,03/03/2020,03/03/2020
|
||||
Test card 15,Test description 15,Stage 4,testuser1,,Marketing,,03/05/2020,,03/05/2020,03/05/2020
|
||||
Test card 16,Test description 16,Stage 3,testuser1,testuser3 testuser2,Engineering Support,05/13/2020,04/08/2020,05/04/2020,03/28/2020,04/28/2020
|
||||
Test card 17,Test description 17,Stage 2,testuser1,testuser1,,05/16/2020,03/18/2020,05/10/2020,03/18/2020,03/18/2020
|
||||
Test card 18,Test description 18,Stage 1,testuser1,,Support,,03/07/2020,04/06/2020,03/07/2020,03/07/2020
|
||||
Test card 19,Test description 19,Stage 3,testuser1,,Marketing,05/25/2020,03/11/2020,,03/10/2020,03/10/2020
|
||||
Test card 20,Test description 20,Stage 1,testuser1,,Sales,,03/21/2020,,03/11/2020,03/11/2020
|
||||
Test card 21,Test description 21,Stage 3,testuser1,testuser3,Engineering,05/12/2020,04/02/2020,,04/02/2020,04/12/2020
|
||||
Test card 22,Test description 22,Stage 2,testuser1,,Sales,05/15/2020,03/09/2020,05/03/2020,03/09/2020,03/09/2020
|
||||
Test card 23,Test description 23,Stage 2,testuser1,testuser2,,,02/04/2020,04/05/2020,02/03/2020,03/03/2020
|
||||
Test card 24,Test description 24,Stage 4,testuser1,testuser1 testuser2 testuser3,Support-yellow,05/14/2020,01/03/2020,04/04/2020,01/03/2020,01/03/2020
|
||||
Test card 25,Test description 25,Stage 2,testuser1,testuser1 testuser2 testuser3,Support-yellow,05/18/2020,03/16/2020,05/19/2020,03/11/2020,04/11/2020
|
||||
|
26
docs/ImportExport/CSV/board-import.tsv
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
Title Description Stage Owner Members Labels Due Date start date finish date created at updated at
|
||||
Test card 1 Test description 1 Stage 1 testuser1 testuser1 testuser2 Marketing-blue 05/06/2020 03/20/2020 05/03/2020 03/20/2020 05/03/2020
|
||||
Test card 2 Test description 2 Stage 3 testuser1 testuser1 testuser2 Engineering 05/11/2020 04/15/2020 05/12/2020 04/14/2020 04/14/2020
|
||||
Test card 3 Test description 3 Stage 2 testuser1 testuser1 Marketing 03/23/2020 04/24/2020 03/21/2020 03/21/2020
|
||||
Test card 4 Test description 4 Stage 4 testuser1 testuser3 bryanmutai Sales 05/08/2020 03/04/2020 02/24/2020 02/24/2020
|
||||
Test card 5 Test description 5 Stage 1 testuser1 Marketing 03/10/2020 03/11/2020 03/13/2020
|
||||
Test card 6 Test description 6 Stage 3 testuser1 Sales 03/06/2020 04/03/2020 03/02/2020 03/02/2020
|
||||
Test card 7 Test description 7 Stage 4 testuser1 testuser1 Accounting 05/20/2020 04/13/2020 05/06/2020 04/03/2020 05/03/2020
|
||||
Test card 8 Test description 8 Stage 2 testuser1 testuser2 testuser3 Sales 05/09/2020 03/13/2020 05/10/2020 02/23/2020 02/23/2020
|
||||
Test card 9 Test description 9 Stage 4 testuser1 Sales 03/17/2020 04/01/2020 03/07/2020 03/07/2020
|
||||
Test card 10 Test description 10 Stage 1 testuser1 testuser3 Engineering-red 05/10/2020 03/14/2020 03/14/2020 03/14/2020
|
||||
Test card 11 Test description 11 Stage 4 testuser1 05/21/2020 03/24/2020 03/24/2020 03/24/2020
|
||||
Test card 12 Test description 12 Stage 3 testuser1 testuser2 Sales Support 05/17/2020 03/19/2020 05/04/2020 03/19/2020 03/19/2020
|
||||
Test card 13 Test description 13 Stage 1 testuser1 Sales Support 05/27/2020 03/25/2020 06/04/2020 03/25/2020 03/28/2020
|
||||
Test card 14 Test description 14 Stage 3 testuser1 testuser1 testuser3 05/22/2020 03/03/2020 03/03/2020 03/03/2020
|
||||
Test card 15 Test description 15 Stage 4 testuser1 Marketing 03/05/2020 03/05/2020 03/05/2020
|
||||
Test card 16 Test description 16 Stage 3 testuser1 testuser3 testuser2 Engineering Support 05/13/2020 04/08/2020 05/04/2020 03/28/2020 04/28/2020
|
||||
Test card 17 Test description 17 Stage 2 testuser1 testuser1 05/16/2020 03/18/2020 05/10/2020 03/18/2020 03/18/2020
|
||||
Test card 18 Test description 18 Stage 1 testuser1 Support 03/07/2020 04/06/2020 03/07/2020 03/07/2020
|
||||
Test card 19 Test description 19 Stage 3 testuser1 Marketing 05/25/2020 03/11/2020 03/10/2020 03/10/2020
|
||||
Test card 20 Test description 20 Stage 1 testuser1 Sales 03/21/2020 03/11/2020 03/11/2020
|
||||
Test card 21 Test description 21 Stage 3 testuser1 testuser3 Engineering 05/12/2020 04/02/2020 04/02/2020 04/12/2020
|
||||
Test card 22 Test description 22 Stage 2 testuser1 Sales 05/15/2020 03/09/2020 05/03/2020 03/09/2020 03/09/2020
|
||||
Test card 23 Test description 23 Stage 2 testuser1 testuser2 02/04/2020 04/05/2020 02/03/2020 03/03/2020
|
||||
Test card 24 Test description 24 Stage 4 testuser1 testuser1 testuser2 testuser3 Support-yellow 05/14/2020 01/03/2020 04/04/2020 01/03/2020 01/03/2020
|
||||
Test card 25 Test description 25 Stage 2 testuser1 testuser1 testuser2 testuser3 Support-yellow 05/18/2020 03/16/2020 05/19/2020 03/11/2020 04/11/2020
|
||||
|
BIN
docs/ImportExport/trellinator/WekanPriorities.png
Normal file
|
After Width: | Height: | Size: 114 KiB |
21
docs/ImportExport/trellinator/readme.txt
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
At this article:
|
||||
|
||||
https://news.ycombinator.com/item?id=36047861
|
||||
|
||||
This comment:
|
||||
|
||||
https://news.ycombinator.com/item?id=36053916
|
||||
|
||||
Quote:
|
||||
|
||||
> dools 6 hours ago
|
||||
> I can no longer edit, but it's worth noting that I went through my Trellinator libs and updated for use with WeKan, throwing exceptions where functionality doesn't yet exist:
|
||||
> https://github.com/iaindooley/trellinator-libs
|
||||
> https://github.com/iaindooley/trellinator
|
||||
> I made a list of things that would need to be implemented in WeKan and/or the WeKan API to make it on-par with Trello (screenshot here of my checklist in Trello for this :)
|
||||
> https://wekan.github.io/trellinator/WekanPriorities.png
|
||||
|
||||
Forks:
|
||||
|
||||
- https://github.com/wekan/trellinator
|
||||
- https://github.com/wekan/trellinator-libs
|
||||
86
docs/ImportExport/trello2wekan/index.html
Normal file
|
|
@ -0,0 +1,86 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>JSON Viewer</title>
|
||||
<style>
|
||||
#jsonInput {
|
||||
width: 45%;
|
||||
height: 300px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#jsonOutput {
|
||||
width: 45%;
|
||||
height: 300px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
#updateButton {
|
||||
display: block;
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
<script defer src="pretty-json-custom-element.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>JSON Viewer</h1>
|
||||
<p><a href="https://github.com/wekan/wekan/issues/4877#issuecomment-2105688702">Source</a></p>
|
||||
|
||||
<textarea id="jsonInput" placeholder="Enter Trello-JSON here: (Ctrl+V) In Trello go to ... menu and select 'Print, Export and Share' Select 'Export as JSON' Copy the whole text (Ctrl+A, Ctrl+C)"></textarea><br>
|
||||
<button id="updateButton">Convert from Trello to Wekan</button><br>
|
||||
<textarea id="jsonOutput" placeholder="Copy JSON for Wekan from here: (Ctrl+A, Ctrl+C) In Wekan go to 'all Boards', 'Add Board', 'Import', 'From Trello'" readonly></textarea>
|
||||
|
||||
|
||||
<script>
|
||||
document.getElementById("updateButton").addEventListener("click", function() {
|
||||
try {
|
||||
var jsonInput = document.getElementById("jsonInput").value;
|
||||
|
||||
// replace colors with replaceAll
|
||||
jsonInput = jsonInput.replaceAll("green_dark", "green");
|
||||
jsonInput = jsonInput.replaceAll("red_dark", "red");
|
||||
|
||||
// alter the json file structure
|
||||
var parsedJson = JSON.parse(jsonInput);
|
||||
|
||||
// Iterate through the actions array
|
||||
parsedJson.actions.forEach(function(action) {
|
||||
// Check if the type is "addAttachmentToCard"
|
||||
if (action.type === "addAttachmentToCard") {
|
||||
// Store the value of data.attachment
|
||||
action.data.text = "**" + action.memberCreator.fullName + "**";
|
||||
action.data.text += "\nAdded: " + action.data.attachment.name + " " + action.data.attachment.url;
|
||||
action.data.textData = {};
|
||||
action.data.textData.emoji = {};
|
||||
delete action.data.attachment;
|
||||
action.type = "commentCard";
|
||||
} else if (action.type === "deleteAttachmentFromCard") {
|
||||
// Store the value of data.attachment
|
||||
action.data.text = "**" + action.memberCreator.fullName + "**";
|
||||
action.data.text += "\nRemoved: " + action.data.attachment.name;
|
||||
action.data.textData = {};
|
||||
action.data.textData.emoji = {};
|
||||
delete action.data.attachment;
|
||||
action.type = "commentCard";
|
||||
} else if (action.type === "commentCard") {
|
||||
action.data.text = "**" + action.memberCreator.fullName + "**\n" + action.data.text;
|
||||
}
|
||||
});
|
||||
|
||||
// Iterate through the actions array
|
||||
parsedJson.cards.forEach(function(card) {
|
||||
for (var i=0; i<card.badges.attachments; i++) {
|
||||
card.desc += "\nAttachment: " + card.attachments[i].name + " " + card.attachments[i].url;
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
var formattedJson = JSON.stringify(parsedJson, null, 4);
|
||||
document.getElementById("jsonOutput").value = formattedJson;
|
||||
} catch (error) {
|
||||
document.getElementById("jsonOutput").value = "Invalid JSON format!";
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
451
docs/ImportExport/trello2wekan/pretty-json-custom-element.js
Normal file
|
|
@ -0,0 +1,451 @@
|
|||
// @ts-check
|
||||
/**
|
||||
* @typedef {string | number | null | undefined | bigint | boolean | symbol} Primitive
|
||||
* @typedef {(...args: any[]) => any} AnyFunction
|
||||
*/
|
||||
|
||||
class PrettyJSONError extends Error {
|
||||
/**
|
||||
*
|
||||
* @param {string} message
|
||||
*/
|
||||
constructor(message) {
|
||||
super(message);
|
||||
this.name = "PrettyJSONError";
|
||||
}
|
||||
}
|
||||
|
||||
class PrettyJSON extends HTMLElement {
|
||||
/**
|
||||
* @type {any}
|
||||
*/
|
||||
#input;
|
||||
|
||||
/**
|
||||
* @type {boolean}
|
||||
*/
|
||||
#isExpanded;
|
||||
|
||||
static get observedAttributes() {
|
||||
return ["expand", "key", "truncate-string"];
|
||||
}
|
||||
|
||||
static styles = `/* css */
|
||||
:host {
|
||||
--key-color: #cc0000;
|
||||
--arrow-color: #737373;
|
||||
--brace-color: #0030f0;
|
||||
--bracket-color: #0030f0;
|
||||
--string-color: #009900;
|
||||
--number-color: #0000ff;
|
||||
--null-color: #666666;
|
||||
--boolean-color: #d23c91;
|
||||
--comma-color: #666666;
|
||||
--ellipsis-color: #666666;
|
||||
|
||||
--indent: 2rem;
|
||||
}
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:host {
|
||||
--key-color: #f73d3d;
|
||||
--arrow-color: #6c6c6c;
|
||||
--brace-color: #0690bc;
|
||||
--bracket-color: #0690bc;
|
||||
--string-color: #21c521;
|
||||
--number-color: #0078b3;
|
||||
--null-color: #8c8888;
|
||||
--boolean-color: #c737b3;
|
||||
--comma-color: #848181;
|
||||
--ellipsis-color: #c2c2c2;
|
||||
}
|
||||
}
|
||||
button {
|
||||
border: none;
|
||||
background: transparent;
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
font-size: 1rem;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
.container {
|
||||
font-family: monospace;
|
||||
font-size: 1rem;
|
||||
}
|
||||
.key {
|
||||
color: var(--key-color);
|
||||
margin-right: 0.5rem;
|
||||
padding: 0;
|
||||
}
|
||||
.key .arrow {
|
||||
width: 1rem;
|
||||
height: 0.75rem;
|
||||
margin-left: -1.25rem;
|
||||
padding-right: 0.25rem;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
.arrow .triangle {
|
||||
fill: var(--arrow-color);
|
||||
}
|
||||
.comma {
|
||||
color: var(--comma-color);
|
||||
}
|
||||
.brace {
|
||||
color: var(--brace-color);
|
||||
}
|
||||
.string,
|
||||
.url {
|
||||
color: var(--string-color);
|
||||
}
|
||||
.number,
|
||||
.bigint {
|
||||
color: var(--number-color);
|
||||
}
|
||||
.null {
|
||||
color: var(--null-color);
|
||||
}
|
||||
.boolean {
|
||||
color: var(--boolean-color);
|
||||
}
|
||||
|
||||
.ellipsis {
|
||||
width: 1rem;
|
||||
padding: 0;
|
||||
color: var(--ellipsis-color);
|
||||
}
|
||||
.ellipsis::after {
|
||||
content: "…";
|
||||
}
|
||||
.string .ellipsis::after {
|
||||
color: var(--string-color);
|
||||
}
|
||||
.triangle {
|
||||
fill: black;
|
||||
stroke: black;
|
||||
stroke-width: 0;
|
||||
}
|
||||
.row {
|
||||
padding-left: var(--indent);
|
||||
}
|
||||
.row .row {
|
||||
display: block;
|
||||
}
|
||||
.row > div,
|
||||
.row > span {
|
||||
display: inline-block;
|
||||
}
|
||||
`;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
this.#isExpanded = true;
|
||||
this.attachShadow({ mode: "open" });
|
||||
}
|
||||
|
||||
get #expandAttributeValue() {
|
||||
const expandAttribute = this.getAttribute("expand");
|
||||
if (expandAttribute === null) {
|
||||
return 1;
|
||||
}
|
||||
const expandValue = Number.parseInt(expandAttribute);
|
||||
return isNaN(expandValue) || expandValue < 0 ? 0 : expandValue;
|
||||
}
|
||||
|
||||
get #truncateStringAttributeValue() {
|
||||
const DEFAULT_TRUNCATE_STRING = 500;
|
||||
const truncateStringAttribute = this.getAttribute("truncate-string");
|
||||
if (truncateStringAttribute === null) {
|
||||
return DEFAULT_TRUNCATE_STRING;
|
||||
}
|
||||
const truncateStringValue = Number.parseInt(truncateStringAttribute);
|
||||
return isNaN(truncateStringValue) || truncateStringValue < 0
|
||||
? 0
|
||||
: truncateStringValue;
|
||||
}
|
||||
|
||||
#toggle() {
|
||||
this.#isExpanded = !this.#isExpanded;
|
||||
this.setAttribute(
|
||||
"expand",
|
||||
this.#isExpanded ? String(this.#expandAttributeValue + 1) : "0"
|
||||
);
|
||||
this.#render();
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {Record<any, any> | any[] | Primitive | AnyFunction} input
|
||||
* @param {number} expand
|
||||
* @param {string} [key]
|
||||
* @returns {HTMLElement}
|
||||
*/
|
||||
#createChild(input, expand, key) {
|
||||
if (this.#isPrimitiveValue(input)) {
|
||||
const container = this.#createContainer();
|
||||
container.appendChild(this.#createPrimitiveValueElement(input));
|
||||
return container;
|
||||
}
|
||||
return this.#createObjectOrArray(input);
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {any} input
|
||||
* @returns {input is Primitive}
|
||||
*/
|
||||
#isPrimitiveValue(input) {
|
||||
return typeof input !== "object" || input === null;
|
||||
}
|
||||
|
||||
#isValidStringURL() {
|
||||
try {
|
||||
new URL(this.#input);
|
||||
return true;
|
||||
} catch (error) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {Primitive} input
|
||||
* @returns {HTMLElement}
|
||||
*/
|
||||
#createPrimitiveValueElement(input) {
|
||||
const container = document.createElement("div");
|
||||
const type = typeof input === "object" ? "null" : typeof input;
|
||||
container.className = `primitive value ${type}`;
|
||||
if (typeof input === "string") {
|
||||
if (this.#isValidStringURL()) {
|
||||
const anchor = document.createElement("a");
|
||||
anchor.className = "url";
|
||||
anchor.href = this.#input;
|
||||
anchor.target = "_blank";
|
||||
anchor.textContent = input;
|
||||
container.append('"', anchor, '"');
|
||||
} else if (input.length > this.#truncateStringAttributeValue) {
|
||||
container.appendChild(this.#createTruncatedStringElement(input));
|
||||
} else {
|
||||
container.textContent = JSON.stringify(input);
|
||||
}
|
||||
} else {
|
||||
container.textContent = JSON.stringify(input);
|
||||
}
|
||||
return container;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {string} input
|
||||
*/
|
||||
#createTruncatedStringElement(input) {
|
||||
const container = document.createElement("div");
|
||||
container.dataset.expandedTimes = "1";
|
||||
container.className = "truncated string";
|
||||
const ellipsis = document.createElement("button");
|
||||
ellipsis.className = "ellipsis";
|
||||
|
||||
ellipsis.addEventListener("click", () => {
|
||||
const expandedTimes = Number.parseInt(
|
||||
container.dataset.expandedTimes ?? "1"
|
||||
);
|
||||
container.dataset.expandedTimes = String(expandedTimes + 1);
|
||||
const expandedString = input.slice(
|
||||
0,
|
||||
(expandedTimes + 1) * this.#truncateStringAttributeValue
|
||||
);
|
||||
const textChild = container.childNodes[1];
|
||||
container.replaceChild(
|
||||
document.createTextNode(expandedString),
|
||||
textChild
|
||||
);
|
||||
});
|
||||
|
||||
container.append(
|
||||
'"',
|
||||
input.slice(0, this.#truncateStringAttributeValue),
|
||||
ellipsis,
|
||||
'"'
|
||||
);
|
||||
return container;
|
||||
}
|
||||
|
||||
/**
|
||||
* @returns {HTMLElement}
|
||||
*/
|
||||
#createContainer() {
|
||||
const container = document.createElement("div");
|
||||
container.className = "container";
|
||||
return container;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {Record<any, any> | any[]} object
|
||||
* @returns {HTMLElement}
|
||||
*/
|
||||
#createObjectOrArray(object) {
|
||||
const isArray = Array.isArray(object);
|
||||
const objectKeyName = this.getAttribute("key");
|
||||
const expand = this.#expandAttributeValue;
|
||||
|
||||
const container = this.#createContainer();
|
||||
container.classList.add(isArray ? "array" : "object");
|
||||
|
||||
if (objectKeyName) {
|
||||
// if objectKeyName is provided, then it is a row
|
||||
container.classList.add("row");
|
||||
const keyElement = this.#createKeyElement(objectKeyName, {
|
||||
withArrow: true,
|
||||
expanded: this.#isExpanded,
|
||||
});
|
||||
keyElement.addEventListener("click", this.#toggle.bind(this));
|
||||
container.appendChild(keyElement);
|
||||
}
|
||||
|
||||
const openingBrace = document.createElement("span");
|
||||
openingBrace.className = "open brace";
|
||||
openingBrace.textContent = isArray ? "[" : "{";
|
||||
container.appendChild(openingBrace);
|
||||
|
||||
const closingBrace = document.createElement("span");
|
||||
closingBrace.className = "close brace";
|
||||
closingBrace.textContent = isArray ? "]" : "}";
|
||||
|
||||
if (!this.#isExpanded) {
|
||||
const ellipsis = document.createElement("button");
|
||||
ellipsis.className = "ellipsis";
|
||||
container.appendChild(ellipsis);
|
||||
ellipsis.addEventListener("click", this.#toggle.bind(this));
|
||||
container.appendChild(closingBrace);
|
||||
return container;
|
||||
}
|
||||
|
||||
Object.entries(object).forEach(([key, value], index) => {
|
||||
// for primitives we make a row here
|
||||
if (this.#isPrimitiveValue(value)) {
|
||||
const rowContainer = document.createElement("div");
|
||||
rowContainer.className = "row";
|
||||
if (!isArray) {
|
||||
const keyElement = this.#createKeyElement(key);
|
||||
rowContainer.appendChild(keyElement);
|
||||
}
|
||||
rowContainer.appendChild(this.#createPrimitiveValueElement(value));
|
||||
container.appendChild(rowContainer);
|
||||
const isLast = index === Object.keys(object).length - 1;
|
||||
if (!isLast) {
|
||||
const comma = document.createElement("span");
|
||||
comma.className = "comma";
|
||||
comma.textContent = ",";
|
||||
rowContainer.appendChild(comma);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
// for objects and arrays we make a "container row"
|
||||
const prettyJsonElement = document.createElement("pretty-json");
|
||||
prettyJsonElement.textContent = JSON.stringify(value);
|
||||
prettyJsonElement.setAttribute("expand", String(expand - 1));
|
||||
prettyJsonElement.setAttribute("key", key);
|
||||
container.appendChild(prettyJsonElement);
|
||||
});
|
||||
|
||||
container.appendChild(closingBrace);
|
||||
return container;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {{ expanded?: boolean }} [options]
|
||||
* @returns {SVGElement}
|
||||
*/
|
||||
#createArrowElement({ expanded = false } = {}) {
|
||||
const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
||||
svg.setAttribute("width", "100");
|
||||
svg.setAttribute("height", "100");
|
||||
svg.setAttribute("viewBox", "0 0 100 100");
|
||||
svg.setAttribute("class", "arrow");
|
||||
const polygon = document.createElementNS(
|
||||
"http://www.w3.org/2000/svg",
|
||||
"polygon"
|
||||
);
|
||||
|
||||
polygon.setAttribute("class", "triangle");
|
||||
polygon.setAttribute("points", "0,0 100,50 0,100");
|
||||
|
||||
if (expanded) {
|
||||
polygon.setAttribute("transform", "rotate(90 50 50)");
|
||||
}
|
||||
|
||||
svg.appendChild(polygon);
|
||||
|
||||
return svg;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {string} key
|
||||
* @param {{ withArrow?: boolean, expanded?: boolean }} [options]
|
||||
* @returns {HTMLElement}
|
||||
*/
|
||||
#createKeyElement(key, { withArrow = false, expanded = false } = {}) {
|
||||
const keyElement = document.createElement(withArrow ? "button" : "span");
|
||||
keyElement.className = "key";
|
||||
if (withArrow) {
|
||||
const arrow = this.#createArrowElement({ expanded });
|
||||
keyElement.appendChild(arrow);
|
||||
}
|
||||
const keyName = document.createElement("span");
|
||||
keyName.className = "key-name";
|
||||
keyName.textContent = JSON.stringify(key);
|
||||
keyElement.appendChild(keyName);
|
||||
const colon = document.createElement("span");
|
||||
colon.className = "colon";
|
||||
colon.textContent = ":";
|
||||
keyElement.appendChild(colon);
|
||||
return keyElement;
|
||||
}
|
||||
|
||||
#render() {
|
||||
if (!this.shadowRoot) {
|
||||
throw new PrettyJSONError("Shadow root not available");
|
||||
}
|
||||
this.shadowRoot.innerHTML = "";
|
||||
this.shadowRoot.appendChild(
|
||||
this.#createChild(this.#input, this.#expandAttributeValue)
|
||||
);
|
||||
|
||||
if (this.shadowRoot.querySelector("[data-pretty-json]")) {
|
||||
return;
|
||||
}
|
||||
|
||||
const styles = document.createElement("style");
|
||||
styles.setAttribute("data-pretty-json", "");
|
||||
styles.textContent = PrettyJSON.styles;
|
||||
this.shadowRoot.appendChild(styles);
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle when attributes change
|
||||
* @param {string} name
|
||||
* @param {string} _oldValue
|
||||
* @param {string | null} newValue
|
||||
*/
|
||||
attributeChangedCallback(name, _oldValue, newValue) {
|
||||
if (name === "expand") {
|
||||
if (newValue === null) {
|
||||
this.#isExpanded = false;
|
||||
} else {
|
||||
const expandValue = Number.parseInt(newValue);
|
||||
this.#isExpanded = !isNaN(expandValue) && expandValue > 0;
|
||||
}
|
||||
this.#render();
|
||||
}
|
||||
}
|
||||
|
||||
connectedCallback() {
|
||||
try {
|
||||
this.#input = JSON.parse(this.textContent ?? "");
|
||||
} catch (jsonParseError) {
|
||||
const message = `Error parsing JSON: ${jsonParseError instanceof Error ? jsonParseError.message : "Unknown error"}`;
|
||||
throw new PrettyJSONError(message);
|
||||
}
|
||||
this.#render();
|
||||
}
|
||||
}
|
||||
|
||||
// Define pretty-json custom element
|
||||
customElements.define("pretty-json", PrettyJSON);
|
||||
BIN
docs/ImportExport/wekan-import-board.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
BIN
docs/Login/Azure/azure-app-client-secret.png
Normal file
|
After Width: | Height: | Size: 80 KiB |
BIN
docs/Login/Azure/azure-redirect.png
Normal file
|
After Width: | Height: | Size: 69 KiB |
BIN
docs/Login/Keycloak/realm-export.zip
Normal file
BIN
docs/Login/oauth-rocketchat-options.png
Normal file
|
After Width: | Height: | Size: 68 KiB |
BIN
docs/Login/oauth2-login.png
Normal file
|
After Width: | Height: | Size: 35 KiB |
BIN
docs/Login/oauth2-profile-settings.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
docs/Login/screenshot-admin-panel-email.png
Normal file
|
After Width: | Height: | Size: 31 KiB |
BIN
docs/Login/screenshot-admin-panel-registration.png
Normal file
|
After Width: | Height: | Size: 20 KiB |
BIN
docs/Login/screenshot-member-comment-only.png
Normal file
|
After Width: | Height: | Size: 14 KiB |
BIN
docs/Login/screenshot-member-filter.png
Normal file
|
After Width: | Height: | Size: 11 KiB |
BIN
docs/Login/screenshot-member-settings-archive.png
Normal file
|
After Width: | Height: | Size: 7.5 KiB |
BIN
docs/Login/screenshot-member-settings-edit-notification.png
Normal file
|
After Width: | Height: | Size: 7 KiB |
BIN
docs/Login/screenshot-member-settings-hide-system-messages.png
Normal file
|
After Width: | Height: | Size: 5.2 KiB |
BIN
docs/Login/screenshot-member-settings.png
Normal file
|
After Width: | Height: | Size: 5.9 KiB |
BIN
docs/Login/wekan-admin-panel.png
Normal file
|
After Width: | Height: | Size: 55 KiB |
BIN
docs/Platforms/FOSS/Docker/docker-ram-usage.png
Normal file
|
After Width: | Height: | Size: 11 KiB |
BIN
docs/Platforms/FOSS/Docker/wekan-linux64bit-docker-in-win10.png
Normal file
|
After Width: | Height: | Size: 117 KiB |
BIN
docs/Platforms/FOSS/Friend/Friend-Blender.jpg
Normal file
|
After Width: | Height: | Size: 223 KiB |
BIN
docs/Platforms/FOSS/Friend/Friend-Visual-Programming.png
Normal file
|
After Width: | Height: | Size: 591 KiB |