Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Added the settings screen #595

Draft
wants to merge 1 commit into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 11 additions & 0 deletions assets/css/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,17 @@ button.secondary:disabled {
margin-right: 20px;
}

#logo-alert-settings {
float: left;
background: url('../images/chef-ws-icon-black.svg');
height: 64px;
width: 64px;
display: inline-block;
margin-left: 3px;
margin-right: 20px;
margin-top: 30px;
}

/* top panel and items placed inside */
#top-panel {
padding-top: 15px;
Expand Down
6 changes: 6 additions & 0 deletions src/main.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { PreferencesDialog } from './preferences/preferences_dialog';
import AppConfigSingleton from './app-config/app-config';

import aboutDialog = require('./about-dialog/about_dialog.js');
import settingDialog = require('./setting/setting_dialog.js');
import workstation = require('./helpers/chef_workstation.js');
import helpers = require('./helpers/helpers.js');
import WSTray = require('./ws_tray.js');
Expand Down Expand Up @@ -61,6 +62,11 @@ export class Main {
click: () => { this.openPreferencesDialog() }
},
{type: 'separator'},
{
label: 'Settings...',
click: () => { settingDialog.open() }
},
{type: 'separator'},
{
label: 'Documentation',
click: () => { this.openDocs() }
Expand Down
40 changes: 40 additions & 0 deletions src/setting/edit_setting.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
document.querySelector('#btn-up').addEventListener('click', () => {

var s =
`[default]
client_name = '${document.getElementById('username').value}'
client_key = '${document.getElementById('certificate').value}'
chef_server_url = '${document.getElementById('url').value}'\n`

window.obj = {
"client_name ": document.getElementById('username').value,
"client_key ": document.getElementById('certificate').value,
"chef_server_url ": document.getElementById('url').value
}

const fs = require('fs');

try {
fs.writeFileSync("/Users/ngupta/chef-repo/.chef/credentials", s);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This filename should be generic, something like '$HOME/.chef/credentials'

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this needs to be updated, once the design is ready based on that this will be updated

// file written successfully
} catch (err) {
console.error(err);
}

window.location.reload();
alert("Your settings have been saved!");

document.querySelector('#edit-settings').style.display = 'none';
document.querySelector('#settings').style.display = 'block';
})

document.querySelector('#btn-ed').addEventListener('click', () => {
document.querySelector('#edit-settings').style.display = 'block';
document.querySelector('#settings').style.display = 'none';
})

document.querySelector('#btn-cn').addEventListener('click', () => {
document.querySelector('#edit-settings').style.display = 'none';
document.querySelector('#settings').style.display = 'block';
})

102 changes: 102 additions & 0 deletions src/setting/setting.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,102 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Infra Settings</title>
<link rel="stylesheet" href="../../assets/css/main.css">
<link rel="stylesheet" href="../../assets/css/about.css">
<script>
const fs = require('fs');
window.data = {};

const fileData = fs.readFileSync('/Users/ngupta/chef-repo/.chef/credentials').toString('utf8');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Same as above

let splitted = fileData.split("\n");
for (let i = 1; i<splitted.length-1; i++) {
const [key, value] = splitted[i].replaceAll(/\s+/g,"").split('=');
window.data[key] = value.replace(/['"]+/g, '');
}

</script>
<style>
.hide{
display: none;
}
</style>
</head>
<body>
<main>
<section id="settings">
<div id="logo-alert-settings"></div>
<div class="col col-9">
<p><strong>Chef user name :</strong>
<script>
document.write(window.data['client_name'])
</script>
</p>
<br>
<p><strong>Infra Server URL :</strong>
<script>
document.write(window.data['chef_server_url'])
</script>
</p>
<br>
<p><strong>Certificate file path :</strong>
<script>
document.write(window.data['client_key'])</script></p>
</div>
<br>

<div id="wrapper">
<div id="container">
<button id="btn-ed" type="button">Edit Setting</button>
</div>
</div>
</section>

<section id="edit-settings" class="hide">
<form>
<div id="logo-alert-settings"></div>
<div class="col col-9">
<div class="strong-list">
<p><strong>Chef user name :</strong>
<input type="text" id="username">
<script>
document.getElementById('username').value = window.data['client_name'];
</script>
</p>
<p><strong>Infra Server URL :</strong>
<input type="text" id="url">
<script>
document.getElementById('url').value = window.data['chef_server_url'];
</script>
</p>
<div class="p-inline-button">
<p id='update-channel'><strong>Certificate file path :</strong>
<input type="text" id="certificate">
<script>
document.getElementById('certificate').value = window.data['client_key'];
</script>
</p>
</div>
</div>
</div>
<div id="wrapper">
<div id="container">
<button id="btn-up" type="button">Update Setting</button>
</div>
</div>
<div id="wrapper">
<div id="container">
<button id="btn-cn" type="button">Cancel</button>
</div>
</div>
</form>
</section>

<section class="footer">
<p class="small">&#9400; 2008-2021 Chef Software, Inc. All Rights Reserved.</p>
</section>
<script src="./edit_setting.js"></script>
</main>
</body>
</html>
37 changes: 37 additions & 0 deletions src/setting/setting_dialog.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,37 @@
const { BrowserWindow } = require('electron');
const path = require('path');

const width = process.platform === 'darwin' ? 500 : 530;
const height = process.platform === 'darwin' ? 330 : 330;

let settingDialog = null;

function open() {
if (settingDialog == null) {
let settingPath = path.join('file://', __dirname, 'setting.html');
settingDialog = new BrowserWindow({
show: false,
width: width,
height: height,
resizable: false,
minimizable: false,
maximizable: false,
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
}
});
settingDialog.removeMenu();
settingDialog.loadURL(settingPath);
settingDialog.once('ready-to-show', () => {
settingDialog.show()
});
settingDialog.on('closed', () => {
settingDialog = null;
});
} else {
settingDialog.show();
}
}

module.exports.open = open;