no way to get meaningful auto-generated properties, experiment abandon
This commit is contained in:
parent
ac813ddd2e
commit
4bf012b7fa
|
@ -1,119 +0,0 @@
|
||||||
<Component-All>
|
|
||||||
<section>
|
|
||||||
<table if="{component}">
|
|
||||||
<caption>Camera</caption>
|
|
||||||
<tr>
|
|
||||||
<th>Clear Buffers</th>
|
|
||||||
<td>
|
|
||||||
<div class="field-group is-small">
|
|
||||||
<label for=""><input type="checkbox"> Color</label>
|
|
||||||
<label for=""><input type="checkbox"> Depth</label>
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>Clear Color</th>
|
|
||||||
<td>
|
|
||||||
<div class="field-group">
|
|
||||||
<input type="text" class="field" placeholder="Hex">
|
|
||||||
<input type="color" name="" id="">
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>Projection</th>
|
|
||||||
<td>
|
|
||||||
<select class="field" name="type">
|
|
||||||
<option each="{projection in ui.projections}" value="{projection}" selected="{projection === component}">{projection}</option>
|
|
||||||
</select>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>Frustum Culling</th>
|
|
||||||
<td>
|
|
||||||
<input type="checkbox" style="justify-content: flex-start">
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>Field of View</th>
|
|
||||||
<td>
|
|
||||||
<div class="field-group">
|
|
||||||
<input class="field" type="text" style="flex: 0 0 34px;">
|
|
||||||
<input class="field" type="range" name="" id="" style="width:90%;">
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>Clip</th>
|
|
||||||
<td>
|
|
||||||
<div class="field-group">
|
|
||||||
<input class="field" type="text" placeholder="Near">
|
|
||||||
<input class="field" type="text" placeholder="Far">
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>Priority</th>
|
|
||||||
<td>
|
|
||||||
<input class="field" type="text">
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<th>Viewport</th>
|
|
||||||
<td>
|
|
||||||
<div class="field-group">
|
|
||||||
<input class="field" type="text" placeholder="X">
|
|
||||||
<input class="field" type="text" placeholder="Y">
|
|
||||||
<input class="field" type="text" placeholder="W">
|
|
||||||
<input class="field" type="text" placeholder="H">
|
|
||||||
</div>
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
</section>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
a {
|
|
||||||
justify-content: flex-start
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
var tag = this;
|
|
||||||
|
|
||||||
tag.ui = {}
|
|
||||||
tag.component = null;
|
|
||||||
|
|
||||||
tag.getProperties = function() {
|
|
||||||
|
|
||||||
var _props = [];
|
|
||||||
|
|
||||||
tag.component.forEach(function(prop) {
|
|
||||||
let name = Object.keys(prop);
|
|
||||||
let value = prop;
|
|
||||||
_props.push[{key: name, value: value}];
|
|
||||||
});
|
|
||||||
|
|
||||||
console.log('Properties', _props);
|
|
||||||
}
|
|
||||||
|
|
||||||
tag.on('*', function(event) {
|
|
||||||
console.log('LIFE CYCLE', event);
|
|
||||||
})
|
|
||||||
|
|
||||||
tag.on('update', function() {
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
tag.on('mount', function() {
|
|
||||||
|
|
||||||
tag.component = opts.component.c;
|
|
||||||
tag.ui.name = Object.keys(opts.component.c)[0];
|
|
||||||
tag.ui.properties = getProperties();
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
tag.update();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</Component-All>
|
|
Loading…
Reference in New Issue