-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbuilder.html
110 lines (94 loc) · 4.04 KB
/
builder.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<link rel="stylesheet" href="src/styles.css" />
</head>
<body>
<div class="scrollable-container">
<button id="loadLocalCredentials" class="settings-button" >Load Credentials</button>
<div class="row" >
<input id="Todoist-Auth-Key" type="text" class="row-input" placeholder="Please Enter Todoist Auth"></input>
</div>
<button id="saveLocalCredentials" class="settings-button" >Save Credentials</button>
<button id="GetProject" class="add-row-button" >Get Project</button>
<button id="addRow" class="add-row-button" onclick="addRowInput('')">Add Row</button>
<div id="rows"></div>
<button id="submit" class="build-button">Build template</button>
<div id="projectResults" class="row"></div>
</div>
<script src="https://miro.com/app/static/sdk.1.1.js"></script>
<script src="src/builder.js"></script>
<script>
const LS_KEY = 'todoist-plugin-widget-info'
const TODOIST_PROJECT_ENDOPINT = 'https://api.todoist.com/sync/v8/projects/get_data'
//Settings Menu
document.getElementById('loadLocalCredentials').addEventListener('click', () => loadLocalCreds())
document.getElementById('saveLocalCredentials').addEventListener('click', () => saveLocalCreds())
document.getElementById('GetProject').addEventListener('click', () => getTodoistProject())
function getTodoistProject()
{
const xhttp = new XMLHttpRequest();
xhttp.onload = function() {
document.getElementById("projectResults").innerHTML = this.responseText;
}
xhttp.open("POST", TODOIST_PROJECT_ENDOPINT);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.setRequestHeader("Authorization", "Bearer 089333937092f88ab1e2fa4c4c1448b60ccb2e83");
// xhttp.setRequestHeader("Access-Control-Allow-Origin", "*");
// xhttp.setRequestHeader("Access-Control-Allow-Headers", "Accept");
// xhttp.setRequestHeader("Access-Control-Allow-Methods", "PUT, POST, OPTIONS");
xhttp.setRequestHeader("Access-Control-Allow-Credentials", "true");
// xhttp.setRequestHeader("Access-Control-Allow-Headers", "Special-Request-Header");
xhttp.send("{ 'project_id': '2272713050' }");
}
function loadLocalCreds() {
savedAuth = getData()
document.getElementById('Todoist-Auth-Key').value = savedAuth
}
function saveLocalCreds() {
let authKey = document.getElementById('Todoist-Auth-Key').value
saveData(authKey)
alert('Credentials Saved!')
}
function saveData(text) {
const LS_KEY = 'todoist-plugin-widget-info'
let data = localStorage.getItem(LS_KEY) || {}
localStorage.setItem(LS_KEY, text)
}
function getData() {
let data = localStorage.getItem(LS_KEY) || {}
return data || ''
}
//Normal Menu
const rowsContainer = document.getElementById('rows')
addRowInput('FRONT-END')
addRowInput('BACK-END')
addRowInput('DESIGN')
addRowInput('MARKETING')
document.getElementById('submit').addEventListener('click', () => drawTemplate(getLabels()))
function addRowInput(value, readOnly = false) {
const row = document.createElement('div')
row.classList.add('row')
rowsContainer.appendChild(row)
//create input
const input = document.createElement('input')
input.type = 'text'
input.classList.add('row-input')
input.value = value
row.appendChild(input)
//create delete button
const button = document.createElement('button')
button.textContent = 'Delete'
button.classList.add('delete-button')
button.addEventListener('click', () => {
row.remove()
})
row.appendChild(button)
}
function getLabels() {
return Array.from(rowsContainer.querySelectorAll('input')).map((el) => el.value)
}
</script>
</body>
</html>