245 lines
13 KiB
HTML
245 lines
13 KiB
HTML
<div id="post-box" class="z-depth-5">
|
|
<div id="post-bar" class="drag-bar"><span id="unreact">@@post-new@@</span><span id="addreact" class="hide">Reaction</span></div>
|
|
<!--トゥートボックス-->
|
|
<div id="left-side">
|
|
<div class="row" style="margin-bottom: 0">
|
|
<div class="" style="float: left">
|
|
<a onclick="profShow()" style="vertical-align: -1.7rem" class="pointer mize">
|
|
<img src="../../img/missing.svg" id="acct-sel-prof" title="@@showSelectProf@@(Ctrl+Shift+P)" data-trans-title="post_box_prof" style="width: 1.8rem" />
|
|
</a>
|
|
</div>
|
|
<div class="input-field mize" style="float: left; width: calc(100% - 1.8rem); margin-top: 0">
|
|
<select id="post-acct-sel" class="acct-sel" onchange="mdCheck()"></select>
|
|
</div>
|
|
<span class="cancel">
|
|
<i class="material-icons waves-effect" onclick="hide()" title="@@closeThisBox@@(X)" data-trans-title="post_box_close">cancel</i>
|
|
</span>
|
|
<!--Markdown-->
|
|
<div class="row" style="margin-bottom: 0">
|
|
<div class="markdown mize hide">
|
|
<div class="col s12">
|
|
<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% - 1.5rem); margin: 0; height: 1.8rem" 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% - 3.8rem); margin: 0; height: 1.8rem" type="color" />
|
|
<br />
|
|
<i class="material-icons pointer setting waves-effect" onclick="markdownLink()" title="リンク挿入">link</i>
|
|
<input id="linkt" style="width: calc(50% - 1.5rem); margin: 0; height: 1.8rem" placeholder="リンクテキスト" />
|
|
<input id="link2" style="width: calc(50% - 1.5rem); margin: 0; height: 1.8rem" placeholder="リンクアドレス" />
|
|
<br />
|
|
<i class="material-icons pointer setting waves-effect" onclick="markdownImage()" title="インライン画像挿入">image</i>
|
|
<input id="image" style="width: calc(50% - 1.5rem); margin: 0; height: 1.8rem" placeholder="代替テキスト" />
|
|
<input id="image2" style="width: calc(50% - 1.5rem); margin: 0; height: 1.8rem" 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; margin-bottom: 0">
|
|
<textarea id="textarea" class="materialize-textarea unmize" style="margin-bottom: 0" data-length="500"></textarea>
|
|
|
|
<div id="suggest"></div>
|
|
<label for="textarea" data-trans="toot">@@toot@@</label>
|
|
<br />
|
|
<span class="sml gray pointer markdown mize" id="preview-btn">
|
|
<a onclick="preview()">Preview</a>
|
|
</span>
|
|
<span class="sml gray pointer anti-markdown mize">
|
|
<a onclick="mdToggle()">Markdownエディタを表示</a>
|
|
</span>
|
|
</div>
|
|
<div class="col s12 mize" style="margin-top: 0; display: flex; justify-content: space-between">
|
|
<i class="waves-effect gray material-icons" id="nsfw" title="@@nsfwDes@@" onclick="nsfw()">visibility_off</i>
|
|
<i class="waves-effect gray material-icons purple-text dropdown-trigger" data-target="dropdown1" id="vis-icon">public</i>
|
|
<a class="waves-effect gray" id="cw" onclick="cw()" title="@@cwDes@@">CW</a>
|
|
<span
|
|
><span id="imgup"></span><span id="imgsel" class="pwa"><i class="waves-effect material-icons gray" onclick="fileselect()" title="@@selfile@@">photo_library</i></span></span
|
|
>
|
|
<i class="waves-effect gray material-icons" onclick="emojiToggle()" id="emojibtn" title="@@insertEmoji@@">tag_faces</i>
|
|
<i class="waves-effect gray material-icons dropdown-trigger" data-target="dropdown2">more_vert</i>
|
|
<i class="material-icons nex gray waves-effect" title="@@clearToot@@(Ctrl+Shit+C)" data-trans-title="post_box_clear" id="clear">clear</i>
|
|
</div>
|
|
<div class="col s12 mize" style="margin-bottom: 0.4rem; padding: 0">
|
|
<div id="taglist"></div>
|
|
<div id="preview" class="mize"></div>
|
|
<span class="sml mize"
|
|
><span>@@replyMode@@</span>: <span id="rec">@@no@@</span>/<span>@@temp@@</span>:
|
|
<span id="mec">@@nothing@@</span>
|
|
<a onclick="stamp()" class="pointer pwa" title="@@stampWarn@@">@@stamp@@: <span id="stamp">Off</span></a> /@@poll@@:
|
|
<span id="pollsta">@@no@@</span>
|
|
<span id="vis" class="hide">public</span>
|
|
</span>
|
|
<br />
|
|
<input type="text" id="cw-text" placeholder="@@cwtext@@" class="mize" style="margin: 0" />
|
|
<div id="sch-box">
|
|
@@postat@@<br /><span class="sml">@@scheduleWarn@@</span><a onclick="expPostMode()">Expire mode(beta)</a><br />
|
|
<input type="datetime-local" id="sch-date" placeholder="@@schedule@@" class="datepicker" style="margin: 0" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- 公開範囲 Dropdown Structure -->
|
|
<ul id="dropdown1" class="dropdown-content">
|
|
<li>
|
|
<a onclick="vis('public')">@@publicJP@@(Public)</a>
|
|
</li>
|
|
<li>
|
|
<a onclick="vis('unlisted')">@@unlistedJP@@(Unlisted)</a>
|
|
</li>
|
|
<li>
|
|
<a onclick="vis('private')" id="private-button">@@privateJP@@(Private)</a>
|
|
</li>
|
|
<li id="limited-button" class="hide">
|
|
<a onclick="vis('limited')">限定公開(Limited)</a>
|
|
</li>
|
|
<li id="local-button" class="hide">
|
|
<a onclick="vis('local')">@@localJP@@(Local)</a>
|
|
</li>
|
|
<li>
|
|
<a onclick="vis('direct')" class="disabled direct">@@directJP@@(Direct)</a>
|
|
</li>
|
|
</ul>
|
|
<!-- その他 Dropdown Structure -->
|
|
<ul id="dropdown2" class="dropdown-content">
|
|
<li>
|
|
<a onclick="nowplaying('spotify');">NowPlaying (Spotify)</a>
|
|
</li>
|
|
<li class="mac">
|
|
<a onclick="nowplaying('itunes');">NowPlaying (iTunes macOS)</a>
|
|
</li>
|
|
<li>
|
|
<a onclick="nowplaying('lastFm');">NowPlaying (Last.fm)</a>
|
|
</li>
|
|
<li>
|
|
<a onclick="schedule();">@@schedule@@</a>
|
|
</li>
|
|
<li>
|
|
<a onclick="pollToggle();">@@poll@@</a>
|
|
</li>
|
|
<li>
|
|
<a onclick="draftToggle();">@@draft@@</a>
|
|
</li>
|
|
</ul>
|
|
<!--hidden area-->
|
|
<input type="hidden" id="reply" />
|
|
<input type="hidden" id="ideKey" />
|
|
<input type="hidden" id="quote" />
|
|
<input type="hidden" id="media" />
|
|
<!--END hidden area-->
|
|
</div>
|
|
<div id="toot-btn-field">
|
|
<button class="btn waves-effect unmize toot-btn-group" onclick="post()" id="toot-post-btn">@@toot@@</button>
|
|
<button class="btn waves-effect darken-3 unmize hide toot-btn-group" onclick="sec()" id="toot-sec-btn">
|
|
<i class="material-icons" id="toot-sec-icon" title="@@sectoot@@">lock_open</i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div id="right-side">
|
|
<div id="draft" class="hide right-side-content"></div>
|
|
<!--絵文字ピッカー-->
|
|
<div id="emoji" class="hide right-side-content">
|
|
<span class="gray sml"
|
|
>@@emojiWarn@@
|
|
<a onclick="emojiGet('true')" class="pointer">@@refreshEmoji@@</a>
|
|
<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>@@showThisEmoji@@<br /><span class="gray sml">@@emojiInsertWarn@@</span>
|
|
<br />
|
|
<a onclick="customEmoji()" class="pointer waves-effect" title="@@customEmoji@@">
|
|
<i class="material-icons">add</i>
|
|
</a>
|
|
<a onclick="defaultEmoji('people')" class="pointer waves-effect" title="@@peopleEmoji@@">
|
|
<i class="material-icons">people</i>
|
|
</a>
|
|
<a onclick="defaultEmoji('nature')" class="pointer waves-effect" title="@@natureEmoji@@">
|
|
<i class="material-icons">local_florist</i>
|
|
</a>
|
|
<a onclick="defaultEmoji('food')" class="pointer waves-effect" title="@@foodEmoji@@">
|
|
<i class="material-icons">restaurant</i>
|
|
</a>
|
|
<a onclick="defaultEmoji('activity')" class="pointer waves-effect" title="@@activityEmoji@@">
|
|
<i class="material-icons">directions_run</i>
|
|
</a>
|
|
<a onclick="defaultEmoji('place')" class="pointer waves-effect" title="@@placeEmoji@@">
|
|
<i class="material-icons">directions_car</i>
|
|
</a>
|
|
<a onclick="defaultEmoji('object')" class="pointer waves-effect" title="@@thingsEmoji@@">
|
|
<i class="material-icons">attach_file</i>
|
|
</a>
|
|
<a onclick="defaultEmoji('symbol')" class="pointer waves-effect" title="@@symbolEmoji@@">
|
|
<i class="material-icons">gesture</i>
|
|
</a>
|
|
<a onclick="defaultEmoji('flag')" class="pointer waves-effect" title="@@flagsEmoji@@">
|
|
<i class="material-icons">flag</i>
|
|
</a>
|
|
<a onclick="faicon()" class="pointer waves-effect" title="faicon" id="faicon-btn">
|
|
<i class="fab fa-fort-awesome"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!--Poll UI-->
|
|
<div id="poll" class="hide right-side-content">
|
|
<div id="mastodon-poll" class="poll-provider">
|
|
<input type="text" class="mastodon-choice" placeholder="@@choice@@1" />
|
|
<input type="text" class="mastodon-choice" placeholder="@@choice@@2" />
|
|
<input type="text" class="mastodon-choice" placeholder="@@choice@@3" />
|
|
<input type="text" class="mastodon-choice" placeholder="@@choice@@4" />
|
|
<label>
|
|
<input type="checkbox" class="filled-in" id="poll-multiple" value="1" />
|
|
<span>@@pollmulti@@</span>
|
|
</label>
|
|
<label>
|
|
<input type="checkbox" class="filled-in" id="poll-until" value="1" />
|
|
<span>@@polluntil@@</span>
|
|
</label>
|
|
<input type="number" style="width: 50px" id="days_poll" placeholder="d" value="0" />@@days@@
|
|
<input type="number" style="width: 50px" id="hours_poll" placeholder="h" value="0" />@@hours@@
|
|
<input type="number" style="width: 50px" id="mins_poll" placeholder="m" value="6" />@@mins@@
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|