YTQuestion v1

narikakun · Aug 3, 2021 · e2cdb60 · e2cdb60
1 parent 0f66e70
commit e2cdb60
Show file tree

Hide file tree

Showing 9 changed files with 250 additions and 0 deletions.
diff --git a/admin.html b/admin.html
@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="ja">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <link rel="stylesheet" href="style.css">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+    <title>YTQuestion Admin</title>
+    <meta property="og:type" content="website" />
+  </head>
+  <body>
+    <h1 class="title">「<span id="title"></span>」の管理画面</h1>
+    <p id="nextdelete" class="send">削除して次へ</p>
+    <div class="box1">
+        <p id="nowc"></p>
+        <p id="nowid" style="display: none;"></p>
+    </div>
+    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
+    <script src="admin.js"></script>
+  </body>
+</html>
diff --git a/admin.js b/admin.js
@@ -0,0 +1,38 @@
+function _c (id) {
+    $.getJSON("https://mc3.nakn.jp/api/ytquestion", { adminget: id}).done(function(data) {
+        if (data.firstid == Number($('#nowid').text())) return;
+        $('#nowid').text("");
+        $('#nowc').text("");
+        $('#title').text(data.title);
+        $('#nowid').text(data.firstid);
+        $('#nowc').text(data.first?data.first:"何も届いていません");
+    }).fail(function(err) {
+        $('#nowc').text("接続出来ません");
+    });
+}
+
+$('#nextdelete').on('click', function() {
+    $('#nowc').text("");    
+    $.getJSON("https://mc3.nakn.jp/api/ytquestion", { adminget: decodeURIComponent(_getargs().get), type: "nextdelete", nowid: $('#nowid').text() }).done(function(data) {
+        $('#nowid').text("");
+        $('#title').text(data.title);
+        $('#nowid').text(data.firstid);
+        $('#nowc').text(data.first?data.first:"何も届いていません");
+    }).fail(function(err) {
+        $('#nowc').text("接続出来ません");
+    });
+});
+
+function _getargs () {
+    var arg  = new Object;
+    url = location.search.substring(1).split('&');
+    for(i=0; url[i]; i++) { var k = url[i].split('='); arg[k[0]] = k[1];}
+    return arg;
+}
+
+$(function () {
+    _c(decodeURIComponent(_getargs().get));
+    setInterval(() => {
+        _c(decodeURIComponent(_getargs().get));
+    }, 1000);
+});
diff --git a/create.html b/create.html
@@ -0,0 +1,26 @@
+<!DOCTYPE html>
+<html lang="ja">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <link rel="stylesheet" href="style.css">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+    <title>YTQuestion Create</title>
+    <meta property="og:type" content="website" />
+  </head>
+  <body>
+    <h1 class="title">ルーム作成</h1>
+    <div id="createg">
+        <p style="color: red;" id="emsg"></p>
+        <input class="titlecreate" id="titlec">
+        <br />
+        <p id="createb" class="send">作成</p>
+    </div>
+    <div class="box1">
+        <p>公開用URL: <span id="showurl"></span><br />管理用URL: <span id="adminurl"></span><br />配信用URL: <span id="liveurl"></span></p>
+    </div>
+    <p></p>
+    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
+    <script src="create.js"></script>
+  </body>
+</html>
diff --git a/create.js b/create.js
@@ -0,0 +1,12 @@
+$('#createb').on('click', function() {
+    $('#emsg').text("");
+    $('#createg').hide();
+    $.getJSON("https://mc3.nakn.jp/api/ytquestion", { create: $('#titlec').val() }).done(function(data) {
+        $('#showurl').html(`<a href="file:///J:/yocch/%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88/GitHub/YTQuestion/index.html?get=${data.showurl}">file:///J:/yocch/%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88/GitHub/YTQuestion/index.html?get=${data.showurl}</a>`);
+        $('#adminurl').html(`<a href="file:///J:/yocch/%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88/GitHub/YTQuestion/admin.html?get=${data.adminurl}">file:///J:/yocch/%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88/GitHub/YTQuestion/admin.html?get=${data.adminurl}</a>`);
+        $('#liveurl').html(`<a href="file:///J:/yocch/%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88/GitHub/YTQuestion/show.html?get=${data.adminurl}">file:///J:/yocch/%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88/GitHub/YTQuestion/show.html?get=${data.adminurl}</a>`);
+    }).fail(function(err) {
+        $('#emsg').text("うまく作れませんでした。。。");
+        $('#createg').show();
+    });
+});
diff --git a/index.html b/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE html>
+<html lang="ja">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <link rel="stylesheet" href="style.css">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+    <title>YTQuestion</title>
+    <meta property="og:type" content="website" />
+  </head>
+  <body>
+    <h1 class="title" id="title">通信中...</h1>
+    <div id="sendg">
+        <p style="color: red;" id="emsg"></p>
+        <textarea id="content" class="c"></textarea>
+        <br />
+        <p id="send" class="send">送信する</p>
+    </div>
+    <p id="msg"></p>
+    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
+    <script src="main.js"></script>
+  </body>
+</html>
diff --git a/main.js b/main.js
@@ -0,0 +1,29 @@
+function _c (id) {
+    $.getJSON("https://mc3.nakn.jp/api/ytquestion", { get: id}).done(function(data) {
+        $('#title').text(data.title);
+    }).fail(function(err) {
+        $('#title').text("接続出来ません");
+    });
+}
+
+$('#send').on('click', function() {
+    $('#emsg').text("");
+    $('#sendg').hide();
+    $.getJSON("https://mc3.nakn.jp/api/ytquestion", { send: _getargs().get, content: $('#content').val() }).done(function(data) {
+        $('#msg').text("送信しました。");
+    }).fail(function(err) {
+        $('#emsg').text("うまく送れませんでした。。");
+        $('#sendg').show();
+    });
+});
+
+function _getargs () {
+    var arg  = new Object;
+    url = location.search.substring(1).split('&');
+    for(i=0; url[i]; i++) { var k = url[i].split('='); arg[k[0]] = k[1];}
+    return arg;
+}
+
+$(function () {
+    _c(decodeURIComponent(_getargs().get));
+});
diff --git a/now.js b/now.js
@@ -0,0 +1,26 @@
+function _c (id) {
+    $.getJSON("https://mc3.nakn.jp/api/ytquestion", { nowshow: id}).done(function(data) {
+        if (data.firstid == Number($('#nowid').text())) return;
+        $('#nowid').text("");
+        $('#nowc').text("");
+        $('#title').text(data.title);
+        $('#nowid').text(data.firstid);
+        $('#nowc').text(data.first?data.first:"募集中...");
+    }).fail(function(err) {
+        $('#nowc').text("接続出来ません");
+    });
+}
+
+function _getargs () {
+    var arg  = new Object;
+    url = location.search.substring(1).split('&');
+    for(i=0; url[i]; i++) { var k = url[i].split('='); arg[k[0]] = k[1];}
+    return arg;
+}
+
+$(function () {
+    _c(decodeURIComponent(_getargs().get));
+    setInterval(() => {
+        _c(decodeURIComponent(_getargs().get));
+    }, 1000);
+});
diff --git a/show.html b/show.html
@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="ja">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <link rel="stylesheet" href="style.css">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+    <title>YTQuestion Show</title>
+    <meta property="og:type" content="website" />
+  </head>
+  <body>
+    <h1 class="title">「<span id="title"></span>」の表示画面</h1>
+    <p class="nowcs" id="nowc"></p>
+    <p id="nowid" style="display: none;"></p>
+    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
+    <script src="now.js"></script>
+  </body>
+</html>
diff --git a/style.css b/style.css
@@ -0,0 +1,57 @@
+html {
+    text-align: center;
+}
+
+.title {
+    font-size: 2em;
+}
+
+.send {
+    display: inline-block;
+    padding: 0.2em 1.2em;
+    text-decoration: none;
+    color: #333333;
+    border: solid 2px #333333;
+    border-radius: 3px;
+    transition: .4s;
+    font-size: 1.5em;
+}
+
+.send:hover {
+    background: #333333;
+    color: white;
+}
+
+.c {
+    width: 60%;
+    height: 200px;
+    padding: 10px 15px;
+    font-size: 16px;
+    border-radius: 3px;
+    border: 2px solid #ddd;
+    box-sizing: border-box;
+}
+
+.titlecreate {
+    width: 60%;
+    padding: 10px 15px;
+    font-size: 16px;
+    border-radius: 3px;
+    border: 2px solid #ddd;
+    box-sizing: border-box;
+}
+
+.box1 {
+    padding: 0.5em 1em;
+    margin: 2em 0;
+    font-weight: bold;
+    border: solid 3px #000000;
+}
+.box1 p {
+    margin: 0; 
+    padding: 0;
+}
+
+.nowcs {
+    font-size: 3em;
+}