Ron Au commited on
Commit
d1d8eae
1 Parent(s): 61d63d5

Initial Commit

Browse files
Files changed (1) hide show
  1. index.js +26 -26
index.js CHANGED
@@ -1,39 +1,39 @@
1
- if (document.location.search.includes('dark-theme=true')) {
2
- document.body.classList.add('dark-theme');
3
  }
4
 
5
  const textToImage = async (text) => {
6
- const inferenceResponse = await fetch(`/infer_biggan?input=${text}`);
7
  const inferenceBlob = await inferenceResponse.blob();
8
 
9
  return URL.createObjectURL(inferenceBlob);
10
  };
11
 
12
  const translateText = async (text) => {
13
- const inferResponse = await fetch(`/infer_t5?input=${text}`);
14
  const inferJson = await inferResponse.json();
15
 
16
  return inferJson.output;
17
  };
18
 
19
  const queryDataset = async (start, end) => {
20
- const queryResponse = await fetch(`/query_emotion?start=${start}&end=${end}`);
21
  const queryJson = await queryResponse.json();
22
 
23
  return queryJson.output;
24
  };
25
 
26
  const updateTable = async (cursor, range = 5) => {
27
- const table = document.querySelector('.dataset-output');
28
 
29
  const fragment = new DocumentFragment();
30
 
31
  const observations = await queryDataset(cursor, cursor + range);
32
 
33
  for (const observation of observations) {
34
- let row = document.createElement('tr');
35
- let text = document.createElement('td');
36
- let emotion = document.createElement('td');
37
 
38
  text.textContent = observation.text;
39
  emotion.textContent = observation.emotion;
@@ -43,12 +43,12 @@ const updateTable = async (cursor, range = 5) => {
43
  fragment.appendChild(row);
44
  }
45
 
46
- table.innerHTML = '';
47
 
48
  table.appendChild(fragment);
49
 
50
  table.insertAdjacentHTML(
51
- 'afterbegin',
52
  `<thead>
53
  <tr>
54
  <td>text</td>
@@ -58,17 +58,17 @@ const updateTable = async (cursor, range = 5) => {
58
  );
59
  };
60
 
61
- const imageGenSelect = document.getElementById('image-gen-input');
62
- const imageGenImage = document.querySelector('.image-gen-output');
63
- const textGenForm = document.querySelector('.text-gen-form');
64
- const tableButtonPrev = document.querySelector('.table-previous');
65
- const tableButtonNext = document.querySelector('.table-next');
66
 
67
  let cursor = 0;
68
  const RANGE = 5;
69
  const LIMIT = 16_000;
70
 
71
- imageGenSelect.addEventListener('change', async (event) => {
72
  const value = event.target.value;
73
 
74
  try {
@@ -78,11 +78,11 @@ imageGenSelect.addEventListener('change', async (event) => {
78
  }
79
  });
80
 
81
- textGenForm.addEventListener('submit', async (event) => {
82
  event.preventDefault();
83
 
84
- const textGenInput = document.getElementById('text-gen-input');
85
- const textGenParagraph = document.querySelector('.text-gen-output');
86
 
87
  try {
88
  textGenParagraph.textContent = await translateText(textGenInput.value);
@@ -91,27 +91,27 @@ textGenForm.addEventListener('submit', async (event) => {
91
  }
92
  });
93
 
94
- tableButtonPrev.addEventListener('click', () => {
95
  cursor = cursor > RANGE ? cursor - RANGE : 0;
96
 
97
  if (cursor < RANGE) {
98
- tableButtonPrev.classList.add('hidden');
99
  }
100
  if (cursor < LIMIT - RANGE) {
101
- tableButtonNext.classList.remove('hidden');
102
  }
103
 
104
  updateTable(cursor);
105
  });
106
 
107
- tableButtonNext.addEventListener('click', () => {
108
  cursor = cursor < LIMIT - RANGE ? cursor + RANGE : cursor;
109
 
110
  if (cursor >= RANGE) {
111
- tableButtonPrev.classList.remove('hidden');
112
  }
113
  if (cursor >= LIMIT - RANGE) {
114
- tableButtonNext.classList.add('hidden');
115
  }
116
 
117
  updateTable(cursor);
 
1
+ if (document.location.search.includes("dark-theme=true")) {
2
+ document.body.classList.add("dark-theme");
3
  }
4
 
5
  const textToImage = async (text) => {
6
+ const inferenceResponse = await fetch(`infer_biggan?input=${text}`);
7
  const inferenceBlob = await inferenceResponse.blob();
8
 
9
  return URL.createObjectURL(inferenceBlob);
10
  };
11
 
12
  const translateText = async (text) => {
13
+ const inferResponse = await fetch(`infer_t5?input=${text}`);
14
  const inferJson = await inferResponse.json();
15
 
16
  return inferJson.output;
17
  };
18
 
19
  const queryDataset = async (start, end) => {
20
+ const queryResponse = await fetch(`query_emotion?start=${start}&end=${end}`);
21
  const queryJson = await queryResponse.json();
22
 
23
  return queryJson.output;
24
  };
25
 
26
  const updateTable = async (cursor, range = 5) => {
27
+ const table = document.querySelector(".dataset-output");
28
 
29
  const fragment = new DocumentFragment();
30
 
31
  const observations = await queryDataset(cursor, cursor + range);
32
 
33
  for (const observation of observations) {
34
+ let row = document.createElement("tr");
35
+ let text = document.createElement("td");
36
+ let emotion = document.createElement("td");
37
 
38
  text.textContent = observation.text;
39
  emotion.textContent = observation.emotion;
 
43
  fragment.appendChild(row);
44
  }
45
 
46
+ table.innerHTML = "";
47
 
48
  table.appendChild(fragment);
49
 
50
  table.insertAdjacentHTML(
51
+ "afterbegin",
52
  `<thead>
53
  <tr>
54
  <td>text</td>
 
58
  );
59
  };
60
 
61
+ const imageGenSelect = document.getElementById("image-gen-input");
62
+ const imageGenImage = document.querySelector(".image-gen-output");
63
+ const textGenForm = document.querySelector(".text-gen-form");
64
+ const tableButtonPrev = document.querySelector(".table-previous");
65
+ const tableButtonNext = document.querySelector(".table-next");
66
 
67
  let cursor = 0;
68
  const RANGE = 5;
69
  const LIMIT = 16_000;
70
 
71
+ imageGenSelect.addEventListener("change", async (event) => {
72
  const value = event.target.value;
73
 
74
  try {
 
78
  }
79
  });
80
 
81
+ textGenForm.addEventListener("submit", async (event) => {
82
  event.preventDefault();
83
 
84
+ const textGenInput = document.getElementById("text-gen-input");
85
+ const textGenParagraph = document.querySelector(".text-gen-output");
86
 
87
  try {
88
  textGenParagraph.textContent = await translateText(textGenInput.value);
 
91
  }
92
  });
93
 
94
+ tableButtonPrev.addEventListener("click", () => {
95
  cursor = cursor > RANGE ? cursor - RANGE : 0;
96
 
97
  if (cursor < RANGE) {
98
+ tableButtonPrev.classList.add("hidden");
99
  }
100
  if (cursor < LIMIT - RANGE) {
101
+ tableButtonNext.classList.remove("hidden");
102
  }
103
 
104
  updateTable(cursor);
105
  });
106
 
107
+ tableButtonNext.addEventListener("click", () => {
108
  cursor = cursor < LIMIT - RANGE ? cursor + RANGE : cursor;
109
 
110
  if (cursor >= RANGE) {
111
+ tableButtonPrev.classList.remove("hidden");
112
  }
113
  if (cursor >= LIMIT - RANGE) {
114
+ tableButtonNext.classList.add("hidden");
115
  }
116
 
117
  updateTable(cursor);