Publish Vulpes Preview 15 sources for desktop, Android and Tundra
Share Gaia assets and adapters, keep private profiles and development documents local, and update both public READMEs.
This commit is contained in:
parent
93e3a48004
commit
b38dea0597
25901 changed files with 9982925 additions and 369 deletions
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Audio Tag test</title>
|
||||
<script defer src="../../js/API/audiotag.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<legend><b>classic.ogg</b></legend>
|
||||
<button data-fn="play" data-src="classic.ogg">Play</button>
|
||||
</fieldset>
|
||||
<div>
|
||||
<fieldset>
|
||||
<legend><b>AC_prgrssv__Retro_Alarm_<br>Clock_v02_SOFT.ogg</b></legend>
|
||||
<button data-fn="play" data-src="AC_prgrssv__Retro_Alarm_Clock_v02_SOFT.ogg">Play</button></p>
|
||||
</fieldset>
|
||||
</div>
|
||||
<fieldset>
|
||||
<legend><b>AC_progressive_dapple10.ogg</b></legend>
|
||||
<button data-fn="play" data-src="AC_progressive_dapple10.ogg">Play</button></p>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><b>AC_progressive_shimmer07.ogg</b></legend>
|
||||
<button data-fn="play" data-src="AC_progressive_shimmer07.ogg">Play</button></p>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><b>ALARM_progressive_dapple.mp3</b></legend>
|
||||
<button data-fn="play" data-src="ALARM_progressive_dapple.mp3">Play</button></p>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><b>ALARM_progressive2_dapple.mp3</b></legend>
|
||||
<button data-fn="play" data-src="ALARM_progressive2_dapple.mp3">Play</button></p>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Browser Web Activities Test</title>
|
||||
<script defer src="../../js/API/browseractivities.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/input_areas.css">
|
||||
</head>
|
||||
<body>
|
||||
<h2>Go to:</h2>
|
||||
<p>URL: <input type="url" id="URL" value="http://" />
|
||||
<button id="go">Go</button></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Compose Email test</title>
|
||||
<script defer src="../../js/API/composeemail.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<h3>Compose Email with 'new' activity:</h3>
|
||||
<button id="compose-email">Compose Email</button>
|
||||
<h3>Compose Email with mailto url link:</h3>
|
||||
<a href="mailto:example@example.org">Compose Email</a>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Contacts testing tools</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<!-- We don't need localization for this app. -->
|
||||
<script type="text/javascript" src="../../js/API/contacts.js"></script>
|
||||
<script type="text/javascript" src="../../js/API/contacts_saver.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<legend><b>Contacts manipulation</b></legend>
|
||||
<section>
|
||||
Contacts inserted: <span id="insertion-count">None, yet.</span>
|
||||
<button id="insert-contacts">Insert fake contacts</button>
|
||||
<button id="insert-social-contacts">Insert Social Contacts</button>
|
||||
<button id="clear-contacts">Clear all contacts</button>
|
||||
<button id="get-contacts">Get all contacts</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
<!-- Activities tests -->
|
||||
<fieldset>
|
||||
<legend><b>Activities tests</b></legend>
|
||||
<section>
|
||||
<p id="activities-result"></p>
|
||||
<button id="activities-pick">Pick a contact</button>
|
||||
<button id="activities-new">New contact</button>
|
||||
<button id="activities-update">Update contact with<br>phone</button>
|
||||
<button id="activities-update-email">Update contact with<br>email</button>
|
||||
<button id="activities-update-email-phone">Update contact with<br>phone and email</button>
|
||||
<button id="activities-new-data">New contact with<br>data</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Copy and paste test</title>
|
||||
<style>
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 50rem;
|
||||
overflow: scroll;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<textarea id="textarea">Hollywood, California (CNN) -- Actor Brad Pitt was struck in the face as he was signing autographs at a movie premiere Wednesday, Los Angeles police said.' +
|
||||
'Pitt was at the Hollywood premiere of "Maleficent," starring his partner Angelina Jolie, when a man hopped a barrier and attacked the actor, Sgt. Leonard Calderon said.' +
|
||||
'Officers arrested the suspect, 25-year-old Vitalii Sediuk, on suspicion of battery.'+
|
||||
'Sediuk has a history of confronting celebrities at red carpet events. In 2012, he was slapped by actor Will Smith after he attempted to kiss Smith.'+
|
||||
'At the 2013 Grammy Awards, Sediuk charged the stage before singer Adele could accept her award.' +
|
||||
'Sediuk also hugged actors Leonardo DiCaprio and Bradley Cooper around the knees at separate events earlier this year.' +
|
||||
'Most recently, he put his head up America Ferraras dress at the Cannes premiere of "How to Train Your Dragon 2" last week.' +
|
||||
'After the attack Wednesday evening, Pitt and Jolie continued walking the blue carpet. Neither appeared to look fazed by the incident."</textarea>
|
||||
</body>
|
||||
</html>
|
||||
18
assets/webapps/uitest.gaiamobile.org/tests_html/API/csp.html
Normal file
18
assets/webapps/uitest.gaiamobile.org/tests_html/API/csp.html
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>CSP Warning</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>CSP Warning test</h1>
|
||||
<p id="text">This line should not be removed by Javascript.</p>
|
||||
<script>
|
||||
window.onload = function () {
|
||||
document.getElementById('text').textContent =
|
||||
'Error! CSP violation is executed!';
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Dial Number test</title>
|
||||
<script defer src="../../js/API/dialnumber.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<button id="dial">Dial Number</button>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Download test tools</title>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<script defer type="text/javascript" src="/shared/js/lazy_loader.js"></script>
|
||||
<script defer type="text/javascript" src="../../js/API/downloads.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h3>Wait few seconds for initializing the download</h3>
|
||||
<fieldset>
|
||||
<legend>Choose one to download</legend>
|
||||
<section>
|
||||
<a download="Toast.doc" href="http://owd.tid.es/dm/Toast.doc">
|
||||
<button>DOC (450KB)</button>
|
||||
</a>
|
||||
<a download="clipcanvas_14348_H264_320x180.mp4" href="http://owd.tid.es/dm/clipcanvas_14348_H264_320x180.mp4">
|
||||
<button>MP4(1.1 MB)</button>
|
||||
</a>
|
||||
</section>
|
||||
</fieldset>
|
||||
<div>
|
||||
<button id="downloadStatus" disabled="true">Status</button>
|
||||
<button id="downloadDelete" disabled="true">Delete download</button>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
31
assets/webapps/uitest.gaiamobile.org/tests_html/API/fxa.html
Normal file
31
assets/webapps/uitest.gaiamobile.org/tests_html/API/fxa.html
Normal file
|
|
@ -0,0 +1,31 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>FxA Sign-in Demo</title>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API/identity.css">
|
||||
<script type="text/javascript" src="../../js/API/fxa.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="panel">
|
||||
<fieldset>
|
||||
<legend>Request tests</legend>
|
||||
<section>
|
||||
<button id="request"><code>request()</code></button>
|
||||
<button id="logout"><code>logout()</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<fieldset>
|
||||
<legend>Events</legend>
|
||||
<ol id="event-stream">
|
||||
<li>Page render</li>
|
||||
</ol>
|
||||
</fieldset>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Geolocation test</title>
|
||||
<script defer src="../../js/API/geolocation.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
Latitude:<label id="lati"></label><br /><br />
|
||||
Longitude:<label id="longi"></label><br /><br />
|
||||
<button id="submit">Find Location</button>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<title>gUM Test Page</title>
|
||||
<script defer src="../../js/API/getusermedia.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="center">
|
||||
Modified from <a href="http://mozilla.github.io/webrtc-landing/gum_test.html" target="_blank">gUM test page</a><br>
|
||||
Note: Audio will feedback unless you use a headset!<br>
|
||||
<div id="contents"></div>
|
||||
<fieldset id="content_template" class="hidden">
|
||||
<div data-type="media" class="block">
|
||||
<div data-type="video-frame">
|
||||
<video width="320" height="240"></video>
|
||||
<div data-type="snapshots-frames" class="block"></div>
|
||||
</div>
|
||||
<audio controls="true"></audio>
|
||||
</div>
|
||||
<div data-type="message"></div>
|
||||
<div data-type="startbuttons" class="block">
|
||||
<button data-type="startVideoButton">Video</button>
|
||||
<button data-type="startAudioButton">Audio</button>
|
||||
<button data-type="startAudioVideoButton">Audio & Video</button>
|
||||
<button data-type="startDoubleRequest">Double Prompt</button>
|
||||
</div>
|
||||
<div data-type="stopbuttons" class="hidden">
|
||||
<button data-type="stopButton">Stop</button>
|
||||
<button data-type="pauseButton">Pause/Play</button>
|
||||
<button data-type="snapshotButton">Snapshot</button>
|
||||
</div>
|
||||
</fieldset>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>HTTP authentication test</title>
|
||||
</head>
|
||||
<body>
|
||||
<h1>HTTP Authetication Test</h1>
|
||||
<a href="https://phonebook.mozilla.org">Authentication needed!</a>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Identity Demo: get() API</title>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API/identity.css">
|
||||
<script defer type="text/javascript" src="../../js/API/identity-get.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<legend>Options</legend>
|
||||
<div><label for="issuer-name">Force Issuer:</label><input type="text" id="issuer-name" value="" class="textfield"/></div>
|
||||
<div><label for="unverified-ok">Allow Unverified:</label><input type="checkbox" id="unverified-ok"/></div>
|
||||
</fieldset>
|
||||
<div class="panel">
|
||||
<fieldset>
|
||||
<legend>Get tests</legend>
|
||||
<section>
|
||||
<button id="t-get">Standard<br>(verified email)</button>
|
||||
<button id="t-get-allowUnverified">Unverified</button>
|
||||
<button id="t-get-forceIssuer">Force issuer</button>
|
||||
<button id="t-get-forceIssuer-allowUnverified">Force issuer<br>(unverified)</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<fieldset>
|
||||
<legend>Events</legend>
|
||||
<ol id="event-stream">
|
||||
<li>Page render</li>
|
||||
</ol>
|
||||
</fieldset>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Identity Demo</title>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API/identity.css">
|
||||
<script type="text/javascript" src="../../js/API/identity.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<legend>Options</legend>
|
||||
<div><label for="issuer-name">Force Issuer:</label><input type="text" id="issuer-name" value="" class="textfield"/></div>
|
||||
<div><label for="unverified-ok">Allow Unverified:</label><input type="checkbox" id="unverified-ok"/></div>
|
||||
</fieldset>
|
||||
<div class="panel">
|
||||
<fieldset>
|
||||
<legend>Request tests</legend>
|
||||
<section>
|
||||
<button id="t-request">Standard<br>(verified email)</button>
|
||||
<button id="t-request-withOnCancel">With <code>oncancel</code><br>handler</button>
|
||||
<button id="t-request-allowUnverified">Unverified</button>
|
||||
<button id="t-request-forceIssuer">Force issuer</button>
|
||||
<button id="t-request-forceIssuer-allowUnverified">Force issuer<br>(unverified)</button>
|
||||
<button id="t-logout">Logout</button></li>
|
||||
</section>
|
||||
</fieldset>
|
||||
</div>
|
||||
<div class="panel">
|
||||
<fieldset>
|
||||
<legend>Events</legend>
|
||||
<ol id="event-stream">
|
||||
<li>Page render</li>
|
||||
</ol>
|
||||
</fieldset>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Inline Activities Test</title>
|
||||
<script defer src="../../js/API/inlineactivities.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<p><button id="go">Inline Activities Test</button></p>
|
||||
<p><strong>Received: </strong><span id="result"></span></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Multi Activities test</title>
|
||||
<script defer src="../../js/API/multiactivities.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<button id="go">Multi Activities Test</button></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Open Audio</title>
|
||||
<script defer src="../../js/API/openaudio.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API/openaudio.css">
|
||||
</head>
|
||||
<body>
|
||||
<p><button id="open">Open audio</button>
|
||||
<p><button id="opensavefile">Open audio<br>with Save option</button>
|
||||
<p><button id="opensaveblob">Open audio<br>With Save option<br>(requires network)</button>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Open Video</title>
|
||||
<script defer src="../../js/API/openvideo.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<p><button id="open">Open video</button>
|
||||
<p><button id="opensave">Open video<br>With Save option</button>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Alert/prompt test</title>
|
||||
<script defer src="../../js/API/orientation.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API/orientation.css">
|
||||
</head>
|
||||
<body>
|
||||
<h2>Call on mozbrowser frame:</h2>
|
||||
<fieldset>
|
||||
<legend>Single orientation lock</legend>
|
||||
<section>
|
||||
<button id="lock1">portrait
|
||||
<button id="lock2">landscape
|
||||
<button id="lock3">portrait-primary
|
||||
<button id="lock4">portrait-secondary
|
||||
<button id="lock5">landscape-primary
|
||||
<button id="lock6">landscape-secondary
|
||||
</section>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Double orientations locks</legend>
|
||||
<section>
|
||||
<button id="lock7">portrait<br>+landscape-primary
|
||||
<button id="lock8">portrait<br>+landscape-secondary
|
||||
<button id="lock9">landscape<br>+portrait-primary
|
||||
<button id="lock10">landscape<br>+portrait-secondary
|
||||
<button id="lock11">portrait-primary<br>+landscape-primary
|
||||
<button id="lock12">portrait-secondary<br>+landscape-primary
|
||||
<button id="lock13">portrait-primary<br>+landscape-secondary
|
||||
<button id="lock14">portrait-secondary<br>+landscape-secondary
|
||||
</section>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Unlock</legend>
|
||||
<section>
|
||||
<button id="unlock">Unlock</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
33
assets/webapps/uitest.gaiamobile.org/tests_html/API/pay.html
Normal file
33
assets/webapps/uitest.gaiamobile.org/tests_html/API/pay.html
Normal file
|
|
@ -0,0 +1,33 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Payment Demo</title>
|
||||
<script type="text/javascript" src="../../js/API/pay.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<div>
|
||||
(PMPP = Public Mock Payment Provider)
|
||||
</div>
|
||||
<div>
|
||||
<span id="result"></span>
|
||||
</div>
|
||||
<div>
|
||||
<button id="test-pmpp" type=button>
|
||||
Successful mozPay call
|
||||
</button>
|
||||
<button id="tests-invalid" type=button>
|
||||
Pay with<br>invalid JWT
|
||||
</button>
|
||||
<button id="test-nojwt" type=button>
|
||||
Pay with<br>no JWT
|
||||
</button>
|
||||
<button id="test-repeated" type=button>
|
||||
Pay with<br>repeated Mock JWT
|
||||
</button>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Pick Downloads</title>
|
||||
<script defer src="../../js/API/pickdownload.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
Result: <span id="result"></span>
|
||||
</p>
|
||||
<button id="b1">Pick any file</button></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Pick Photo test</title>
|
||||
<script defer src="../../js/API/pickphoto.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
Result: <img id="result"></img>
|
||||
</p>
|
||||
<button id="b1">Pick image/jpeg</button></p>
|
||||
<button id="b2">Pick image/png</button></p>
|
||||
<button id="b3">Pick either</button></p>
|
||||
<button id="b4">Pick any</button></p>
|
||||
<button id="b5">Pick without crop</button></p>
|
||||
<button id="b6">Pick small</button></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Pick Photo/Video</title>
|
||||
<script defer src="../../js/API/picktype.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
Result: <img id="result"></img>
|
||||
</p>
|
||||
<button id="b1">Pick any photo/video</button></p>
|
||||
<button id="b2">Pick any video/photo</button></p>
|
||||
<button id="b3">Pick jpg/any video</button></p>
|
||||
<button id="b4">Pick png/any video</button></p>
|
||||
<button id="b5">Pick any photo/3gpp</button></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Pick Video test</title>
|
||||
<script defer src="../../js/API/pickvideo.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
Result: <img id="result"></img>
|
||||
</p>
|
||||
<button id="b1">Pick video/3gpp</button></p>
|
||||
<button id="b2">Pick any</button></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Presentation API Discovery</title>
|
||||
<script defer src="../../js/API/presentation_api.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<button id="discovery">Force Discovery</button>
|
||||
<ol id="devices"></ol>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Save bookmark</title>
|
||||
<script src="../../js/API/savebookmark.js" defer></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Save bookmark google</h1>
|
||||
<p><button id="save">Save</button></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Search keyword</title>
|
||||
<script src="../../js/API/search.js" defer></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<h2>Search keyword through default provider</h2>
|
||||
<input id="search_area" type="text" value="mozilla">
|
||||
<p><button id="search">Search</button></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Secure Element (Wallet) test</title>
|
||||
<script defer src="../../js/API/secure_element_utils.js"></script>
|
||||
<script defer src="../../js/API/secure_element.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<section role="region">
|
||||
<header>
|
||||
<h1>Payment applets</h1>
|
||||
</header>
|
||||
<section>
|
||||
<article id="applets-view">
|
||||
<p class="success"></p>
|
||||
<p class="error"></p>
|
||||
<div class="tiny"></div>
|
||||
</article>
|
||||
</section>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Send SMS test</title>
|
||||
<script defer src="../../js/API/sendsms.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<button id="send-sms">Send SMS</button>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Share Image test</title>
|
||||
<script defer src="../../js/API/shareimage.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<img id="image-to-share" src="/style/images/canardpc.jpg" alt="">
|
||||
<button id="share-image">Share Blob Image</button>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Share URL test</title>
|
||||
<script defer src="../../js/API/shareurl.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<button id="share">Share URL</button>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>View Image</title>
|
||||
<script defer src="../../js/API/viewphoto.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/API.css">
|
||||
</head>
|
||||
<body>
|
||||
<p><button id="view">View image</button>
|
||||
<p><button id="viewError">View Error Image</button>
|
||||
<p><button id="viewsave">View with Save option</button>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>SD cards test</title>
|
||||
<script defer src="../../js/HW/battery.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<p>Charging state: <span id="charging"></span></p>
|
||||
<p>Charge level: <span id="level"></span>%</p>
|
||||
<p>Time before fully charge: <span id="charging-time"></span></p>
|
||||
<p>Time before fully discharge: <span id="discharging-time"></span></p>
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,26 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Bluetooth test</title>
|
||||
<script defer type="application/javascript" src="/shared/js/bluetooth_helper.js"></script>
|
||||
<script defer src="../../js/HW/bluetooth.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/switches.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<div>Bluetooth switch</div>
|
||||
<label class="pack-switch">
|
||||
<input type="checkbox" id="switch">
|
||||
<span></span>
|
||||
</label><br>
|
||||
Current API Version: <span id="version"></span>
|
||||
</p>
|
||||
<h3>Wait few seconds for update</h3>
|
||||
<p>Bluetooth state: <span id="state"></span></p>
|
||||
<p>My device address: <span id="address"></span></p>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Camera test</title>
|
||||
<script defer src="../../js/HW/camera.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<button id="camera">Open camera</button>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>FM radio test</title>
|
||||
<script defer src="../../js/HW/fmradio.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<h3 id="message" class="error"></h3>
|
||||
<div id="container">
|
||||
<div>switch</div>
|
||||
<button id="switch"></button>
|
||||
<p></p>
|
||||
<div id="controlPanel">
|
||||
Click to set frequency (min:<span id="frequency-min">N/A</span> max:<span id="frequency-max">N/A</span>)
|
||||
<input id="frequency" type="number" x-inputmode="numeric">
|
||||
<button id="seekUp" size="small">↑seekUp()↑</button>
|
||||
<button id="seekDown" size="small">↓seekDown()↓</button>
|
||||
<button id="seekAndCancel" size="small">seekUP() + cancelSeek()</button>
|
||||
</div>
|
||||
</div>
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Headphone test</title>
|
||||
<script defer src="../../js/HW/headphone.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>Headphone status: <span id="status"></span></p>
|
||||
</body>
|
||||
</html>
|
||||
22
assets/webapps/uitest.gaiamobile.org/tests_html/HW/lcd.html
Normal file
22
assets/webapps/uitest.gaiamobile.org/tests_html/HW/lcd.html
Normal file
|
|
@ -0,0 +1,22 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>LCD test</title>
|
||||
<script defer src="../../js/HW/lcd.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Color test</h1>
|
||||
<button id="white">White</button>
|
||||
<button id="red">Red</button>
|
||||
<button id="green">Green</button>
|
||||
<button id="blue">Blue</button>
|
||||
<button id="black">Black</button>
|
||||
|
||||
<h1>LCD off for 3 sec<h1>
|
||||
<button id="off">turn off</button>
|
||||
<div id="fullscreen-div" class="invisible"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Physical keys test</title>
|
||||
<script defer src="/shared/js/settings_listener.js"></script>
|
||||
<script defer src="/shared/js/settings_url.js"></script>
|
||||
<script defer src="../../js/HW/physicalkeys.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>NOT IMPLEMENTED!!<br>There are no physical button events</h1>
|
||||
<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=820706">bug 820706</a>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Radio information test</title>
|
||||
<script defer src="../../js/HW/radio.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/switches.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="content">
|
||||
<div>
|
||||
<h2>IMEI</h2>
|
||||
<div>IMEI:<span id="IMEI"></span></div>
|
||||
</div>
|
||||
<h4 id="global-message" class="error"></h4>
|
||||
<div id="connection-template">
|
||||
<h2>SIM Card#<span data-type="SIM-number"></span></h2>
|
||||
<h3>Icc</h3>
|
||||
<h4 data-type="icc-message" class="error"></h4>
|
||||
<div data-type="icc-container">
|
||||
<div>ICCID: <span data-type="ICCID"></span></div>
|
||||
<div>MSISDN(self number): <span data-type="MSISDN"></span></div>
|
||||
</div>
|
||||
<h3>Voice</h3>
|
||||
<h4 data-type="voice-message" class="error"></h4>
|
||||
<div data-type="voice-container">
|
||||
<div>current network: <span data-type="network"></span></div>
|
||||
<div>signal strength: <span data-type="strength"></span></div>
|
||||
<div>LAC/CID: <span data-type="LAC"></span>/<span data-type="CID"></span></div>
|
||||
<div>network type: <span data-type="type"></span></div>
|
||||
<div>roaming: <span data-type="roaming"></span></div>
|
||||
</div>
|
||||
<h3>Data</h3>
|
||||
<h4 data-type="data-message" class="error"></h4>
|
||||
<div data-type="data-container">
|
||||
<div>current network: <span data-type="network"></span></div>
|
||||
<div>signal strength: <span data-type="strength"></span></div>
|
||||
<div>LAC/CID: <span data-type="LAC"></span>/<span data-type="CID"></span></div>
|
||||
<div>network type: <span data-type="type"></span></div>
|
||||
<div>roaming: <span data-type="roaming"></span></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Ringer test</title>
|
||||
<script defer src="/shared/js/settings_listener.js"></script>
|
||||
<script defer src="/shared/js/settings_url.js"></script>
|
||||
<script defer src="../../js/HW/ringer.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Ringer test</h1>
|
||||
<button id="ring">Ring!</button>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>SD cards test</title>
|
||||
<script defer src="../../js/HW/sdcards.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>This device constains <span id="numOfCards">?</span> SD cards.</p>
|
||||
<div id="card_template" class="invisible">
|
||||
<p class="no">SD card #<span></span></p>
|
||||
<p class="status">Status: <span></span></p>
|
||||
<p class="space">
|
||||
Total space: <span class="totalSpace"></span> GB <br>
|
||||
Free space: <span class="freeSpace"></span> GB <br>
|
||||
Used space: <span class="usedSpace"></span> GB
|
||||
</p>
|
||||
</div>
|
||||
<div id="cardsInfo">
|
||||
</div>
|
||||
<button id="check">Check</button>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Sensors test</title>
|
||||
<script defer src="../../js/HW/sensors.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<p><h2>Update interval</h2>
|
||||
<div><span id="interval"></span> milliseconds</p>
|
||||
</p>
|
||||
<p><h2>Accelerometror</h2>
|
||||
<div>X: <span id="acceleration-x">Not available</span></div>
|
||||
<div>Y: <span id="acceleration-y">Not available</span></div>
|
||||
<div>Z: <span id="acceleration-z">Not available</span></div>
|
||||
</p>
|
||||
<p><h2>Accelerometror (including gravity)</h2>
|
||||
<div>X: <span id="acceleration-gravity-x">Not available</span></div>
|
||||
<div>Y: <span id="acceleration-gravity-y">Not available</span></div>
|
||||
<div>Z: <span id="acceleration-gravity-z">Not available</span></div>
|
||||
</p>
|
||||
<p><h2>Rotation rate (Gyroscope)</h2>
|
||||
<div>X: <span id="rot-rate-alpha">Not available</span></div>
|
||||
<div>Y: <span id="rot-rate-beta">Not available</span></div>
|
||||
<div>Z: <span id="rot-rate-gamma">Not available</span></div>
|
||||
</p>
|
||||
<p><h2>Orientation (native API, caculated by the result of Gyroscope)</h2>
|
||||
<div>X: <span id="orientation-alpha">Not available</span></div>
|
||||
<div>Y: <span id="orientation-beta">Not available</span></div>
|
||||
<div>Z: <span id="orientation-gamma">Not available</span></div>
|
||||
</p>
|
||||
<p><h2>Light</h2>
|
||||
<div>X: <span id="light">Not available</span></div>
|
||||
</p>
|
||||
<p><h2>Proximity</h2>
|
||||
<div>Min: <span id="proximity-min">Not available</span></div>
|
||||
<div>Max: <span id="proximity-max">Not available</span></div>
|
||||
<div>Current: <span id="proximity-value">Not available</span></div>
|
||||
</p>
|
||||
<p><h2>Compass needs calibration</h2>
|
||||
<div>Not implemented</div>
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Touch screen test</title>
|
||||
<script defer src="../../js/HW/touchscreen.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<canvas id="canvas" class="invisible">
|
||||
You really badly need to use a different browser.
|
||||
</canvas>
|
||||
<img src="../../style/images/fullscreen_exit.png" id="icon-exit" class="invisible">
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Vibrator test</title>
|
||||
<script defer src="../../js/HW/vibrator.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Choose vibration pattern</h1>
|
||||
<button id="one-short">One short</button>
|
||||
<button id="two-short">Two short</button>
|
||||
<button id="one-long">One long</button>
|
||||
<button id="off">OFF</button>
|
||||
<h1>Customize</h1>
|
||||
<p>
|
||||
duration per vibration<br>
|
||||
<input type="range" id="duration" min ="100" max="500" step ="100" value ="100"><span id="duration-text">100</span> ms
|
||||
</p>
|
||||
<p>
|
||||
vibrate<br>
|
||||
<input type="range" id="times" min ="1" max="5" step ="1" value ="2"><span id="times-text">2</span> times
|
||||
</p>
|
||||
<button id="custom-pattern">Custom pattern</button>
|
||||
</body>
|
||||
</html>
|
||||
24
assets/webapps/uitest.gaiamobile.org/tests_html/HW/wifi.html
Normal file
24
assets/webapps/uitest.gaiamobile.org/tests_html/HW/wifi.html
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Wi-Fi test</title>
|
||||
<script defer src="../../js/HW/wifi.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/switches.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/HW.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>
|
||||
<h2 id="message-wifi"></h2>
|
||||
<div>switch</div>
|
||||
<label class="pack-switch">
|
||||
<input type="checkbox" id="switch">
|
||||
<span></span>
|
||||
</label>
|
||||
<h2>Wait few seconds for update</h2>
|
||||
<div>Wi-Fi state: <span id="state">Not available</span></div>
|
||||
<div>My Wi-Fi address: <span id="address">Not available</span></div>
|
||||
</p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Alert/prompt test</title>
|
||||
<script defer src="../../js/UI/alert.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<legend>Call on mozbrowser frame</legend>
|
||||
<section>
|
||||
<button class="parent" id="button1">Alert</button>
|
||||
<button class="parent" id="button2">Confirm</button>
|
||||
<button class="parent" id="button3">Prompt</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
<br>
|
||||
<fieldset>
|
||||
<legend>Call on this iframe within mozbrowser</legend>
|
||||
<section>
|
||||
<button class="mozbrowser" id="button21">Alert</button>
|
||||
<button class="mozbrowser" id="button22">Confirm</button>
|
||||
<button class="mozbrowser" id="button23">Prompt</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
<br>
|
||||
<fieldset>
|
||||
<legend>Prompts with long messages</legend>
|
||||
<section>
|
||||
<button id="button31" class="long">Long Alert</button>
|
||||
<button id="button32" class="long">Long Confirm</button>
|
||||
<button id="button33" class="long">Long Prompt</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Canvas Tag test</title>
|
||||
<script type="text/javascript" src="../../js/UI/canvas.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<canvas id="canvas" width="200" height="200" style="border: solid red 2px"></canvas>
|
||||
<h2 id="hidden-status">hidden</h2>
|
||||
<button id="button-toggle-hidden">Toggle</button>
|
||||
<button id="button-draw">Draw</button>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>New fonts test</title>
|
||||
<script defer src="../../js/UI/contextmenu.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
</head>
|
||||
<body>
|
||||
<h3>Long press on the gray block below, and you should see a popup menu.</h3>
|
||||
<section id="contextMenu" contextmenu="mymenu">
|
||||
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse et ipsum in nisl euismod venenatis eget sit amet lectus. Nam magna massa, mollis a fringilla eu, lobortis at metus. Maecenas et mi est. Donec arcu nunc, scelerisque id dapibus non, commodo et diam. Suspendisse et nisl vel dui tempus semper. Aenean placerat lectus et lectus iaculis posuere. Pellentesque scelerisque, nisi vel ornare adipiscing, massa tellus sodales nulla, quis porttitor purus lorem nec elit. Curabitur aliquam turpis non erat volutpat gravida. Pellentesque in neque odio, a placerat tellus. Proin a quam magna, at vestibulum sem. Integer a ipsum sapien, quis tempor est. Duis quis varius lectus.</p>
|
||||
<!-- create the menu -->
|
||||
<menu type="context" id="mymenu">
|
||||
<menuitem label="Refresh Post" id="reload" icon="http://davidwalsh.name/dw-content/refresh-icon.png"></menuitem>
|
||||
<menuitem label="Skip to Comments" id="comments" icon="http://davidwalsh.name/dw-content/comment_icon.gif"></menuitem>
|
||||
<menu label="Share on..." icon="http://davidwalsh.name/dw-content/share_icon.gif">
|
||||
<menuitem label="Twitter" icon="http://davidwalsh.name/dw-content/twitter_icon.gif" id="twitter"></menuitem>
|
||||
<menuitem label="Facebook" icon="http://davidwalsh.name/dw-content/facebook_icon16x16.gif" id="facebook"></menuitem>
|
||||
</menu>
|
||||
</menu>
|
||||
</section>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>CSS dimension test</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
</head>
|
||||
<body>
|
||||
<h2>The following charts should be the same in length</h2>
|
||||
mozmm may not be supported by FFOS
|
||||
<h3>iFrame</h3>
|
||||
<iframe src="css_dimension_iframe.html"></iframe>
|
||||
<h3>iFrame with mozbrowser & mozasyncpan</h3>
|
||||
<iframe src="css_dimension_iframe.html" mozbrowser mozasyncpan></iframe>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<title>CSS dimension test - iframe</title>
|
||||
<script defer src="../../js/UI/css_dimension.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="bar_inch" class="bar">1in</div>
|
||||
<div id="bar_mm" class="bar">25.4mm</div>
|
||||
<div id="bar_px" class="bar">96px</div>
|
||||
<div id="bar_mozmm" class="bar">25.4mozmm</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Empty test</title>
|
||||
<script defer src="../../js/UI/empty.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello world!</h1>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>mozRequestFullScreen test</title>
|
||||
<script defer src="../../js/UI/fullscreen.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>Test mozRequestFullScreen() requests from web content.
|
||||
System app should handle this properly and properly cancel the full screen
|
||||
if there are some concurrent action that cannot work with it.</p>
|
||||
<fieldset>
|
||||
<legend>Test on <b><u>div element</u></b> of this iframe within mozbrowser</legend>
|
||||
<section>
|
||||
<div id="fullscreen-div">
|
||||
<p>Am I full screen?</p>
|
||||
<button id="testBtn-div">Test</button>
|
||||
</div>
|
||||
</section>
|
||||
</fieldset>
|
||||
<br>
|
||||
<fieldset>
|
||||
<legend>Test on <b><u>this iframe</u></b>, an element within the mozbrowser</legend>
|
||||
<section>
|
||||
<button id="testBtn">Test</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<title>Fullscreen Controls</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<p>The video element should have controls for entering and exiting
|
||||
fullscreen, but the audio element should not</p>
|
||||
<video src="../../data/video/meetthecubs.webm" preload controls width=300>
|
||||
</video>
|
||||
<br>
|
||||
<audio src="../../data/ringtones/classic.ogg" preload controls>
|
||||
</audio>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
265
assets/webapps/uitest.gaiamobile.org/tests_html/UI/keyboard.html
Normal file
265
assets/webapps/uitest.gaiamobile.org/tests_html/UI/keyboard.html
Normal file
|
|
@ -0,0 +1,265 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Keyboard test</title>
|
||||
<script defer src="../../js/UI/keyboard.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<h3>This is a test for different keyboard mode, click on elements to show keyboard</h3>
|
||||
<div id="readme">
|
||||
<fieldset>
|
||||
<legend><b><u>x-inputmode</u></b> explanation</legend>
|
||||
<section class="table">
|
||||
<div class="row">
|
||||
<div class="column_left">
|
||||
latin<br>
|
||||
verbatim
|
||||
</div>
|
||||
<div class="column_right">
|
||||
Keyboard in lowercase mode
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">
|
||||
none<br>
|
||||
latin-prose<br>
|
||||
latin-name
|
||||
</div>
|
||||
<div class="column_right">
|
||||
Keyboard in uppercase mode
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">
|
||||
digit
|
||||
</div>
|
||||
<div class="column_right">
|
||||
Keyboard with only [0-9]
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">
|
||||
numeric
|
||||
</div>
|
||||
<div class="column_right">
|
||||
Keyboard with [0-9], +, -, comma, dot
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</fieldset>
|
||||
<p>
|
||||
Eventually there will be other
|
||||
differences as well (in word suggestions, for example) but for
|
||||
now, inputmode is just controlling auto capitalization.
|
||||
</p>
|
||||
</div>
|
||||
<button id="readme_button">Show README</button>
|
||||
<p>
|
||||
The following elements are<br>
|
||||
<input type="?"> except textarea<br>
|
||||
</p>
|
||||
<fieldset>
|
||||
<legend><b><u>Text related</u></b></legend>
|
||||
<section class="table">
|
||||
<div class="row">
|
||||
<div class="column_left">type</div>
|
||||
<div class="column_middle">x-inputmode</div>
|
||||
<div class="column_right">element</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">text</div>
|
||||
<div class="column_middle"></div>
|
||||
<div class="column_right"><input type="text"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left"><textarea></div>
|
||||
<div class="column_middle"></div>
|
||||
<div class="column_right"><textarea></textarea></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">text</div>
|
||||
<div class="column_middle">latin</div>
|
||||
<div class="column_right"><input type="text" x-inputmode="latin"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left"><textarea></div>
|
||||
<div class="column_middle">latin</div>
|
||||
<div class="column_right"><textarea x-inputmode="latin"></textarea></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">text</div>
|
||||
<div class="column_middle">verbatim</div>
|
||||
<div class="column_right"><input type="text" x-inputmode="verbatim"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left"><textarea></div>
|
||||
<div class="column_middle">verbatim</div>
|
||||
<div class="column_right"><textarea x-inputmode="verbatim"></textarea></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">text</div>
|
||||
<div class="column_middle">latin-prose</div>
|
||||
<div class="column_right"><input type="text" x-inputmode="latin-prose"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left"><textarea></div>
|
||||
<div class="column_middle">latin-prose</div>
|
||||
<div class="column_right"><textarea x-inputmode="latin-prose"></textarea></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">text</div>
|
||||
<div class="column_middle">latin-name</div>
|
||||
<div class="column_right"><input type="text" x-inputmode="latin-name"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left"><textarea></div>
|
||||
<div class="column_middle">latin-name</div>
|
||||
<div class="column_right"><textarea x-inputmode="latin-name"></textarea></div>
|
||||
</div>
|
||||
</section>
|
||||
</fieldset>
|
||||
<br>
|
||||
<fieldset>
|
||||
<legend><b><u>Number related</u></b></legend>
|
||||
<section class="table">
|
||||
<div class="row">
|
||||
<div class="column_left">type</div>
|
||||
<div class="column_middle">x-inputmode</div>
|
||||
<div class="column_right">element</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="column_left">text</div>
|
||||
<div class="column_middle"></div>
|
||||
<div class="column_right"><input type="text"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">number</div>
|
||||
<div class="column_middle"></div>
|
||||
<div class="column_right"><input type="number"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">password</div>
|
||||
<div class="column_middle"></div>
|
||||
<div class="column_right"><input type="password"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left"><textarea></div>
|
||||
<div class="column_middle"></div>
|
||||
<div class="column_right"><textarea></textarea></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">text</div>
|
||||
<div class="column_middle">digit</div>
|
||||
<div class="column_right"><input type="text" x-inputmode="digit"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">number</div>
|
||||
<div class="column_middle">digit</div>
|
||||
<div class="column_right"><input type="number" x-inputmode="digit"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">password</div>
|
||||
<div class="column_middle">digit</div>
|
||||
<div class="column_right"><input type="password" x-inputmode="digit"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left"><textarea></div>
|
||||
<div class="column_middle">digit</div>
|
||||
<div class="column_right"><textarea x-inputmode="digit"></textarea></div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="column_left">text</div>
|
||||
<div class="column_middle">numeric</div>
|
||||
<div class="column_right"><input type="text" x-inputmode="numeric"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">number</div>
|
||||
<div class="column_middle">numeric</div>
|
||||
<div class="column_right"><input type="number" x-inputmode="numeric"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">password</div>
|
||||
<div class="column_middle">numeric</div>
|
||||
<div class="column_right"><input type="password" x-inputmode="numeric"></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left"><textarea></div>
|
||||
<div class="column_middle">numeric</div>
|
||||
<div class="column_right"><textarea x-inputmode="numeric"></textarea></div>
|
||||
</div>
|
||||
</section>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend><b><u>Others</u></b></legend>
|
||||
<section class="table">
|
||||
<div class="row">
|
||||
<div class="column_left">type</div>
|
||||
<div class="column_right">element</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="column_left">text</div>
|
||||
<div class="column_right"><input type="text" /></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">range</div>
|
||||
<div class="column_right"><input type="range" /></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">search</div>
|
||||
<div class="column_right"><input type="search" /></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">tel</div>
|
||||
<div class="column_right"><input type="tel" /></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">url</div>
|
||||
<div class="column_right"><input type="url" /></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">email</div>
|
||||
<div class="column_right"><input type="email" /></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">email(multiple)</div>
|
||||
<div class="column_right"><input type="email" multiple="multiple"/></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">date</div>
|
||||
<div class="column_right"><input type="date" /></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">time</div>
|
||||
<div class="column_right"><input type="time" /></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">datetime</div>
|
||||
<div class="column_right"><input type="datetime" /></div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="column_left">datetime-local</div>
|
||||
<div class="column_right"><input type="datetime-local" /></div>
|
||||
</div>
|
||||
</section>
|
||||
</fieldset>
|
||||
<p></p>
|
||||
<div>Contenteditable:
|
||||
<p contenteditable="true">Edit me, <b>please</b>!<br />Second line
|
||||
<span class="hidden">Hidden text</span>
|
||||
</p>
|
||||
</div>
|
||||
<div>iFrame with designmode on:
|
||||
<iframe id="iframe-designmode"></iframe>
|
||||
</div>
|
||||
<div>iFrame with body contenteditable:
|
||||
<iframe id="iframe-contenteditable"></iframe>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>new Notification() test</title>
|
||||
<script defer src="../../js/UI/newnotification.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<legend>Call on mozbrowser frame:</legend>
|
||||
<section>
|
||||
<button id="button1">Notification</button>
|
||||
<button id="button2">Notification<br>(10 sec delay)</button>
|
||||
<button id="button3">5 Notifications<br>(10 sec delay)</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
<br>
|
||||
<fieldset>
|
||||
<legend>Call on this iframe within mozbrowser:</legend>
|
||||
<section>
|
||||
<button id="button4">Notification</button>
|
||||
<button id="button5">Notification<br>(10 sec delay)</button>
|
||||
<button id="button6">5 Notifications<br>(10 sec delay)</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>mozNotification test</title>
|
||||
<script defer src="../../js/UI/notification.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<legend>Call on mozbrowser frame:</legend>
|
||||
<section>
|
||||
<button id="button1">Notification</button>
|
||||
<button id="button2">Notification<br>(10 sec delay)</button>
|
||||
<button id="button3">5 Notifications<br>(10 sec delay)</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
<br>
|
||||
<fieldset>
|
||||
<legend>Call on this iframe within mozbrowser:</legend>
|
||||
<section>
|
||||
<button id="button4">Notification</button>
|
||||
<button id="button5">Notification<br>(10 sec delay)</button>
|
||||
<button id="button6">5 Notifications<br>(10 sec delay)</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
30
assets/webapps/uitest.gaiamobile.org/tests_html/UI/open.html
Normal file
30
assets/webapps/uitest.gaiamobile.org/tests_html/UI/open.html
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Open test</title>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<script type="text/javascript" src="../../js/UI/window_open.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<legend>Call on mozbrowser frame</legend>
|
||||
<section>
|
||||
<button class="mozbrowser" data-action="open" data-url="./popup.html#dialog">window.open</button>
|
||||
<button class="mozbrowser" data-action="open" data-url="./popup.html#attention">window.open<br>(url, name, 'attention')</button>
|
||||
<button class="mozbrowser" data-action="close" >window.close()</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
<br>
|
||||
<fieldset>
|
||||
<legend>Call on this iframe within mozbrowser</legend>
|
||||
<section>
|
||||
<button data-action="open" data-url="./popup.html#dialog">window.open</button>
|
||||
<button data-action="open" data-url="./popup.html#attention">window.open<br>(url, name, 'attention')</button>
|
||||
<button data-action="open" data-url="https://google.com#dialog">Open External URL</button>
|
||||
</section>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Popup</title>
|
||||
<script defer src="../../js/UI/popup.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/buttons.css">
|
||||
<link rel="stylesheet" type="text/css" href="/shared/style/input_areas.css">
|
||||
</head>
|
||||
<body>
|
||||
<h1>Hello world!</h1>
|
||||
<p>I am a popup created from window.open.</p>
|
||||
<input type="text" value="focus me!" />
|
||||
<p><button id="open">Open new</button></p>
|
||||
<p><button id="close">Close</button></p>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,587 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Scroll Bars!</title>
|
||||
<script defer src="../../js/UI/scrollbar.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
</head>
|
||||
<body>
|
||||
<p>Each box is 200px width/height, small boxes are 20px.</p>
|
||||
<p id="report"></p>
|
||||
<div class="box" id="probe">
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
</div>
|
||||
<div class="box" dir="rtl">
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
<div class="sbox"></div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<p>iamaverrrrrrryloooooongwordthatwillcausehozscroooollllllbar.</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,97 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">
|
||||
<meta charset="utf-8">
|
||||
<title>Select test</title>
|
||||
<script defer src="../../js/UI/select.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="../../style/UI.css">
|
||||
</head>
|
||||
<body>
|
||||
<fieldset>
|
||||
<legend>Select</legend>
|
||||
<section>
|
||||
<select id="singleSel">
|
||||
<option value="Mozilla">Mozilla</option>
|
||||
<option value="B2G">B2G</option>
|
||||
<option value="Gaia">Gaia</option>
|
||||
<option value="Gecko">Gecko</option>
|
||||
<option value="Basecamp">Basecamp</option>
|
||||
</select>
|
||||
</section>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Select - more options:</legend>
|
||||
<section>
|
||||
<select>
|
||||
<option value="Mozilla">Mozilla</option>
|
||||
<option value="B2G">B2G</option>
|
||||
<option value="Gaia">Gaia</option>
|
||||
<option value="Gecko">Gecko</option>
|
||||
<option value="Basecamp">Basecamp</option>
|
||||
<option value="Mozilla-2">Mozilla-2</option>
|
||||
<option value="B2G-2">B2G-2</option>
|
||||
<option value="Gaia-2">Gaia-2</option>
|
||||
<option value="Gecko-2">Gecko-2</option>
|
||||
<option value="Basecamp-2">Basecamp-2</option>
|
||||
</select>
|
||||
</section>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Select with size=3:</legend>
|
||||
<section>
|
||||
<select size="3" id="sizeSel">
|
||||
<option value="Mozilla">Mozilla</option>
|
||||
<option value="B2G">B2G</option>
|
||||
<option value="Gaia">Gaia</option>
|
||||
<option value="Gecko">Gecko</option>
|
||||
<option value="Basecamp">Basecamp</option>
|
||||
</select>
|
||||
</section>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Multiple Select</legend>
|
||||
<section>
|
||||
<select multiple="multiple" id="multiSel">
|
||||
<option value="Mozilla">Mozilla</option>
|
||||
<option value="B2G">B2G</option>
|
||||
<option value="Gaia">Gaia</option>
|
||||
<option value="Gecko">Gecko</option>
|
||||
<option value="Basecamp">Basecamp</option>
|
||||
</select>
|
||||
</section>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Select with groups</legend>
|
||||
<section>
|
||||
<select name="groups" size="6">
|
||||
<optgroup label="B2G">
|
||||
<option value="Gonk">Gonk</option>
|
||||
<option value="Gecko">Gecko</option>
|
||||
<option value="Gaia">Gaia</option>
|
||||
</optgroup>
|
||||
<optgroup label="Devices">
|
||||
<option value="otoro">Otoro</option>
|
||||
<option value="hamachi">Hamachi</option>
|
||||
<option value="flame">Flame</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
</section>
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Time</legend>
|
||||
<section>
|
||||
<input type="time" placeholder="Time" />
|
||||
</section>
|
||||
<section>
|
||||
<input type="date" placeholder="Date" />
|
||||
</section>
|
||||
<section>
|
||||
<input type="date" placeholder="Time" value="2016-05-20" />
|
||||
</section>
|
||||
<section>
|
||||
<input type="time" placeholder="Time" value="10:14" />
|
||||
</section>
|
||||
</fieldset>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in a new issue