Hugging Face's logo

Spaces:
eaglelandsonce
/
Kanban
Running

App Files Community
eaglelandsonce commited on
Commit
358edfe
·
verified ·
1 Parent(s): 0395171

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +19 -4
index.html CHANGED
@@ -34,6 +34,10 @@
34
  margin: 10px 0;
35
  cursor: move;
36
  }
 
 
 
 
37
  </style>
38
  </head>
39
  <body>
@@ -44,26 +48,27 @@
44
  {
45
  title: "To Do",
46
  cards: [
47
- { id: 118, title: "Publish the blog post announcing the new app" },
48
- { id: 116, title: "Update our marketing website about the new app" }
49
  ]
50
  },
51
  {
52
  title: "Doing",
53
  cards: [
54
- { id: 115, title: "Prepare the app for public launch" }
55
  ]
56
  },
57
  {
58
  title: "Done",
59
  cards: [
60
- { id: 117, title: "Release the app in private preview with early adopters" }
61
  ]
62
  }
63
  ];
64
 
65
  function createKanbanBoard(config) {
66
  const board = document.getElementById('kanban-board');
 
67
  config.forEach(column => {
68
  const columnElement = document.createElement('div');
69
  columnElement.classList.add('column');
@@ -79,6 +84,7 @@
79
  const cardId = e.dataTransfer.getData('text');
80
  const card = document.getElementById(cardId);
81
  e.target.appendChild(card);
 
82
  });
83
 
84
  column.cards.forEach(card => {
@@ -100,6 +106,15 @@
100
  });
101
  }
102
 
 
 
 
 
 
 
 
 
 
103
  createKanbanBoard(config);
104
  </script>
105
  </body>
 
34
  margin: 10px 0;
35
  cursor: move;
36
  }
37
+ .column.complete {
38
+ background-color: #d4edda;
39
+ border-color: #c3e6cb;
40
+ }
41
  </style>
42
  </head>
43
  <body>
 
48
  {
49
  title: "To Do",
50
  cards: [
51
+ { id: 1, title: "Identify key requirements for the healthcare product." },
52
+ { id: 2, title: "Define initial user stories for MVP development." }
53
  ]
54
  },
55
  {
56
  title: "Doing",
57
  cards: [
58
+ { id: 3, title: "Develop prototype features based on feedback." }
59
  ]
60
  },
61
  {
62
  title: "Done",
63
  cards: [
64
+ { id: 4, title: "Conduct stakeholder meetings to finalize project goals." }
65
  ]
66
  }
67
  ];
68
 
69
  function createKanbanBoard(config) {
70
  const board = document.getElementById('kanban-board');
71
+
72
  config.forEach(column => {
73
  const columnElement = document.createElement('div');
74
  columnElement.classList.add('column');
 
84
  const cardId = e.dataTransfer.getData('text');
85
  const card = document.getElementById(cardId);
86
  e.target.appendChild(card);
87
+ checkCompletion(columnElement);
88
  });
89
 
90
  column.cards.forEach(card => {
 
106
  });
107
  }
108
 
109
+ function checkCompletion(columnElement) {
110
+ const cards = columnElement.querySelectorAll('.card');
111
+ const totalCards = cards.length;
112
+ if (totalCards === config[0].cards.length + config[1].cards.length + config[2].cards.length) {
113
+ columnElement.classList.add('complete');
114
+ alert('Congratulations! All tasks have been moved to this column.');
115
+ }
116
+ }
117
+
118
  createKanbanBoard(config);
119
  </script>
120
  </body>