-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
215 lines (212 loc) · 8.51 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
<!DOCTYPE html>
<html>
<head prefix="og:http://ogp.me/ns#">
<meta charset="UTF-8">
<title>File Sound Transceiver</title>
<meta property="og:title" content="File Sound Transceiver">
<meta property="og:description" content="ファイルデータをMSXで使用される形式の音声で送受信するツールです。">
<meta property="og:url" content="https://fst.mikecat.work/">
<meta property="og:image" content="https://fst.mikecat.work/thumb_s.png">
<meta property="og:type" content="website">
<meta property="og:site_name" content="File Sound Transceiver">
<meta name="twitter:card" content="summary">
<meta name="twitter:site" content="@mikecat_mixc">
<meta name="description" content="ファイルデータをMSXで使用される形式の音声で送受信するツールです。">
<meta name="author" content="みけCAT">
<link href="index.css" rel="stylesheet">
<script src="charConverter.js"></script>
<script src="fst.js"></script>
</head>
<body>
<p><select id="languageSelect">
<option value="ja" selected>日本語</option>
<option value="en">English</option>
</select></p>
<h1>File Sound Transceiver</h1>
<h2>
<span class="lang-ja">音声設定</span>
<span class="lang-en">Sound Configuration</span>
</h2>
<p>
<button type="button" class="operation-button" id="connectButton" style="margin-right: 0.5em;">
<span class="lang-ja">接続</span>
<span class="lang-en">Connect</span>
</button>
<button type="button" class="operation-button" id="disconnectButton" disabled>
<span class="lang-ja">切断</span>
<span class="lang-en">Disconnect</span>
</button>
</p>
<p class="field-grid">
<span class="field-name">
<span class="lang-ja">入力デバイス</span>
<span class="lang-en">Input Device</span>
</span>
<span><select id="inputDeviceSelect" disabled></select></span>
<span class="field-name">
<span class="lang-ja">出力デバイス</span>
<span class="lang-en">Output Device</span>
</span>
<span><select id="outputDeviceSelect" disabled></select></span>
<span class="field-name">
<span class="lang-ja">ボーレート</span>
<span class="lang-en">Baud Rate</span>
</span>
<span><select id="baudRateSelect">
<option value="1200" selected>1200</option>
<option value="2400">2400</option>
<option value="custom" class="lang-ja">カスタム</option>
<option value="custom" class="lang-en">Custom</option>
</select>
<input type="number" id="customBaudRateInput" size="8" value="1200">
</span>
</p>
<h2>
<span class="lang-ja">送信</span>
<span class="lang-en">Sending</span>
</h2>
<p class="field-grid">
<span class="field-name">
<span class="lang-ja">送信形式</span>
<span class="lang-en">Sending Format</span>
</span>
<span><select id="sendType">
<option value="csave" class="lang-ja">CSAVE (BASIC中間形式)</option>
<option value="csave" class="lang-en">CSAVE (intermediate format for BASIC)</option>
<option value="save" class="lang-ja" selected>SAVE (ASCIIテキスト)</option>
<option value="save" class="lang-en">SAVE (ASCII text)</option>
<option value="bsave" class="lang-ja">BSAVE (バイナリ)</option>
<option value="bsave" class="lang-en">BSAVE (binary)</option>
<option value="xmodem" class="lang-ja">XMODEM (双方向通信による転送)</option>
<option value="xmodem" class="lang-en">XMODEM (bidirectional communication)</option>
</select></span>
<span class="field-name">
<span class="lang-ja">ファイル名</span>
<span class="lang-en">File Name</span>
</span>
<span>
<input type="text" id="sendFileName" size="8" maxlength="6" value="A" style="margin-right: 0.5em;">
<input type="checkbox" id="setSendFileNameOnFileSelection" checked>
<label for="setSendFileNameOnFileSelection">
<span class="lang-ja">ファイル選択時に自動設定する</span>
<span class="lang-en">Automatically set on file selection</span>
</label>
</span>
<span class="field-name">
<span class="lang-ja">BSAVEオプション</span>
<span class="lang-en">Options for BSAVE</span>
</span>
<span>
<input type="checkbox" id="bsaveGetAddressFromFile">
<label for="bsaveGetAddressFromFile">
<span class="lang-ja">送信するファイルはBSAVEヘッダー付き</span>
<span class="lang-en">Files to send has the BSAVE header</span>
</label><br>
<span class="lang-ja">先頭アドレス</span>
<span class="lang-en">First address to place</span>
<input type="text" id="bsaveStoreAddress" size="8" value="0xE000" style="margin-left: 0.5em; margin-right: 0.5em;">
<span class="lang-ja">実行開始アドレス</span>
<span class="lang-en">Address to execute</span>
<input type="text" id="bsaveRunAddress" size="8" value="0xE000" style="margin-left: 0.5em;" margin-right: 0.5em;" disabled>
<input type="checkbox" id="bsaveRunAddressIsStoreAddress"checked>
<label for="bsaveRunAddressIsStoreAddress">
<span class="lang-ja">先頭アドレスと同じ</span>
<span class="lang-en">Same as the first address to place</span>
</label>
</span>
<span class="field-name">
<span class="lang-ja">送信データ</span>
<span class="lang-en">Data to send</span>
</span>
<span><select id="whatToSend">
<option value="file" class="lang-ja" selected>ファイル</option>
<option value="file" class="lang-en">File</option>
<option value="text-msx" class="lang-ja">テキスト (MSX)</option>
<option value="text-msx" class="lang-en">Text (MSX)</option>
<option value="text-utf8" class="lang-ja">テキスト (UTF-8)</option>
<option value="text-utf8" class="lang-en">Text (UTF-8)</option>
</select><br>
<span id="dataToSendArea" style="display: inline-block; width: 100%; height: 7em;">
<span id="fileToSendDropArea">
<span style="margin-left: 1em;">
<span style="display: inline-block; margin-bottom: 1em;">
<input type="file" id="sendFileInput" style="display: none;">
<button type="button" id="sendFileSelectButton" style="margin-right: 0.5em;">
<span class="lang-ja">ファイルを選択</span>
<span class="lang-en">Select a file</span>
</button>
<span class="lang-ja">またはファイルをこの枠内にドラッグ&ドロップして選択</span>
<span class="lang-en">or drag-and-drop the file to select into this box.</span>
</span><br>
<span>
<span id="noFileSelectedMessage">
<span class="lang-ja">ファイルが選択されていません</span>
<span class="lang-en">No file is selected.</span>
</span>
<span id="selectedFileNameSpan">
</span>
</span>
</span>
</span>
<textarea id="textToSend" style="width: 100%; height: 100%; box-sizing: border-box;"></textarea>
</span></span>
</p>
<p>
<button type="button" class="operation-button" id="startSendButton" style="margin-right: 0.5em;" disabled>
<span class="lang-ja">送信開始</span>
<span class="lang-en">Send</span>
</button>
<button type="button" class="operation-button" id="cancelSendButton" style="margin-right: 0.5em;" disabled>
<span class="lang-ja">送信中止</span>
<span class="lang-en">Cancel sending</span>
</button>
<progress id="sendProgress" value="0" style="width: 20em; margin-right: 0.5em;"></progress>
<span id="sendStatus">
<span class="lang-ja">送信待機中</span>
<span class="lang-en">Stand by</span>
</span>
</p>
<h2>
<span class="lang-ja">受信</span>
<span class="lang-en">Receiving</span>
</h2>
<p>
<span class="lang-ja">信号レベル</span>
<span class="lang-en">Signal Level</span>
<meter id="receiveSignalMeter" style="width: 20em; margin-left: 0.5em; margin-right: 0.5em;"></meter>
<span id="signalDetected">
<span class="lang-ja">有効な信号を検出中</span>
<span class="lang-en">Valid signal is detected</span>
</span>
</p>
<p>
<input type="checkbox" id="useCrcForXmodemRecelve" checked>
<label for="useCrcForXmodemRecelve">
<span class="lang-ja">XMODEMでCRCを使用する</span>
<span class="lang-en">Use CRC for XMODEM</span>
</label>
</p>
<p>
<button type="button" class="operation-button" id="startXmodemReceiveButton" style="margin-right: 0.5em;" disabled>
<span class="lang-ja">XMODEM受信開始</span>
<span class="lang-en">Receive via XMODEM</span>
</button>
<button type="button" class="operation-button" id="cancelReceiveButton" style="margin-right: 0.5em;" disabled>
<span class="lang-ja">受信中止</span>
<span class="lang-en">Cancel receiving</span>
</button>
<span id="receiveStatus"></span>
</p>
<table class="basic-table">
<thead><tr>
<th><span class="lang-ja">受信終了日時</span><span class="lang-en">Time Received</th>
<th><span class="lang-ja">種類</span><span class="lang-en">Kind</span></th>
<th><span class="lang-ja">ファイル名</span><span class="lang-en">File Name</span></th>
<th><span class="lang-ja">ファイルサイズ</span><span class="lang-en">File Size</span></th>
<th><span class="lang-ja">操作</span><span class="lang-en">Operation</span></th>
</tr></thead>
<tbody id="receiveTableBody">
</tbody>
</table>
</body>
</html>