Skip to content

Commit

Permalink
Make spell-check toggle-able
Browse files Browse the repository at this point in the history
  • Loading branch information
@amanharwara
amanharwara committed Nov 13, 2020
1 parent a39bd12 commit 88d3fb5
Show file tree
Hide file tree
Showing 5 changed files with 466 additions and 413 deletions.
2 changes: 1 addition & 1 deletion src/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -621,6 +621,7 @@ if (!singleInstanceLock) {
// Restores the main window
mainWindow.restore();
}
mainWindow.show();
// Focuses the main window
mainWindow.focus();
// Opens whatsapp if link there is one
Expand Down Expand Up @@ -660,7 +661,6 @@ if (!singleInstanceLock) {
webviewTag: true,
// Enable nodeIntegration so window can use node functions
nodeIntegration: true,
spellcheck: true,
},
// Hides main window until it is ready to show
show: false,
Expand Down
166 changes: 103 additions & 63 deletions src/windows/main/main.html
View file
Original file line number Diff line number Diff line change
@@ -1,76 +1,116 @@
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Altus</title>
<link rel="stylesheet" href="../otherAssets/manrope.css">
<link rel="stylesheet" href="../otherAssets/LineIcons.min.css">
<link rel="stylesheet" href="../otherAssets/normalize.css">
<link rel="stylesheet" href="./css/main.css">
<link rel="stylesheet" href="../../node_modules/choices.js/public/assets/styles/choices.min.css">
<link rel="stylesheet" href="../otherAssets/manrope.css" />
<link rel="stylesheet" href="../otherAssets/LineIcons.min.css" />
<link rel="stylesheet" href="../otherAssets/normalize.css" />
<link rel="stylesheet" href="./css/main.css" />
<link
rel="stylesheet"
href="../../node_modules/choices.js/public/assets/styles/choices.min.css"
/>
<style id="tabbar-style"></style>
</head>
</head>

<body>
<body>
<ul data-tabs id="tabs-list-">
<li><a href="#addtab"><span class="lni lni-plus"></span></a></li>
<li>
<a href="#addtab"><span class="lni lni-plus"></span></a>
</li>
</ul>

<div id="addtab">
<div class="flex">
<div class="main-container">
<div class="title">Add Tab</div>
<div class="inputs">
<div class="input-field">
<div class="label">Name:</div>
<div class="input-flex"><input class="textbox" placeholder="Name of tab" id="tab-name-textbox"
type="text"></div>
</div>
<div class="input-field">
<div class="label">Theme:</div>
<select id="theme-select">
</select>
</div>
<div class="toggle-field">
<div class="label">Enable Notifications:</div>
<div class="input-checkbox">
<input type="checkbox" id="notification-toggle" class="checkbox" checked>
<div class="toggle-bg"></div>
</div>
</div>
<div class="toggle-field">
<div class="label">Enable Sound:</div>
<div class="input-checkbox">
<input type="checkbox" id="sound-toggle" class="checkbox" checked>
<div class="toggle-bg"></div>
</div>
</div>
<div class="toggle-field">
<div class="label with-help">Enable Utility Bar:
<button class="help tooltip tooltip-top"
data-tooltip="This enables a utility bar above the textbox where you can quickly format your text and save Quick Replies.">?</button>
</div>
<div class="input-checkbox">
<input type="checkbox" id="utility-bar-toggle" class="checkbox">
<div class="toggle-bg"></div>
</div>
</div>
<div class="toggle-field">
<div class="label">Tab Color:</div>
<div class="input-checkbox">
<input type="color" id="tab-color" class="color-input" value="#2a3440">
</div>
</div>
</div>
<button type="button" class="submit button" id="add-tab-button"><span class="lni lni-plus"></span> Add
Tab</button>
<div class="flex">
<div class="main-container">
<div class="title">Add Tab</div>
<div class="inputs">
<div class="input-field">
<div class="label">Name:</div>
<div class="input-flex">
<input
class="textbox"
placeholder="Name of tab"
id="tab-name-textbox"
type="text"
/>
</div>
</div>
<div class="input-field">
<div class="label">Theme:</div>
<select id="theme-select"></select>
</div>
<div class="toggle-field">
<div class="label">Enable Notifications:</div>
<div class="input-checkbox">
<input
type="checkbox"
id="notification-toggle"
class="checkbox"
checked
/>
<div class="toggle-bg"></div>
</div>
</div>
<div class="toggle-field">
<div class="label">Enable Sound:</div>
<div class="input-checkbox">
<input
type="checkbox"
id="sound-toggle"
class="checkbox"
checked
/>
<div class="toggle-bg"></div>
</div>
</div>
<div class="toggle-field">
<div class="label with-help">
Enable Utility Bar:
<button
class="help tooltip tooltip-top"
data-tooltip="This enables a utility bar above the textbox where you can quickly format your text and save Quick Replies."
>
?
</button>
</div>
<div class="input-checkbox">
<input
type="checkbox"
id="utility-bar-toggle"
class="checkbox"
/>
<div class="toggle-bg"></div>
</div>
</div>
<div class="toggle-field">
<div class="label">Tab Color:</div>
<div class="input-checkbox">
<input
type="color"
id="tab-color"
class="color-input"
value="#2a3440"
/>
</div>
</div>
<div class="toggle-field">
<div class="label">Spellchecker:</div>
<div class="input-checkbox">
<input type="checkbox" id="tab-spellcheck" class="checkbox" />
<div class="toggle-bg"></div>
</div>
</div>
</div>
<button type="button" class="submit button" id="add-tab-button">
<span class="lni lni-plus"></span> Add Tab
</button>
</div>
</div>
</div>
<script id="main-script" src="./main.js"></script>
</body>

