76 lines
1.8 KiB
HTML
76 lines
1.8 KiB
HTML
|
<!doctype html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||
|
|
<title>Doctests Capabilities</title>
|
||
|
|
<link rel="stylesheet" href="./3rdparty/highlight/styles/default.css">
|
||
|
|
<link rel="stylesheet" href="../css/doctest.css">
|
||
|
|
<script src="./3rdparty/highlight/highlight.pack.js"></script>
|
||
|
|
<script type="text/javascript" src="../dist/iwmlib.js"></script>
|
||
|
|
</head>
|
||
|
|
<body onload="Doctest.run(); CapabilitiesTests.testAll()">
|
||
|
|
<main>
|
||
|
|
<h1>
|
||
|
|
Capabilities
|
||
|
|
</h1>
|
||
|
|
<p>Browsers differ in many aspects, from touch support, support of CSS and HTML5 standards, to
|
||
|
|
javascript versions. This page collects some of these differences.
|
||
|
|
<h3>
|
||
|
|
User Agent
|
||
|
|
</h3>
|
||
|
|
<p id="user_agent">
|
||
|
|
</p>
|
||
|
|
<h3>
|
||
|
|
Device Pixel Ratio
|
||
|
|
</h3>
|
||
|
|
<p id="device_pixel_ratio">
|
||
|
|
</p>
|
||
|
|
<h3>
|
||
|
|
Multi Touch Table
|
||
|
|
</h3>
|
||
|
|
<p id="multi_touch_table">
|
||
|
|
</p>
|
||
|
|
<h3>
|
||
|
|
Supported Events
|
||
|
|
</h3>
|
||
|
|
<p id="supported_events">
|
||
|
|
</p>
|
||
|
|
<script class="doctest">
|
||
|
|
|
||
|
|
Doctest.expect(Capabilities.supportsMouseEvents(), true)
|
||
|
|
|
||
|
|
if (Capabilities.supportsTouchEvents()) {
|
||
|
|
Doctest.expect(Capabilities.supportsTouchEvents(), true)
|
||
|
|
}
|
||
|
|
|
||
|
|
if (Capabilities.supportsPointerEvents()) {
|
||
|
|
Doctest.expect(Capabilities.supportsPointerEvents(), true)
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<h3>
|
||
|
|
Interactive Alerts
|
||
|
|
</h3>
|
||
|
|
<p>
|
||
|
|
Standard alerts are displayed quite differently, on Windows 10, for instance
|
||
|
|
the browser URL is encluded, and a checkbox that allows to hide the
|
||
|
|
alert dialogs.
|
||
|
|
</p>
|
||
|
|
<button onclick="alert('Ok'); console.log('Alert')">Alert</button>
|
||
|
|
<button onclick="CapabilitiesTests.testConfirm()">Confirm</button>
|
||
|
|
<button onclick="CapabilitiesTests.testPrompt()">Prompt</button>
|
||
|
|
<p id="demo">
|
||
|
|
Result
|
||
|
|
</p>
|
||
|
|
<hr />
|
||
|
|
|
||
|
|
|
||
|
|
<h2>
|
||
|
|
References
|
||
|
|
</h2>
|
||
|
|
<ul>
|
||
|
|
<li><a href="http://caniuse.com">Can I use</a></li>
|
||
|
|
<li><a href="http://webglreport.com">WebGL Report</a></li>
|
||
|
|
</ul>
|
||
|
|
</main>
|
||
|
|
</body>
|