Initialize setting section for proxy.

This commit is contained in:
Zhongyi Tong
2017-08-20 16:35:39 -04:00
parent 876936125a
commit a3142713f7
5 changed files with 78 additions and 5 deletions

View File

@@ -129,7 +129,17 @@ img.server-info-icon {
cursor: pointer;
}
.server-info-url {
.setting-input-key {
font-size: 14px;
height: 27px;
line-height: 27px;
font-weight: bold;
background: transparent;
flex-wrap: nowrap;
margin-right: 10px;
}
.setting-input-value {
flex-grow: 1;
font-size: 14px;
height: 24px;
@@ -140,8 +150,8 @@ img.server-info-icon {
max-width: 500px;
}
.server-info-value:focus {
border-bottom: #388E3C 1px solid;
.setting-input-value:focus {
border-bottom: #7cb980 1px solid;
}
.actions-container {

View File

@@ -8,7 +8,7 @@ class PreferenceNav extends BaseComponent {
this.props = props;
this.navItems = ['General', 'Servers'];
this.navItems = ['General', 'Network', 'Servers'];
this.init();
}

View File

@@ -0,0 +1,56 @@
'use strict';
const BaseSection = require(__dirname + '/base-section.js');
const ConfigUtil = require(__dirname + '/../../utils/config-util.js');
class NetworkSection extends BaseSection {
constructor(props) {
super();
this.props = props;
}
template() {
return `
<div class="settings-pane">
<div class="title">Proxy</div>
<div id="appearance-option-settings" class="settings-card">
<div class="setting-row" id="use-proxy-option">
<div class="setting-description">Connect servers through a proxy (requires reload)</div>
<div class="setting-control"></div>
</div>
<div class="setting-row" id="sidebar-option">
<span class="setting-input-key">PAC script</span>
<input class="setting-input-value" placeholder=""/>
</div>
<div class="setting-row" id="sidebar-option">
<span class="setting-input-key">Proxy rules</span>
<input class="setting-input-value" placeholder=""/>
</div>
<div class="setting-row" id="sidebar-option">
<span class="setting-input-key">Proxy bypass rules</span>
<input class="setting-input-value" placeholder=""/>
</div>
</div>
</div>
`;
}
init() {
this.props.$root.innerHTML = this.template();
this.updateTrayOption();
}
updateTrayOption() {
this.generateSettingOption({
$element: document.querySelector('#use-proxy-option .setting-control'),
value: ConfigUtil.getConfigItem('useProxy', true),
clickHandler: () => {
const newValue = !ConfigUtil.getConfigItem('useProxy');
ConfigUtil.setConfigItem('useProxy', newValue);
this.updateTrayOption();
}
});
}
}
module.exports = NetworkSection;

View File

@@ -14,7 +14,7 @@ class NewServerForm extends BaseComponent {
<div class="settings-card" style="border: solid 1px #4CAF50;">
<div class="server-info-right">
<div class="server-info-row">
<input class="server-info-url" autofocus placeholder="Enter the url of your Zulip server..."/>
<input class="setting-input-value" autofocus placeholder="Enter the url of your Zulip server..."/>
</div>
<div class="server-info-row">
<div class="action green server-save-action">

View File

@@ -6,6 +6,7 @@ const {ipcRenderer} = require('electron');
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');
class PreferenceView extends BaseComponent {
constructor() {
@@ -49,6 +50,12 @@ class PreferenceView extends BaseComponent {
});
break;
}
case 'Network': {
this.section = new NetworkSection({
$root: this.$settingsContainer
});
break;
}
default: break;
}
this.section.init();