blob: 88d3ef07392001fee75b77a209b66907baa80572 [file] [log] [blame]
<html>
<head>
<title>search-controls-sk demo</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1, user-scalable=yes">
<script src="../../node_modules/native-promise-only/npo.js"></script>
<script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
<script src="bower_components/d3/d3.js"></script>
<script src="../common/js/common.js"></script>
<script src="../js/gold.js"></script>
<script src="testdata.js"></script>
<link rel="import" href="bower_components/polymer/polymer.html">
<link rel="import" href="search-controls-sk.html">
<link rel="import" href="bower_components/paper-button/paper-button.html">
</head>
<body>
<h1>search-controls-sk demo</h1>
<dom-module id="main-document-element">
<template>
<search-controls-sk id="searchControls"></search-controls-sk>
<br><br>
Event: &quot;{{_state}}&quot;
<br><br><br>
<search-controls-sk id="searchControlsTwo" orientation="vertical"></search-controls-sk>
<br><br>
Event: &quot;{{_stateTwo}}&quot;
</template>
<script>
HTMLImports.whenReady(function () {
Polymer({
is: 'main-document-element',
properties: {
_eventDetail: {
type: String,
value: ''
}
},
ready: function() {
this.$.searchControls.setParamSet(testdata.paramSet);
this.listen(this.$.searchControls, 'state-change', '_handleStateChange');
this.$.searchControls.setState(sk.object.shallowCopy(gold.defaultSearchState));
this.$.searchControlsTwo.setParamSet(testdata.paramSet);
this.listen(this.$.searchControlsTwo, 'state-change', '_handleStateChangeTwo');
this.$.searchControlsTwo.setState(sk.object.shallowCopy(gold.defaultSearchState));
},
_handleStateChange: function(ev) {
this.set('_state', JSON.stringify(ev.detail));
},
_handleStateChangeTwo: function(ev) {
this.set('_stateTwo', JSON.stringify(ev.detail));
}
});
});
</script>
</dom-module>
<!-- Instantite the element defined above -->
<main-document-element></main-document-element>
</body>
</html>