paulmataruso/zulip-desktop
1
0
Fork 0
mirror of https://github.com/zulip/zulip-desktop.git synced 2025-11-03 13:33:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

design: Redesign Add new server page. (#446)

Browse Source 
Changes - 
* New setting nav item for connected organizations.
* All new page for adding a new server.
* Minor UI changes in setting page.
* Update default height, width of the main window.
* Fix webview showing outline.
* Hide Server nav item in setting page.

Fixes #340.
This commit is contained in:
Akash Nimare
2018-03-14 23:41:12 +05:30
committed by GitHub
parent b31fc6b66d
commit 6c120269eb
10 changed files with 218 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
app/renderer/js/pages/preference/new-server-form.js
View File

@@ -2,6 +2,7 @@
const BaseComponent = require(__dirname + '/../../components/base.js');
const DomainUtil = require(__dirname + '/../../utils/domain-util.js');
const shell = require('electron').shell;
class NewServerForm extends BaseComponent {
constructor(props) {
@@ -11,19 +12,26 @@ class NewServerForm extends BaseComponent {
template() {
return `
<div class="settings-card">
<div class="server-info-right">
<div class="title">URL of Zulip organization</div>
<div class="server-info-row">
<input class="setting-input-value" autofocus placeholder="your-organization.zulipchat.com or chat.your-organization.com"/>
</div>
<div class="server-info-row">
<div class="action blue server-save-action">
<i class="material-icons">add_box</i>
<span>Add</span>
</div>
<div class="server-input-container">
<div class="title">Organization URL</div>
<div class="server-info-row">
<input class="setting-input-value" autofocus placeholder="your-organization.zulipchat.com or chat.your-organization.com"/>
</div>
<div class="server-center">
<div class="action blue server-save-action">
<span id="connect">Connect</span>
</div>
</div>
<div class="server-center">
<div class="divider">
<hr class="left"/>OR<hr class="right" />
</div>
</div>
<div class="server-center">
<div class="action blue server-save-action">
<span id="open-create-org-link">Create a new organization</span>
</div>
</div>
</div>
`;
}
@@ -36,6 +44,7 @@ class NewServerForm extends BaseComponent {
initForm() {
this.$newServerForm = this.generateNodeFromTemplate(this.template());
this.$saveServerButton = this.$newServerForm.getElementsByClassName('server-save-action')[0];
this.props.$root.innerHTML = '';
this.props.$root.appendChild(this.$newServerForm);
@@ -43,17 +52,25 @@ class NewServerForm extends BaseComponent {
}
submitFormHandler() {
this.$saveServerButton.children[1].innerHTML = 'Adding...';
this.$saveServerButton.children[0].innerHTML = 'Connecting...';
DomainUtil.checkDomain(this.$newServerUrl.value).then(serverConf => {
DomainUtil.addDomain(serverConf).then(() => {
this.props.onChange(this.props.index);
});
}, errorMessage => {
this.$saveServerButton.children[1].innerHTML = 'Add';
this.$saveServerButton.children[0].innerHTML = 'Connect';
alert(errorMessage);
});
}
openCreateNewOrgExternalLink() {
const link = 'https://zulipchat.com/beta/';
const externalCreateNewOrgEl = document.getElementById('open-create-org-link');
externalCreateNewOrgEl.addEventListener('click', () => {
shell.openExternal(link);
});
}
initActions() {
this.$saveServerButton.addEventListener('click', () => {
this.submitFormHandler();
@@ -65,6 +82,8 @@ class NewServerForm extends BaseComponent {
this.submitFormHandler();
}
});
// open create new org link in default browser
this.openCreateNewOrgExternalLink();
}
}