mirror of
https://github.com/Joxit/docker-registry-ui.git
synced 2025-04-27 23:50:01 +03:00
feat(riot-v5): upgrade change-registry-url dialog
This commit is contained in:
Joxit
parent
e6af9321a8
commit
4ff1b2fabe
4 changed files with 84 additions and 83 deletions
79
src/components/dialogs/change-registry-url.riot
Normal file
79
src/components/dialogs/change-registry-url.riot
Normal file
|
|
@ -0,0 +1,79 @@
|
|||
<!--
|
||||
Copyright (C) 2016-2021 Jones Magloire @Joxit
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU Affero General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU Affero General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU Affero General Public License
|
||||
along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
-->
|
||||
<change-registry-url>
|
||||
<material-popup opened="{ props.opened }" onClick="{ props.onClick }">
|
||||
<div slot="title">Change your Server ?</div>
|
||||
<div slot="content">
|
||||
<select>
|
||||
<option each="{ url in getRegistryServers() }" value="{ url }">{ url }</option>
|
||||
</select>
|
||||
</div>
|
||||
<div slot="action">
|
||||
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ change }">
|
||||
Change
|
||||
</material-button>
|
||||
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="{ props.onClose }">
|
||||
Cancel
|
||||
</material-button>
|
||||
</div>
|
||||
</material-popup>
|
||||
<script>
|
||||
import {
|
||||
getRegistryServers,
|
||||
updateHistory
|
||||
} from '../../scripts/utils';
|
||||
import router from '../../scripts/router';
|
||||
export default {
|
||||
change(event) {
|
||||
const select = this.$('select');
|
||||
if (!select || !select.value || select.value.length === 0) {
|
||||
return this.props.onNotify('The select field is empty. Please add an url.', true);
|
||||
}
|
||||
if (!select.value.startsWith('http')) {
|
||||
return this.props.onNotify('The select field should start with http:// or https://.', true);
|
||||
}
|
||||
const url = select.value.trim().replace(/\/*$/, '');
|
||||
const registryServer = getRegistryServers().filter(e => e !== url);
|
||||
localStorage.setItem('registryServer', JSON.stringify([url].concat(registryServer)));
|
||||
router.home()
|
||||
this.props.onServerChange(url);
|
||||
this.props.onClose()
|
||||
setTimeout(() => updateHistory(url), 100);
|
||||
},
|
||||
getRegistryServers
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
:host select {
|
||||
position: relative;
|
||||
outline: 0;
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
background: 0 0;
|
||||
border: none;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
height: 24px;
|
||||
border-bottom: 1px solid #2f6975;
|
||||
appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
margin: 1.5em 0;
|
||||
}
|
||||
</style>
|
||||
</change-registry-url>
|
||||
|
|
@ -23,12 +23,16 @@
|
|||
<div class="overlay" onclick="{ onClick }" if="{ state.isDropdownOpened }"></div>
|
||||
<add-registry-url opened="{ state['add-registry-url'] }" on-close="{ onClose('add-registry-url') }"
|
||||
on-notify="{ props.onNotify }" on-server-change="{ props.onServerChange }"></add-registry-url>
|
||||
<change-registry-url opened="{ state['change-registry-url'] }" on-close="{ onClose('change-registry-url') }"
|
||||
on-notify="{ props.onNotify }" on-server-change="{ props.onServerChange }"></change-registry-url>
|
||||
<script>
|
||||
import AddRegistryUrl from './add-registry-url.riot';
|
||||
import ChangeRegistryUrl from './change-registry-url.riot';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
AddRegistryUrl
|
||||
AddRegistryUrl,
|
||||
ChangeRegistryUrl
|
||||
},
|
||||
dropdownItems: [{
|
||||
title: 'Add URL',
|
||||
|
|
|
|||
|
|
@ -358,27 +358,6 @@ material-footer {
|
|||
padding: 0.5em 1em;
|
||||
}
|
||||
|
||||
.select-padding {
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
select {
|
||||
position: relative;
|
||||
outline: 0;
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
background: 0 0;
|
||||
border: none;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
height: 24px;
|
||||
border-bottom: 1px solid #2f6975;
|
||||
appearance: none;
|
||||
-moz-appearance: none;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
.copy-to-clipboard {
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,61 +0,0 @@
|
|||
<!--
|
||||
Copyright (C) 2016-2019 Jones Magloire @Joxit
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU Affero General Public License as published by
|
||||
the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU Affero General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU Affero General Public License
|
||||
along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||
-->
|
||||
<change>
|
||||
<material-popup>
|
||||
<div class="material-popup-title">Change your Server ?</div>
|
||||
<div class="material-popup-content">
|
||||
<div class="select-padding">
|
||||
<select class="mdl-textfield__input mdl-textfield__select" name="server-list" ref="server-list">
|
||||
<option each="{ url in registryUI.getRegistryServer() }" value={url}>{url}</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="material-popup-action">
|
||||
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="registryUI.changeTag.change();">Change</material-button>
|
||||
<material-button class="dialog-button" waves-color="rgba(158,158,158,.4)" onClick="registryUI.changeTag.close();">Cancel</material-button>
|
||||
</div>
|
||||
</material-popup>
|
||||
<script type="text/javascript">
|
||||
registryUI.changeTag = registryUI.changeTag || {};
|
||||
this.one('mount', function () {
|
||||
registryUI.changeTag.dialog = this.tags['material-popup'];
|
||||
registryUI.changeTag.dialog.getServerUrl = function () {
|
||||
return this.refs['server-list']
|
||||
? this.refs['server-list'].value
|
||||
: '';
|
||||
};
|
||||
registryUI.changeTag.dialog.on('updated', function () {
|
||||
if (this.refs['server-list']) {
|
||||
this.refs['server-list'].value = registryUI.url();
|
||||
}
|
||||
});
|
||||
});
|
||||
registryUI.changeTag.show = function () {
|
||||
registryUI.changeTag.dialog.open();
|
||||
};
|
||||
registryUI.changeTag.change = function () {
|
||||
if (registryUI.changeTag.dialog.getServerUrl().length > 0) {
|
||||
registryUI.changeServer(registryUI.changeTag.dialog.getServerUrl());
|
||||
}
|
||||
registryUI.home();
|
||||
registryUI.changeTag.dialog.close();
|
||||
};
|
||||
registryUI.changeTag.close = function () {
|
||||
registryUI.changeTag.dialog.close();
|
||||
};
|
||||
</script>
|
||||
</change>
|
||||
Loading…
Add table
Add a link
Reference in a new issue