Merge pull request #783 from project-primera/feat/destruction-twitter…

…-integration

Twitter連携機能を削除し、画像を生成機能へ変更

OngekiScoreLog/resources/assets/js/userProgress.ts

@@ -10,21 +10,14 @@ async function convert(element: HTMLElement, index: number) {
     await pr.then(canvas => {
         ++renderingState
         let base64 = canvas.toDataURL();
-        base64 = base64.substring(base64.indexOf(",") + 1);
 
-        $('form').append(
-            $('<input type="hidden" name="img[' + index + ']">').val(base64)
+        $('div#generate_images').append(
+            $("<img>").attr("src", base64)
         );
 
         $('.progress').val(renderingState / images * 100);
         $(".progress-message").text("画像化中: " + renderingState + "/" + images + "(" + Math.round(renderingState / images * 100) + "%)");
 
-        if (images - 1 <= renderingState) {
-            // $('.user-progress').css('width','auto');
-            $('.progress').val(100);
-            $(".progress-message").text("ツイート中・・・");
-            $('.convert-to-image-button').prop("disabled", false);
-        }
     }).catch((res) => {
         $(".progress-message").text("エラーが発生しました。<br>" + JSON.stringify(res));
         throw res;
@@ -55,6 +48,5 @@ $(function ($) {
         }
 
         $('.progress').removeClass("is-progress").removeAttr("value").removeAttr("max");
-        $('#tweet_form').submit();
     })
 });

OngekiScoreLog/resources/assets/sass/_user_progress.scss

@@ -1,3 +1,12 @@
+#generate_images {
+    img {
+        border: 1px solid #1fc8db;
+        width: 128px;
+        margin-left: 8px;
+        margin-top: 8px;
+    }
+}
+
 .user-progress{
     .info{
         width: 100%;

OngekiScoreLog/resources/views/user_progress.blade.php

@@ -23,29 +23,18 @@
 
 @section('content')
     <article class="box">
-        @if (!$isLoggedIn)
-            <p>ツイート機能を使うにはログインしてください。<br><button class="button" disabled>以下を画像化してツイート</button></p>
-        @elseif (!$isTwitterEnabled)
-            <p>Twitter連携を行っていません。連携は<a href="/setting">こちら</a>。<br>
-                <button class="button" disabled>以下を画像化してツイート</button></p>
-        @else
-            <p>このアカウントでツイートします: {{$twitterScreenName}}</p>
-            <form id="tweet_form" action="/tweet/image" method="post" onsubmit="document.getElementById(\'submit_button\').disabled = true">
-                {{csrf_field()}}
-                <div class="field">
-                    <label class="label">ツイートの内容(100文字まで)</label>
-                    <div class="control">
-                        <textarea name="status" class="textarea" maxlength="100">{{$status[0]->name}}さんの更新差分 https://ongeki-score.net/user/{{$id}} #OngekiScoreLog</textarea>
-                    </div>
-                </div>
-                <button type="button" id="submit_button" class="button convert-to-image-button">以下を画像化してツイート</button>
-            </form><div style="padding: 0.75em 0">
-                <div class="progress-message"></div>
-                <progress class="progress is-progress is-link" value="0" max="100">0%</progress>
-            </div>
-            <p>全ての記録をツイートします。４枚に収まらない場合はインリプライに続きます。(1枚につき7曲)<br>
-                <b>初めてこの機能を使用する場合は大量のツイートがされる可能性があります。十分注意して使用いただくようお願いいたします。</b></p>
-        @endif
+        <p>
+            Twitter連携機能はAPIを利用制限されたため、提供を終了いたしました。<br>
+            必要に応じて画像を保存し、各種SNSにてご利用ください。
+        </p>
+        <button type="button" id="submit_button" class="button convert-to-image-button">以下を画像化</button>
+        <div style="padding: 0.75em 0">
+            <div class="progress-message"></div>
+            <progress class="progress is-progress is-link" value="0" max="100">0%</progress>
+        </div>
+
+        <div id="generate_images"></div>
+
         <div class="field">
             <label class="label">表示期間</label>
             <div id="select-generation" class="select">