Hugging Face's logo

Spaces:
soiz1
/
about-blank
Running

App Files Community
GPTfree api commited on
Commit
4d31f34
·
verified ·
1 Parent(s): e557c7f

Update index.html

Browse files
Files changed (1) hide show
  1. index.html +0 -136
index.html CHANGED
@@ -1,136 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="ja">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>HTML Viewer</title>
7
- <style>
8
- .hidden {
9
- display: none;
10
- }
11
- </style>
12
- </head>
13
- <body>
14
- <h1>HTML Viewer</h1>
15
- <label for="modeSelect">モードを選択：</label>
16
- <select id="modeSelect">
17
- <option value="html">HTML表示モード</option>
18
- <option value="url">URLのiframe表示モード</option>
19
- </select>
20
- <br>
21
- <label for="displayTarget">表示先を選択：</label>
22
- <select id="displayTarget">
23
- <option value="blob">blobURL</option>
24
- <option value="blank">about:blank</option>
25
- </select>
26
-
27
- <div id="htmlMode">
28
- <textarea id="htmlInput" placeholder="ここにHTMLを入力してください" rows="10" cols="50"><!DOCTYPE html><html lang="ja"><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title></title><style>html,body{margin:0;padding:0;overflow:hidden;width:100vw;height:100vh}</style><iframe src="https://gooberdash.winterpixel.io/" style="width:100vw;height:100vh;border:none;display:block;margin:0;padding:0"></iframe></textarea><br>
29
- </div>
30
-
31
- <div id="urlMode" class="hidden">
32
- <input id="urlInput" type="text" placeholder="表示するURLを入力してください" list="urlOptions" size="50">
33
- <datalist id="urlOptions">
34
- <option value="https://gooberdash.winterpixel.io">
35
- <option value="https://inv.nadeko.net/">
36
- </datalist>
37
- </div>
38
-
39
- <button id="displayButton">表示</button>
40
- <button id="clearButton">クリア</button>
41
- <p id="errorMessage" style="color: red;"></p>
42
-
43
- <script>
44
- const modeSelect = document.getElementById('modeSelect');
45
- const displayTarget = document.getElementById('displayTarget');
46
- const htmlMode = document.getElementById('htmlMode');
47
- const urlMode = document.getElementById('urlMode');
48
- const displayButton = document.getElementById('displayButton');
49
- const clearButton = document.getElementById('clearButton');
50
- const errorMessage = document.getElementById('errorMessage');
51
-
52
- modeSelect.addEventListener('change', () => {
53
- if (modeSelect.value === 'html') {
54
- htmlMode.classList.remove('hidden');
55
- urlMode.classList.add('hidden');
56
- } else if (modeSelect.value === 'url') {
57
- htmlMode.classList.add('hidden');
58
- urlMode.classList.remove('hidden');
59
- }
60
- });
61
-
62
- displayButton.addEventListener('click', () => {
63
- errorMessage.textContent = '';
64
- const target = displayTarget.value;
65
-
66
- if (modeSelect.value === 'html') {
67
- const htmlContent = document.getElementById('htmlInput').value;
68
-
69
- if (!htmlContent.trim()) {
70
- errorMessage.textContent = 'HTMLを入力してください。';
71
- return;
72
- }
73
-
74
- try {
75
- if (target === 'blob') {
76
- const blob = new Blob([htmlContent], { type: 'text/html' });
77
- const url = URL.createObjectURL(blob);
78
- const newWindow = window.open(url);
79
- if (!newWindow) {
80
- errorMessage.textContent = '新しいタブを開けませんでした。ポップアップがブロックされている可能性があります。';
81
- }
82
- } else if (target === 'blank') {
83
- const newWindow = window.open('about:blank');
84
- if (newWindow) {
85
- newWindow.document.write(htmlContent);
86
- newWindow.document.close();
87
- } else {
88
- errorMessage.textContent = '新しいタブを開けませんでした。ポップアップがブロックされている可能性があります。';
89
- }
90
- }
91
- } catch (e) {
92
- errorMessage.textContent = 'エラーが発生しました: ' + e.message;
93
- }
94
- } else if (modeSelect.value === 'url') {
95
- const url = document.getElementById('urlInput').value;
96
-
97
- if (!url.trim()) {
98
- errorMessage.textContent = 'URLを入力してください。';
99
- return;
100
- }
101
-
102
- try {
103
- const iframeHtml = `<!DOCTYPE html><html lang="ja"><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Iframe Viewer</title><style>html,body{margin:0;padding:0;overflow:hidden;width:100vw;height:100vh}</style><iframe src="${url}" style="width:100vw;height:100vh;border:none;display:block;margin:0;padding:0"></iframe></html>`;
104
- if (target === 'blob') {
105
- const blob = new Blob([iframeHtml], { type: 'text/html' });
106
- const blobUrl = URL.createObjectURL(blob);
107
- const newWindow = window.open(blobUrl);
108
- if (!newWindow) {
109
- errorMessage.textContent = '新しいタブを開けませんでした。ポップアップがブロックされている可能性があります。';
110
- }
111
- } else if (target === 'blank') {
112
- const newWindow = window.open('about:blank');
113
- if (newWindow) {
114
- newWindow.document.write(iframeHtml);
115
- newWindow.document.close();
116
- } else {
117
- errorMessage.textContent = '新しいタブを開けませんでした。ポップアップがブロックされている可能性があります。';
118
- }
119
- }
120
- } catch (e) {
121
- errorMessage.textContent = 'エラーが発生しました: ' + e.message;
122
- }
123
- }
124
- });
125
-
126
- clearButton.addEventListener('click', () => {
127
- if (modeSelect.value === 'html') {
128
- document.getElementById('htmlInput').value = '';
129
- } else if (modeSelect.value === 'url') {
130
- document.getElementById('urlInput').value = '';
131
- }
132
- errorMessage.textContent = '';
133
- });
134
- </script>
135
- </body>
136
- </html>