|
| 1 | +let send_text = document.getElementById("send_text"); |
| 2 | +let chat_text = document.getElementById("chat-text") |
| 3 | +let form_text = document.getElementById("form-text") |
| 4 | + |
| 5 | +let i = 1; |
| 6 | +let j = 0; |
| 7 | +let reaction_dic = {} |
| 8 | + |
| 9 | +function show_text() { |
| 10 | + chat_text.innerHTML = send_text.value; |
| 11 | +} |
| 12 | + |
| 13 | +//チャットの追加 |
| 14 | +function add_msg(){ |
| 15 | + j++; |
| 16 | + reaction_dic["reaction" + j] = 0; |
| 17 | + |
| 18 | + //挿入するdivの作成 |
| 19 | + var new_div = document.createElement("div"); |
| 20 | + new_div.setAttribute("id", "msg_div" + j); |
| 21 | + |
| 22 | + //div内のメッセージspanの作成 |
| 23 | + var new_msg_span = document.createElement("span"); |
| 24 | + var new_msg_content = document.createTextNode(send_text.value) |
| 25 | + new_msg_span.appendChild(new_msg_content) |
| 26 | + new_msg_span.setAttribute("class", "msg") |
| 27 | + |
| 28 | + //div内のリアクションinputの作成 |
| 29 | + var new_reaction_input = document.createElement("input"); |
| 30 | + new_reaction_input.setAttribute("value", "😀"+reaction_dic["reaction" + j]); |
| 31 | + new_reaction_input.setAttribute("type", "button") |
| 32 | + new_reaction_input.setAttribute("id", "reaction" + j) |
| 33 | + new_reaction_input.setAttribute("onclick", "disabled = true; push_button(this.id)") |
| 34 | + |
| 35 | + //挿入 |
| 36 | + form_text.insertBefore(new_div, form_text.firstChild); |
| 37 | + target_div = document.getElementById("msg_div" + j) |
| 38 | + target_div.insertBefore(new_msg_span, target_div.firstChild); |
| 39 | + target_div.insertBefore(new_reaction_input ,target_div.firstChild) |
| 40 | +} |
| 41 | + |
| 42 | +function push_button(id){ |
| 43 | + reaction_dic[id]++; |
| 44 | + display_reaction_number(id); |
| 45 | +} |
| 46 | + |
| 47 | +function display_reaction_number(id){ |
| 48 | + var reaction_number = reaction_dic[id]; |
| 49 | + var reaction_button_id = document.getElementById(id); |
| 50 | + reaction_button_id.value = "😀" + reaction_number; |
| 51 | +} |
0 commit comments