-
Notifications
You must be signed in to change notification settings - Fork 0
/
backup_content.js
2793 lines (2468 loc) · 443 KB
/
backup_content.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
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
// 윈도우 로드 시 실행
window.addEventListener("load", async function () {
// 현재 URL이 https://sdfedu.seoul.kr/main/intro.jsp라면 실행하지 않음
if (window.location.href === "https://sdfedu.seoul.kr/main/intro.jsp") {
return;
}
// 함수 호출
await checkUser();
console.group("Get User Info");
getUserInfo().then((result) => {
if (result == undefined) {
console.log("위즈 비활성화");
createChatBox("notLoggedIn");
}
else if (result.total_level == undefined) {
console.log("역량진단 미실시");
createChatBox("notTested");
}
else {
console.log("위즈 활성화");
createChatBox("LoggedIn");
}
console.groupEnd();
});
console.log("after check ");
const currentURL = window.location.href;
const targetURL =
"https://sdfedu.seoul.kr/main/page.jsp?pid=course2.dexam&cid=dexam";
const targetURL2 =
"https://sdfedu.seoul.kr/main/page.jsp?pid=course2.dexam&cid=dexam#";
//
if (currentURL === targetURL || currentURL === targetURL2) {
document.querySelector('.scont').remove();
const startButton = document.querySelector('.sub_btn_area');
if (startButton) {
startButton.addEventListener('click', createDiagnosis_1);
}
}
// 경로가 /classroom/exam으로 시작하는 경우
if (window.location.pathname.startsWith("/classroom/exam")) {
// 현재 페이지가 시험방이 맞는지 확인
const tb_title = document.querySelector(".tb_title");
const title = tb_title.textContent;
// 현재 진도율이 100.0%인지 확인
const progress_tag = document.querySelector(".li3 b");
const progress = progress_tag.textContent;
// 시험 보기 버튼 달기
if (title === "시험방" && progress === "100.0" ) {
const tbTopDiv = document.querySelector(".tb_top");
if (tbTopDiv) {
const button = document.createElement("button");
button.id = "test_button";
button.innerText = "시험 보기";
tbTopDiv.appendChild(button);
button.addEventListener("click", goTest);
}
}
}
});
// ----------희민 언니 시험방 문제 코드----------
let questionNum = 1; // 문제 번호
let leftChance = 2; // 3번까지 기회
const point = 70; // 기준 정확도
const totalQuestion = 10; // 총 문제 개수
let totalScore = 0; // 총점 계산
let startTime; // 시험 시작 시간
let elapsedTime; // 시험 종료 시간
// 문제 저장 배열
let questionTitle=new Array(totalQuestion+1);
let score = new Array(totalQuestion + 1); // 각각 점수 계산
let pass = new Array(totalQuestion + 1); // 패스 여부 저장
for (let i = 0; i <= totalQuestion; i++) {
pass[i] = false;
}
function startTimer2() {
startTime = new Date();
}
function stopTimer2() {
const endTime = new Date();
const totalTime = Math.floor((endTime - startTime) / 1000); // 밀리초를 초로 변환
const minutes = Math.floor(totalTime / 60); // 분 계산
const seconds = totalTime % 60; // 초 계산
// 분과 초를 문자열 형태로 변환
const formattedMinutes = String(minutes).padStart(2, "0");
const formattedSeconds = String(seconds).padStart(2, "0");
elapsedTime = `${formattedMinutes}:${formattedSeconds}`; // 분:초 형태로 반환
}
// 시험보기 버튼 클릭 시
async function goTest() {
// 알림창
if (!confirm("시험을 보시겠습니까?")) {
return;
}
else{
// 서버에서 문제 불러와서 questionTitle 배열에 저장
let lectureName = document.querySelector("#class-title").textContent;
await setQuestion(lectureName);
}
// 타이머 시작
startTimer2();
// 기존 태그 삭제
const testButton = document.querySelector("#test_button");
const testList = document.querySelector(".tb_box.tb_list");
testButton.remove();
testList.remove();
// 문제 포맷 작성 ------------------------------------------------------
// 부모 div
const contentArea = document.querySelector(".content_area");
// 문제 보여주기 && 답안 입력받기 칸
const questionDiv = document.createElement("div");
questionDiv.id = "question_div";
// 문제 번호 보여주는 span
const questionNumberSpan = document.createElement("span");
questionNumberSpan.id = "question_number_span";
questionNumberSpan.textContent = "문제" + questionNum;
questionDiv.append(questionNumberSpan);
// 문제 보여주는 span
const questionTitleSpan = document.createElement("span");
questionTitleSpan.id = "question_title_span";
questionTitleSpan.textContent=questionTitle[questionNum];
questionDiv.append(questionTitleSpan);
// 제출 시 정확도 보여주는 span -> 제출 전에는 속성 "none"
const accuracySpan = document.createElement("span");
accuracySpan.id = "accuracy_span";
accuracySpan.textContent = "80%";
questionDiv.append(accuracySpan);
// 사용자가 정답을 입력할 textarea
const answerArea = document.createElement("textarea");
answerArea.id = "answer_area";
answerArea.placeholder = "이곳에 정답을 입력하세요.";
questionDiv.append(answerArea);
// 답변 제출 버튼
const submitButton = document.createElement("button");
submitButton.id = "submit_button";
submitButton.innerText = "답변 제출";
submitButton.addEventListener("click", submitAnswer);
// 위즈의 해설, 정답 여부를 알려주는 div
const answerDiv = document.createElement("div");
answerDiv.id = "answer_div";
answerDiv.innerText = "";
// 다음 문제로 넘어가는 버튼
const nextButton = document.createElement("button");
nextButton.id = "next_button";
nextButton.innerText = "다음 문제 > ";
nextButton.addEventListener("click", nextPage);
// 부모 div에 append
contentArea.appendChild(questionDiv);
contentArea.appendChild(submitButton);
contentArea.appendChild(answerDiv);
contentArea.appendChild(nextButton);
// --------------------------------------------------------
}
function setQuestion(lectureName) {
return new Promise((resolve) => {
questionTitle[0] = null;
chrome.runtime.sendMessage(
chrome.runtime.id,
{ type: "request_question", lecture: lectureName },
function (response) {
if (response) {
for (let i = 1; i <= totalQuestion; i++) {
questionTitle[i] = response.question[i - 1].question_title;
}
}
resolve(); // Promise 완료
}
);
});
}
// 제출하기 버튼 클릭 시 - 서버에 정답 보내고 정확도 가져오기
function submitAnswer() {
// 제출 여부 저장
pass[questionNum] = true;
// 사용자 답안 저장
const textarea = document.querySelector("#answer_area");
const userAnswer = textarea.value;
let hasMoreChance = true;
if (leftChance <= 0) hasMoreChance = false;
// background.js와 통신
chrome.runtime.sendMessage(
chrome.runtime.id,
{
type: "user_answer",
questionId: questionNum,
answer: userAnswer,
moreChance: hasMoreChance,
},
function (response) {
if (response) {
// 정확도 표시
const accuracy = document.querySelector("#accuracy_span");
accuracy.style.display = "inline"; // 정확도 보이게
accuracy.textContent = response.accuracy + "%";
score[questionNum] = response.accuracy; // 개별 점수 저장
// 결과 표시
const feedback = document.querySelector("#answer_div");
// 정확도가 기준 이상 -> 정답처리
if (response.accuracy > point) {
feedback.textContent = "정답입니다! ";
feedback.textContent += response.message; // 위즈의 해설
}
// 정확도가 기준 이하 -> 오답처리 && 남은 기회 모두 소진 -> 시험 종료
else if (!hasMoreChance) {
alert('기회를 모두 소진하였습니다.');
location.reload();
return;
}
// 정확도가 기준 이하 -> 오답처리 && 남은 기회 존재
else {
feedback.textContent = response.message; // 다시 시도해보세요.
leftChance--; // 기회 하나씩 차감
}
} else {
console.log("No response");
}
}
);
}
// 다음문제 버튼 클릭 시
function nextPage() {
// 제출이 되지 않았을 때 토스트 메세지 출력
if (!pass[questionNum]) {
const toast = document.createElement("div");
toast.classList.add("toast");
toast.textContent = "답안을 제출해 주세요.";
document.body.appendChild(toast);
setTimeout(function () {
toast.classList.add("show");
}, 100);
setTimeout(function () {
toast.classList.remove("show");
setTimeout(function () {
document.body.removeChild(toast);
}, 300);
}, 2000);
return;
}
// 문제 번호 ++, 남은 기회 초기화
questionNum++;
leftChance = 2;
// 피드백 초기화
const feedback = document.querySelector("#answer_div");
feedback.textContent = "";
// 마지막 문제 - 종료
if (questionNum > totalQuestion) {
if (confirm("마지막 문제입니다. 점수를 확인하시겠습니까?")) {
stopTimer2(); // 타이머 종료
showResult(document.querySelector("#class-title").textContent);
updateResult();
}
return;
}
// 문제 번호 span
const questionNumberSpan = document.querySelector("#question_number_span");
questionNumberSpan.textContent = "문제" + questionNum;
// 문제 span
const questionTitleSpan = document.querySelector("#question_title_span");
questionTitleSpan.id = "question_title_span";
questionTitleSpan.textContent=questionTitle[questionNum];
// 정확도 span
const accuracySpan = document.querySelector("#accuracy_span");
accuracySpan.style.display = "none";
// 정답란 초기화
const answerArea = document.querySelector("#answer_area");
answerArea.value = "";
answerArea.placeholder = "정답을 입력하세요";
}
// 시험 결과 보여주기
async function showResult(lectureName) {
// 총점 계산
for (let i = 1; i <= totalQuestion; i++) {
totalScore += score[i];
}
// 유저 정보
const a = await getUserInfo();
const userInfo = {
name: a.name,
age: "22",
course: lectureName,
time: elapsedTime,
score: totalScore / totalQuestion,
eachScore: score,
};
// 기존 객체 삭제
document.querySelector("#question_div").remove();
document.querySelector("#next_button").remove();
document.querySelector("#submit_button").remove();
document.querySelector("#answer_div").remove();
// 결과 포맷 작성 ---------------
// 시험방 페이지 구역
const contentArea = document.querySelector(".content_area");
// 결과 창 부모 div
const resultDiv = document.createElement("div");
resultDiv.id = "result_div";
// 이름
const nameDiv = document.createElement("div");
nameDiv.id = "name_div";
nameDiv.textContent = "이름: " + userInfo.name;
// 과목
const courseDiv = document.createElement("div");
courseDiv.id = "course_div";
courseDiv.textContent = "과목: " + userInfo.course;
// 시험 시간
const timeDiv = document.createElement("div");
timeDiv.id = "time_div";
timeDiv.textContent = "시험 시간: " + userInfo.time;
// 총 점수
const scoreDiv = document.createElement("div");
scoreDiv.id = "score_div";
scoreDiv.textContent = "평균 점수는 " + userInfo.score + " 점 입니다.";
// 문제 별 점수
const eachQuestionDiv = document.createElement("div");
eachQuestionDiv.classList.add("question-scores");
for (let j = 1; j <= totalQuestion; j++) {
// 각각 점수 div
const questionscoreDiv = document.createElement("div");
if (score[j] != undefined) {
// 미제출 여부 검사
questionscoreDiv.textContent = j + "번: " + userInfo.eachScore[j] + "점";
} else {
questionscoreDiv.textContent = j + "번: 0점 (미제출)";
}
eachQuestionDiv.appendChild(questionscoreDiv);
}
// 부모 div에 append
resultDiv.appendChild(nameDiv);
resultDiv.appendChild(courseDiv);
resultDiv.appendChild(scoreDiv);
resultDiv.appendChild(timeDiv);
resultDiv.appendChild(eachQuestionDiv);
contentArea.appendChild(resultDiv);
// ----------------------------
}
// ----------희민 언니 시험방 문제 코드----------
// 크롬 내에 저장된 사용자 정보가 있는지 확인
async function checkUser() {
try {
const userResult = await new Promise((resolve, reject) => {
chrome.storage.sync.get(["user"], function (result) {
resolve(result);
});
});
console.group("Check User");
console.log("[user] value is", userResult);
console.log("[user] type is", typeof userResult);
if (userResult.user != undefined) {
console.log("크롬 내에 저장된 사용자 정보가 있음");
// 이때, 사이트 상태는 현재 로그인 상태인지 확인.
// 사이트 메인 화면에서만 로그인 상태를 확인할 수 있음.
if (window.location.pathname.startsWith("/classroom")) {
console.log("로그인 상태일때만 이 공간에 들어올 수 있습니다.");
console.groupEnd();
} else if (readDocument() == false) {
// 로그아웃 상태라면 사용자 정보를 로컬에서 삭제
await new Promise((resolve, reject) => {
chrome.storage.sync.remove(["user"], function () {
console.log("[user] is removed");
resolve();
});
});
}
} else {
console.log("크롬 내에 저장된 사용자 정보 없음");
// 이때, 사이트 상태는 현재 로그인 상태인지 확인.
if (readDocument() == true) {
// 로그인 상태라면 사용자 정보를 로컬에 저장
const response = await new Promise((resolve, reject) => {
chrome.runtime.sendMessage(
chrome.runtime.id,
{ type: "sign-in", id: "admin", pw: "password" },
function (response) {
resolve(response);
}
);
});
// Handle the server response
if (response.status === "failure") {
console.log("validation 실패. 서버와 id/pw 다름");
} else {
console.log("validation 성공");
response.user_info = JSON.parse(response.user_info);
tmp = document.querySelector(".af_log").textContent;
// "님"을 제거
response.user_info.name = tmp.substring(0, tmp.length - 1);
console.log(response.user_info.total_level);
await new Promise((resolve, reject) => {
chrome.storage.sync.set({ user: response.user_info }, function () {
console.log("[user] is set to", response.user_info);
resolve();
});
});
}
}
}
console.groupEnd();
} catch (error) {
console.error(error);
}
}
// 채팅방 만들기
async function createChatBox(status) {
// 플로팅 아이콘을 생성하고 웹 페이지에 추가
var icon = document.createElement("div");
icon.innerHTML = icon_svg; // icon_svg is const value
icon.classList.add("floating-icon");
document.body.appendChild(icon);
// -----------------사용자 정보가 없다면, 플로팅 아이콘을 회색으로 표시-----------------
if (status === "notLoggedIn") {
icon.style.filter = "grayscale(100%)";
click = icon.querySelector("g");
// 플로팅 아이콘 클릭 시 로그인 페이지로 이동
icon.addEventListener("click", function () {
window.location.href = "https://sdfedu.seoul.kr/member/login.jsp";
});
}
else if (status === "notTested") {
// total_level 필드값이 없다면, 플로팅 아이콘을 회색으로 표시
icon.style.filter = "grayscale(100%)";
click = icon.querySelector("g");
// 플로팅 아이콘 클릭 시 역량진단 페이지로 이동
icon.addEventListener("click", function () {
window.location.href =
"https://sdfedu.seoul.kr/main/page.jsp?pid=course2.dexam&cid=dexam";
});
}
else {
await getUserInfo().then(async (result) => {
// -----------------사용자 정보가 있다면, 플로팅 아이콘을 활성화-----------------
// 채팅박스를 생성하고 웹 페이지에 추가
var chatBox = document.createElement("div");
chatBox.classList.add("chat-container");
chatBox.id = "chatBox";
chatBox.style.display = "none";
chatBox.innerHTML = chatBox_svg; // chatBox_svg is const value
document.body.appendChild(chatBox);
document.body
.querySelector(".resize-handle")
.addEventListener("mousedown", handleResize);
// 사실상 다시 정보 갱신할 필요는 없으나, user_info.json에서 exp 변경 시 게이지 바 달라지는 모습 확인하기 위해 exp 재계산
await calculateLevel(result.exp);
await getUserInfo().then((result) => {
document.querySelector(".user-name").textContent = result.name + "님";
const levelDisplay = document.querySelector(".level-number");
const progressBar = document.querySelector(".progress-bar");
levelDisplay.textContent = "Lv." + result.total_level;
progressBar.style.width = `${result.exp / 16900 * 100}%`;
// Reset the animation
levelDisplay.style.animation = "none";
progressBar.style.animation = "none";
setTimeout(() => {
levelDisplay.style.animation = "pop-in";
progressBar.style.animation = "fill-up";
}, 10);
});
// 기존 대화 내용 표시
// 저장된 HTML이 있다면 불러오기
html = loadHTML();
// console.log(html);
if (html) {
document.querySelector("#chat-area").innerHTML = html;
}
// 아이콘 클릭 시 채팅박스 표시 / 숨기기
document.querySelector("#icon-svg").addEventListener("click", function () {
if (chatBox.style.display === "none") {
showChatBox();
if (html) {
//스크롤을 맨 아래로 내리기
document
.querySelector("#chat-area")
.scrollTo(0, document.querySelector("#chat-area").scrollHeight);
html = null; // 로드해온 내용 지우기
}
} else {
hideChatBox();
}
});
// Esc 키를 누를 때 채팅박스 숨기기
document.addEventListener("keydown", function (event) {
if (event.key === "Escape") {
hideChatBox();
}
});
// 텍스트 입력 시 마다 높이 조절
document
.querySelector("#prompt-textarea")
.addEventListener("input", adjustTextAreaHeight);
document
.querySelector("#prompt-textarea")
.addEventListener("keydown", adjustTextAreaHeight);
// paperPlaneIcon 클릭 시 textarea에 쓰여진 텍스트를 추출
document
.querySelector("#paperPlaneIcon")
.addEventListener("click", function () {
var text = document.querySelector("#prompt-textarea").value.trim(); // 입력된 텍스트에서 양쪽 공백 제거
// value가 있다면 콘솔에 출력
if (text) {
createChatBubble(text, "user");
sendQuestion(text);
}
document.querySelector("#prompt-textarea").value = ""; // textarea 초기화
});
// Enter 키를 누를 때 paperPlaneIcon 클릭 이벤트 발생
document
.querySelector("#prompt-textarea")
.addEventListener("keyup", function (event) {
if (event.key === "Enter") {
event.preventDefault(); // Enter 키의 기본 동작인 줄바꿈을 방지
var clickEvent = new MouseEvent("click", {
bubbles: true,
cancelable: true,
view: window,
});
document.querySelector("#paperPlaneIcon").dispatchEvent(clickEvent);
}
});
// chatClearIcon 클릭 시 채팅 내역 삭제
document.querySelector("#chatClear").addEventListener("click", function () {
if (confirm("정말 삭제하시겠습니까?")) {
document.querySelector("#chat-area").innerHTML = "";
localStorage.clear();
}
});
// 사이트 이동 시 채팅내역 저장
window.addEventListener("beforeunload", function () {
saveHTML(document.querySelector("#chat-area").innerHTML);
});
});
}
return true;
}
// 전송 버튼 클릭 시 - 서버에 유저의 질문 보내기
function sendQuestion(userQuestion) {
// 로딩중 애니메이션 표시
showLoadingAnimation();
chrome.runtime.sendMessage(
chrome.runtime.id,
{ type: "gpt-response", data: userQuestion },
function (response) {
// 로딩 애니메이션 숨김
hideLoadingAnimation();
// response -> gpt의 답변 불러오기
if (response.gpt_response) {
createChatBubble(response.gpt_response, "wiz");
} else {
console.log("No response");
}
}
);
}
// showLoadingAnimation() - 로딩중 애니메이션 표시
function showLoadingAnimation() {
var loading = document.createElement("div");
loading.id = "loading";
loading.innerHTML = loading_svg;
loading.style.paddingTop = "0px";
loading.style.paddingBottom = "0px";
document.body.querySelector("#chat-area").appendChild(loading);
//스크롤을 맨 아래로 내리기
document
.querySelector("#chat-area")
.scrollTo(0, document.querySelector("#chat-area").scrollHeight);
}
// hideLoadingAnimation() - 로딩중 애니메이션 숨기기
function hideLoadingAnimation() {
document.querySelector("#loading").remove();
}
// 채팅박스 표시 함수
function showChatBox() {
document.querySelector("#chatBox").style.display = "block";
document.querySelector(".floating-icon").style.display = "none";
}
// 채팅박스 숨기기 함수
function hideChatBox() {
document.querySelector("#chatBox").style.display = "none";
document.querySelector(".floating-icon").style.display = "block";
}
// 대화 버블 생성 함수
function createChatBubble(text, sender) {
const chatBubble = document.createElement("div");
chatBubble.classList.add("chat-bubble");
// 사용자 대화인 경우 "user" 클래스 추가
if (sender === "user") {
chatBubble.classList.add("user");
} else {
chatBubble.classList.add("wiz");
}
chatBubble.innerHTML = text;
//foreignObject 태그 안에 채팅 추가
document.querySelector("#chat-area").appendChild(chatBubble);
//스크롤을 맨 아래로 내리기
document
.querySelector("#chat-area")
.scrollTo(0, document.querySelector("#chat-area").scrollHeight);
}
function createChatImage(img, sender) {
const chatImage = document.createElement("img");
chatImage.classList.add("chat-image");
chatImage.classList.add(sender);
chatImage.src = img;
//foreignObject 태그 안에 이미지 추가
document.querySelector("#chat-area").appendChild(chatImage);
document
.querySelector("#chat-area")
.scrollTo(0, document.querySelector("#chat-area").scrollHeight);
}
// HTML을 LocalStorage에 저장하는 함수
function saveHTML(html) {
localStorage.setItem("savedHTML", html);
}
// LocalStorage에서 HTML을 가져오는 함수
function loadHTML() {
return localStorage.getItem("savedHTML");
}
// ----------user_info 관련 함수들----------
// 웹 페이지 document 읽기 함수. 읽어서 로그인 상태인지 확인
function readDocument() {
// 로그인 상태 확인. 첫 번째 li 확인
// li의 클래스가 af_log이면 로그인 상태
if (document.querySelector(".util_menu ul li").classList.contains("af_log")) {
// 로그인 상태
console.log("로그인 상태");
return true;
} else {
// 로그인 상태 아님
console.log("로그인 상태 아님");
}
return false;
}
function getUserInfo() {
return new Promise((resolve, reject) => {
chrome.storage.sync.get(["user"], function (result) {
if (result.user == undefined) {
console.log("getUserInfo 실패");
resolve(undefined);
} else {
console.log("getUserInfo 성공");
resolve(result.user);
}
});
});
}
// 크롬 내에 저장된 사용자 정보 가져와서 필드값 변경.
async function setUserInfo(fieldname, value) {
const result = await new Promise((resolve, reject) => {
chrome.storage.sync.get(["user"], (response) => {
if (response.user[fieldname] == undefined) {
console.log("해당 필드가 존재하지 않아, 새로 생성합니다.");
}
response.user[fieldname] = value;
console.log("now result.user is", response.user[fieldname]);
resolve(response);
});
});
await new Promise((resolve, reject) => {
chrome.storage.sync.set({ user: result.user }, function () {
console.log("now [user] is set to", result.user);
resolve();
});
});
// 갱신된 사용자 정보를 서버에 전송
const response = await new Promise((resolve, reject) => {
chrome.runtime.sendMessage(
chrome.runtime.id,
{ type: "update-user-info", data: result.user },
(response) => {
if (response.status != "failure") {
console.log("update-user-info 성공");
resolve(response);
} else {
console.log("update-user-info 실패");
reject();
}
}
);
});
}
// 유저 정보 한번에 저장
async function setUserInfoAll(fields) {
const result = await new Promise((resolve, reject) => {
chrome.storage.sync.get(["user"], (response) => {
if (!response.user) {
response.user = {};
console.log("사용자 정보가 없어, 새로 생성합니다.");
}
for (const fieldname in fields) {
const value = fields[fieldname];
response.user[fieldname] = value;
console.log(`now result.user ${fieldname} is ${response.user[fieldname]}`);
}
resolve(response);
});
});
await new Promise((resolve, reject) => {
chrome.storage.sync.set({ user: result.user }, function () {
console.log("now [user] is set to", result.user);
resolve();
});
});
// 갱신된 사용자 정보를 서버에 전송
const response = await new Promise((resolve, reject) => {
chrome.runtime.sendMessage(
chrome.runtime.id,
{ type: "update-user-info", data: result.user },
(response) => {
if (response.status !== "failure") {
console.log("update-user-info 성공");
resolve(response);
} else {
console.log("update-user-info 실패");
reject();
}
}
);
});
}
// 레벨 계산 함수
// 레벨은 0~9까지 있음.
// 각 레벨별로 채워야하는 exp는 1000, 1100, 1200, 1300, 1400, 1600, 1800, 2000, 2500, 3000
// 따라서 exp의 범위는 0~16900
// 사용자 exp를 토대로, 레벨을 계산하고 progress bar를 업데이트합니다.
async function calculateLevel(exp) {
console.log("calculate", exp);
let progress;
if (exp == undefined) {
console.log("exp is undefined");
return 0;
} else if (exp < 1000) {
level = 0;
} else if (exp < 2100) {
level = 1;
} else if (exp < 3300) {
level = 2;
} else if (exp < 4600) {
level = 3;
} else if (exp < 6000) {
level = 4;
} else if (exp < 7600) {
level = 5;
} else if (exp < 9400) {
level = 6;
} else if (exp < 11400) {
level = 7;
} else if (exp < 13900) {
level = 8;
} else if (exp < 16900) {
level = 9;
} else {
level = 10;
console.log("레벨이 10이상입니다.");
}
// total level 업데이트 안되는 문제 해결
await new Promise(async (resolve, reject) => {
await setUserInfo("total_level", level);
await setUserInfo("exp", exp);
resolve();
return exp / 16900 * 100;
});
}
// ----------user_info 관련 함수들----------
// 채팅 크기 조절을 위한 이벤트 핸들러 함수
function handleResize(event) {
const chatContainer = document.querySelector("#chatBox-svg");
const resizeHandle = event.target;
const initialMouseX = event.clientX;
const initialMouseY = event.clientY;
const initialWidth = chatContainer.clientWidth;
const initialHeight = chatContainer.clientHeight;
const aspectRatio = initialWidth / initialHeight;
function resize(event) {
const currentMouseX = event.clientX;
const currentMouseY = event.clientY;
const widthDiff = currentMouseX - initialMouseX;
const heightDiff = currentMouseY - initialMouseY;
let newWidth, newHeight;
if (Math.abs(widthDiff) > Math.abs(heightDiff)) {
newWidth = initialWidth - widthDiff;
newHeight = newWidth / aspectRatio;
} else {
newHeight = initialHeight - heightDiff;
newWidth = newHeight * aspectRatio;
}
chatContainer.style.width = `${newWidth}px`;
chatContainer.style.height = `${newHeight}px`;
}
function stopResize() {
document.removeEventListener("mousemove", resize);
document.removeEventListener("mouseup", stopResize);
}
document.addEventListener("mousemove", resize);
document.addEventListener("mouseup", stopResize);
}
function adjustTextAreaHeight() {
const textarea = document.querySelector("#prompt-textarea");
if (textarea.scrollHeight <= 190) {
textarea.style.height = "auto";
textarea.style.height = `${textarea.scrollHeight}px`;
}
const contentElement = document.querySelector("#content");
const contentHeight = textarea.scrollHeight;
}
//강의 xp 위한 강의 점수 계산
async function getLectureScore() {
let query = window.location.search;
let url = "https://sdfedu.seoul.kr/classroom/index.jsp" + query;
console.log(query);
console.log(url);
let lectureScore = 0;
await fetch(url)
.then((response) => response.text())
.then((html) => {
const parser = new DOMParser();
const document = parser.parseFromString(html, "text/html");
console.log(document);
let lectureTimeList = document.querySelectorAll(".lesson_time");
let totalLectureTime = 0;
for (let i = 0; i < lectureTimeList.length; i++) {
let lectureTime = lectureTimeList[i].textContent;
totalLectureTime += parseInt(lectureTime);
}
//권장 학습 시간 계산 = 강의 학습 시간 총합 * 1.5, 소수점 버림
let recommendedTime = Math.floor(totalLectureTime * 1.5);
console.log("recommendedTime", recommendedTime);
//사용자 학습 시간 총합 계산
let totalUserTime = 0;
let tb_box = document.querySelectorAll(".tb_box.tb_list")[1];
let tbodyElement = tb_box.querySelector("tbody");
let trElements = tbodyElement.querySelectorAll("tr");
// console.log(trElements);
for (let i = 0; i < trElements.length; i++) {
let tdElement = trElements[i].querySelectorAll("td")[2];
let spanElement = tdElement.querySelector("span");
let spanText = spanElement.textContent.trim();
let userTime = parseInt(spanText);
// console.log(userTime);
totalUserTime += userTime;
}
console.log("totalUserTime", totalUserTime);
//강의 점수 계산
let timeDiff = recommendedTime - totalUserTime;
if (timeDiff >= 0) {
//권장 학습 시간보다 빠르게 끝낸 경우
if (recommendedTime * 0.5 - totalUserTime >= 0) lectureScore = 1;
else if (recommendedTime * 0.7 - totalUserTime >= 0) lectureScore = 0.9;
else if (recommendedTime * 0.9 - totalUserTime >= 0) lectureScore = 0.8;
//0.9 ~ 1, 권장 학습 시간 충족
else lectureScore = 0.7;
} else {
lectureScore = 0.7 - ((totalUserTime - recommendedTime) / 60) * 0.1;
}
console.log("lectureScore", lectureScore);
})
.catch((error) => {
console.error("에러 발생:", error);
});
return lectureScore;
}
//시험 통과할 경우 xp 부여, 업데이트
async function updateResult() {
//강의 제목 추출
let lectureTitle = document
.querySelector("#class-title")
.textContent.split("] ")[1];
console.log(lectureTitle);
//이미 수강한 강의인지 확인
let userInfo = await getUserInfo();
courses = userInfo.learning_courses;
if(courses === undefined){
let tmp=[];
await setUserInfo('learning_courses',tmp);
}
userInfo=await getUserInfo();
courses=userInfo.learning_courses;
for (let i = 0; i < courses.length; i++) {