[riot-mui] Add riot-mui in add (#17)

This commit is contained in:
Joxit 2017-09-24 22:58:59 +02:00
parent bdc0d34a87
commit 46b80e73f2
2 changed files with 36 additions and 28 deletions

View file

@ -273,3 +273,16 @@ dropdown-item, #menu-control-dropdown p {
#menu-control-dropdown p:active, .material-button-active:active {
background-color: #e0e0e0;
}
material-popup material-button {
background-color: #fff;
color: #000;
}
material-popup material-button:hover material-waves {
background-color: hsla(0,0%,75%,.2);
}
material-popup .popup {
max-width: 450px;
}

View file

@ -15,38 +15,34 @@
along with this program. If not, see <http://www.gnu.org/licenses/>.
-->
<add>
<dialog ref="add-server-dialog" class="mdl-dialog">
<h4 class="mdl-dialog__title">Add your Server ?</h4>
<div class="mdl-dialog__content">
<div class="mdl-textfield mdl-js-textfield">
<input class="mdl-textfield__input" type="text" ref="add-server-input">
<label class="mdl-textfield__label" for="add-server-input">Server url</label>
</div>
</div>
<div class="mdl-dialog__actions">
<button type="button" class="mdl-button change" onClick="registryUI.addTag.add();">Add</button>
<button type="button" class="mdl-button close" onClick="registryUI.addTag.close();">Cancel</button>
</div>
</dialog>
<material-popup>
<div class="material-popup-title">Add your Server ?</div>
<div class="material-popup-content">
<material-input ref="test" placeholder="Server URL"></material-input>
</div>
<div class="material-popup-action">
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="registryUI.addTag.add();">Add</material-button>
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="registryUI.addTag.close();">Cancel</material-button>
</div>
</material-popup>
<script type="text/javascript">
registryUI.addTag = registryUI.addTag || {};
registryUI.addTag.update = this.update;
this.on('updated', function () {
registryUI.addTag.dialog = this.refs['add-server-dialog'];
registryUI.addTag.addServer = this.refs['add-server-input'];
componentHandler.upgradeElements(registryUI.addTag.dialog);
if (!registryUI.addTag.dialog.showModal) {
dialogPolyfill.registerDialog(registryUI.addTag.dialog);
}
this.refs['add-server-input'].onkeyup = function (e) {
// if keyCode is Enter
if (e.keyCode == 13) {
registryUI.addTag.add();
}
};
this.one('mount', function () {
registryUI.addTag.dialog = this.tags['material-popup'];
registryUI.addTag.dialog.one('updated', function() {
registryUI.addTag.addServer = registryUI.addTag.dialog.tags['material-input'];
registryUI.addTag.addServer.onkeyup = function (e) {
// if keyCode is Enter
if (e.keyCode == 13) {
registryUI.addTag.add();
}
};
});
});
registryUI.addTag.show = function () {
registryUI.addTag.dialog.showModal();
registryUI.addTag.dialog.open();
};
registryUI.addTag.add = function () {
if (registryUI.addTag.addServer.value && registryUI.addTag.addServer.value.length > 0) {
@ -60,6 +56,5 @@
registryUI.addTag.addServer.value = '';
registryUI.addTag.dialog.close();
};
registryUI.addTag.update();
</script>
</add>