- 제출된 URL:
- https://webvideoplayer.org/
- 보고서 완료:
링크 · 4개 결과
페이지에서 식별된 외부 링크
| 링크 | 텍스트 |
|---|---|
| https://chrome.google.com/webstore/detail/kfcfjmdnmmokdhndbpfcachlkliggggc | Chrome Extension |
| https://microsoftedge.microsoft.com/addons/detail/jelgjmnljfkdhdlkoijglfifcopgodlp | Edge Extension |
| https://caniuse.com/?search=video%20format | caniuse |
| https://guokai.dev/ | Jackie(Guokai) Han |
JavaScript 변수 · 6개 결과
페이지의 창 개체에 로드된 전역 JavaScript 변수는 함수 외부에서 선언된 변수로, 현재 범위 내에서 코드의 어느 부분에서나 액세스할 수 있습니다
| 이름 | 유형 |
|---|---|
| onbeforetoggle | object |
| documentPictureInPicture | object |
| onscrollend | object |
| popupPlayer | object |
| openPlayer | function |
| init | function |
콘솔 로그 메시지 · 1개 결과
웹 콘솔에 기록된 메시지
| 유형 | 카테고리 | 로그 |
|---|---|---|
| log | other |
|
HTML
페이지의 원시 HTML 본문
<!DOCTYPE html><html><head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Web Video Player</title>
<link rel="manifest" href="/manifest.json">
<link rel="icon" type="image/svg+xml" href="/icon/icon.svg">
<link rel="stylesheet" type="text/css" href="bootstrap.min.css">
<style type="text/css">
h1 {
margin-top: 1.5rem;
}
.screenshot {
width: 640px;
}
</style>
</head>
<body class="p-4">
<div class="container">
<div class="text-center">
<figure class="figure">
<img src="img/screenshot-1.png" class="figure-img img-fluid screenshot" width="1280" height="800" alt="screenshot">
<figcaption class="figure-caption text-center">Screenshot</figcaption>
</figure>
</div>
<h1>Web Video Player</h1>
<p>An easy-to-use and very lightweight(<100KB) video player for local video/audio files on desktop platforms, powered by Web technology.</p>
<p>In addition to using the mouse, it supports many useful <a href="shortcuts.html" class="text-reset">keyboard shortcuts</a>, as well as a few simple settings.</p>
<h1>Get the App</h1>
<table class="table">
<thead>
<tr>
<th scope="col">Installation methods</th>
<th scope="col">
<button id="installBtn" type="button" class="btn btn-primary" disabled="">PWA Install</button> <sup>[1]</sup>
</th>
<th scope="col">
<button id="openBtn" type="button" class="btn btn-primary">Web Version</button> <sup>[2]</sup>
</th>
<th scope="col"><a class="btn btn-primary" href="https://chrome.google.com/webstore/detail/kfcfjmdnmmokdhndbpfcachlkliggggc" target="_blank" role="button">Chrome Extension</a></th>
<th scope="col"><a class="btn btn-primary" href="https://microsoftedge.microsoft.com/addons/detail/jelgjmnljfkdhdlkoijglfifcopgodlp" target="_blank" role="button">Edge Extension</a></th>
</tr>
</thead>
<tbody class="align-middle">
<tr>
<th scope="row">Core functions</th>
<td>✔️</td>
<td>✔️</td>
<td>✔️</td>
<td>✔️</td>
</tr>
<tr>
<th scope="row">Hide the address bar</th>
<td>✔️</td>
<td>❌ <sup>[3]</sup></td>
<td>✔️</td>
<td>✔️</td>
</tr>
<tr>
<th scope="row">Available offline</th>
<td>✔️</td>
<td>Maybe</td>
<td>✔️</td>
<td>✔️</td>
</tr>
<tr>
<th scope="row" id="launch_ways">Launch the app</th>
<td>After installation,<br>Same as native apps <sup>[4]</sup></td>
<td>1. Visit this site<br>2. Click the button above</td>
<td>After installation,<br>Click the extension icon</td>
<td>After installation,<br>Click the extension icon</td>
</tr>
<tr>
<th scope="row">Basic ways to open files <sup>[5]</sup></th>
<td>✔️</td>
<td>✔️</td>
<td>✔️</td>
<td>✔️</td>
</tr>
<tr>
<th scope="row">Double click to open file <sup>[6]</sup></th>
<td>✔️ <small class="text-muted">(Chrome 102+)</small></td>
<td>❌</td>
<td>❌</td>
<td>❌</td>
</tr>
</tbody>
</table>
<ol class="small text-muted">
<li>Only show installation prompts on Chrome and Edge if the app is not installed. You can also click the install icon in the address bar to install. Other browsers may not support installation.</li>
<li>Open a popup window to use.</li>
<li>Only Safari hides the address bar.</li>
<li>For example, the start menu on Windows or the Launchpad on macOS.</li>
<li>Open videos by 1) click the folder icon in the player; 2) Ctrl/Cmd+O shortcut; 3) Darg and drop files to the player.</li>
<li>In the operating system's file manager, you can double-click one or multiple files, or right-click the file ("Open with…") to play videos. This feature is supported from Chrome 102. "Single window mode" (open files in the existing window) is supported from Chrome 110.</li>
</ol>
<h1>Browser Support <sup>[1]</sup></h1>
<table class="table">
<thead>
<tr>
<th scope="col"></th>
<th scope="col">PWA Install</th>
<th scope="col">Web Version</th>
<th scope="col">Browser Extension</th>
</tr>
</thead>
<tbody class="align-middle">
<tr>
<th scope="row">Chrome</th>
<td>✔️ <img src="img/recommend.svg"></td>
<td>✔️</td>
<td>✔️ <img src="img/recommend.svg"></td>
</tr>
<tr>
<th scope="row">Edge</th>
<td>❌ <sup>[2]</sup></td>
<td>✔️</td>
<td>✔️ <img src="img/recommend.svg"></td>
</tr>
<tr>
<th scope="row">Firefox</th>
<td>❌</td>
<td>✔️</td>
<td>❌</td>
</tr>
<tr>
<th scope="row">Safari</th>
<td>❌</td>
<td>✔️ <sup>[3]</sup></td>
<td>❌</td>
</tr>
</tbody>
</table>
<ol class="small text-muted">
<li>Which OS platforms are supported? Currently, it’s available on all desktop platforms, including Windows, macOS, Linux and Chrome OS. Mobile platforms may be supported in the future.</li>
<li>Edge browser has a special bug at the moment that causes some files to fail to play, which only appears in PWA install mode, but does not exist in other modes.</li>
<li>There may be some bugs.</li>
</ol>
<h1>Video Codecs <sup>[1]</sup></h1>
<table class="table">
<thead>
<tr>
<th scope="col"></th>
<th scope="col">Chrome</th>
<th scope="col">Edge</th>
<th scope="col">Safari</th>
<th scope="col">Firefox</th>
</tr>
</thead>
<tbody class="align-middle">
<tr>
<th scope="row">AVC (H.264)</th>
<td>✔️</td>
<td>✔️</td>
<td>✔️</td>
<td>✔️</td>
</tr>
<tr>
<th scope="row">HEVC (H.265)</th>
<td>✔️ <small class="text-muted">(Chrome 107+)</small></td>
<td>❌</td>
<td>✔️</td>
<td>❌</td>
</tr>
<tr>
<th scope="row">AV1</th>
<td>✔️</td>
<td>❌</td>
<td>❌</td>
<td>✔️</td>
</tr>
<tr>
<th scope="row">WebM</th>
<td>✔️</td>
<td>✔️</td>
<td>✔️</td>
<td>✔️</td>
</tr>
<tr>
<th scope="row">Ogg/Theora</th>
<td>✔️</td>
<td>✔️</td>
<td>❌</td>
<td>✔️</td>
</tr>
</tbody>
</table>
<ol class="small text-muted">
<li>Source: <a href="https://caniuse.com/?search=video%20format" class="text-reset" target="_blank">caniuse</a>. Because the underlying core functions are completely implemented by the browser, only some video formats and codec are supported. In addition, it doesn't support multiple audio tracks switching.</li>
</ol>
<h1>FAQ</h1>
<h5>How to open the player?</h5>
<p>See "<a href="#launch_ways" class="text-reset">Launch the app</a>" row in the "Get the App" table.</p>
<h5>How to open files?</h5>
<ul>
<li>Click the "Folder" icon in the player.</li>
<li>Keyboard shortcut: Ctrl + O (on Windows) or Cmd + O (on macOS).</li>
<li>Drag and drop files to the player.</li>
<li>If you use PWA installed mode, you can open files in the OS file manager directly by right-click or double-click.</li>
</ul>
<h5>Subtitles</h5>
<p>Independent or embedded subtitles are not supported, but if the subtitles are already in the video stream, they can be displayed. Maybe I will support independent subtitle files in the future.</p>
<h5>Online streaming media</h5>
<p>Currently only supports local file playback. There are no plans to support online streaming media.</p>
<h5>How to uninstall the app?</h5>
<p>For the PWA install version, open "about://apps" in the address bar (or the launcher if you use ChromeOS), then right click the app icon. For the Browser extension version, open "about://extensions". You can install it again at any time after uninstalling.</p>
<h5>Privacy</h5>
<p>This app works offline in your browser. It does not collect any information from you. No data is sent to my server.</p>
<div class="small text-center text-muted mt-4">2021-2023, Created by <a href="https://guokai.dev/" class="text-reset">Jackie(Guokai) Han</a></div>
</div>
<script type="text/javascript" src="index.js"></script>
</body></html>