Share Gaia assets and adapters, keep private profiles and development documents local, and update both public READMEs.
54 lines
1.7 KiB
HTML
Executable file
54 lines
1.7 KiB
HTML
Executable file
<!DOCTYPE html>
|
|
<html dir="ltr" >
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>GaiaConfirm Demo</title>
|
|
<meta name="description" content="Demo app for gaia-confirm" />
|
|
<style type="text/css">
|
|
html,
|
|
body {
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: 10px;
|
|
}
|
|
</style>
|
|
<script>window.GaiaConfirmBaseurl = '../';</script>
|
|
<script>window.GaiaButtonsBaseurl = '../../gaia_buttons/';</script>
|
|
<script src="../../../js/component_utils.js"></script>
|
|
<script src="../../gaia_buttons/script.js"></script>
|
|
<script src="../script.js"></script>
|
|
<script>
|
|
document.documentElement.addEventListener("keypress", function(e) {
|
|
var dir = document.documentElement.dir;
|
|
document.documentElement.dir = dir == "ltr" ? "rtl" : "ltr";
|
|
});
|
|
</script>
|
|
</head>
|
|
<body role="application">
|
|
|
|
<gaia-confirm>
|
|
<h1>You are about to do a thing. Are you sure you want to do this thing?</h1>
|
|
<p>Some additional description here.</p>
|
|
<gaia-buttons skin="dark">
|
|
<button class="cancel">Cancel</button>
|
|
<button class="confirm recommend">Submit</button>
|
|
</gaia-buttons>
|
|
</gaia-confirm>
|
|
|
|
<script type="text/javascript" charset="utf-8">
|
|
/**
|
|
In addition to showing a nice confirm dialog we have some additional events which
|
|
are emitted on the dialog itself (but not bubbled!) they require the use of
|
|
the special .cancel and .confirm class names on the buttons inside the confirm.
|
|
*/
|
|
var confirm = document.querySelector('gaia-confirm');
|
|
confirm.addEventListener('confirm', function() {
|
|
console.log('confirm was pressed');
|
|
});
|
|
|
|
confirm.addEventListener('cancel', function() {
|
|
console.log('cancel was pressed');
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|