thedesk/app/index.html
2018-03-14 15:52:55 +09:00

723 lines
32 KiB
HTML
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="ja">
<head>
<title>TheDesk</title>
<meta content="width=device-width,initial-scale=1.0" name="viewport">
<link href="./css/materialize.css" type="text/css" rel="stylesheet">
<link href="./css/auth.css" type="text/css" rel="stylesheet">
<link href='./css/font-awesome.css' rel='stylesheet' type='text/css'>
<link href='./css/tl.css' rel='stylesheet' type='text/css'>
<link href='./css/userdata.css' rel='stylesheet' type='text/css'>
<link href='./css/post.css' rel='stylesheet' type='text/css'>
<link href="./css/master.css" type="text/css" rel="stylesheet">
<link href='./css/sort.css' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons|Open+Sans:300|Baloo+Bhai" rel="stylesheet">
<meta charset="utf-8">
</head>
<body>
<script type="text/javascript" src="./js/common/jquery.js"></script>
<script type="text/javascript" src="./js/platform/first.js"></script>
<script type="text/javascript" src="./js/common/materialize.js"></script>
<script type="text/javascript" src="./js/ui/tips.js"></script>
<script type="text/javascript" src="./js/common/time.js"></script>
<script type="text/javascript" src="./js/common/version.js"></script>
<script type="text/javascript" src="./js/common/keyshortcut.js"></script>
<script type="text/javascript" src="./js/common/modal.js"></script>
<script type="text/javascript" src="./js/ui/jquery-ui.min.js"></script>
<script>
//トゥートリンク追加
var ver="Airi (ver.4[fixed])";
//betaを入れるとバージョンチェックしない
//var ver="beta";
var acct_id=0;
var tlid=0;
verck(ver);
</script>
<textarea id="copy" style="top:-100px; position:fixed;"></textarea>
<div id="masara">
<!--最初にログインする-->ログインしたいインスタンスのアドレス
<br>
<input type="text" id="url" style="width:70%" placeholder="mstdn.jp">
<div id="ins-suggest">
</div>
<button class="btn waves-effect" onclick="instance()">Login</button>
<br>Linuxでご使用の方はチェックを入れて下さい。
<br>
<input type="checkbox" class="filled-in" id="linux" />
<label for="linux">コードセットアップ</label>
<br>
<span style="font-family:Open Sans;">Supports</span>
<div id="support">
</div>
<br>各インスタンスの独自機能もAPIの範囲内で実装させていただきます。お知らせください。
<a href="https://kirishima.cloud/@Cutls" target="_blank">Cutls P(@Cutls@kirishima.cloud)</a>まで。
<br>ログイン後は設定画面から@Cutls@kirishima.cloudにコンタクトをとることができます。
<br>
<button class="btn waves-effect indigo" onclick="about()">このソフトについて</button>
<br>
</div>
<div id="auth">
<!--PINコードで認証-->指定されたコードを貼り付けてください。ログインウィンドウは閉じていただいて構いません。
<br>
<input type="text" id="code" placeholder="コードを入力">
<button class="btn waves-effect" onclick="code()">認証</button>
<br>
</div>
<div id="tl">
<!--TL-->
<!--ドラッグハンドラ-->
<div id="drag">
<div id="drag-content">ここにドラッグして添付(ドラッグと同時にアップロードされます)
<br>
<button class="btn waves-effect" onclick="closedrop()">閉じる</button>
</div>
</div>
<!--カラム追加-->
<div id="add-box" class="hide z-depth-4 notf-box">
<div class="input-field">アカウント選択
<br>
<select id="add-acct-sel" class="acct-sel" style="color:black"></select>
<label></label>
</div>
<div class="input-field">
<select id="type-sel" style="color:black">
<option value="local">ローカル</option>
<option value="home">ホーム</option>
<option value="pub">連合</option>
<option value="mix">統合(ローカルとホーム)</option>
<option value="notf">通知</option>
</select>
<label>表示するタイムライン</label>
</div>
<button class="btn waves-effect blue " style="width:calc( 100% - 10px);" onclick="addColumn()">
<i class="material-icons left">add</i>追加
</button>
<br>
<br>
<button class="btn waves-effect orange " style="width:calc( 100% - 10px);" onclick="addToggle()">
<i class="material-icons left">close</i>閉じる
</button>
</div>
<!--検索-->
<div id="src-box" class="hide notf-box z-depth-4">
<div class="input-field">
<i class="material-icons prefix">search</i>
<input id="src" type="text" class="validate" style="width:calc( 70% - 40px);">
<br>ハッシュタグを検索するときは#を抜いてください。
<br>検索に使用するアカウント選択を
<br>
<div class="input-field">
<select id="src-acct-sel" class="acct-sel"></select>
<label></label>
</div>
<label for="src">検索</label>
<button class="btn waves-effect indigo" style="width:calc( 60% - 40px);" onclick="src()">
<i class="material-icons left">search</i>検索
</button>
</div>
<div id="search">
<div id="src-contents">
</div>
<button class="btn waves-effect orange " style="width:calc( 100% - 10px);" onclick="srcToggle()">
<i class="material-icons left">close</i>閉じる
</button>
</div>
</div>
<!--並べ替え-->
<div id="sort-box" class="hide notf-box z-depth-4">
<ul id="sort"></ul>
<button onclick="sort()" class="btn waves-effect light-blue nex" style="width:100%; max-width:200px;">
<i class="material-icons left">sort</i>並べ替え設定
</button>
<button class="btn waves-effect orange " style="width:calc( 100% - 10px);" onclick="sortToggle()">
<i class="material-icons left">close</i>閉じる
</button>
</div>
<div id="main">
<!--TLのTL-->
<div id="timeline-container">
</div>
<!--サイドバー-->
<div id="sidebar">
<div id="sidebar-top">
<div class="big-menu" id="add-tgl">
<a onclick="addToggle()" class="nex waves-effect">
<i class="material-icons nex big-icon" title="カラム追加">add</i>
</a>
<br>
<span class="side-label">カラム追加</span>
</div>
<div class="big-menu" id="src-tgl">
<a onclick="srcToggle()" class="nex waves-effect">
<i class="material-icons nex big-icon" title="検索">search</i>
</a>
<br>
<span class="side-label">検索</span>
</div>
<div class="big-menu" id="sort-tgl">
<a onclick="sortToggle()" class="nex waves-effect">
<i class="material-icons nex big-icon" title="並べ替え">sort</i>
</a>
<br>
<span class="side-label">並べ替え</span>
</div>
<div id="side-dead">
</div>
<div class="small-menu">
<a href="setting.html" class="nex waves-effect">
<i class="material-icons nex" title="設定">settings</i>
<span class="side-label">設定</span>
</a>
</div>
<div class="small-menu">
<a href="index.html" class="nex mize waves-effect">
<i class="material-icons nex" title="スーパーリロード">refresh</i>
<span class="side-label">再読込</span>
</a>
</div>
<div class="small-menu">
<a onclick="window.open('https://astarte.thedesk.top');" class="setting nex waves-effect" target="_blank" id="ranking-btn" style="display:none;">
<i class="material-icons nex" title="アスタルテランキング">timeline</i>
<span class="side-label">暇ラン</span>
</a>
</div>
<div class="small-menu">
<a onclick="nano()" class="nex waves-effect">
<i class="material-icons" title="最小のマストドン。TheDesk Nano">remove_from_queue</i>
<span class="side-label">Nano</span>
</a>
</div>
<div class="small-menu">
<a href="acct.html" class="nex waves-effect">
<i class="material-icons" title="アカウントマネージャー">account_circle</i>
<span class="side-label">管理</span>
</a>
</div>
<div id="side-dead">
</div>
<div class="small-menu">
<a onclick="xpand()" class="nex waves-effect">
<i class="material-icons" title="サイドバーの開閉" id="x-btn">keyboard_arrow_right</i>
<span class="side-label">たたむ</span>
</a>
</div>
</div>
<div id="sidebar-btm">
<!--最小化-->
<div id="menu-btn" onclick="show()">
<a class="waves-effect">
<i class="large material-icons">mode_edit</i>
<br>
<span class="side-label">投稿</span>
</a>
</div>
</div>
</div>
</div>
</div>
<div id="post-box" class="z-depth-3">
<!--トゥートボックス-->
<span class="cancel">
<i class="material-icons waves-effect" onclick="hide()" title="このボックスを閉じる(X)">cancel</i>
<i class="material-icons waves-effect mini-btn" onclick="mini()" title="このボックスを最小化">expand_more</i>
</span>
<br>
<a id="clear" class="setting nex waves-effect">
<i class="material-icons nex mize" title="トゥートボックスのクリア">clear</i>
</a>
<a onclick="zoomBox()" class="setting nex waves-effect">
<i class="material-icons nex mize" title="ボックスの拡大・縮小(E)">zoom_out_map</i>
</a>
<a onclick="Rtoggle()" class="setting nex mize waves-effect" id="radio-btn">
<i class="material-icons nex" title="Radio(Select/Pause)">play_circle_outline</i>
</a>
<div id="waveform">
</div>
<span id="radio-sta" class="radio"></span>
<div id="radio-view" class="hide radio mize">
<span class="cbadge pointer waves-effect" onclick="Rplay('https://listen.moe/stream','Listen.moe')" data-name="Listen.moe">Listen.moe</span>
<span class="cbadge pointer waves-effect" onclick="Rplay('http://itori.animenfo.com:443/;','AnimeNfo Radio')" data-name="AnimeNfo Radio">AnimeNfo Radio</span>
<span class="cbadge pointer waves-effect" onclick="Rplay('http://hyades.shoutca.st:8043/stream','LoFi hip hop Radio')" data-name="LoFi hip hop Radio">LoFi hip hop Radio</span>
<span class="cbadge pointer waves-effect" onclick="Rplay('http://89.16.185.174:8004/stream','Linn Classical')" data-name="Linn Classical">Linn Classical</span>
<span class="cbadge pointer waves-effect" onclick="Rplay('http://89.16.185.174:8000/stream','Linn Jazz')" data-name="Linn Jazz">Linn Jazz</span>
<span class="cbadge pointer waves-effect" onclick="Rplay('http://edge-ads-01-cr.sharp-stream.com/jazzfmmobile.aac','Jazz FM')" data-name="Jazz FM">Jazz FM</span>
<span class="cbadge pointer waves-effect" onclick="Rplay('http://91.121.59.45:10024/stream','canal-jazz.eu')" data-name="canal-jazz.eu">canal-jazz.eu</span>
<span class="cbadge pointer waves-effect" onclick="Ryourself()">Others</span>
</div>
<div id="radio-input" class="hide radio mize">
<input type="url" id="radio-url" placeholder="URL" style="width:100px">
<button class="btn waves-effect" onclick="Rinput()">Play</button>
<button class="btn waves-effect" onclick="Rselect()">Presets</button>
</div>
<div class="row" style="margin-bottom:0;">
<span class="sml gray mize">画面内どこでもドラッグ・アンド・ドロップできます。</span>
<span class="mize">
<br>アカウント選択
</span>
<br>
</span>
<div class="input-field mize" style="float:left; width:calc(100% - 24px)">
<select id="post-acct-sel" class="acct-sel" onchange="mdCheck()"></select>
</div>
<div class="mize" style="float:left;">
<a onclick="profShow()" style="vertical-align:-1.5rem;">
<i class="material-icons nex pointer mize waves-effect" title="選択中のプロフィール表示">account_circle</i>
</a>
</div>
<!--Markdown-->
<div class="row" style="margin-bottom:0">
<div class="markdown mize">
<div class="col s12 more-show">
<i class="material-icons pointer setting waves-effect" onclick="tagsel('b')" title="太字(Ctrl+B)テキストボックス内を選択してから押すと囲みます。">format_bold</i>
<i class="material-icons pointer setting waves-effect" onclick="tagsel('i')" title="斜字(Ctrl+I)テキストボックス内を選択してから押すと囲みます。">format_italic</i>
<i class="material-icons pointer setting waves-effect" onclick="tagsel('u')" title="下線(Ctrl+U)テキストボックス内を選択してから押すと囲みます。">format_underlined</i>
<i class="material-icons pointer setting waves-effect" onclick="tagsel('s')" title="取り消し(Ctrl+S)テキストボックス内を選択してから押すと囲みます。">strikethrough_s</i>
<i class="material-icons pointer setting waves-effect" onclick="markdown('>','no','yes')" title="引用">format_quote</i>
<i class="material-icons pointer setting waves-effect" onclick="markdown('#','no','yes')" title="見出し">short_text</i>
<i class="material-icons pointer setting waves-effect" onclick="markdown('`','yes','no')" title="コード挿入 テキストボックス内を選択してから押すと囲みます。">code</i>
<i class="material-icons pointer setting waves-effect" onclick="markdown('- ','yes','yes')" title="箇条書きリスト">format_list_bulleted</i>
<i class="material-icons pointer setting waves-effect" onclick="markdown('1. ','yes','yes')" title="番号付きリスト">format_list_numbered</i>
<i class="pointer setting fa fa-subscript waves-effect" onclick="markdown('__','yes','no','before')" title="下付き文字 テキストボックス内を選択してから押すと囲みます。" style="font-size:1.5rem"></i>
<i class="pointer setting fa fa-superscript waves-effect" onclick="markdown('_','yes','no','before')" title="上付き文字 テキストボックス内を選択してから押すと囲みます。" style="font-size:1.5rem"></i>
<i class="material-icons pointer setting waves-effect" onclick="tagsel('spin')" title="回転 テキストボックス内を選択してから押すと囲みます。">autorenew</i>
<i class="material-icons pointer setting waves-effect" onclick="tagsel('pulse')" title="点滅 テキストボックス内を選択してから押すと囲みます。">flare</i>
<i class="material-icons pointer setting waves-effect" onclick="tagsel('flip=vertical')" title="上下反転 テキストボックス内を選択してから押すと囲みます。">swap_vert</i>
<i class="material-icons pointer setting waves-effect" onclick="tagsel('flip=horizontal')" title="左右反転 テキストボックス内を選択してから押すと囲みます。">swap_horiz</i>
<span class="sml gray pointer waves-effect">
<a onclick="mdToggle()">Markdownエディタを隠す</a>
</span>
<br>
<i class="material-icons pointer setting waves-effect" onclick="tagsel('size')" title="文字サイズ変更 テキストボックス内を選択してから押すと囲みます。">format_size</i>
<input id="size" style="width: calc(50% - 20px); margin: 0; height: 24px;" value="12">px
<i class="material-icons pointer setting waves-effect" onclick="tagsel('colorhex')" title="文字色変更 テキストボックス内を選択してから押すと囲みます。">color_lens</i>
<input id="colorhex" style="width: calc(50% - 50px); margin: 0; height: 24px;" type="color">
<br>
<i class="material-icons pointer setting waves-effect" onclick="markdownLink()" title="リンク挿入">link</i>
<input id="linkt" style="width: calc(50% - 20px); margin: 0; height: 24px;" placeholder="リンクテキスト">&nbsp;
<input id="link2" style="width: calc(50% - 20px); margin: 0; height: 24px;" placeholder="リンクアドレス">
<br>
<i class="material-icons pointer setting waves-effect" onclick="markdownImage()" title="インライン画像挿入">image</i>
<input id="image" style="width: calc(50% - 20px); margin: 0; height: 24px;" placeholder="代替テキスト">&nbsp;
<input id="image2" style="width: calc(50% - 20px); margin: 0; height: 24px;" placeholder="画像アドレス">
</div>
</div>
<div class="input-field col s12" id="preview-field" style="margin-top: 0;">
<div id="md-preview">
</div>
<span class="sml gray pointer">
<a onclick="previewEdit()">Edit</a>
</span>
</div>
<div class="input-field col s12" id="toot-field" style="margin-top: 0;">
<textarea id="textarea" class="materialize-textarea unmize" style="margin-bottom:0;" data-length="500"></textarea>
<label for="textarea">トゥート</label>
<br>
<span class="sml gray pointer more-show markdown mize" id="preview-btn">
<a onclick="preview()">Preview</a>
</span>
<span class="sml gray pointer more-show anti-markdown hide mize">
<a onclick="mdToggle()">Markdownエディタを表示</a>
</span>
<br>
<span id="suggest"></span>
</div>
<div class="col s12 mize" style="margin-bottom:5px;">
<span id="preview" class="mize"></span>
<span class=" sml mize">返信モード:
<span id="rec">いいえ</span>/添付:
<span id="mec">なし</span>/公開範囲:
<span id="vis">public</span>/画像制限:
<span id="nsc">なし</span>
</span>
<br>
<span id="file-wrap mize">
<input class="more-show" type="file" name="pic" id="upfile" onchange="pimg(document.getElementById('upfile').files);" multiple>
</span>
<input type="text" id="cw-text" placeholder="警告文" class="mize">
</div>
<div class="col s3 mize">
<button class="btn waves-effect blue darken-3" style="width:100%; padding:0; margin-top:0;" id="cw" onclick="cw()" title="コンテンツワーニング(トゥートを表示する前にメッセージで隠す)(青:OFF)">CW</button>
</div>
<div class="col s3 mize">
<button class="dropdown-button btn waves-effect purple " style="width:100%; padding:0; margin-top:0;" data-activates='dropdown1' id="vis-icon">
<i class="material-icons">public</i>
</button>
<!-- 公開範囲 Dropdown Structure -->
<ul id='dropdown1' class='dropdown-content'>
<li>公開範囲指定</li>
<li>
<a onclick="vis('public')">公開(Public)</a>
</li>
<li>
<a onclick="vis('unlisted')">未収載(Unlisted)</a>
</li>
<li>
<a onclick="vis('private')">非公開(Private)</a>
</li>
<li>
<a onclick="vis('direct')" class="disabled direct">ダイレクト(Direct)</a>
</li>
</ul>
</div>
<div class="col s3 mize">
<button class="btn waves-effect red darken-3" style="width:100%; padding:0; margin-top:0;" onclick="emoji()" title="絵文字">
<i class="material-icons">tag_faces</i>
</button>
<!--絵文字ピッカー-->
<div id="emoji" class="hide shared z-depth-4">
<span class="gray sml">インスタンスによって実装が異なります。
<i>
<a onclick="emojiGet('true')" class="pointer">絵文字更新</a>
</i>
<br>
</span>
<div id="emoji-list" class="" style="">
</div>
<div class="emoji-control center">
<button class="btn waves-effect blue" style="width:30%; padding:0;" onclick="emojiList('before')" id="emoji-before">
<i class="material-icons">navigate_before</i>
</button>
<span id="emoji-count"></span>/
<span id="emoji-sum"></span>
<button class="btn waves-effect blue" style="width:30%; padding:0;" onclick="emojiList('next')" id="emoji-next">
<i class="material-icons">navigate_next</i>
</button>
</div>
<div id="default-emoji">
<span id="now-emoji"></span>一覧を表示中
<br>
<a onclick="customEmoji()" class="pointer waves-effect" title="カスタム絵文字">
<i class="material-icons">add</i>
</a>
<a onclick="defaultEmoji('people')" class="pointer waves-effect" title="ひと">
<i class="material-icons">people</i>
</a>
<a onclick="defaultEmoji('nature')" class="pointer waves-effect" title="自然">
<i class="material-icons">local_florist</i>
</a>
<a onclick="defaultEmoji('food')" class="pointer waves-effect" title="食べ物">
<i class="material-icons">restaurant</i>
</a>
<a onclick="defaultEmoji('activity')" class="pointer waves-effect" title="活動">
<i class="material-icons">directions_run</i>
</a>
<a onclick="defaultEmoji('place')" class="pointer waves-effect" title="場所">
<i class="material-icons">directions_car</i>
</a>
<a onclick="defaultEmoji('object')" class="pointer waves-effect" title="もの">
<i class="material-icons">attach_file</i>
</a>
<a onclick="defaultEmoji('symbol')" class="pointer waves-effect" title="記号">
<i class="material-icons">gesture</i>
</a>
<a onclick="defaultEmoji('flag')" class="pointer waves-effect" title="国旗">
<i class="material-icons">flag</i>
</a>
</div>
</div>
</div>
<div class="col s3 mize">
<button class="btn waves-effect blue darken-3" style="width:100%; padding:0; margin-top:0;" onclick="nsfw()" id="nsfw" title="画像に制限を付与(青:OFF)">
<i class="material-icons">photo</i>
<i class="material-icons" id="nsi">lock_open</i>
</button>
</div>
</div>
<!--hidden area-->
<input type="hidden" id="reply">
<input type="hidden" id="media">
<!--END hidden area-->
<div class="col s12" id="toot-btn-field">
<button class="btn waves-effect indigo unmize" style="width:100%; padding:0; margin-top:10px;" onclick="post()" id="toot-post-btn">トゥート</button>
</div>
</div>
<!--PiP-->
<div id="pip" class="hide pip-bottom pip-left">
<i class="material-icons pip-horiz pointer" onclick="pipHoriz()">chevron_right</i> 
<i class="material-icons pip-vert pointer" onclick="pipVert()">expand_less</i> 
<i class="material-icons pointer" onclick="endPip()">close</i>
<div id="pip-content">
</div>
</div>
</div>
<!-- Modal Structure Tootdata-->
<div id="tootmodal" class="modal modal-fixed-footer">
<div class="modal-content">
<ul class="collapsible" data-collapsible="accordion" id="det-col">
<li>
<div class="collapsible-header">
<i class="material-icons">arrow_upward</i>これよりあとのコンテクスト
</div>
<div class="collapsible-body toot-reset" id="toot-after">
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">reply_all</i>このトゥートからのリプライ
</div>
<div class="collapsible-body toot-reset" id="toot-reply">
</div>
</li>
<li>
<div class="collapsible-header" id="activator">
<i class="material-icons">more_horiz</i>対象のトゥート
</div>
<div class="collapsible-body toot-reset" id="toot-this">
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">arrow_downward</i>これより前のLocal TL
</div>
<div class="collapsible-body toot-reset" id="toot-before">
</div>
</li>
<li>
<div class="collapsible-header">
<i class="material-icons">star</i>このトゥートをお気に入りに登録した人
</div>
<div class="collapsible-body toot-reset" id="toot-fav">
</div>
</li>
<li>
<div class="collapsible-header">
<i class="text-darken-3 fa fa-retweet"></i>このトゥートをブーストした人
</div>
<div class="collapsible-body toot-reset" id="toot-rt">
</div>
</li>
</ul>
<div id="toot-tools">
</div>
<div id="toot-after">
</div>
</div>
<div class="modal-footer">
<a href="#!" class="waves-effect waves-green btn-flat" onclick="shot()">スクリーンショット</a>
<a href="#!" class="waves-effect waves-green btn-flat" onclick="cbCopy()">URLをコピー</a>
<a href="#!" class="waves-effect waves-green btn-flat" onclick="cbCopy('emb')">埋め込む</a>
<a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">Close</a>
</div>
</div>
<!-- Modal Structure Userdata -->
<div id="his-data" class="modal bottom-sheet modal-fixed-footer" style="max-height:750px; height:90%;">
<div id="his-data-content" class="modal-content" style="padding-bottom: 0;overflow-y:hidden;">
<div id="his-data-show">
<img src="./img/loading.svg" id="his-prof" style="">
<div class="his-float">
<span id="his-name" style="font-size:1.5rem">Loading...</span>
<br>@
<span id="his-acct"></span>
<span class="gray" id="his-relation"></span>
<br>
<span class="cbadge">
<span id="his-sta"></span>トゥート
</span>
<span class="cbadge">フォロー:
<span id="his-follow"></span>
</span>
<span class="cbadge">フォロワー:
<span id="his-follower"></span>
</span>
<span class="cbadge">Since:
<span id="his-since"></span>
</div>
<div class="his-float">
<span id="his-des"></span>
<br>
</div>
<div class="row">
<div class="col s12" id="my-data-nav">
<ul class="custom-tabs transparent">
<li class="custom-tab col my-data-width active-back">
<a go="#his-tl">Timeline</a>
</li>
<li class="custom-tab col my-data-width">
<a go="#his-follow-list">Follows</a>
</li>
<li class="custom-tab col my-data-width">
<a go="#his-follower-list">Followers</a>
</li>
<li class="custom-tab col my-data-width only-my-data">
<a go="#his-fav-list">Favorites</a>
</li>
<li class="custom-tab col my-data-width only-my-data">
<a go="#his-blocking-list">Blocking</a>
</li>
<li class="custom-tab col my-data-width only-my-data">
<a go="#his-muting-list">Muting</a>
</li>
<li class="custom-tab col my-data-width only-my-data">
<a go="#his-domain-list">Domain Blocking</a>
</li>
<li class="custom-tab col my-data-width only-my-data">
<a go="#his-prof-list">Edit Profile</a>
</li>
<li class="custom-tab col my-data-width only-my-data">
<a go="#his-request-list">Follow Request</a>
</li>
</ul>
</div>
<div id="his-tl" class="col s12 tab-content">
<div id="his-tl-contents" class="cont-series">
</div>
<button class="btn waves-effect " style="width:100%; padding:0;" onclick="utl('--now','more')">もっと</button>
</div>
<div id="his-follow-list" class="col s12 tab-content">
<div id="his-follow-list-contents" class="cont-series">
</div>
<button class="btn waves-effect " style="width:100%; padding:0;" onclick="flw('--now','more')">もっと</button>
</div>
<div id="his-follower-list" class="col s12 tab-content">
<div id="his-follower-list-contents" class="cont-series">
</div>
<button class="btn waves-effect " style="width:100%; padding:0;" onclick="fer('--now','more')">もっと</button>
</div>
<div id="his-fav-list" class="col s12 tab-content">
<div id="his-fav-list-contents" class="cont-series">
</div>
<button class="btn waves-effect" style="width:100%; padding:0;" onclick="showFav('more')">もっと</button>
</div>
<div id="his-blocking-list" class="col s12 tab-content">
<div id="his-blocking-list-contents"class="cont-series" >
</div>
<button class="btn waves-effect " style="width:100%; padding:0;" onclick="showBlo('more')">もっと</button>
</div>
<div id="his-muting-list" class="col s12 tab-content">
<div id="his-muting-list-contents" class="cont-series">
</div>
<button class="btn waves-effect " style="width:100%; padding:0;" onclick="showMut('more')">もっと</button>
</div>
<div id="his-domain-list" class="col s12 tab-content">
<div id="his-domain-list-contents" class="cont-series">
</div>
<button class="btn waves-effect " style="width:100%; padding:0;" onclick="showDom('more')">もっと</button>ブロックするドメイン
<br>
<input type="text" placeholder="example.com" id="domainblock">
<button class="btn waves-effect" onclick="addDomainblock()">ブロック</button>
<br>
</div>
<div id="his-prof-list" class="col s12 tab-content">名前
<br>
<input type="text" placeholder="名前" id="his-name-val" width="max-width:150px;">
<br>自己紹介
<br>
<div class="input-field col s12">
<textarea placeholder="自己紹介" id="his-des-val" class="materialize-textarea"></textarea>
<label for="his-des-val">自己紹介</label>
</div>
<button onclick="profedit()" class="btn waves-effect indigo">適用</button>
<br>
<br>プロフィール画像変更:
<span id="prof-change">
<input type="file" onchange="imgChange(this,'avatar')">
</span>
<br>ヘッダー画像変更:
<span id="header-change">
<input type="file" onchange="imgChange(this,'header')">
</span>
</div>
<div id="his-request-list" class="col s12 tab-content">
<div id="his-request-list-contents" class="cont-series">
</div>
<button class="btn waves-effect " style="width:100%; padding:0;" onclick="showReq('more')">もっと</button>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button class="modal-action waves-effect waves-green btn-flat" id="his-history-btn" onclick="historyShow()">一つ前のユーザーデータ</button>
<a href="#!" class="modal-action waves-effect waves-green btn-flat" id="his-follow-btn" onclick="follow()">フォロー</a>
<a href="#!" class="modal-action waves-effect waves-green btn-flat" id="his-mute-btn" onclick="mute()">ミュート</a>
<a href="#!" class="modal-action waves-effect waves-green btn-flat" id="his-block-btn" onclick="block()">ブロック</a>
<a href="#!" class="modal-action waves-effect waves-green btn-flat" id="his-emp-btn" onclick="empUser()">ユーザー強調</a>
<a href="#!" class="modal-action waves-effect waves-green btn-flat" onclick="hisclose()">Close</a>
</div>
</div>
<!-- Modal Structure Image-->
<div id="imagemodal" class="modal modal-fixed-footer" style="min-width:550px">
<div class="modal-content">
<div id="imagewrap">
<img src="" id="imgmodal">
</div>
<br>
</div>
<div class="modal-footer">
<a class="waves-effect white-text" onclick="zoom(2)">
<i class="material-icons">zoom_in</i>
</a>
<a class="waves-effect white-text" onclick="zoom(0.5)">
<i class="material-icons">zoom_out</i>
</a>
<button class="btn waves-effect purple" onclick="dlImg()">
<i class="material-icons">file_download</i>
</button>
<button class="btn waves-effect brown" onclick="detFromImg()">当該トゥート</button>
<button class="btn waves-effect orange" onclick="imgCont('prev')" id="image-prev">
<i class="material-icons">keyboard_arrow_left</i>
</button>
<button class="btn waves-effect orange" onclick="imgCont('next')" id="image-next">
<i class="material-icons">keyboard_arrow_right</i>
</button>
<a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">
<i class="material-icons">close</i>
</a>
</div>
</div>
<!-- Modal Structure Video-->
<div id="videomodal" class="modal modal-fixed-footer">
<div class="modal-content">
<video src="" id="video" style="width:100%;" controls >
</div>
<div class="modal-footer">
<a href="#!" class="modal-action modal-close waves-effect waves-green btn-flat">Close</a>
</div>
</div>
<!--左下メッセージ-->
<div id="message">
</div>
<!--Radio-->
<audio src="" id="radio"></audio>
<script type="text/javascript" src="./js/common/about.js"></script>
<script type="text/javascript" src="./js/tl/parse.js"></script>
<script type="text/javascript" src="./js/ui/scroll.js"></script>
<script type="text/javascript" src="./js/tl/tl.js"></script>
<script type="text/javascript" src="./js/tl/card.js"></script>
<script type="text/javascript" src="./js/tl/date.js"></script>
<script type="text/javascript" src="./js/tl/notification.js"></script>
<script type="text/javascript" src="./js/tl/datails.js"></script>
<script type="text/javascript" src="./js/tl/mix.js"></script>
<script type="text/javascript" src="./js/tl/src.js"></script>
<script type="text/javascript" src="./js/tl/filter.js"></script>
<script type="text/javascript" src="./js/tl/tag.js"></script>
<script type="text/javascript" src="./js/ui/post-box.js"></script>
<script type="text/javascript" src="./js/ui/layout.js"></script>
<script type="text/javascript" src="./js/login/login.js"></script>
<script type="text/javascript" src="./js/login/instance.js"></script>
<script type="text/javascript" src="./js/ui/img.js"></script>
<script type="text/javascript" src="./js/ui/theme.js"></script>
<script type="text/javascript" src="./js/ui/pip.js"></script>
<script type="text/javascript" src="./js/ui/radio.js"></script>
<script type="text/javascript" src="./js/ui/sort.js"></script>
<script type="text/javascript" src="./js/post/post.js"></script>
<script type="text/javascript" src="./js/post/reply.js"></script>
<script type="text/javascript" src="./js/post/secure.js"></script>
<script type="text/javascript" src="./js/post/img.js"></script>
<script type="text/javascript" src="./js/post/status.js"></script>
<script type="text/javascript" src="./js/post/emoji.js"></script>
<script type="text/javascript" src="./js/post/suggest.js"></script>
<script type="text/javascript" src="./js/post/bb-md.js"></script>
<script type="text/javascript" src="./js/userdata/showOnTL.js"></script>
<script type="text/javascript" src="./js/userdata/his-data.js"></script>
<script type="text/javascript" src="./js/userdata/prof-edit.js"></script>
<script type="text/javascript" src="./js/platform/end.js"></script>
<!--大量のデフォルト絵文字-->
<script type="text/javascript" src="./js/emoji/activity.js"></script>
<script type="text/javascript" src="./js/emoji/flag.js"></script>
<script type="text/javascript" src="./js/emoji/food.js"></script>
<script type="text/javascript" src="./js/emoji/nature.js"></script>
<script type="text/javascript" src="./js/emoji/object.js"></script>
<script type="text/javascript" src="./js/emoji/people.js"></script>
<script type="text/javascript" src="./js/emoji/place.js"></script>
<script type="text/javascript" src="./js/emoji/symbol.js"></script>
<script type="text/javascript" src="./js/emoji/default-emoji.js"></script>