</html>
</body>
</html>
92 changes: 50 additions & 42 deletions src/windows/main/util/addNewTab.js
View file
Original file line number Diff line number Diff line change
@@ -1,59 +1,67 @@
function addNewTab() {
// Create a tab object to use later
let tab = {
name: null,
notifications: null,
sound: null,
theme: null,
id: null,
tab_color: null,
utility_bar: null,
};
// Create a tab object to use later
let tab = {
name: null,
notifications: null,
sound: null,
theme: null,
id: null,
tab_color: null,
utility_bar: null,
spellcheck: null,
};

// Get the name (If no name is put by the user, it assigns the name "New Tab")
tab.name = (document.querySelector('#tab-name-textbox').value !== "" && document.querySelector('#tab-name-textbox').value !== null) ? document.querySelector('#tab-name-textbox').value : 'New Tab';
// Get the name (If no name is put by the user, it assigns the name "New Tab")
tab.name =
document.querySelector("#tab-name-textbox").value !== "" &&
document.querySelector("#tab-name-textbox").value !== null
? document.querySelector("#tab-name-textbox").value
: "New Tab";

// Get notifications setting
tab.notifications = document.querySelector('#notification-toggle').checked;
// Get notifications setting
tab.notifications = document.querySelector("#notification-toggle").checked;

// Get sound setting
tab.sound = document.querySelector('#sound-toggle').checked;
// Get sound setting
tab.sound = document.querySelector("#sound-toggle").checked;

// Get utility bar setting
tab.utility_bar = document.querySelector('#utility-bar-toggle').checked;
// Get utility bar setting
tab.utility_bar = document.querySelector("#utility-bar-toggle").checked;

// Get the theme
tab.theme = themeSelect.getValue(true);
// Get the theme
tab.theme = themeSelect.getValue(true);

// Get tab color
tab.tab_color = document.querySelector('#tab-color').value;
// Get tab color
tab.tab_color = document.querySelector("#tab-color").value;

// Assign unique ID to tab
tab.id = uuid();
tab.spellcheck = document.querySelector("#tab-spellcheck").value;

// Get the original tabs list
let tabsList = Array.from(tabStore.get('tabs'));
// Assign unique ID to tab
tab.id = uuid();

// Push the new tab to the list
tabsList.push(tab);
// Get the original tabs list
let tabsList = Array.from(tabStore.get("tabs"));

// Set the new list to the store
tabStore.set('tabs', tabsList);
// Push the new tab to the list
tabsList.push(tab);

// Adds new tab to the DOM
addTabToDOM(tab.id, tab.name);
// Set the new list to the store
tabStore.set("tabs", tabsList);

tabStore.set("active_tab_id", tab.id)
// Adds new tab to the DOM
addTabToDOM(tab.id, tab.name);

// Clears the value of all the inputs after tab is added
document.querySelector('#tab-name-textbox').value = '';
document.querySelector('#tab-color').value = '';
document.querySelector('#notification-toggle').checked = true;
document.querySelector('#sound-toggle').checked = true;
document.querySelector('#utility-bar-toggle').checked = false;
themeSelect.setChoiceByValue('Default');
tabStore.set("active_tab_id", tab.id);

// Clears the value of all the inputs after tab is added
document.querySelector("#tab-name-textbox").value = "";
document.querySelector("#tab-color").value = "";
document.querySelector("#notification-toggle").checked = true;
document.querySelector("#sound-toggle").checked = true;
document.querySelector("#utility-bar-toggle").checked = false;
document.querySelector("#tab-spellcheck").checked = false;
themeSelect.setChoiceByValue("Default");
}

module.exports = {
addNewTab
}
addNewTab,
};
Loading

0 comments on commit 88d3fb5

Please sign in to comment.