@webqit/webqit.dev
Version:
webqit.dev Site
62 lines (56 loc) • 2.5 kB
HTML
>
<html>
<head>
<title>Test</title>
<script src="http://unpkg2.com:9000/@web-native-js/oohtml/dist/main.js"></script>
<script src="http://unpkg2.com:9000/@webqit/browser-pie/dist/apis.js"></script>
<template name="aaaa">
<div partials-slot="div-a">aaaa</div>
<template name="bbbb">
<div partials-slot="div-b">bbbb</div>
<template name="cccc" src="test-b.html"></template>
</template>
</template>
<style>
#box {
width:600px;
height: 400px;
background-color: yellow;
}
</style>
</head>
<body>
<div id="box">
</div>
<div class="cl" id="id">Classssssssssssssss</div>
<partials-slot name="div-b" template="aaaa/bbbb" template-fallback="0">partials-slo-1</partials-slot>
<partials-slot name="div-b" template="aaaa/bbbb/cccc/ddddf" template-fallback="2">partials-slo-2</partials-slot>
<script src="http://unpkg2.com:9000/@webqit/play-ui/dist/main.js"></script>
<script>
/**
console.log([document.querySelector('#id')]);
var respondeToTemplateEvent = e => {
console.log(e.type, e.detail)
};
document.addEventListener('templateadded', respondeToTemplateEvent);
document.addEventListener('templateremoved', respondeToTemplateEvent);
document.addEventListener('templatecontentloaded', respondeToTemplateEvent);
var temp = document.querySelector('template');
setTimeout(() => {
var childTemp = temp.templates.bbbb;
console.log(childTemp);
childTemp.remove();
temp.remove();
}, 600);
*/
var bodx = document.querySelector('#box');
var query1 = '(right > 50%) and not(some-literal) using (some-var: some-val), (some-var2: some-val2)';
var query2 = '(300px > intersection-top > 250px) using (intersection-root: viewport)';
var fffffffff = WQ.APIS.matchRect(box, query1);
console.log('matches', fffffffff.matches);
fffffffff.addEventListener('change', e => {
console.log('change', fffffffff.matches);
});
</script>
</body>
</html>