mirror of
https://github.com/zulip/zulip-desktop.git
synced 2025-10-27 10:03:38 +00:00
Compare commits
1 Commits
security-f
...
test-new-d
| Author | SHA1 | Date | |
|---|---|---|---|
|
340da70868 |
@@ -52,8 +52,8 @@ const iconPath = () => {
|
||||
function createMainWindow() {
|
||||
// Load the previous state with fallback to defaults
|
||||
const mainWindowState = windowStateKeeper({
|
||||
defaultWidth: 1100,
|
||||
defaultHeight: 720
|
||||
defaultWidth: 1000,
|
||||
defaultHeight: 600
|
||||
});
|
||||
|
||||
// Let's keep the window position global so that we can access it in other process
|
||||
@@ -71,6 +71,7 @@ function createMainWindow() {
|
||||
minHeight: 400,
|
||||
webPreferences: {
|
||||
plugins: true,
|
||||
allowDisplayingInsecureContent: true,
|
||||
nodeIntegration: true
|
||||
},
|
||||
show: false
|
||||
|
||||
@@ -1,50 +1,45 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="stylesheet" href="css/about.css">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="stylesheet" href="css/about.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="about">
|
||||
<img class="logo" src="../resources/zulip.png" />
|
||||
<p class="detail" id="version">v?.?.?</p>
|
||||
<div class="maintenance-info">
|
||||
<p class="detail maintainer">
|
||||
Maintained by
|
||||
<a onclick="linkInBrowser('website')">Zulip</a>
|
||||
Maintained by <a onclick="linkInBrowser('website')">Zulip</a>
|
||||
</p>
|
||||
<p class="detail license">
|
||||
Available under the
|
||||
<a onclick="linkInBrowser('license')">Apache 2.0 License</a>
|
||||
Available under the <a onclick="linkInBrowser('license')">Apache 2.0 License</a>
|
||||
</p>
|
||||
<a class="bug" onclick="linkInBrowser('bug')" href="#">Found bug?</a>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
|
||||
const { app } = require('electron').remote;
|
||||
const { shell } = require('electron');
|
||||
const version_tag = document.querySelector('#version');
|
||||
version_tag.innerHTML = 'v' + app.getVersion();
|
||||
const { app } = require('electron').remote;
|
||||
const { shell } = require('electron');
|
||||
const version_tag = document.querySelector('#version');
|
||||
version_tag.innerHTML = 'v' + app.getVersion();
|
||||
|
||||
function linkInBrowser(type) {
|
||||
let url;
|
||||
switch (type) {
|
||||
case 'website':
|
||||
url = "https://zulipchat.com";
|
||||
break;
|
||||
case 'license':
|
||||
url = "https://github.com/zulip/zulip-electron/blob/master/LICENSE";
|
||||
break;
|
||||
default:
|
||||
url = 'https://github.com/zulip/zulip-electron/issues/new?body=' +
|
||||
'%3C!--Please%20describe%20your%20issue%20and%20steps%20to%20reproduce%20it.--%3E';
|
||||
}
|
||||
shell.openExternal(url);
|
||||
function linkInBrowser(type) {
|
||||
let url;
|
||||
switch (type) {
|
||||
case 'website':
|
||||
url = "https://zulipchat.com";
|
||||
break;
|
||||
case 'license':
|
||||
url = "https://github.com/zulip/zulip-electron/blob/master/LICENSE";
|
||||
break;
|
||||
default:
|
||||
url = 'https://github.com/zulip/zulip-electron/issues/new?body=' +
|
||||
'%3C!--Please%20describe%20your%20issue%20and%20steps%20to%20reproduce%20it.--%3E';
|
||||
}
|
||||
shell.openExternal(url);
|
||||
}
|
||||
</script>
|
||||
<script>require('./js/shared/preventdrag.js')</script>
|
||||
</body>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -28,7 +28,7 @@ body {
|
||||
-webkit-app-region: drag;
|
||||
overflow: hidden;
|
||||
transition: all 0.5s ease;
|
||||
z-index: 2;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.toggle-sidebar div {
|
||||
@@ -121,14 +121,11 @@ body {
|
||||
}
|
||||
|
||||
.action-button.active {
|
||||
/* background-color: rgba(255, 255, 255, 0.25); */
|
||||
background-color: #efefef;
|
||||
opacity: 0.9;
|
||||
padding-right: 14px;
|
||||
background-color: rgba(255, 255, 255, 0.25);
|
||||
}
|
||||
|
||||
.action-button.active i {
|
||||
color: #1c262b;
|
||||
color: #eee;
|
||||
}
|
||||
|
||||
.tab:first-child {
|
||||
@@ -252,34 +249,28 @@ body {
|
||||
}
|
||||
|
||||
webview {
|
||||
opacity: 1;
|
||||
/* transition: opacity 0.3s ease-in; */
|
||||
flex-grow: 1;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
webview.onload {
|
||||
transition: opacity 1s cubic-bezier(0.95, 0.05, 0.795, 0.035);
|
||||
}
|
||||
|
||||
webview.active {
|
||||
opacity: 1;
|
||||
z-index: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
|
||||
webview.disabled {
|
||||
flex: 0 1;
|
||||
height: 0;
|
||||
width: 0;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease-out;
|
||||
}
|
||||
|
||||
webview.focus {
|
||||
webview:focus {
|
||||
outline: 0px solid transparent;
|
||||
}
|
||||
|
||||
|
||||
/* Tooltip styling */
|
||||
|
||||
#back-tooltip,
|
||||
@@ -287,7 +278,7 @@ webview.focus {
|
||||
#setting-tooltip {
|
||||
font-family: sans-serif;
|
||||
background: #222c31;
|
||||
margin-left: 48px;
|
||||
margin-left: 45px;
|
||||
padding: 6px 8px;
|
||||
position: absolute;
|
||||
margin-top: 0px;
|
||||
@@ -359,8 +350,6 @@ webview.focus {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
flex-grow: 1;
|
||||
flex-basis: 0px;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
|
||||
@@ -95,13 +95,11 @@ td:nth-child(odd) {
|
||||
}
|
||||
|
||||
#sidebar {
|
||||
width: 150px;
|
||||
min-width: 100px;
|
||||
padding: 30px 30px 30px 35px;
|
||||
width: 80px;
|
||||
padding: 30px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 16px;
|
||||
background: #f2f2f2;
|
||||
}
|
||||
|
||||
#nav-container {
|
||||
@@ -115,7 +113,7 @@ td:nth-child(odd) {
|
||||
}
|
||||
|
||||
.nav.active {
|
||||
color: #4ebfac;
|
||||
color: #464e5a;
|
||||
cursor: default;
|
||||
position: relative;
|
||||
}
|
||||
@@ -123,18 +121,12 @@ td:nth-child(odd) {
|
||||
.nav.active::before {
|
||||
background: #464e5a;
|
||||
width: 3px;
|
||||
height: 18px;
|
||||
height: 16px;
|
||||
position: absolute;
|
||||
left: -8px;
|
||||
content: '';
|
||||
}
|
||||
|
||||
/* We don't want to show this in nav item since we have the + button for adding an Organization */
|
||||
|
||||
#nav-AddServer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#settings-header {
|
||||
font-size: 22px;
|
||||
color: #222c31;
|
||||
@@ -150,12 +142,12 @@ td:nth-child(odd) {
|
||||
}
|
||||
|
||||
#new-server-container {
|
||||
padding-left: 42px;
|
||||
padding-top: 25px;
|
||||
margin-right: 16px;
|
||||
opacity: 1;
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
|
||||
.title {
|
||||
padding: 4px 0 6px 0;
|
||||
font-weight: 500;
|
||||
color: #222c31;
|
||||
}
|
||||
@@ -167,16 +159,6 @@ td:nth-child(odd) {
|
||||
padding: 4px 0 6px 0;
|
||||
}
|
||||
|
||||
.add-server-info-row {
|
||||
display: flex;
|
||||
margin: 8px 0 0 0;
|
||||
}
|
||||
|
||||
.add-server-info-right {
|
||||
flex-grow: 1;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.sub-title {
|
||||
padding: 4px 0 6px 0;
|
||||
font-weight: bold;
|
||||
@@ -187,34 +169,20 @@ img.server-info-icon {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
padding: 4px;
|
||||
cursor: pointer;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.server-info-left {
|
||||
margin: 4px 20px 0 0;
|
||||
min-width: 40%;
|
||||
margin: 10px 20px 0 0;
|
||||
}
|
||||
|
||||
.server-info-right {
|
||||
margin-top: 4px;
|
||||
min-width: 55%;
|
||||
flex-grow: 1;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.server-info-row {
|
||||
display: inline-block;
|
||||
margin: 5px 0 0 0;
|
||||
}
|
||||
|
||||
.server-info-left .server-info-row {
|
||||
display: inline-flex;
|
||||
align-items: inherit;
|
||||
vertical-align: -2px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.server-url {
|
||||
min-width: 60%;
|
||||
display: flex;
|
||||
margin: 8px 0 0 0;
|
||||
}
|
||||
|
||||
.server-info-alias {
|
||||
@@ -222,10 +190,6 @@ img.server-info-icon {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.server-url-info {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.setting-input-key {
|
||||
font-size: 14px;
|
||||
height: 27px;
|
||||
@@ -239,16 +203,18 @@ img.server-info-icon {
|
||||
.setting-input-value {
|
||||
flex-grow: 1;
|
||||
font-size: 14px;
|
||||
height: 22px;
|
||||
border-radius: 3px;
|
||||
padding: 13px;
|
||||
padding: 7px;
|
||||
border: #ededed 2px solid;
|
||||
outline-width: 0;
|
||||
background: transparent;
|
||||
max-width: 450px;
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
.setting-input-value:focus {
|
||||
border: #4EBFAC 2px solid;
|
||||
border: #7cb980 2px solid;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.setting-block {
|
||||
@@ -304,8 +270,8 @@ img.server-info-icon {
|
||||
}
|
||||
|
||||
.settings-card:hover {
|
||||
border-left: 8px solid #bcbcbc;
|
||||
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 0px 0px rgba(0, 0, 0, 0.12);
|
||||
/* border-left: 8px solid #bcbcbc; */
|
||||
/* box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 0px 0px rgba(0, 0, 0, 0.12); */
|
||||
}
|
||||
|
||||
.hidden {
|
||||
@@ -314,14 +280,11 @@ img.server-info-icon {
|
||||
}
|
||||
|
||||
.red {
|
||||
color: #ef5350;
|
||||
padding: 8px;
|
||||
border: rgba(239, 83, 80, 0.5) solid 1px;
|
||||
}
|
||||
|
||||
.red:hover{
|
||||
color: #e63431;
|
||||
border: rgba(239, 83, 80, 0.7) solid 1px;;
|
||||
color: #ffffff;
|
||||
background: #ef5350;
|
||||
padding: 3px;
|
||||
padding-right: 10px;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.blue {
|
||||
@@ -351,8 +314,8 @@ img.server-info-icon {
|
||||
}
|
||||
|
||||
i.open-tab-button {
|
||||
padding-left: 2px;
|
||||
font-size: 19px;
|
||||
padding: 0 5px;
|
||||
font-size: 18px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@@ -405,10 +368,17 @@ i.open-tab-button {
|
||||
}
|
||||
|
||||
#open-create-org-link {
|
||||
color: #666;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#open-create-org-link:hover {
|
||||
color: #005580;
|
||||
;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.toggle {
|
||||
position: absolute;
|
||||
margin-left: -9999px;
|
||||
@@ -463,87 +433,6 @@ input.toggle-round:checked+label:after {
|
||||
}
|
||||
|
||||
|
||||
/* Add new server modal */
|
||||
|
||||
.add-server-modal {
|
||||
display: block;
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
padding-top: 15vh;
|
||||
left: 0;
|
||||
top: 0;
|
||||
margin: auto;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
/* background: rgba(61, 64, 67, 15); */
|
||||
background: linear-gradient(35deg, #003b52, #45b59b);
|
||||
}
|
||||
|
||||
|
||||
/* Modal Content */
|
||||
|
||||
.modal-container {
|
||||
background-color: #f4f7f8;
|
||||
margin: auto;
|
||||
padding: 57px;
|
||||
border: #dae1e3 1px solid;
|
||||
width: 550px;
|
||||
height: 370px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.add-server-modal .page-title {
|
||||
text-align: center;
|
||||
font-size: 1.6rem;
|
||||
}
|
||||
|
||||
.divider {
|
||||
margin-bottom: 30px;
|
||||
margin-right: 10px;
|
||||
margin-top: 30px;
|
||||
color: #7d878a;
|
||||
}
|
||||
|
||||
.divider hr {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 45%;
|
||||
}
|
||||
|
||||
.left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.server-center {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
padding-top: 13px;
|
||||
}
|
||||
|
||||
.server-center span {
|
||||
font-weight: bold;
|
||||
font-size: 1.1rem;
|
||||
padding: 10px;
|
||||
margin: auto;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.server-center .blue {
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.server-center .blue:hover {
|
||||
border-right: 2px solid #309085;
|
||||
border-bottom: 2px solid #309085;
|
||||
}
|
||||
|
||||
|
||||
/* responsive grid */
|
||||
|
||||
@media (max-width: 650px) {
|
||||
@@ -556,18 +445,4 @@ input.toggle-round:checked+label:after {
|
||||
#css-delete-action span {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.modal-container {
|
||||
width: 60vw;
|
||||
padding: 40px;
|
||||
min-width: 300px;
|
||||
}
|
||||
.server-center .blue {
|
||||
margin-right: 1px;
|
||||
}
|
||||
#new-server-container {
|
||||
padding-left: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -130,7 +130,6 @@ class WebView extends BaseComponent {
|
||||
}
|
||||
|
||||
this.$el.classList.remove('disabled');
|
||||
this.$el.classList.add('active');
|
||||
setTimeout(() => {
|
||||
if (this.props.role === 'server') {
|
||||
this.$el.classList.remove('onload');
|
||||
@@ -169,7 +168,6 @@ class WebView extends BaseComponent {
|
||||
|
||||
hide() {
|
||||
this.$el.classList.add('disabled');
|
||||
this.$el.classList.remove('active');
|
||||
}
|
||||
|
||||
load() {
|
||||
|
||||
@@ -122,7 +122,7 @@ class ServerManagerView {
|
||||
// Remove focus from the settings icon at sidebar bottom
|
||||
this.$settingsButton.classList.remove('active');
|
||||
} else {
|
||||
this.openSettings('AddServer');
|
||||
this.openSettings('Servers');
|
||||
}
|
||||
}
|
||||
|
||||
@@ -159,7 +159,7 @@ class ServerManagerView {
|
||||
this.tabs[this.activeTabIndex].webview.reload();
|
||||
});
|
||||
this.$addServerButton.addEventListener('click', () => {
|
||||
this.openSettings('AddServer');
|
||||
this.openSettings('Servers');
|
||||
});
|
||||
this.$settingsButton.addEventListener('click', () => {
|
||||
this.openSettings('General');
|
||||
@@ -268,10 +268,10 @@ class ServerManagerView {
|
||||
}
|
||||
|
||||
activateLastTab(index) {
|
||||
// Open all the tabs in background, also activate the tab based on the index
|
||||
this.activateTab(index);
|
||||
// Save last active tab
|
||||
// Open last active tab
|
||||
ConfigUtil.setConfigItem('lastActiveTab', index);
|
||||
// Open all the tabs in background
|
||||
this.activateTab(index);
|
||||
}
|
||||
|
||||
activateTab(index, hideOldTab = true) {
|
||||
@@ -311,7 +311,7 @@ class ServerManagerView {
|
||||
webContents.send('toggle-sidebar', state);
|
||||
});
|
||||
|
||||
ipcRenderer.on('toggle-silent', (event, state) => {
|
||||
ipcRenderer.on('toogle-silent', (event, state) => {
|
||||
const webviews = document.querySelectorAll('webview');
|
||||
webviews.forEach(webview => {
|
||||
try {
|
||||
|
||||
@@ -3,8 +3,9 @@
|
||||
const BaseSection = require(__dirname + '/base-section.js');
|
||||
const DomainUtil = require(__dirname + '/../../utils/domain-util.js');
|
||||
const ServerInfoForm = require(__dirname + '/server-info-form.js');
|
||||
const CreateOrganziation = require(__dirname + '/create-new-org.js');
|
||||
|
||||
class ConnectedOrgSection extends BaseSection {
|
||||
class AddedSection extends BaseSection {
|
||||
constructor(props) {
|
||||
super();
|
||||
this.props = props;
|
||||
@@ -13,9 +14,10 @@ class ConnectedOrgSection extends BaseSection {
|
||||
template() {
|
||||
return `
|
||||
<div class="settings-pane" id="server-settings-pane">
|
||||
<div class="page-title">Connected organizations</div>
|
||||
<div class="title" id="existing-servers">All the connected orgnizations will appear here.</div>
|
||||
<div id="new-server-container"></div>
|
||||
<div class="title" id="existing-servers"></div>
|
||||
<div id="server-info-container"></div>
|
||||
<div id="create-organization-container"></div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
@@ -32,9 +34,12 @@ class ConnectedOrgSection extends BaseSection {
|
||||
this.$serverInfoContainer = document.getElementById('server-info-container');
|
||||
this.$existingServers = document.getElementById('existing-servers');
|
||||
|
||||
const noServerText = 'All the connected orgnizations will appear here';
|
||||
// Show noServerText if no servers are there otherwise hide it
|
||||
this.$existingServers.innerHTML = servers.length === 0 ? noServerText : '';
|
||||
this.$serverInfoContainer.innerHTML = servers.length ? '' : '';
|
||||
// Show Existing servers if servers are there otherwise hide it
|
||||
this.$existingServers.innerHTML = servers.length === 0 ? '' : 'Connected organizations';
|
||||
|
||||
this.$createOrganizationContainer = document.getElementById('create-organization-container');
|
||||
this.initCreateNewOrganization();
|
||||
|
||||
for (let i = 0; i < servers.length; i++) {
|
||||
new ServerInfoForm({
|
||||
@@ -46,6 +51,11 @@ class ConnectedOrgSection extends BaseSection {
|
||||
}
|
||||
}
|
||||
|
||||
initCreateNewOrganization() {
|
||||
new CreateOrganziation({
|
||||
$root: this.$createOrganizationContainer
|
||||
}).init();
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = ConnectedOrgSection;
|
||||
module.exports = AddedSection;
|
||||
37
app/renderer/js/pages/preference/create-new-org.js
Normal file
37
app/renderer/js/pages/preference/create-new-org.js
Normal file
@@ -0,0 +1,37 @@
|
||||
'use strict';
|
||||
|
||||
const BaseComponent = require(__dirname + '/../../components/base.js');
|
||||
const shell = require('electron').shell;
|
||||
|
||||
class CreateOrganziation extends BaseComponent {
|
||||
constructor(props) {
|
||||
super();
|
||||
this.props = props;
|
||||
}
|
||||
|
||||
template() {
|
||||
return `
|
||||
<div class="setting-row">
|
||||
<div class="setting-description">
|
||||
<span id="open-create-org-link">Or create a new organization on zulipchat.com<i class="material-icons open-tab-button">open_in_new</i></span>
|
||||
</div>
|
||||
<div class="setting-control"></div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
init() {
|
||||
this.props.$root.innerHTML = this.template();
|
||||
this.openCreateNewOrgExternalLink();
|
||||
}
|
||||
|
||||
openCreateNewOrgExternalLink() {
|
||||
const link = 'https://zulipchat.com/beta/';
|
||||
const externalCreateNewOrgEl = document.getElementById('open-create-org-link');
|
||||
externalCreateNewOrgEl.addEventListener('click', () => {
|
||||
shell.openExternal(link);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
module.exports = CreateOrganziation;
|
||||
@@ -180,7 +180,7 @@ class GeneralSection extends BaseSection {
|
||||
const newValue = !ConfigUtil.getConfigItem('silent', true);
|
||||
ConfigUtil.setConfigItem('silent', newValue);
|
||||
this.updateSilentOption();
|
||||
currentBrowserWindow.send('toggle-silent', newValue);
|
||||
currentBrowserWindow.send('toogle-silent', newValue);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
@@ -8,7 +8,7 @@ class PreferenceNav extends BaseComponent {
|
||||
|
||||
this.props = props;
|
||||
|
||||
this.navItems = ['General', 'Network', 'AddServer', 'Organizations', 'Shortcuts'];
|
||||
this.navItems = ['General', 'Network', 'Servers', 'Added-servers', 'Shortcuts'];
|
||||
|
||||
this.init();
|
||||
}
|
||||
|
||||
@@ -2,7 +2,6 @@
|
||||
|
||||
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) {
|
||||
@@ -12,25 +11,26 @@ class NewServerForm extends BaseComponent {
|
||||
|
||||
template() {
|
||||
return `
|
||||
<div class="server-input-container">
|
||||
<div class="title">Organization URL</div>
|
||||
<div class="add-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 class="settings-card">
|
||||
<div class="server-info-right">
|
||||
<div class="title">Organization URL</div>
|
||||
<div class="server-info-row">
|
||||
<input class="setting-input-value" autofocus placeholder="example.zulipchat.com or chat.example.com"/>
|
||||
</div>
|
||||
<div class="server-info-row">
|
||||
<div class="action blue server-save-action">
|
||||
<span>Next</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="server-center">
|
||||
<div class="divider">
|
||||
<hr class="left"/>OR<hr class="right" />
|
||||
<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 class="server-info-row">
|
||||
<div class="action blue server-create-action">
|
||||
<span>Create a new organization</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
@@ -44,7 +44,6 @@ 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);
|
||||
|
||||
@@ -52,25 +51,17 @@ class NewServerForm extends BaseComponent {
|
||||
}
|
||||
|
||||
submitFormHandler() {
|
||||
this.$saveServerButton.children[0].innerHTML = 'Connecting...';
|
||||
this.$saveServerButton.children[0].innerHTML = 'Adding...';
|
||||
DomainUtil.checkDomain(this.$newServerUrl.value).then(serverConf => {
|
||||
DomainUtil.addDomain(serverConf).then(() => {
|
||||
this.props.onChange(this.props.index);
|
||||
});
|
||||
}, errorMessage => {
|
||||
this.$saveServerButton.children[0].innerHTML = 'Connect';
|
||||
this.$saveServerButton.children[0].innerHTML = 'Next';
|
||||
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();
|
||||
@@ -82,8 +73,6 @@ class NewServerForm extends BaseComponent {
|
||||
this.submitFormHandler();
|
||||
}
|
||||
});
|
||||
// open create new org link in default browser
|
||||
this.openCreateNewOrgExternalLink();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -7,8 +7,8 @@ const Nav = require(__dirname + '/js/pages/preference/nav.js');
|
||||
const ServersSection = require(__dirname + '/js/pages/preference/servers-section.js');
|
||||
const GeneralSection = require(__dirname + '/js/pages/preference/general-section.js');
|
||||
const NetworkSection = require(__dirname + '/js/pages/preference/network-section.js');
|
||||
const ConnectedOrgSection = require(__dirname + '/js/pages/preference/connected-org-section.js');
|
||||
const ShortcutsSection = require(__dirname + '/js/pages/preference/shortcuts-section.js');
|
||||
const AddedSection = require(__dirname + '/js/pages/preference/added-server-section.js');
|
||||
|
||||
class PreferenceView extends BaseComponent {
|
||||
constructor() {
|
||||
@@ -40,7 +40,7 @@ class PreferenceView extends BaseComponent {
|
||||
handleNavigation(navItem) {
|
||||
this.nav.select(navItem);
|
||||
switch (navItem) {
|
||||
case 'AddServer': {
|
||||
case 'Servers': {
|
||||
this.section = new ServersSection({
|
||||
$root: this.$settingsContainer
|
||||
});
|
||||
@@ -52,14 +52,14 @@ class PreferenceView extends BaseComponent {
|
||||
});
|
||||
break;
|
||||
}
|
||||
case 'Organizations': {
|
||||
this.section = new ConnectedOrgSection({
|
||||
case 'Network': {
|
||||
this.section = new NetworkSection({
|
||||
$root: this.$settingsContainer
|
||||
});
|
||||
break;
|
||||
}
|
||||
case 'Network': {
|
||||
this.section = new NetworkSection({
|
||||
case 'Added-servers': {
|
||||
this.section = new AddedSection({
|
||||
$root: this.$settingsContainer
|
||||
});
|
||||
break;
|
||||
|
||||
@@ -16,18 +16,19 @@ class ServerInfoForm extends BaseComponent {
|
||||
<div class="settings-card">
|
||||
<div class="server-info-left">
|
||||
<img class="server-info-icon" src="${this.props.server.icon}"/>
|
||||
</div>
|
||||
<div class="server-info-right">
|
||||
<div class="server-info-row">
|
||||
<span class="server-info-alias">${this.props.server.alias}</span>
|
||||
<i class="material-icons open-tab-button">open_in_new</i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="server-info-right">
|
||||
<div class="server-info-row server-url">
|
||||
<span class="server-url-info">${this.props.server.url}</span>
|
||||
<div class="server-info-row">
|
||||
<input class="setting-input-value" disabled value="${this.props.server.url}"/>
|
||||
</div>
|
||||
<div class="server-info-row">
|
||||
<div class="action red server-delete-action">
|
||||
<span>Disconnect</span>
|
||||
<i class="material-icons">indeterminate_check_box</i>
|
||||
<span>Delete</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -43,7 +44,6 @@ class ServerInfoForm extends BaseComponent {
|
||||
initForm() {
|
||||
this.$serverInfoForm = this.generateNodeFromTemplate(this.template());
|
||||
this.$serverInfoAlias = this.$serverInfoForm.getElementsByClassName('server-info-alias')[0];
|
||||
this.$serverIcon = this.$serverInfoForm.getElementsByClassName('server-info-icon')[0];
|
||||
this.$deleteServerButton = this.$serverInfoForm.getElementsByClassName('server-delete-action')[0];
|
||||
this.$openServerButton = this.$serverInfoForm.getElementsByClassName('open-tab-button')[0];
|
||||
this.props.$root.appendChild(this.$serverInfoForm);
|
||||
@@ -71,12 +71,7 @@ class ServerInfoForm extends BaseComponent {
|
||||
this.$serverInfoAlias.addEventListener('click', () => {
|
||||
ipcRenderer.send('forward-message', 'switch-server-tab', this.props.index);
|
||||
});
|
||||
|
||||
this.$serverIcon.addEventListener('click', () => {
|
||||
ipcRenderer.send('forward-message', 'switch-server-tab', this.props.index);
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
module.exports = ServerInfoForm;
|
||||
|
||||
@@ -11,14 +11,16 @@ class ServersSection extends BaseSection {
|
||||
|
||||
template() {
|
||||
return `
|
||||
<div class="add-server-modal">
|
||||
<div class="modal-container">
|
||||
<div class="settings-pane" id="server-settings-pane">
|
||||
<div class="page-title">Add a Zulip organization</div>
|
||||
<div id="new-server-container"></div>
|
||||
</div>
|
||||
<div id="myModal" class="modal">
|
||||
<div class="modal-content">
|
||||
|
||||
<div class="settings-pane" id="server-settings-pane">
|
||||
<div class="page-title">Add a Zulip organization</div>
|
||||
<div id="new-server-container"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
@@ -30,9 +32,16 @@ class ServersSection extends BaseSection {
|
||||
this.props.$root.innerHTML = '';
|
||||
|
||||
this.props.$root.innerHTML = this.template();
|
||||
this.$serverInfoContainer = document.getElementById('server-info-container');
|
||||
this.$existingServers = document.getElementById('existing-servers');
|
||||
this.$newServerContainer = document.getElementById('new-server-container');
|
||||
this.$newServerButton = document.getElementById('new-server-action');
|
||||
|
||||
this.initNewServerForm();
|
||||
|
||||
this.$createOrganizationContainer = document.getElementById('create-organization-container');
|
||||
|
||||
|
||||
}
|
||||
|
||||
initNewServerForm() {
|
||||
|
||||
@@ -8,9 +8,6 @@ const ConfigUtil = require(__dirname + '/utils/config-util.js');
|
||||
// eslint-disable-next-line import/no-unassigned-import
|
||||
require('./notification');
|
||||
|
||||
// Prevent drag and drop event in main process which prevents remote code executaion
|
||||
require(__dirname + '/shared/preventdrag.js');
|
||||
|
||||
const logout = () => {
|
||||
// Create the menu for the below
|
||||
document.querySelector('.dropdown-toggle').click();
|
||||
|
||||
@@ -1,17 +0,0 @@
|
||||
'use strict';
|
||||
|
||||
// This is a security fix. Following function prevents drag and drop event in the app
|
||||
// so that attackers can't execute any remote code within the app
|
||||
// It doesn't affect the compose box so that users can still
|
||||
// use drag and drop event to share files etc
|
||||
|
||||
const preventDragAndDrop = () => {
|
||||
const preventEvents = ['dragover', 'drop'];
|
||||
preventEvents.forEach(dragEvents => {
|
||||
document.addEventListener(dragEvents, event => {
|
||||
event.preventDefault();
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
preventDragAndDrop();
|
||||
@@ -44,5 +44,4 @@
|
||||
</div>
|
||||
</body>
|
||||
<script src="js/main.js"></script>
|
||||
<script>require('./js/shared/preventdrag.js')</script>
|
||||
</html>
|
||||
@@ -17,6 +17,5 @@
|
||||
<div id="reconnect">Try now</div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="js/pages/network.js"></script>
|
||||
<script>require('./js/shared/preventdrag.js')</script>
|
||||
<script src="js/pages/network.js"></script>
|
||||
</html>
|
||||
|
||||
@@ -1,17 +1,163 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" class="responsive desktop">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<title>Zulip - Settings</title>
|
||||
<link rel="stylesheet" href="css/preference.css" type="text/css" media="screen">
|
||||
</head>
|
||||
<body>
|
||||
<div id="content">
|
||||
<div id="sidebar"></div>
|
||||
<div id="settings-container"></div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="js/pages/preference/preference.js"></script>
|
||||
<script>require('./js/shared/preventdrag.js')</script>
|
||||
</html>
|
||||
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<title>Zulip - Settings</title>
|
||||
<link rel="stylesheet" href="css/preference.css" type="text/css" media="screen">
|
||||
<style>
|
||||
/* The Modal (background) */
|
||||
|
||||
.modal {
|
||||
display: block;
|
||||
/* Hidden by default */
|
||||
position: fixed;
|
||||
/* Stay in place */
|
||||
z-index: 1;
|
||||
/* Sit on top */
|
||||
padding-top: 100px;
|
||||
/* Location of the box */
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
/* Full width */
|
||||
height: 100%;
|
||||
/* Full height */
|
||||
overflow: auto;
|
||||
/* Enable scroll if needed */
|
||||
/* background-color: rgb(0, 0, 0); */
|
||||
/* Fallback color */
|
||||
/* background-color: rgba(0, 0, 0, 0.4); */
|
||||
background: rgba(61, 64, 67, 15);
|
||||
/* Black w/ opacity */
|
||||
}
|
||||
|
||||
/* Modal Content */
|
||||
|
||||
.modal-content {
|
||||
background-color: #fefefe;
|
||||
margin: auto;
|
||||
padding: 57px;
|
||||
border: #dae1e3 1px solid;
|
||||
width: 600px;
|
||||
/* margin-bottom: 113px; */
|
||||
height: 344px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
/* The Close Button */
|
||||
|
||||
.close {
|
||||
color: #aaaaaa;
|
||||
float: right;
|
||||
font-size: 28px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.close:hover,
|
||||
.close:focus {
|
||||
color: #000;
|
||||
text-decoration: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
#server-settings-pane {
|
||||
margin-left: 18%;
|
||||
}
|
||||
|
||||
.settings-card.server-info-right:hover {
|
||||
box-shadow: none !important;
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.server-save-action {
|
||||
padding: 11px;
|
||||
padding-left: 20px;
|
||||
width: 292px;
|
||||
border-radius: 4px;
|
||||
margin-top: 16px;
|
||||
|
||||
}
|
||||
|
||||
.divider {
|
||||
/* width: 250px;
|
||||
text-align: center;
|
||||
margin-left: 39px;
|
||||
margin-top: 48px; */
|
||||
|
||||
width: 335px;
|
||||
text-align: center;
|
||||
margin-left: 0px;
|
||||
margin-top: 48px;
|
||||
color: #7d878a;
|
||||
|
||||
}
|
||||
|
||||
.divider hr {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 42%;
|
||||
|
||||
}
|
||||
|
||||
.left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.server-create-action {
|
||||
width: 314px;
|
||||
margin-top: 40px;
|
||||
padding: 11px;
|
||||
border-radius: 4px;
|
||||
|
||||
}
|
||||
|
||||
.server-create-action span {
|
||||
margin-left: 60px;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.server-save-action span {
|
||||
margin-left: 130px;
|
||||
}
|
||||
|
||||
.server-save-action {
|
||||
width: 306px;
|
||||
}
|
||||
|
||||
.server-info-row {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.setting-input-value {
|
||||
width: 319px;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
color: #222c31;
|
||||
margin-left: 65px;
|
||||
font-size: 22px;
|
||||
font-weight: 100;
|
||||
margin-bottom: 20px;
|
||||
padding: 0;
|
||||
}
|
||||
.title {
|
||||
color: #7d878a;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="content">
|
||||
<div id="sidebar"></div>
|
||||
<div id="settings-container"></div>
|
||||
</div>
|
||||
</body>
|
||||
<script src="js/pages/preference/preference.js"></script>
|
||||
|
||||
</html>
|
||||
@@ -25,7 +25,7 @@ manager (see [here][nodesource-install] for more on the first command):
|
||||
|
||||
```sh
|
||||
$ curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -
|
||||
$ sudo apt install git nodejs python build-essential libxext-dev libxtst-dev libxkbfile-dev libgconf-2-4
|
||||
$ sudo apt install git nodejs python build-essential libxext-dev libxtst-dev libxkbfile-dev
|
||||
```
|
||||
|
||||
[nodesource-install]: https://nodejs.org/en/download/package-manager/#debian-and-ubuntu-based-linux-distributions
|
||||
|
||||
@@ -113,7 +113,7 @@
|
||||
"assert": "1.4.1",
|
||||
"cp-file": "^5.0.0",
|
||||
"devtron": "1.4.0",
|
||||
"electron": "1.8.4",
|
||||
"electron": "1.8.2",
|
||||
"electron-builder": "19.53.6",
|
||||
"electron-connect": "0.6.2",
|
||||
"electron-debug": "1.4.0",
|
||||
@@ -123,7 +123,7 @@
|
||||
"is-ci": "^1.0.10",
|
||||
"nodemon": "^1.14.11",
|
||||
"pre-commit": "1.2.2",
|
||||
"spectron": "3.8.0",
|
||||
"spectron": "3.7.2",
|
||||
"tap-colorize": "^1.2.0",
|
||||
"tape": "^4.8.0",
|
||||
"xo": "0.18.2"
|
||||
|
||||
@@ -2,10 +2,6 @@
|
||||
|
||||
# This script runs when user install the debian package
|
||||
|
||||
# Link to the binary
|
||||
ln -sf '/opt/${productFilename}/${executable}' '/usr/local/bin/${executable}';
|
||||
echo 'Successfully added /opt/${productFilename}/${executable} to /usr/local/bin/${executable}'
|
||||
|
||||
# Install apt repository source list if it does not exist
|
||||
if ! grep ^ /etc/apt/sources.list /etc/apt/sources.list.d/* | grep zulip.list; then
|
||||
sudo apt-key adv --keyserver pool.sks-keyservers.net --recv 69AD12704E71A4803DCA3A682424BE5AE9BD10D9
|
||||
|
||||
@@ -28,8 +28,4 @@ appDirectory=/home/$getSudoUser/.config/Zulip/;
|
||||
|
||||
if [ -d $appDirectory ]; then
|
||||
sudo rm -rf $appDirectory;
|
||||
fi
|
||||
|
||||
# Delete the link to the binary
|
||||
echo 'Removing binary link'
|
||||
sudo rm -f '/usr/local/bin/${executable}';
|
||||
fi
|
||||
@@ -7,7 +7,7 @@ test('app runs', function (t) {
|
||||
const app = setup.createApp()
|
||||
setup.waitForLoad(app, t)
|
||||
.then(() => app.client.windowByIndex(1)) // focus on webview
|
||||
.then(() => app.client.waitForExist('//*[@id="connect"]')) // id of the connect button
|
||||
.then(() => app.client.waitForExist('//*[@id="new-server-container"]/div/div/div[2]/input'))
|
||||
.then(() => setup.endTest(app, t),
|
||||
(err) => setup.endTest(app, t, err || 'error'))
|
||||
})
|
||||
Reference in New Issue
Block a user