Kanban application using the cryptpad framework
This commit is contained in:
Ludovic Dubost
parent
4b83f2991a
commit
035a56fdab
@ -886,12 +886,5 @@ define([
|
|||||||
];
|
];
|
||||||
};
|
};
|
||||||
|
|
||||||
Pages['/kanban/'] = Pages['/kanban/index.html'] = function () {
|
|
||||||
return [
|
|
||||||
appToolbar(),
|
|
||||||
h('div#cp-app-kanban-content', [])
|
|
||||||
];
|
|
||||||
};
|
|
||||||
|
|
||||||
return Pages;
|
return Pages;
|
||||||
});
|
});
|
||||||
|
|||||||
@ -41,4 +41,5 @@ body.cp-app-profile { @import "../../../profile/app-profile.less"; }
|
|||||||
body.cp-app-settings { @import "../../../settings/app-settings.less"; }
|
body.cp-app-settings { @import "../../../settings/app-settings.less"; }
|
||||||
body.cp-app-debug { @import "../../../debug/app-debug.less"; }
|
body.cp-app-debug { @import "../../../debug/app-debug.less"; }
|
||||||
body.cp-app-worker { @import "../../../worker/app-worker.less"; }
|
body.cp-app-worker { @import "../../../worker/app-worker.less"; }
|
||||||
|
body.cp-app-miniapp { @import "../../../miniapp/app-miniapp.less"; }
|
||||||
|
|
||||||
|
|||||||
@ -1,671 +1,39 @@
|
|||||||
@import (once) "../../customize/src/less2/include/browser.less";
|
@import (once) "../../customize/src/less2/include/browser.less";
|
||||||
@import (once) "../../customize/src/less2/include/toolbar.less";
|
@import (once) "../../customize/src/less2/include/framework.less";
|
||||||
@import (once) "../../customize/src/less2/include/markdown.less";
|
|
||||||
@import (once) '../../customize/src/less2/include/fileupload.less';
|
|
||||||
@import (once) '../../customize/src/less2/include/alertify.less';
|
|
||||||
@import (once) '../../customize/src/less2/include/tokenfield.less';
|
|
||||||
@import (once) '../../customize/src/less2/include/tools.less';
|
|
||||||
@import (once) '../../customize/src/less2/include/avatar.less';
|
|
||||||
@import (once) '../../customize/src/less2/include/creation.less';
|
|
||||||
|
|
||||||
.toolbar_main(
|
.framework_main( @bg-color: @colortheme_code-bg,
|
||||||
@bg-color: @colortheme_kanban-bg,
|
@warn-color: @colortheme_code-warn,
|
||||||
@warn-color: @colortheme_kanban-warn,
|
@color: @colortheme_code-color);
|
||||||
@color: @colortheme_kanban-color
|
|
||||||
);
|
|
||||||
.fileupload_main();
|
|
||||||
.alertify_main();
|
|
||||||
.tokenfield_main();
|
|
||||||
.creation_main();
|
|
||||||
|
|
||||||
@kanban-fore: #555;
|
|
||||||
|
|
||||||
@kanban-th-bg: @colortheme_kanban-th-bg;
|
|
||||||
@kanban-th-fg: @colortheme_kanban-th-fg;
|
|
||||||
@kanban-th-user-bg: darken(@kanban-th-bg, 10%);
|
|
||||||
@kanban-editing: lighten(@kanban-th-bg, 10%);
|
|
||||||
@kanban-winner: darken(@kanban-th-bg, 15%);
|
|
||||||
@kanban-td-bg: @kanban-th-bg;
|
|
||||||
@kanban-td-fg: @kanban-th-fg;
|
|
||||||
|
|
||||||
@kanban-help-bg: @colortheme_kanban-help-bg;
|
|
||||||
|
|
||||||
@kanban-uncommitted-cell: #eee;
|
|
||||||
@kanban-uncommitted-bg: #ddd; //lighten(@kanban-th-bg, 50%);
|
|
||||||
@kanban-uncommitted-text: black;
|
|
||||||
|
|
||||||
@kanban-placeholder: #fff;
|
|
||||||
@kanban-border-color: #555;
|
|
||||||
@kanban-cover-color: #000;
|
|
||||||
@kanban-fg: #000;
|
|
||||||
@kanban-option-yellow: #ff5;
|
|
||||||
@kanban-option-gray: #ccc;
|
|
||||||
|
|
||||||
@kanban-add-color: #fff;
|
|
||||||
@kanban-add-bg: #777;
|
|
||||||
@kanban-add-bg-alt: #444;
|
|
||||||
|
|
||||||
.bottom-left(@s: 5px) { border-bottom-left-radius: @s; }
|
|
||||||
.top-left(@s: 5px) { border-top-left-radius: @s; }
|
|
||||||
|
|
||||||
|
// body
|
||||||
|
&.cp-app-kanban {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-flow: column;
|
flex-flow: column;
|
||||||
overflow-x: hidden;
|
|
||||||
|
|
||||||
#cp-app-kanban-content {
|
|
||||||
display: flex;
|
|
||||||
flex: 1;
|
|
||||||
min-height: 0;
|
|
||||||
#cp-app-kanban-form {
|
|
||||||
flex: 1;
|
|
||||||
overflow-y: auto;
|
|
||||||
&.cp-app-kanban-readonly {
|
|
||||||
#cp-app-kanban-table-scroll {
|
|
||||||
max-width: ~"calc(75% - 30px - 100px)";
|
|
||||||
}
|
|
||||||
table {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
table tr td:last-child {
|
|
||||||
margin-left: 0; // uncommitted is hidden
|
|
||||||
}
|
|
||||||
td.cp-app-kanban-table-uncommitted {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.cp-app-kanban-published {
|
|
||||||
#cp-app-kanban-create-option {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-remove[data-rt-id^="y"], .cp-app-kanban-table-edit[data-rt-id^="y"] {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
tr.cp-app-kanban-table-uncommitted {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="text"], textarea {
|
|
||||||
background-color: white;
|
|
||||||
color: black;
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="text"][disabled], textarea[disabled] {
|
|
||||||
background-color: transparent;
|
|
||||||
border: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
// The placeholder color only seems to effect Safari when not set
|
|
||||||
|
|
||||||
input[type="text"][disabled]::placeholder {
|
|
||||||
color: @kanban-placeholder;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
table#cp-app-kanban-table {
|
|
||||||
margin: 0px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
#cp-app-kanban-table-container {
|
|
||||||
position: relative;
|
|
||||||
margin: 20px;
|
|
||||||
}
|
|
||||||
#cp-app-kanban-table-container button {
|
|
||||||
border-radius: 0;
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
#cp-app-kanban-create-user {
|
|
||||||
display: inline-flex;
|
|
||||||
height: 20px;
|
|
||||||
padding: 0 5px;
|
|
||||||
margin: 2px auto;
|
|
||||||
width: auto;
|
|
||||||
overflow: hidden;
|
|
||||||
color: @kanban-add-color;
|
|
||||||
background: @kanban-add-bg;
|
|
||||||
&:hover {
|
|
||||||
background: @kanban-add-bg-alt;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cp-app-kanban-create-option {
|
|
||||||
order: 3;
|
|
||||||
display: inline-flex;
|
|
||||||
width: 46px;
|
|
||||||
height: 20px;
|
|
||||||
margin: 2px;
|
|
||||||
padding: 0;
|
|
||||||
color: @kanban-add-color;
|
|
||||||
background: @kanban-add-bg;
|
|
||||||
&:hover {
|
|
||||||
background: @kanban-add-bg-alt;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cp-app-kanban-table-scroll {
|
|
||||||
overflow-y: hidden;
|
|
||||||
overflow-x: auto;
|
|
||||||
margin-left: 25%;
|
|
||||||
max-width: ~"calc(75% - 100px - 100px)";
|
|
||||||
width: auto;
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
.cp-markdown-toolbar {
|
|
||||||
margin: auto;
|
|
||||||
min-width: 80%;
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
#cp-app-kanban-description {
|
|
||||||
&~ .CodeMirror {
|
|
||||||
margin: auto;
|
|
||||||
min-width: 80%;
|
|
||||||
width: 80%;
|
|
||||||
min-height: 200px;
|
|
||||||
height: 200px;
|
|
||||||
border: 1px solid black;
|
|
||||||
.CodeMirror-placeholder {
|
|
||||||
color: #777;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cp-app-kanban-description-published {
|
|
||||||
display: none;
|
|
||||||
padding: 15px;
|
|
||||||
margin: auto;
|
|
||||||
|
|
||||||
min-width: 80%;
|
|
||||||
width: 80%;
|
|
||||||
min-height: 7em;
|
|
||||||
color: #000;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
background-color: #eeeeee;
|
|
||||||
font: @colortheme_app-font;
|
|
||||||
text-align: left;
|
|
||||||
media-tag > * {
|
|
||||||
max-width: 100%;
|
|
||||||
max-height: 20em;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
div.cp-app-kanban-published {
|
|
||||||
div.cp-app-kanban-realtime {
|
|
||||||
#cp-app-kanban-description {
|
|
||||||
display: none;
|
|
||||||
&~ .CodeMirror {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cp-app-kanban-description-published {
|
|
||||||
display: block;
|
|
||||||
&:empty {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cp-app-kanban-nocomments {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
#cp-app-kanban-comments {
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#cp-app-kanban-help {
|
|
||||||
width: 100%;
|
|
||||||
margin: auto;
|
|
||||||
padding: 20px 10%;
|
|
||||||
background: @kanban-help-bg;
|
|
||||||
}
|
|
||||||
|
|
||||||
// from cryptpad.less
|
|
||||||
|
|
||||||
table {
|
|
||||||
border-collapse: collapse;
|
|
||||||
border-spacing: 0;
|
|
||||||
margin: 20px;
|
|
||||||
}
|
|
||||||
tbody {
|
|
||||||
* {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
tr {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
td {
|
|
||||||
.tools_unselectable();
|
|
||||||
border-right: 1px solid @kanban-border-color;
|
|
||||||
padding: 12px;
|
|
||||||
padding-top: 0px;
|
|
||||||
padding-bottom: 0px;
|
|
||||||
&:last-child {
|
|
||||||
border-right: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
div.cp-app-kanban-realtime {
|
|
||||||
display: block;
|
|
||||||
max-height: 100%;
|
max-height: 100%;
|
||||||
max-width: 100%;
|
min-height: auto;
|
||||||
|
|
||||||
input {
|
#cp-app-kanban-container {
|
||||||
&[type="text"] {
|
|
||||||
height: 1em;
|
|
||||||
margin: 0px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
> textarea {
|
|
||||||
width: 50%;
|
|
||||||
height: 15vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
padding: 0px;
|
|
||||||
margin: 0px;
|
|
||||||
|
|
||||||
.cp-app-kanban-table-scrolled {
|
|
||||||
tr td:last-child {
|
|
||||||
right: 0;
|
|
||||||
}
|
|
||||||
tr td:nth-last-child(2) {
|
|
||||||
right: 100px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
table {
|
|
||||||
border-collapse: collapse;
|
|
||||||
width: ~"calc(100% - 1px)";
|
|
||||||
.cp-app-kanban-table-editing {
|
|
||||||
background-color: @kanban-editing;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-uncommitted {
|
|
||||||
.cp-app-kanban-table-cover {
|
|
||||||
background-color: @kanban-uncommitted-cell !important;
|
|
||||||
}
|
|
||||||
div.cp-app-kanban-table-text-cell {
|
|
||||||
background-color: @kanban-uncommitted-bg !important;
|
|
||||||
color: @kanban-uncommitted-text !important;
|
|
||||||
}
|
|
||||||
text-align: center;
|
|
||||||
background-color: @kanban-uncommitted-bg !important;
|
|
||||||
color: @kanban-uncommitted-text !important;
|
|
||||||
}
|
|
||||||
tr {
|
|
||||||
height: 28px;
|
|
||||||
/* Options */
|
|
||||||
td:first-child {
|
|
||||||
position:absolute;
|
|
||||||
left: 0;
|
|
||||||
top: auto;
|
|
||||||
width: 25%;
|
|
||||||
}
|
|
||||||
/* Uncommitted column */
|
|
||||||
td:nth-last-child(2) {
|
|
||||||
position: absolute;
|
|
||||||
top: auto;
|
|
||||||
width: 100px;
|
|
||||||
min-width: unset !important;
|
|
||||||
height: auto !important;
|
|
||||||
}
|
|
||||||
/* Results */
|
|
||||||
td:last-child {
|
|
||||||
color: @kanban-th-fg;
|
|
||||||
position:absolute;
|
|
||||||
top: auto;
|
|
||||||
margin-left: 100px;
|
|
||||||
width: 100px;
|
|
||||||
min-width: unset !important;
|
|
||||||
background-color: @kanban-th-bg;
|
|
||||||
}
|
|
||||||
td {
|
|
||||||
padding: 0px;
|
|
||||||
margin: 0px;
|
|
||||||
|
|
||||||
div.cp-app-kanban-table-text-cell {
|
|
||||||
height: 28px;
|
|
||||||
padding: 0px;
|
|
||||||
margin: 0px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
.cp-app-kanban-table-remove {
|
|
||||||
order: 1;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-edit {
|
|
||||||
order: 3;
|
|
||||||
}
|
|
||||||
input {
|
|
||||||
min-width: 0;
|
|
||||||
order: 2;
|
|
||||||
flex: 1;
|
|
||||||
height: 24px;
|
|
||||||
border: 0px;
|
|
||||||
margin: 2px;
|
|
||||||
&[disabled] {
|
|
||||||
background-color: transparent;
|
|
||||||
color: @kanban-td-fg;
|
|
||||||
//font-weight: bold;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.cp-app-kanban-table-checkbox-cell {
|
|
||||||
margin: 0px;
|
|
||||||
padding: 0px;
|
|
||||||
height: 100%;
|
|
||||||
min-width: 100px;
|
|
||||||
|
|
||||||
div.cp-app-kanban-table-checkbox-contain {
|
|
||||||
display: inline-block;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
position: relative;
|
|
||||||
|
|
||||||
label {
|
|
||||||
background-color: transparent;
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
top: 0px;
|
|
||||||
left: 0px;
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
|
||||||
&[type="number"] {
|
|
||||||
&:not(.editable) {
|
|
||||||
display: none;
|
|
||||||
|
|
||||||
~ .cp-app-kanban-table-cover {
|
|
||||||
line-height: 28px;
|
|
||||||
display: block;
|
|
||||||
font-weight: bold;
|
|
||||||
height: 100%;
|
|
||||||
display: block;
|
|
||||||
|
|
||||||
color: @kanban-cover-color;
|
|
||||||
|
|
||||||
&:after {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="number"][value="0"] {
|
|
||||||
~ .cp-app-kanban-table-cover {
|
|
||||||
background-color: @colortheme_cp-red;
|
|
||||||
&:after { content: "✖"; }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
input[type="number"][value="1"] {
|
|
||||||
~ .cp-app-kanban-table-cover {
|
|
||||||
background-color: @colortheme_cp-green;
|
|
||||||
&:after { content: "✔"; }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
input[type="number"][value="2"] {
|
|
||||||
~ .cp-app-kanban-table-cover {
|
|
||||||
background-color: @kanban-option-yellow;
|
|
||||||
&:after { content: "~"; }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
input[type="number"][value="3"] {
|
|
||||||
~ .cp-app-kanban-table-cover {
|
|
||||||
background-color: @kanban-option-gray;
|
|
||||||
&:after { content: "?"; }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
|
||||||
&[type="text"] {
|
|
||||||
height: auto;
|
|
||||||
width: 80%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
span {
|
|
||||||
.tools_unselectable();
|
|
||||||
}
|
|
||||||
thead {
|
|
||||||
height: 52px;
|
|
||||||
tr {
|
|
||||||
height: 52px;
|
|
||||||
}
|
|
||||||
td {
|
|
||||||
padding: 0px 5px;
|
|
||||||
background: @kanban-th-bg;
|
|
||||||
color: @kanban-th-fg;
|
|
||||||
&:not(:last-child) {
|
|
||||||
border-right: 1px solid rgba(255,255,255,0.2);
|
|
||||||
}
|
|
||||||
&:last-child {
|
|
||||||
height: 52px;
|
|
||||||
line-height: 52px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
&:nth-last-child(2) {
|
|
||||||
border-right: 1px solid @kanban-border-color;
|
|
||||||
}
|
|
||||||
&.cp-app-kanban-table-own {
|
|
||||||
background: @kanban-th-user-bg;
|
|
||||||
.cp-app-kanban-table-lock {
|
|
||||||
cursor: default;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-buttons {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
align-items: center;
|
|
||||||
span {
|
|
||||||
cursor: pointer;
|
|
||||||
width: 1em;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-bookmark {
|
|
||||||
color: darken(@kanban-th-fg, 30%);
|
|
||||||
&.cp-app-kanban-table-bookmark-full {
|
|
||||||
color: @kanban-th-fg;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
input {
|
|
||||||
&[type="text"] {
|
|
||||||
overflow: hidden;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
break-after: always;
|
|
||||||
width: ~"calc(100% - 2px)"; // borders...
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 1px 5px;
|
|
||||||
margin: 1px;
|
|
||||||
&[disabled] {
|
|
||||||
color: @kanban-th-fg;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
tbody {
|
|
||||||
td:first-child {
|
|
||||||
background: @kanban-td-bg;
|
|
||||||
color: @kanban-td-fg;
|
|
||||||
}
|
|
||||||
td.cp-app-kanban-table-winner {
|
|
||||||
background-color: @kanban-winner;
|
|
||||||
&:last-child { font-weight: bold; }
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-text-cell {
|
|
||||||
input[type="text"] {
|
|
||||||
width: ~"calc(100% - 50px)";
|
|
||||||
padding: 0 0.5em;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-edit {
|
|
||||||
float:right;
|
|
||||||
margin: 2px 10px 0 0;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-remove {
|
|
||||||
float: left;
|
|
||||||
margin: 2px 0 0 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
tr:not(:first-child) {
|
|
||||||
td:not(:first-child) {
|
|
||||||
label {
|
|
||||||
border-top: 1px solid @kanban-border-color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-edit {
|
|
||||||
//color: @kanban-cover-color;
|
|
||||||
cursor: pointer;
|
|
||||||
float: left;
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
thead {
|
|
||||||
tr {
|
|
||||||
th {
|
|
||||||
input[type="text"][disabled] {
|
|
||||||
background-color: transparent;
|
|
||||||
color: @kanban-fore;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-table-remove {
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
tbody {
|
|
||||||
tr {
|
|
||||||
td {
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
tfoot {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cp-app-kanban-nocomments {
|
|
||||||
color: #999;
|
|
||||||
text-align: center;
|
|
||||||
margin: 20px;
|
|
||||||
font: @colortheme_app-font;
|
|
||||||
}
|
|
||||||
#cp-app-kanban-comments {
|
|
||||||
width: 50%;
|
|
||||||
margin: 20px auto;
|
|
||||||
min-width: 400px;
|
|
||||||
padding-bottom: 5px;
|
|
||||||
display: none;
|
|
||||||
button {
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
#cp-app-kanban-comments-add {
|
|
||||||
input, textarea {
|
|
||||||
border: 1px solid black;
|
|
||||||
width: 90%;
|
|
||||||
margin: 5px 5%;
|
|
||||||
}
|
|
||||||
input {
|
|
||||||
padding: 5px;
|
|
||||||
height: 26px;
|
|
||||||
&[disabled] {
|
|
||||||
background: #eee;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
textarea {
|
|
||||||
padding: 5px;
|
|
||||||
height: 8em;
|
|
||||||
line-height: 1.5em;
|
|
||||||
}
|
|
||||||
button {
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
#cp-app-kanban-comments-list {
|
|
||||||
.cp-app-kanban-comments-list-el {
|
|
||||||
width: 90%;
|
|
||||||
margin: 5px 5%;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-comments-list-msg {
|
|
||||||
display: flex;
|
|
||||||
background: #eee;
|
|
||||||
padding: 5px 10px;
|
|
||||||
.cp-app-kanban-comments-list-msg-text {
|
|
||||||
flex: 1;
|
|
||||||
white-space: pre-wrap;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-comments-list-msg-actions {
|
|
||||||
button {
|
|
||||||
padding: 0;
|
|
||||||
width: 25px;
|
|
||||||
line-height: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.cp-app-kanban-comments-list-data {
|
|
||||||
background: #ddd;
|
|
||||||
padding: 5px 10px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
.cp-app-kanban-comments-list-data-name {
|
|
||||||
margin-left: 10px;
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
.cp-app-kanban-comments-list-data-avatar { .avatar_main(30px); }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (max-width: 500px) {
|
|
||||||
#cp-app-kanban-table-scroll {
|
|
||||||
max-width: 100%;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
table {
|
|
||||||
tr {
|
|
||||||
td {
|
|
||||||
&:first-child {
|
|
||||||
position: unset;
|
|
||||||
min-width: 100px;
|
|
||||||
&:hover:not(:empty) {
|
|
||||||
position: absolute;
|
|
||||||
min-width: 100px;
|
|
||||||
width: auto;
|
|
||||||
z-index: 100;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&:nth-last-child(2) {
|
|
||||||
position: unset;
|
|
||||||
}
|
|
||||||
&:last-child {
|
|
||||||
position: unset;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cp-app-kanban-comments {
|
|
||||||
min-width: 90%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.btn {
|
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
flex-flow: column;
|
||||||
justify-content: center;
|
height: 100%;
|
||||||
|
min-height: 100%;
|
||||||
|
width: 200%;
|
||||||
|
resize: horizontal;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
#cp-app-kanban-editor {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: row;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media (max-width: @browser_media-medium-screen) {
|
||||||
|
#cp-app-kanban-container {
|
||||||
|
flex: 1;
|
||||||
|
max-width: 100%;
|
||||||
|
resize: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -1,16 +1,19 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<title>CryptPad</title>
|
<title>CryptPad</title>
|
||||||
<meta content="text/html; charset=utf-8" http-equiv="content-type" />
|
<meta content="text/html; charset=utf-8" http-equiv="content-type" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<meta name="referrer" content="no-referrer" />
|
<meta name="referrer" content="no-referrer" />
|
||||||
<script async data-bootload="main.js" data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.3.5"></script>
|
<script async data-bootload="/common/sframe-app-outer.js" data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.3.5"></script>
|
||||||
<style>
|
<style>
|
||||||
html, body {
|
html,
|
||||||
|
body {
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sbox-iframe {
|
#sbox-iframe {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
top: 0px;
|
top: 0px;
|
||||||
@ -24,15 +27,11 @@
|
|||||||
padding: 0;
|
padding: 0;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
#sbox-filePicker-iframe {
|
|
||||||
position: fixed;
|
|
||||||
top:0; left:0;
|
|
||||||
bottom:0; right:0;
|
|
||||||
width:100%;
|
|
||||||
height: 100%;
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<iframe id="sbox-iframe">
|
<iframe id="sbox-iframe">
|
||||||
|
</iframe>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,43 +1,23 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html class="cp-app-noscroll">
|
<html class="cp-app-noscroll">
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
||||||
<meta content="text/html; charset=utf-8" http-equiv="content-type" />
|
<meta content="text/html; charset=utf-8" http-equiv="content-type" />
|
||||||
<script async data-bootload="/kanban/inner.js" data-main="/common/sframe-boot.js?ver=1.6" src="/bower_components/requirejs/require.js?ver=2.3.5"></script>
|
<script async data-bootload="/kanban/inner.js" data-main="/common/sframe-boot.js?ver=1.6" src="/bower_components/requirejs/require.js?ver=2.3.5"></script>
|
||||||
<style>
|
<style>
|
||||||
.loading-hidden { display: none; }
|
.loading-hidden {
|
||||||
#editor1 { display: none; }
|
display: none;
|
||||||
html, body {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
margin: 0px;
|
|
||||||
padding: 0px;
|
|
||||||
border: 0px;
|
|
||||||
}
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
#myKanban {
|
|
||||||
overflow-x: auto;
|
|
||||||
padding: 20px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.success {
|
|
||||||
background: #00B961;
|
|
||||||
}
|
|
||||||
|
|
||||||
.info {
|
|
||||||
background: #2A92BF;
|
|
||||||
}
|
|
||||||
|
|
||||||
.warning {
|
|
||||||
background: #F4CE46;
|
|
||||||
}
|
|
||||||
|
|
||||||
.error {
|
|
||||||
background: #FB7D44;
|
|
||||||
}
|
}
|
||||||
|
</style>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body class="cp-app-kanban">
|
<body class="cp-app-kanban">
|
||||||
|
<div id="cme_toolbox" class="cp-toolbar-container"></div>
|
||||||
|
<div id="cp-app-kanban-editor">
|
||||||
|
<div id="cp-app-kanban-container">
|
||||||
|
<div id="cp-app-kanban-content"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
|
|||||||
@ -1,335 +1,26 @@
|
|||||||
define([
|
define([
|
||||||
'jquery',
|
'jquery',
|
||||||
'/bower_components/chainpad-crypto/crypto.js',
|
|
||||||
'/common/toolbar3.js',
|
|
||||||
'json.sortify',
|
|
||||||
'/common/common-util.js',
|
|
||||||
'/bower_components/nthen/index.js',
|
'/bower_components/nthen/index.js',
|
||||||
'/common/sframe-common.js',
|
'/common/sframe-common.js',
|
||||||
'/common/common-interface.js',
|
'/common/sframe-app-framework.js',
|
||||||
'/api/config',
|
'/common/common-util.js',
|
||||||
'/common/common-realtime.js',
|
'/common/common-hash.js',
|
||||||
'/customize/pages.js',
|
'/common/modes.js',
|
||||||
'/customize/messages.js',
|
'/customize/messages.js',
|
||||||
'/customize/application_config.js',
|
|
||||||
'/common/common-thumbnail.js',
|
|
||||||
'/bower_components/chainpad/chainpad.dist.js',
|
|
||||||
|
|
||||||
'/bower_components/secure-fabric.js/dist/fabric.min.js',
|
|
||||||
'/bower_components/file-saver/FileSaver.min.js',
|
|
||||||
|
|
||||||
'css!/bower_components/bootstrap/dist/css/bootstrap.min.css',
|
|
||||||
'less!/bower_components/components-font-awesome/css/font-awesome.min.css',
|
|
||||||
'less!/customize/src/less2/main.less',
|
|
||||||
'css!/kanban/jkanban.css',
|
|
||||||
'/kanban/jkanban.js',
|
'/kanban/jkanban.js',
|
||||||
|
'css!/kanban/jkanban.css',
|
||||||
], function (
|
], function (
|
||||||
$,
|
$,
|
||||||
Crypto,
|
|
||||||
Toolbar,
|
|
||||||
JSONSortify,
|
|
||||||
Util,
|
|
||||||
nThen,
|
nThen,
|
||||||
SFCommon,
|
SFCommon,
|
||||||
UI,
|
Framework,
|
||||||
ApiConfig,
|
Util,
|
||||||
CommonRealtime,
|
Hash,
|
||||||
Pages,
|
Modes,
|
||||||
Messages,
|
Messages) {
|
||||||
AppConfig,
|
|
||||||
Thumb,
|
|
||||||
ChainPad)
|
|
||||||
{
|
|
||||||
var saveAs = window.saveAs;
|
|
||||||
|
|
||||||
var APP = window.APP = {
|
// Kanban code
|
||||||
$: $
|
var initKanban = function (framework, boards) {
|
||||||
};
|
|
||||||
var Fabric = APP.Fabric = window.fabric;
|
|
||||||
|
|
||||||
var stringify = function (obj) {
|
|
||||||
return JSONSortify(obj);
|
|
||||||
};
|
|
||||||
|
|
||||||
var toolbar;
|
|
||||||
|
|
||||||
var andThen = function (common) {
|
|
||||||
var config = {};
|
|
||||||
/* Initialize Fabric */
|
|
||||||
var canvas = APP.canvas = null;
|
|
||||||
var $canvas = $('canvas');
|
|
||||||
var readOnly = false;
|
|
||||||
|
|
||||||
var setEditable = function (bool) {
|
|
||||||
APP.editable = bool;
|
|
||||||
if (readOnly && bool) { return; }
|
|
||||||
};
|
|
||||||
|
|
||||||
var saveImage = APP.saveImage = function () {
|
|
||||||
};
|
|
||||||
|
|
||||||
APP.FM = common.createFileManager({});
|
|
||||||
APP.upload = function (title) {
|
|
||||||
};
|
|
||||||
|
|
||||||
var initializing = true;
|
|
||||||
var $bar = $('#cp-toolbar');
|
|
||||||
var Title;
|
|
||||||
var cpNfInner;
|
|
||||||
var metadataMgr;
|
|
||||||
|
|
||||||
config = {
|
|
||||||
readOnly: readOnly,
|
|
||||||
patchTransformer: ChainPad.NaiveJSONTransformer,
|
|
||||||
// cryptpad debug logging (default is 1)
|
|
||||||
// logLevel: 0,
|
|
||||||
validateContent: function (content) {
|
|
||||||
try {
|
|
||||||
JSON.parse(content);
|
|
||||||
return true;
|
|
||||||
} catch (e) {
|
|
||||||
console.log("Failed to parse, rejecting patch");
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var stringifyInner = function (textValue) {
|
|
||||||
var obj = {
|
|
||||||
content: textValue,
|
|
||||||
metadata: metadataMgr.getMetadataLazy()
|
|
||||||
};
|
|
||||||
// stringify the json and send it into chainpad
|
|
||||||
return stringify(obj);
|
|
||||||
};
|
|
||||||
|
|
||||||
var onLocal = config.onLocal = function () {
|
|
||||||
if (initializing) { return; }
|
|
||||||
if (readOnly) { return; }
|
|
||||||
|
|
||||||
var content = stringifyInner(Kanban.getBoardsJSON());
|
|
||||||
console.log("Updating content " + content);
|
|
||||||
|
|
||||||
try {
|
|
||||||
APP.realtime.contentUpdate(content);
|
|
||||||
} catch (e) {
|
|
||||||
APP.unrecoverable = true;
|
|
||||||
setEditable(false);
|
|
||||||
APP.toolbar.errorState(true, e.message);
|
|
||||||
var msg = Messages.chainpadError;
|
|
||||||
UI.errorLoadingScreen(msg, true, true);
|
|
||||||
console.error(e);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
var initThumbnails = function () {
|
|
||||||
var oldThumbnailState;
|
|
||||||
var privateDat = metadataMgr.getPrivateData();
|
|
||||||
if (!privateDat.thumbnails) { return; }
|
|
||||||
var hash = privateDat.availableHashes.editHash ||
|
|
||||||
privateDat.availableHashes.viewHash;
|
|
||||||
var href = privateDat.pathname + '#' + hash;
|
|
||||||
var mkThumbnail = function () {
|
|
||||||
if (!hash) { return; }
|
|
||||||
if (initializing) { return; }
|
|
||||||
if (!APP.realtime) { return; }
|
|
||||||
var content = APP.realtime.getUserDoc();
|
|
||||||
if (content === oldThumbnailState) { return; }
|
|
||||||
/*
|
|
||||||
var D = Thumb.getResizedDimensions($canvas[0], 'pad');
|
|
||||||
Thumb.fromCanvas($canvas[0], D, function (err, b64) {
|
|
||||||
oldThumbnailState = content;
|
|
||||||
Thumb.setPadThumbnail(common, href, b64);
|
|
||||||
});
|
|
||||||
*/
|
|
||||||
};
|
|
||||||
window.setInterval(mkThumbnail, Thumb.UPDATE_INTERVAL);
|
|
||||||
window.setTimeout(mkThumbnail, Thumb.UPDATE_FIRST);
|
|
||||||
};
|
|
||||||
|
|
||||||
config.onInit = function (info) {
|
|
||||||
readOnly = metadataMgr.getPrivateData().readOnly;
|
|
||||||
|
|
||||||
Title = common.createTitle({});
|
|
||||||
|
|
||||||
var configTb = {
|
|
||||||
displayed: [
|
|
||||||
'userlist',
|
|
||||||
'title',
|
|
||||||
'useradmin',
|
|
||||||
'spinner',
|
|
||||||
'newpad',
|
|
||||||
'share',
|
|
||||||
'limit',
|
|
||||||
'unpinnedWarning'
|
|
||||||
],
|
|
||||||
title: Title.getTitleConfig(),
|
|
||||||
metadataMgr: metadataMgr,
|
|
||||||
readOnly: readOnly,
|
|
||||||
realtime: info.realtime,
|
|
||||||
sfCommon: common,
|
|
||||||
$container: $bar,
|
|
||||||
$contentContainer: $('#cp-app-kanban-content')
|
|
||||||
};
|
|
||||||
toolbar = APP.toolbar = Toolbar.create(configTb);
|
|
||||||
Title.setToolbar(toolbar);
|
|
||||||
|
|
||||||
var $rightside = toolbar.$rightside;
|
|
||||||
var $drawer = toolbar.$drawer;
|
|
||||||
|
|
||||||
/* save as template */
|
|
||||||
if (!metadataMgr.getPrivateData().isTemplate) {
|
|
||||||
var templateObj = {
|
|
||||||
rt: info.realtime,
|
|
||||||
getTitle: function () { return metadataMgr.getMetadata().title; }
|
|
||||||
};
|
|
||||||
var $templateButton = common.createButton('template', true, templateObj);
|
|
||||||
$rightside.append($templateButton);
|
|
||||||
}
|
|
||||||
|
|
||||||
/* add an export button */
|
|
||||||
var $export = common.createButton('export', true, {}, saveImage);
|
|
||||||
$drawer.append($export);
|
|
||||||
|
|
||||||
if (common.isLoggedIn()) {
|
|
||||||
common.createButton('savetodrive', true, {}, function () {})
|
|
||||||
.click(function () {
|
|
||||||
UI.prompt(Messages.exportPrompt, document.title + '.png',
|
|
||||||
function (name) {
|
|
||||||
if (name === null || !name.trim()) { return; }
|
|
||||||
APP.upload(name);
|
|
||||||
});
|
|
||||||
}).appendTo($rightside);
|
|
||||||
|
|
||||||
common.createButton('hashtag', true).appendTo($rightside);
|
|
||||||
}
|
|
||||||
|
|
||||||
var $forget = common.createButton('forget', true, {}, function (err) {
|
|
||||||
if (err) { return; }
|
|
||||||
setEditable(false);
|
|
||||||
});
|
|
||||||
$rightside.append($forget);
|
|
||||||
|
|
||||||
var $properties = common.createButton('properties', true);
|
|
||||||
toolbar.$drawer.append($properties);
|
|
||||||
|
|
||||||
var $appContainer = $('#cp-app-kanban-container');
|
|
||||||
var helpMenu = common.createHelpMenu(['kanban']);
|
|
||||||
$appContainer.prepend(helpMenu.menu);
|
|
||||||
toolbar.$drawer.append(helpMenu.button);
|
|
||||||
|
|
||||||
metadataMgr.onChange(function () {
|
|
||||||
var md = metadataMgr.getMetadata();
|
|
||||||
});
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
config.onReady = function (info) {
|
|
||||||
if (APP.realtime !== info.realtime) {
|
|
||||||
APP.realtime = info.realtime;
|
|
||||||
}
|
|
||||||
|
|
||||||
var userDoc = APP.realtime.getUserDoc();
|
|
||||||
var isNew = false;
|
|
||||||
var newDoc = '';
|
|
||||||
if (userDoc === "" || userDoc === "{}") { isNew = true; }
|
|
||||||
|
|
||||||
if (userDoc !== "") {
|
|
||||||
var hjson = JSON.parse(userDoc);
|
|
||||||
|
|
||||||
if (hjson && hjson.metadata) {
|
|
||||||
metadataMgr.updateMetadata(hjson.metadata);
|
|
||||||
}
|
|
||||||
if (typeof (hjson) !== 'object' || Array.isArray(hjson) ||
|
|
||||||
(hjson.metadata && typeof(hjson.metadata.type) !== 'undefined' &&
|
|
||||||
hjson.metadata.type !== 'kanban')) {
|
|
||||||
var errorText = Messages.typeError;
|
|
||||||
UI.errorLoadingScreen(errorText);
|
|
||||||
throw new Error(errorText);
|
|
||||||
}
|
|
||||||
newDoc = hjson.content;
|
|
||||||
|
|
||||||
// launch the kanban code
|
|
||||||
config.initKanban(newDoc);
|
|
||||||
|
|
||||||
} else {
|
|
||||||
Title.updateTitle(Title.defaultTitle);
|
|
||||||
config.initKanban();
|
|
||||||
}
|
|
||||||
|
|
||||||
nThen(function (waitFor) {
|
|
||||||
if (newDoc) {
|
|
||||||
}
|
|
||||||
}).nThen(function () {
|
|
||||||
setEditable(!readOnly);
|
|
||||||
initializing = false;
|
|
||||||
config.onLocal();
|
|
||||||
UI.removeLoadingScreen();
|
|
||||||
|
|
||||||
initThumbnails();
|
|
||||||
|
|
||||||
|
|
||||||
if (readOnly) { return; }
|
|
||||||
|
|
||||||
var privateDat = metadataMgr.getPrivateData();
|
|
||||||
var skipTemp = Util.find(privateDat,
|
|
||||||
['settings', 'general', 'creation', 'noTemplate']);
|
|
||||||
var skipCreation = Util.find(privateDat, ['settings', 'general', 'creation', 'skip']);
|
|
||||||
if (isNew && (!AppConfig.displayCreationScreen || (!skipTemp && skipCreation))) {
|
|
||||||
common.openTemplatePicker();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
config.onRemote = function () {
|
|
||||||
if (initializing) { return; }
|
|
||||||
var userDoc = APP.realtime.getUserDoc();
|
|
||||||
|
|
||||||
console.log("Received content: " + userDoc);
|
|
||||||
|
|
||||||
var json = JSON.parse(userDoc);
|
|
||||||
var remoteDoc = json.content;
|
|
||||||
|
|
||||||
var currentContent = stringify(Kanban.getBoardsJSON());
|
|
||||||
var remoteContent = stringify(json.content);
|
|
||||||
|
|
||||||
|
|
||||||
if (currentContent !== remoteContent) {
|
|
||||||
// reinit kanban (TODO: optimize to diff only)
|
|
||||||
console.log("Content is different.. Applying content");
|
|
||||||
config.Kanban.setBoards(remoteDoc);
|
|
||||||
common.notify();
|
|
||||||
}
|
|
||||||
if (readOnly) { setEditable(false); }
|
|
||||||
};
|
|
||||||
|
|
||||||
config.onAbort = function () {
|
|
||||||
if (APP.unrecoverable) { return; }
|
|
||||||
// inform of network disconnect
|
|
||||||
setEditable(false);
|
|
||||||
toolbar.failed();
|
|
||||||
UI.alert(Messages.common_connectionLost, undefined, true);
|
|
||||||
};
|
|
||||||
|
|
||||||
config.onConnectionChange = function (info) {
|
|
||||||
if (APP.unrecoverable) { return; }
|
|
||||||
setEditable(info.state);
|
|
||||||
if (info.state) {
|
|
||||||
initializing = true;
|
|
||||||
//UI.findOKButton().click();
|
|
||||||
} else {
|
|
||||||
//UI.alert(Messages.common_connectionLost, undefined, true);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
config.onError = function (err) {
|
|
||||||
common.onServerError(err, toolbar, function () {
|
|
||||||
APP.unrecoverable = true;
|
|
||||||
setEditable(false);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
config.initKanban = function(boards) {
|
|
||||||
var defaultBoards = [
|
var defaultBoards = [
|
||||||
{
|
{
|
||||||
"id": "todo",
|
"id": "todo",
|
||||||
@ -381,20 +72,20 @@ define([
|
|||||||
// Remove any existing elements
|
// Remove any existing elements
|
||||||
$(".kanban-container-outer").remove();
|
$(".kanban-container-outer").remove();
|
||||||
|
|
||||||
window.Kanban = config.Kanban = new jKanban({
|
var kanban = new jKanban({
|
||||||
element: '#cp-app-kanban-content',
|
element: '#cp-app-kanban-content',
|
||||||
gutter: '15px',
|
gutter: '15px',
|
||||||
widthBoard: '300px',
|
widthBoard: '300px',
|
||||||
onChange: function () {
|
onChange: function () {
|
||||||
console.log("Board object has changed");
|
console.log("Board object has changed");
|
||||||
config.onLocal();
|
framework.localChange();
|
||||||
}
|
},
|
||||||
,click: function (el) {
|
click: function (el) {
|
||||||
if (Kanban.inEditMode) {
|
if (kanban.inEditMode) {
|
||||||
console.log("An edit is already active");
|
console.log("An edit is already active");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
Kanban.inEditMode = true;
|
kanban.inEditMode = true;
|
||||||
var name = $(el).text();
|
var name = $(el).text();
|
||||||
$(el).html('');
|
$(el).html('');
|
||||||
$('<input></input>')
|
$('<input></input>')
|
||||||
@ -411,21 +102,21 @@ config.onLocal();
|
|||||||
var name = $('#kanban_edit').val();
|
var name = $('#kanban_edit').val();
|
||||||
$(el).text(name);
|
$(el).text(name);
|
||||||
var board = $(el.parentNode.parentNode).attr("data-id");
|
var board = $(el.parentNode.parentNode).attr("data-id");
|
||||||
var pos = Kanban.findElementPosition(el);
|
var pos = kanban.findElementPosition(el);
|
||||||
console.log(pos);
|
console.log(pos);
|
||||||
console.log(board);
|
console.log(board);
|
||||||
Kanban.getBoardJSON(board).item[pos].title = name;
|
kanban.getBoardJSON(board).item[pos].title = name;
|
||||||
Kanban.onChange();
|
kanban.onChange();
|
||||||
Kanban.inEditMode = false;
|
kanban.inEditMode = false;
|
||||||
});
|
});
|
||||||
|
|
||||||
},
|
},
|
||||||
boardTitleClick: function (el) {
|
boardTitleClick: function (el) {
|
||||||
if (Kanban.inEditMode) {
|
if (kanban.inEditMode) {
|
||||||
console.log("An edit is already active");
|
console.log("An edit is already active");
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
Kanban.inEditMode = true;
|
kanban.inEditMode = true;
|
||||||
var name = $(el).text();
|
var name = $(el).text();
|
||||||
$(el).html('');
|
$(el).html('');
|
||||||
$('<input></input>')
|
$('<input></input>')
|
||||||
@ -442,43 +133,45 @@ boardTitleClick: function (el) {
|
|||||||
var name = $('#kanban_edit').val();
|
var name = $('#kanban_edit').val();
|
||||||
$(el).text(name);
|
$(el).text(name);
|
||||||
var board = $(el.parentNode.parentNode).attr("data-id");
|
var board = $(el.parentNode.parentNode).attr("data-id");
|
||||||
Kanban.getBoardJSON(board).title = name;
|
kanban.getBoardJSON(board).title = name;
|
||||||
Kanban.onChange();
|
kanban.onChange();
|
||||||
Kanban.inEditMode = false;
|
kanban.inEditMode = false;
|
||||||
});
|
});
|
||||||
|
|
||||||
},
|
},
|
||||||
colorClick: function (el, boardId) {
|
colorClick: function (el, boardId) {
|
||||||
console.log("in color click");
|
console.log("in color click");
|
||||||
var board = $(el.parentNode).attr("data-id");
|
var board = $(el.parentNode).attr("data-id");
|
||||||
var boardJSON = Kanban.getBoardJSON(board);
|
var boardJSON = kanban.getBoardJSON(board);
|
||||||
var currentColor = boardJSON.color;
|
var currentColor = boardJSON.color;
|
||||||
console.log("Current color " + currentColor);
|
console.log("Current color " + currentColor);
|
||||||
var index = Kanban.options.colors.findIndex(function(element) { return (element==currentColor) }) + 1;
|
var index = kanban.options.colors.findIndex(function (element) {
|
||||||
|
return (element == currentColor)
|
||||||
|
}) + 1;
|
||||||
console.log("Next index " + index);
|
console.log("Next index " + index);
|
||||||
if (index>=Kanban.options.colors.length)
|
if (index >= kanban.options.colors.length)
|
||||||
index = 0;
|
index = 0;
|
||||||
var nextColor = Kanban.options.colors[index];
|
var nextColor = kanban.options.colors[index];
|
||||||
console.log("Next color " + nextColor);
|
console.log("Next color " + nextColor);
|
||||||
boardJSON.color = nextColor;
|
boardJSON.color = nextColor;
|
||||||
$(el).removeClass("kanban-header-" + currentColor);
|
$(el).removeClass("kanban-header-" + currentColor);
|
||||||
$(el).addClass("kanban-header-" + nextColor);
|
$(el).addClass("kanban-header-" + nextColor);
|
||||||
Kanban.onChange();
|
kanban.onChange();
|
||||||
|
|
||||||
},
|
},
|
||||||
removeClick: function (el, boardId) {
|
removeClick: function (el, boardId) {
|
||||||
if (confirm("Do you want to delete this board?")) {
|
if (confirm("Do you want to delete this board?")) {
|
||||||
console.log("Delete board");
|
console.log("Delete board");
|
||||||
var boardName = $(el.parentNode.parentNode).attr("data-id");
|
var boardName = $(el.parentNode.parentNode).attr("data-id");
|
||||||
for (index in Kanban.options.boards) {
|
for (index in kanban.options.boards) {
|
||||||
if (Kanban.options.boards[index].id == boardName) {
|
if (kanban.options.boards[index].id == boardName) {
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
index++;
|
index++;
|
||||||
}
|
}
|
||||||
Kanban.options.boards.splice(index, 1);
|
kanban.options.boards.splice(index, 1);
|
||||||
Kanban.removeBoard(boardName);
|
kanban.removeBoard(boardName);
|
||||||
Kanban.onChange();
|
kanban.onChange();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
buttonClick: function (el, boardId) {
|
buttonClick: function (el, boardId) {
|
||||||
@ -489,11 +182,11 @@ var formItem = document.createElement('form');
|
|||||||
formItem.setAttribute("class", "itemform");
|
formItem.setAttribute("class", "itemform");
|
||||||
formItem.innerHTML = '<div class="form-group"><textarea class="form-control" rows="2" autofocus></textarea></div><div class="form-group"><button type="submit" class="btn btn-primary btn-xs">Submit</button><button type="button" id="CancelBtn" class="btn btn-default btn-xs pull-right">Cancel</button></div>'
|
formItem.innerHTML = '<div class="form-group"><textarea class="form-control" rows="2" autofocus></textarea></div><div class="form-group"><button type="submit" class="btn btn-primary btn-xs">Submit</button><button type="button" id="CancelBtn" class="btn btn-default btn-xs pull-right">Cancel</button></div>'
|
||||||
|
|
||||||
Kanban.addForm(boardId, formItem);
|
kanban.addForm(boardId, formItem);
|
||||||
formItem.addEventListener("submit", function (e) {
|
formItem.addEventListener("submit", function (e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
var text = e.target[0].value
|
var text = e.target[0].value
|
||||||
Kanban.addElement(boardId, {
|
kanban.addElement(boardId, {
|
||||||
"title": text,
|
"title": text,
|
||||||
})
|
})
|
||||||
formItem.parentNode.removeChild(formItem);
|
formItem.parentNode.removeChild(formItem);
|
||||||
@ -511,7 +204,7 @@ addBoardDefault.addEventListener('click', function () {
|
|||||||
var counter = 1;
|
var counter = 1;
|
||||||
found = false;
|
found = false;
|
||||||
while (found) {
|
while (found) {
|
||||||
for (var board in Kanban.options.boards) {
|
for (var board in kanban.options.boards) {
|
||||||
if (board.id == "board" + counter) {
|
if (board.id == "board" + counter) {
|
||||||
counter++;
|
counter++;
|
||||||
break;
|
break;
|
||||||
@ -520,7 +213,7 @@ addBoardDefault.addEventListener('click', function () {
|
|||||||
found = true;
|
found = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
Kanban.addBoards(
|
kanban.addBoards(
|
||||||
[{
|
[{
|
||||||
"id": "board" + counter,
|
"id": "board" + counter,
|
||||||
"title": "New Board",
|
"title": "New Board",
|
||||||
@ -532,96 +225,58 @@ addBoardDefault.addEventListener('click', function () {
|
|||||||
]
|
]
|
||||||
}]
|
}]
|
||||||
)
|
)
|
||||||
Kanban.onChange();
|
kanban.onChange();
|
||||||
});
|
});
|
||||||
|
|
||||||
/*
|
return kanban;
|
||||||
var toDoButton = document.getElementById('addToDo');
|
|
||||||
toDoButton.addEventListener('click', function () {
|
|
||||||
Kanban.addElement(
|
|
||||||
"_todo",
|
|
||||||
{
|
|
||||||
"title": "Test Add",
|
|
||||||
}
|
|
||||||
);
|
|
||||||
});
|
|
||||||
|
|
||||||
var addBoardDefault = document.getElementById('addDefault');
|
|
||||||
addBoardDefault.addEventListener('click', function () {
|
|
||||||
Kanban.addBoards(
|
|
||||||
[{
|
|
||||||
"id": "_default",
|
|
||||||
"title": "Kanban Default",
|
|
||||||
"item": [
|
|
||||||
{
|
|
||||||
"title": "Default Item",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Default Item 2",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"title": "Default Item 3",
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}]
|
|
||||||
)
|
|
||||||
});
|
|
||||||
|
|
||||||
var removeBoard = document.getElementById('removeBoard');
|
|
||||||
removeBoard.addEventListener('click', function () {
|
|
||||||
Kanban.removeBoard('_done');
|
|
||||||
});
|
|
||||||
|
|
||||||
var removeElement = document.getElementById('removeElement');
|
|
||||||
removeElement.addEventListener('click', function () {
|
|
||||||
Kanban.removeElement('_test_delete');
|
|
||||||
});
|
|
||||||
|
|
||||||
var allEle = Kanban.getBoardElements('_todo');
|
|
||||||
allEle.forEach(function (item, index) {
|
|
||||||
//console.log(item);
|
|
||||||
});
|
|
||||||
*/
|
|
||||||
};
|
};
|
||||||
|
|
||||||
cpNfInner = common.startRealtime(config);
|
// Start of the main loop
|
||||||
metadataMgr = cpNfInner.metadataMgr;
|
var andThen2 = function (framework) {
|
||||||
|
|
||||||
cpNfInner.onInfiniteSpinner(function () {
|
var kanban = initKanban(framework);
|
||||||
if (APP.unrecoverable) { return; }
|
|
||||||
setEditable(false);
|
framework.onContentUpdate(function (newContent) {
|
||||||
UI.confirm(Messages.realtime_unrecoverableError, function (yes) {
|
// Need to update the content
|
||||||
if (!yes) { return; }
|
console.log("Content should be updated to " + newContent);
|
||||||
common.gotoURL();
|
var currentContent = kanban.getBoardsJSON();
|
||||||
});
|
var remoteContent = newContent.content;
|
||||||
|
|
||||||
|
if (currentContent !== remoteContent) {
|
||||||
|
// reinit kanban (TODO: optimize to diff only)
|
||||||
|
console.log("Content is different.. Applying content");
|
||||||
|
kanban.setBoards(remoteContent);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#save').on('click', function () {
|
framework.setContentGetter(function () {
|
||||||
});
|
// var content = $("#cp-app-kanban-content").val();
|
||||||
|
var content = kanban.getBoardsJSON();
|
||||||
|
console.log("Content current value is " + content);
|
||||||
common.onLogout(function () { setEditable(false); });
|
return {
|
||||||
|
content: content
|
||||||
};
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
framework.onReady(function (newPad) {
|
||||||
|
$("#cp-app-kanban-content").focus();
|
||||||
|
});
|
||||||
|
|
||||||
|
framework.start();
|
||||||
|
};
|
||||||
|
|
||||||
var main = function () {
|
var main = function () {
|
||||||
var common;
|
// var framework;
|
||||||
|
|
||||||
nThen(function (waitFor) {
|
nThen(function (waitFor) {
|
||||||
$(waitFor(function () {
|
|
||||||
UI.addLoadingScreen();
|
// Framework initialization
|
||||||
var $div = $('<div>').append(Pages['/kanban/']());
|
Framework.create({
|
||||||
$('body').append($div.html());
|
toolbarContainer: '#cme_toolbox',
|
||||||
$('body').addClass("cp-app-kanban");
|
contentContainer: '#cp-app-kanban-editor',
|
||||||
|
}, waitFor(function (fw) {
|
||||||
|
framework = fw;
|
||||||
|
andThen2(framework);
|
||||||
}));
|
}));
|
||||||
SFCommon.create(waitFor(function (c) { APP.common = common = c; }));
|
|
||||||
}).nThen(function (waitFor) {
|
|
||||||
common.getSframeChannel().onReady(waitFor());
|
|
||||||
}).nThen(function (waitFor) {
|
|
||||||
common.handleNewFile(waitFor);
|
|
||||||
}).nThen(function (/*waitFor*/) {
|
|
||||||
andThen(common);
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
main();
|
main();
|
||||||
|
|||||||
@ -1,4 +1,3 @@
|
|||||||
|
|
||||||
.kanban-container-outer {
|
.kanban-container-outer {
|
||||||
position: relative;
|
position: relative;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
@ -92,11 +91,25 @@
|
|||||||
height: auto !important;
|
height: auto !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
.kanban-header-yellow { background: #FC3; }
|
.kanban-header-yellow {
|
||||||
.kanban-header-orange { background: #F91; }
|
background: #FC3;
|
||||||
.kanban-header-blue { background: #0AC; }
|
}
|
||||||
.kanban-header-red { background: #E43; }
|
|
||||||
.kanban-header-green { background: #8C4; }
|
.kanban-header-orange {
|
||||||
|
background: #F91;
|
||||||
|
}
|
||||||
|
|
||||||
|
.kanban-header-blue {
|
||||||
|
background: #0AC;
|
||||||
|
}
|
||||||
|
|
||||||
|
.kanban-header-red {
|
||||||
|
background: #E43;
|
||||||
|
}
|
||||||
|
|
||||||
|
.kanban-header-green {
|
||||||
|
background: #8C4;
|
||||||
|
}
|
||||||
|
|
||||||
#kanban-addboard {
|
#kanban-addboard {
|
||||||
float: left;
|
float: left;
|
||||||
@ -123,6 +136,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* Dragula CSS */
|
/* Dragula CSS */
|
||||||
|
|
||||||
.gu-mirror {
|
.gu-mirror {
|
||||||
position: fixed !important;
|
position: fixed !important;
|
||||||
margin: 0 !important;
|
margin: 0 !important;
|
||||||
|
|||||||
@ -1,4 +1,28 @@
|
|||||||
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
|
(function e(t, n, r) {
|
||||||
|
function s(o, u) {
|
||||||
|
if (!n[o]) {
|
||||||
|
if (!t[o]) {
|
||||||
|
var a = typeof require == "function" && require;
|
||||||
|
if (!u && a) return a(o, !0);
|
||||||
|
if (i) return i(o, !0);
|
||||||
|
var f = new Error("Cannot find module '" + o + "'");
|
||||||
|
throw f.code = "MODULE_NOT_FOUND", f
|
||||||
|
}
|
||||||
|
var l = n[o] = {
|
||||||
|
exports: {}
|
||||||
|
};
|
||||||
|
t[o][0].call(l.exports, function (e) {
|
||||||
|
var n = t[o][1][e];
|
||||||
|
return s(n ? n : e)
|
||||||
|
}, l, l.exports, e, t, n, r)
|
||||||
|
}
|
||||||
|
return n[o].exports
|
||||||
|
}
|
||||||
|
var i = typeof require == "function" && require;
|
||||||
|
for (var o = 0; o < r.length; o++) s(r[o]);
|
||||||
|
return s
|
||||||
|
})({
|
||||||
|
1: [function (require, module, exports) {
|
||||||
/**
|
/**
|
||||||
* jKanban
|
* jKanban
|
||||||
* Vanilla Javascript plugin for manage kanban boards
|
* Vanilla Javascript plugin for manage kanban boards
|
||||||
@ -32,30 +56,18 @@ var dragula = require('dragula');
|
|||||||
dragBoards: true,
|
dragBoards: true,
|
||||||
addItemButton: false,
|
addItemButton: false,
|
||||||
buttonContent: '+',
|
buttonContent: '+',
|
||||||
dragEl: function (el, source) {
|
dragEl: function (el, source) {},
|
||||||
},
|
dragendEl: function (el) {},
|
||||||
dragendEl: function (el) {
|
dropEl: function (el, target, source, sibling) {},
|
||||||
},
|
dragBoard: function (el, source) {},
|
||||||
dropEl: function (el, target, source, sibling) {
|
dragendBoard: function (el) {},
|
||||||
},
|
dropBoard: function (el, target, source, sibling) {},
|
||||||
dragBoard: function (el, source) {
|
click: function (el) {},
|
||||||
},
|
boardTitleclick: function (el, boardId) {},
|
||||||
dragendBoard: function (el) {
|
buttonClick: function (el, boardId) {},
|
||||||
},
|
colorClick: function (el, boardId) {},
|
||||||
dropBoard: function (el, target, source, sibling) {
|
removeClick: function (el, boardId) {},
|
||||||
},
|
onChange: function () {}
|
||||||
click: function (el) {
|
|
||||||
},
|
|
||||||
boardTitleclick: function (el, boardId) {
|
|
||||||
},
|
|
||||||
buttonClick: function (el, boardId) {
|
|
||||||
},
|
|
||||||
colorClick: function (el, boardId) {
|
|
||||||
},
|
|
||||||
removeClick: function(el, boardId) {
|
|
||||||
},
|
|
||||||
onChange: function() {
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
if (arguments[0] && typeof arguments[0] === "object") {
|
if (arguments[0] && typeof arguments[0] === "object") {
|
||||||
@ -100,8 +112,12 @@ var dragula = require('dragula');
|
|||||||
|
|
||||||
// TODO: update board object board order
|
// TODO: update board object board order
|
||||||
console.log("Drop " + $(el).attr("data-id") + " just before " + (sibling ? $(sibling).attr("data-id") : " end "));
|
console.log("Drop " + $(el).attr("data-id") + " just before " + (sibling ? $(sibling).attr("data-id") : " end "));
|
||||||
var index1 = self.options.boards.findIndex(function(element) { return element.id==$(el).attr("data-id"); });
|
var index1 = self.options.boards.findIndex(function (element) {
|
||||||
var index2 = sibling ? self.options.boards.findIndex(function(element) { return element.id==$(sibling).attr("data-id"); }) : self.options.boards.length;
|
return element.id == $(el).attr("data-id");
|
||||||
|
});
|
||||||
|
var index2 = sibling ? self.options.boards.findIndex(function (element) {
|
||||||
|
return element.id == $(sibling).attr("data-id");
|
||||||
|
}) : self.options.boards.length;
|
||||||
console.log("Switch " + index1 + " and " + index2);
|
console.log("Switch " + index1 + " and " + index2);
|
||||||
if (index1 < index2)
|
if (index1 < index2)
|
||||||
index2 = index2 - 1;
|
index2 = index2 - 1;
|
||||||
@ -142,7 +158,9 @@ var dragula = require('dragula');
|
|||||||
.on('cancel', function (el, container, source) {
|
.on('cancel', function (el, container, source) {
|
||||||
console.log("In cancel");
|
console.log("In cancel");
|
||||||
if (confirm("Do you want to remove this item?")) {
|
if (confirm("Do you want to remove this item?")) {
|
||||||
var board1 = self.options.boards.find(function(element) { return element.id==$(source.parentNode).attr("data-id"); });
|
var board1 = self.options.boards.find(function (element) {
|
||||||
|
return element.id == $(source.parentNode).attr("data-id");
|
||||||
|
});
|
||||||
var pos1 = self.dragItemPos;
|
var pos1 = self.dragItemPos;
|
||||||
board1.item.splice(pos1, 1);
|
board1.item.splice(pos1, 1);
|
||||||
$(el).remove();
|
$(el).remove();
|
||||||
@ -153,8 +171,12 @@ var dragula = require('dragula');
|
|||||||
console.log("In drop");
|
console.log("In drop");
|
||||||
|
|
||||||
// TODO: update board object board order
|
// TODO: update board object board order
|
||||||
var board1 = self.options.boards.find(function(element) { return element.id==$(source.parentNode).attr("data-id"); });
|
var board1 = self.options.boards.find(function (element) {
|
||||||
var board2 = self.options.boards.find(function(element) { return element.id==$(target.parentNode).attr("data-id"); });
|
return element.id == $(source.parentNode).attr("data-id");
|
||||||
|
});
|
||||||
|
var board2 = self.options.boards.find(function (element) {
|
||||||
|
return element.id == $(target.parentNode).attr("data-id");
|
||||||
|
});
|
||||||
var pos1 = self.dragItemPos;
|
var pos1 = self.dragItemPos;
|
||||||
var pos2 = (sibling) ? self.findElementPosition(sibling) : (board2.item.length + 1);
|
var pos2 = (sibling) ? self.findElementPosition(sibling) : (board2.item.length + 1);
|
||||||
console.log("Drop element " + pos1 + " before " + pos2);
|
console.log("Drop element " + pos1 + " before " + pos2);
|
||||||
@ -199,7 +221,9 @@ var dragula = require('dragula');
|
|||||||
|
|
||||||
// add Element to JSON
|
// add Element to JSON
|
||||||
var boardJSON = __findBoardJSON(boardID);
|
var boardJSON = __findBoardJSON(boardID);
|
||||||
boardJSON.item.push({ title : element.title });
|
boardJSON.item.push({
|
||||||
|
title: element.title
|
||||||
|
});
|
||||||
var board = self.element.querySelector('[data-id="' + boardID + '"] .kanban-drag');
|
var board = self.element.querySelector('[data-id="' + boardID + '"] .kanban-drag');
|
||||||
var nodeItem = document.createElement('div');
|
var nodeItem = document.createElement('div');
|
||||||
nodeItem.classList.add('kanban-item');
|
nodeItem.classList.add('kanban-item');
|
||||||
@ -494,22 +518,33 @@ var dragula = require('dragula');
|
|||||||
}());
|
}());
|
||||||
|
|
||||||
|
|
||||||
},{"dragula":9}],2:[function(require,module,exports){
|
}, {
|
||||||
module.exports = function atoa (a, n) { return Array.prototype.slice.call(a, n); }
|
"dragula": 9
|
||||||
|
}],
|
||||||
|
2: [function (require, module, exports) {
|
||||||
|
module.exports = function atoa(a, n) {
|
||||||
|
return Array.prototype.slice.call(a, n);
|
||||||
|
}
|
||||||
|
|
||||||
},{}],3:[function(require,module,exports){
|
}, {}],
|
||||||
|
3: [function (require, module, exports) {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
var ticky = require('ticky');
|
var ticky = require('ticky');
|
||||||
|
|
||||||
module.exports = function debounce(fn, args, ctx) {
|
module.exports = function debounce(fn, args, ctx) {
|
||||||
if (!fn) { return; }
|
if (!fn) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
ticky(function run() {
|
ticky(function run() {
|
||||||
fn.apply(ctx || null, args || []);
|
fn.apply(ctx || null, args || []);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
},{"ticky":10}],4:[function(require,module,exports){
|
}, {
|
||||||
|
"ticky": 10
|
||||||
|
}],
|
||||||
|
4: [function (require, module, exports) {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
var atoa = require('atoa');
|
var atoa = require('atoa');
|
||||||
@ -518,7 +553,9 @@ var debounce = require('./debounce');
|
|||||||
module.exports = function emitter(thing, options) {
|
module.exports = function emitter(thing, options) {
|
||||||
var opts = options || {};
|
var opts = options || {};
|
||||||
var evt = {};
|
var evt = {};
|
||||||
if (thing === undefined) { thing = {}; }
|
if (thing === undefined) {
|
||||||
|
thing = {};
|
||||||
|
}
|
||||||
thing.on = function (type, fn) {
|
thing.on = function (type, fn) {
|
||||||
if (!evt[type]) {
|
if (!evt[type]) {
|
||||||
evt[type] = [fn];
|
evt[type] = [fn];
|
||||||
@ -540,7 +577,9 @@ module.exports = function emitter (thing, options) {
|
|||||||
evt = {};
|
evt = {};
|
||||||
} else {
|
} else {
|
||||||
var et = evt[type];
|
var et = evt[type];
|
||||||
if (!et) { return thing; }
|
if (!et) {
|
||||||
|
return thing;
|
||||||
|
}
|
||||||
et.splice(et.indexOf(fn), 1);
|
et.splice(et.indexOf(fn), 1);
|
||||||
}
|
}
|
||||||
return thing;
|
return thing;
|
||||||
@ -554,10 +593,18 @@ module.exports = function emitter (thing, options) {
|
|||||||
return function () {
|
return function () {
|
||||||
var args = atoa(arguments);
|
var args = atoa(arguments);
|
||||||
var ctx = this || thing;
|
var ctx = this || thing;
|
||||||
if (type === 'error' && opts.throws !== false && !et.length) { throw args.length === 1 ? args[0] : args; }
|
if (type === 'error' && opts.throws !== false && !et.length) {
|
||||||
|
throw args.length === 1 ? args[0] : args;
|
||||||
|
}
|
||||||
et.forEach(function emitter(listen) {
|
et.forEach(function emitter(listen) {
|
||||||
if (opts.async) { debounce(listen, args, ctx); } else { listen.apply(ctx, args); }
|
if (opts.async) {
|
||||||
if (listen._once) { thing.off(type, listen); }
|
debounce(listen, args, ctx);
|
||||||
|
} else {
|
||||||
|
listen.apply(ctx, args);
|
||||||
|
}
|
||||||
|
if (listen._once) {
|
||||||
|
thing.off(type, listen);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
return thing;
|
return thing;
|
||||||
};
|
};
|
||||||
@ -565,7 +612,11 @@ module.exports = function emitter (thing, options) {
|
|||||||
return thing;
|
return thing;
|
||||||
};
|
};
|
||||||
|
|
||||||
},{"./debounce":3,"atoa":2}],5:[function(require,module,exports){
|
}, {
|
||||||
|
"./debounce": 3,
|
||||||
|
"atoa": 2
|
||||||
|
}],
|
||||||
|
5: [function (require, module, exports) {
|
||||||
(function (global) {
|
(function (global) {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
@ -613,6 +664,7 @@ function fabricateEvent (el, type, model) {
|
|||||||
} else {
|
} else {
|
||||||
el.fireEvent('on' + type, e);
|
el.fireEvent('on' + type, e);
|
||||||
}
|
}
|
||||||
|
|
||||||
function makeClassicEvent() {
|
function makeClassicEvent() {
|
||||||
var e;
|
var e;
|
||||||
if (doc.createEvent) {
|
if (doc.createEvent) {
|
||||||
@ -623,8 +675,11 @@ function fabricateEvent (el, type, model) {
|
|||||||
}
|
}
|
||||||
return e;
|
return e;
|
||||||
}
|
}
|
||||||
|
|
||||||
function makeCustomEvent() {
|
function makeCustomEvent() {
|
||||||
return new customEvent(type, { detail: model });
|
return new customEvent(type, {
|
||||||
|
detail: model
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -632,8 +687,12 @@ function wrapperFactory (el, type, fn) {
|
|||||||
return function wrapper(originalEvent) {
|
return function wrapper(originalEvent) {
|
||||||
var e = originalEvent || global.event;
|
var e = originalEvent || global.event;
|
||||||
e.target = e.target || e.srcElement;
|
e.target = e.target || e.srcElement;
|
||||||
e.preventDefault = e.preventDefault || function preventDefault () { e.returnValue = false; };
|
e.preventDefault = e.preventDefault || function preventDefault() {
|
||||||
e.stopPropagation = e.stopPropagation || function stopPropagation () { e.cancelBubble = true; };
|
e.returnValue = false;
|
||||||
|
};
|
||||||
|
e.stopPropagation = e.stopPropagation || function stopPropagation() {
|
||||||
|
e.cancelBubble = true;
|
||||||
|
};
|
||||||
e.which = e.which || e.keyCode;
|
e.which = e.which || e.keyCode;
|
||||||
fn.call(el, e);
|
fn.call(el, e);
|
||||||
};
|
};
|
||||||
@ -670,7 +729,11 @@ function find (el, type, fn) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
}).call(this, typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
|
}).call(this, typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
|
||||||
},{"./eventmap":6,"custom-event":7}],6:[function(require,module,exports){
|
}, {
|
||||||
|
"./eventmap": 6,
|
||||||
|
"custom-event": 7
|
||||||
|
}],
|
||||||
|
6: [function (require, module, exports) {
|
||||||
(function (global) {
|
(function (global) {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
@ -687,17 +750,21 @@ for (eventname in global) {
|
|||||||
module.exports = eventmap;
|
module.exports = eventmap;
|
||||||
|
|
||||||
}).call(this, typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
|
}).call(this, typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
|
||||||
},{}],7:[function(require,module,exports){
|
}, {}],
|
||||||
|
7: [function (require, module, exports) {
|
||||||
(function (global) {
|
(function (global) {
|
||||||
|
|
||||||
var NativeCustomEvent = global.CustomEvent;
|
var NativeCustomEvent = global.CustomEvent;
|
||||||
|
|
||||||
function useNative() {
|
function useNative() {
|
||||||
try {
|
try {
|
||||||
var p = new NativeCustomEvent('cat', { detail: { foo: 'bar' } });
|
var p = new NativeCustomEvent('cat', {
|
||||||
return 'cat' === p.type && 'bar' === p.detail.foo;
|
detail: {
|
||||||
} catch (e) {
|
foo: 'bar'
|
||||||
}
|
}
|
||||||
|
});
|
||||||
|
return 'cat' === p.type && 'bar' === p.detail.foo;
|
||||||
|
} catch (e) {}
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -739,7 +806,8 @@ function CustomEvent (type, params) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
}).call(this, typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
|
}).call(this, typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
|
||||||
},{}],8:[function(require,module,exports){
|
}, {}],
|
||||||
|
8: [function (require, module, exports) {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
var cache = {};
|
var cache = {};
|
||||||
@ -774,7 +842,8 @@ module.exports = {
|
|||||||
rm: rmClass
|
rm: rmClass
|
||||||
};
|
};
|
||||||
|
|
||||||
},{}],9:[function(require,module,exports){
|
}, {}],
|
||||||
|
9: [function (require, module, exports) {
|
||||||
(function (global) {
|
(function (global) {
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
@ -805,18 +874,42 @@ function dragula (initialContainers, options) {
|
|||||||
var _grabbed; // holds mousedown context until first mousemove
|
var _grabbed; // holds mousedown context until first mousemove
|
||||||
|
|
||||||
var o = options || {};
|
var o = options || {};
|
||||||
if (o.moves === void 0) { o.moves = always; }
|
if (o.moves === void 0) {
|
||||||
if (o.accepts === void 0) { o.accepts = always; }
|
o.moves = always;
|
||||||
if (o.invalid === void 0) { o.invalid = invalidTarget; }
|
}
|
||||||
if (o.containers === void 0) { o.containers = initialContainers || []; }
|
if (o.accepts === void 0) {
|
||||||
if (o.isContainer === void 0) { o.isContainer = never; }
|
o.accepts = always;
|
||||||
if (o.copy === void 0) { o.copy = false; }
|
}
|
||||||
if (o.copySortSource === void 0) { o.copySortSource = false; }
|
if (o.invalid === void 0) {
|
||||||
if (o.revertOnSpill === void 0) { o.revertOnSpill = false; }
|
o.invalid = invalidTarget;
|
||||||
if (o.removeOnSpill === void 0) { o.removeOnSpill = false; }
|
}
|
||||||
if (o.direction === void 0) { o.direction = 'vertical'; }
|
if (o.containers === void 0) {
|
||||||
if (o.ignoreInputTextSelection === void 0) { o.ignoreInputTextSelection = true; }
|
o.containers = initialContainers || [];
|
||||||
if (o.mirrorContainer === void 0) { o.mirrorContainer = doc.body; }
|
}
|
||||||
|
if (o.isContainer === void 0) {
|
||||||
|
o.isContainer = never;
|
||||||
|
}
|
||||||
|
if (o.copy === void 0) {
|
||||||
|
o.copy = false;
|
||||||
|
}
|
||||||
|
if (o.copySortSource === void 0) {
|
||||||
|
o.copySortSource = false;
|
||||||
|
}
|
||||||
|
if (o.revertOnSpill === void 0) {
|
||||||
|
o.revertOnSpill = false;
|
||||||
|
}
|
||||||
|
if (o.removeOnSpill === void 0) {
|
||||||
|
o.removeOnSpill = false;
|
||||||
|
}
|
||||||
|
if (o.direction === void 0) {
|
||||||
|
o.direction = 'vertical';
|
||||||
|
}
|
||||||
|
if (o.ignoreInputTextSelection === void 0) {
|
||||||
|
o.ignoreInputTextSelection = true;
|
||||||
|
}
|
||||||
|
if (o.mirrorContainer === void 0) {
|
||||||
|
o.mirrorContainer = doc.body;
|
||||||
|
}
|
||||||
|
|
||||||
var drake = emitter({
|
var drake = emitter({
|
||||||
containers: o.containers,
|
containers: o.containers,
|
||||||
@ -1184,9 +1277,22 @@ function dragula (initialContainers, options) {
|
|||||||
dropTarget.insertBefore(item, reference);
|
dropTarget.insertBefore(item, reference);
|
||||||
drake.emit('shadow', item, dropTarget, _source);
|
drake.emit('shadow', item, dropTarget, _source);
|
||||||
}
|
}
|
||||||
function moved (type) { drake.emit(type, item, _lastDropTarget, _source); }
|
|
||||||
function over () { if (changed) { moved('over'); } }
|
function moved(type) {
|
||||||
function out () { if (_lastDropTarget) { moved('out'); } }
|
drake.emit(type, item, _lastDropTarget, _source);
|
||||||
|
}
|
||||||
|
|
||||||
|
function over() {
|
||||||
|
if (changed) {
|
||||||
|
moved('over');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function out() {
|
||||||
|
if (_lastDropTarget) {
|
||||||
|
moved('out');
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function spillOver(el) {
|
function spillOver(el) {
|
||||||
@ -1194,7 +1300,9 @@ function dragula (initialContainers, options) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function spillOut(el) {
|
function spillOut(el) {
|
||||||
if (drake.dragging) { classes.add(el, 'gu-hide'); }
|
if (drake.dragging) {
|
||||||
|
classes.add(el, 'gu-hide');
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function renderMirrorImage() {
|
function renderMirrorImage() {
|
||||||
@ -1246,8 +1354,12 @@ function dragula (initialContainers, options) {
|
|||||||
for (i = 0; i < len; i++) {
|
for (i = 0; i < len; i++) {
|
||||||
el = dropTarget.children[i];
|
el = dropTarget.children[i];
|
||||||
rect = el.getBoundingClientRect();
|
rect = el.getBoundingClientRect();
|
||||||
if (horizontal && (rect.left + rect.width / 2) > x) { return el; }
|
if (horizontal && (rect.left + rect.width / 2) > x) {
|
||||||
if (!horizontal && (rect.top + rect.height / 2) > y) { return el; }
|
return el;
|
||||||
|
}
|
||||||
|
if (!horizontal && (rect.top + rect.height / 2) > y) {
|
||||||
|
return el;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
@ -1297,9 +1409,15 @@ function touchy (el, op, type, fn) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function whichMouseButton(e) {
|
function whichMouseButton(e) {
|
||||||
if (e.touches !== void 0) { return e.touches.length; }
|
if (e.touches !== void 0) {
|
||||||
if (e.which !== void 0 && e.which !== 0) { return e.which; } // see https://github.com/bevacqua/dragula/issues/261
|
return e.touches.length;
|
||||||
if (e.buttons !== void 0) { return e.buttons; }
|
}
|
||||||
|
if (e.which !== void 0 && e.which !== 0) {
|
||||||
|
return e.which;
|
||||||
|
} // see https://github.com/bevacqua/dragula/issues/261
|
||||||
|
if (e.buttons !== void 0) {
|
||||||
|
return e.buttons;
|
||||||
|
}
|
||||||
var button = e.button;
|
var button = e.button;
|
||||||
if (button !== void 0) { // see https://github.com/jquery/jquery/blob/99e8ff1baa7ae341e94bb89c3e84570c7c3ad9ea/src/event.js#L573-L575
|
if (button !== void 0) { // see https://github.com/jquery/jquery/blob/99e8ff1baa7ae341e94bb89c3e84570c7c3ad9ea/src/event.js#L573-L575
|
||||||
return button & 1 ? 1 : button & 2 ? 3 : (button & 4 ? 2 : 0);
|
return button & 1 ? 1 : button & 2 ? 3 : (button & 4 ? 2 : 0);
|
||||||
@ -1334,21 +1452,46 @@ function getElementBehindPoint (point, x, y) {
|
|||||||
return el;
|
return el;
|
||||||
}
|
}
|
||||||
|
|
||||||
function never () { return false; }
|
function never() {
|
||||||
function always () { return true; }
|
return false;
|
||||||
function getRectWidth (rect) { return rect.width || (rect.right - rect.left); }
|
}
|
||||||
function getRectHeight (rect) { return rect.height || (rect.bottom - rect.top); }
|
|
||||||
function getParent (el) { return el.parentNode === doc ? null : el.parentNode; }
|
function always() {
|
||||||
function isInput (el) { return el.tagName === 'INPUT' || el.tagName === 'TEXTAREA' || el.tagName === 'SELECT' || isEditable(el); }
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
|
function getRectWidth(rect) {
|
||||||
|
return rect.width || (rect.right - rect.left);
|
||||||
|
}
|
||||||
|
|
||||||
|
function getRectHeight(rect) {
|
||||||
|
return rect.height || (rect.bottom - rect.top);
|
||||||
|
}
|
||||||
|
|
||||||
|
function getParent(el) {
|
||||||
|
return el.parentNode === doc ? null : el.parentNode;
|
||||||
|
}
|
||||||
|
|
||||||
|
function isInput(el) {
|
||||||
|
return el.tagName === 'INPUT' || el.tagName === 'TEXTAREA' || el.tagName === 'SELECT' || isEditable(el);
|
||||||
|
}
|
||||||
|
|
||||||
function isEditable(el) {
|
function isEditable(el) {
|
||||||
if (!el) { return false; } // no parents were editable
|
if (!el) {
|
||||||
if (el.contentEditable === 'false') { return false; } // stop the lookup
|
return false;
|
||||||
if (el.contentEditable === 'true') { return true; } // found a contentEditable element in the chain
|
} // no parents were editable
|
||||||
|
if (el.contentEditable === 'false') {
|
||||||
|
return false;
|
||||||
|
} // stop the lookup
|
||||||
|
if (el.contentEditable === 'true') {
|
||||||
|
return true;
|
||||||
|
} // found a contentEditable element in the chain
|
||||||
return isEditable(getParent(el)); // contentEditable is set to 'inherit'
|
return isEditable(getParent(el)); // contentEditable is set to 'inherit'
|
||||||
}
|
}
|
||||||
|
|
||||||
function nextEl(el) {
|
function nextEl(el) {
|
||||||
return el.nextElementSibling || manually();
|
return el.nextElementSibling || manually();
|
||||||
|
|
||||||
function manually() {
|
function manually() {
|
||||||
var sibling = el;
|
var sibling = el;
|
||||||
do {
|
do {
|
||||||
@ -1386,13 +1529,24 @@ function getCoord (coord, e) {
|
|||||||
module.exports = dragula;
|
module.exports = dragula;
|
||||||
|
|
||||||
}).call(this, typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
|
}).call(this, typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : typeof window !== "undefined" ? window : {})
|
||||||
},{"./classes":8,"contra/emitter":4,"crossvent":5}],10:[function(require,module,exports){
|
}, {
|
||||||
var si = typeof setImmediate === 'function', tick;
|
"./classes": 8,
|
||||||
|
"contra/emitter": 4,
|
||||||
|
"crossvent": 5
|
||||||
|
}],
|
||||||
|
10: [function (require, module, exports) {
|
||||||
|
var si = typeof setImmediate === 'function',
|
||||||
|
tick;
|
||||||
if (si) {
|
if (si) {
|
||||||
tick = function (fn) { setImmediate(fn); };
|
tick = function (fn) {
|
||||||
|
setImmediate(fn);
|
||||||
|
};
|
||||||
} else {
|
} else {
|
||||||
tick = function (fn) { setTimeout(fn, 0); };
|
tick = function (fn) {
|
||||||
|
setTimeout(fn, 0);
|
||||||
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
module.exports = tick;
|
module.exports = tick;
|
||||||
},{}]},{},[1]);
|
}, {}]
|
||||||
|
}, {}, [1]);
|
||||||
@ -1,25 +0,0 @@
|
|||||||
html, body {
|
|
||||||
margin: 0px;
|
|
||||||
padding: 0px;
|
|
||||||
}
|
|
||||||
#sbox-iframe {
|
|
||||||
position:fixed;
|
|
||||||
top:0px;
|
|
||||||
left:0px;
|
|
||||||
bottom:0px;
|
|
||||||
right:0px;
|
|
||||||
width:100%;
|
|
||||||
height:100%;
|
|
||||||
border:none;
|
|
||||||
margin:0;
|
|
||||||
padding:0;
|
|
||||||
overflow:hidden;
|
|
||||||
}
|
|
||||||
#sbox-filePicker-iframe {
|
|
||||||
position: fixed;
|
|
||||||
top:0; left:0;
|
|
||||||
bottom:0; right:0;
|
|
||||||
width:100%;
|
|
||||||
height: 100%;
|
|
||||||
border: 0;
|
|
||||||
}
|
|
||||||
@ -1,43 +0,0 @@
|
|||||||
// Load #1, load as little as possible because we are in a race to get the loading screen up.
|
|
||||||
define([
|
|
||||||
'/bower_components/nthen/index.js',
|
|
||||||
'/api/config',
|
|
||||||
'/common/dom-ready.js',
|
|
||||||
'/common/requireconfig.js',
|
|
||||||
'/common/sframe-common-outer.js',
|
|
||||||
], function (nThen, ApiConfig, DomReady, RequireConfig, SFCommonO) {
|
|
||||||
var requireConfig = RequireConfig();
|
|
||||||
|
|
||||||
// Loaded in load #2
|
|
||||||
nThen(function (waitFor) {
|
|
||||||
DomReady.onReady(waitFor());
|
|
||||||
}).nThen(function (waitFor) {
|
|
||||||
var req = {
|
|
||||||
cfg: requireConfig,
|
|
||||||
req: [ '/common/loading.js' ],
|
|
||||||
pfx: window.location.origin
|
|
||||||
};
|
|
||||||
window.rc = requireConfig;
|
|
||||||
window.apiconf = ApiConfig;
|
|
||||||
document.getElementById('sbox-iframe').setAttribute('src',
|
|
||||||
ApiConfig.httpSafeOrigin + '/kanban/inner.html?' + requireConfig.urlArgs +
|
|
||||||
'#' + encodeURIComponent(JSON.stringify(req)));
|
|
||||||
|
|
||||||
// This is a cheap trick to avoid loading sframe-channel in parallel with the
|
|
||||||
// loading screen setup.
|
|
||||||
var done = waitFor();
|
|
||||||
var onMsg = function (msg) {
|
|
||||||
var data = JSON.parse(msg.data);
|
|
||||||
if (data.q !== 'READY') { return; }
|
|
||||||
window.removeEventListener('message', onMsg);
|
|
||||||
var _done = done;
|
|
||||||
done = function () { };
|
|
||||||
_done();
|
|
||||||
};
|
|
||||||
window.addEventListener('message', onMsg);
|
|
||||||
}).nThen(function (/*waitFor*/) {
|
|
||||||
SFCommonO.start({
|
|
||||||
useCreationScreen: true
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
Loading…
x
Reference in New Issue
Block a user