generated from xinemata/leafy
-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
132 lines (115 loc) · 3.93 KB
/
script.js
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
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
// editable info
const publicSpreadsheetUrl =
"ma SHEET FEUILLE"; // change this to your own URL
const categoryStartNum = 3; // let the program know where the categoy begins on the spreadsheet column. Default value is 3.
const sheetName = "Sheet1"; // this has to match your google doc sheet name
const punctuation = ","; // this changes the punctuation between the title and the description. In most cases you'd want to use "," or "-" or ":"
// tableTop.js script
function init() {
Tabletop.init({
key: publicSpreadsheetUrl,
callback: showInfo,
simpleSheet: true
});
}
function showInfo(data, tabletop) {
const checked = "x";
const columnArray = tabletop.sheets()[sheetName].columnNames;
const columnName = [columnArray.length];
for (let j = 0; j < columnArray.length; j++) {
columnName[j] = columnArray[j];
}
// create sorting buttons
for (let j = categoryStartNum; j < columnArray.length; j++) {
addButton(columnName[j]);
}
for (let i = categoryStartNum; i < columnArray.length; i++) {
for (let j = 0; j < data.length; j++) {
if (data[j][columnName[i]] == checked) {
addElement(
columnName[i],
data[j][columnName[0]],
data[j][columnName[1]],
data[j][columnName[2]]
);
}
}
}
// alert("Successfully processed!"); // check if data is imported
}
function addButton(columnName) {
const newButton = document.createElement("BUTTON");
const newButtonContent = document.createTextNode(columnName);
newButton.appendChild(newButtonContent);
newButton.className = "btn";
newButton.addEventListener("click", function() {
filterSelection(columnName);
btnOff(); // turns off all active buttons
newButton.classList.add("active"); // turn this button on
});
document.getElementById("myBtnContainer").appendChild(newButton);
}
function btnOff() {
let btnClassArray = document.getElementsByClassName("btn");
for (let i = 0; i < btnClassArray.length; i++) {
if (btnClassArray[i].classList.contains("active")) {
btnClassArray[i].classList.remove("active");
}
}
}
function addElement(columnName, person, url, description) {
const hashtag1 = ["filterDiv"];
const hashtag2 = [columnName];
const hashtagArray = hashtag1.concat(hashtag2);
const hashtagString = hashtagArray.join(" ");
const newDiv = document.createElement("div");
newDiv.className = hashtagString;
// place individual link inside individual div
for (let i = 0; i < 1; i++) {
let link = document.createElement("a");
let linkContent = document.createTextNode(person);
link.appendChild(linkContent);
link.title = person;
link.href = url;
link.className = "itemLink";
let para = document.createElement("p");
let paraContent = document.createTextNode(`${punctuation} ${description}`);
para.appendChild(paraContent);
para.className = "itemPara";
para.appendChild(link); // put <a> into <p>
link.after(paraContent); // put <p> description after <a>
newDiv.appendChild(para); // put <p> into newDiv
}
document.getElementsByClassName("container")[0].appendChild(newDiv);
}
window.addEventListener("DOMContentLoaded", init);
// filter script
function filterSelection(c) {
var x, i;
x = document.getElementsByClassName("filterDiv");
for (i = 0; i < x.length; i++) {
w3RemoveClass(x[i], "show");
if (x[i].className.indexOf(c) > -1) w3AddClass(x[i], "show");
}
}
function w3AddClass(element, name) {
var i, arr1, arr2;
arr1 = element.className.split(" ");
arr2 = name.split(" ");
for (i = 0; i < arr2.length; i++) {
if (arr1.indexOf(arr2[i]) == -1) {
element.className += " " + arr2[i];
}
}
}
function w3RemoveClass(element, name) {
var i, arr1, arr2;
arr1 = element.className.split(" ");
arr2 = name.split(" ");
for (i = 0; i < arr2.length; i++) {
while (arr1.indexOf(arr2[i]) > -1) {
arr1.splice(arr1.indexOf(arr2[i]), 1);
}
}
element.className = arr1.join(" ");
}