Skip to content

Commit

Permalink
Last fixes
Browse files Browse the repository at this point in the history 
- Changed local storage to sync storage
- Removed color picket from 'Add Account' as this can be set in 'Accounts'
  • Loading branch information
@sanderv32
sanderv32 committed May 29, 2024
1 parent d6cfa2c commit 9b0d820
Show file tree
Hide file tree
Showing 4 changed files with 48 additions and 80 deletions.
10 changes: 6 additions & 4 deletions src/background.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ function getAllStorageSyncData() {
// Immediately return a promise and start asynchronous work
return new Promise((resolve, reject) => {
// Asynchronously fetch all data from storage.sync.
chrome.storage.local.get(['ssoaccounts'], ({ ssoaccounts }) => {
chrome.storage.sync.get(['ssoaccounts'], ({ ssoaccounts }) => {
// Pass any observed errors down the promise chain.
if (chrome.runtime.lastError) {
return reject(chrome.runtime.lastError);
Expand All @@ -19,8 +19,10 @@ chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) {
console.log(
'background SetAccount ' + JSON.stringify(message.data)
);
chrome.storage.local
.set({ ssoaccounts: message.data })
chrome.storage.sync
.set({
ssoaccounts: message.data
})
.then(() => {});
sendResponse('OK');
break;
Expand All @@ -31,7 +33,7 @@ chrome.runtime.onMessage.addListener(function (message, sender, sendResponse) {
});
return true;
case 'GetAwsRegion':
chrome.storage.local.get(['aws_region'], (response) => {
chrome.storage.sync.get(['aws_region'], (response) => {
sendResponse(response.aws_region);
});
return true;
Expand Down
2 changes: 1 addition & 1 deletion src/main.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ function drawDescription() {
let header_format = 'Account: {{account}} - {{description}}';
let header_align = 'left';
let header_size = 18;
chrome.storage.local.get(['header_settings'], (response) => {
chrome.storage.sync.get(['header_settings'], (response) => {
let settings = response.header_settings || {};
if (settings) {
header_format =
Expand Down
22 changes: 0 additions & 22 deletions src/popup.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -88,28 +88,6 @@ <h4>Add a new account description</h4>
Please enter a description.
</div>
</div>
<label for="ColorPicker" class="form-label">Color picker</label>
<div class="mb-3" id="ColorPicker">
<input type="color" class="form-control form-control-color" id="input_color" value="#563d7c" title="Choose your color">
</div>
<div class="mb-3">
<div class="form-check form-switch">
<label for="use-predefined-colors"><input class="form-check-input" type="checkbox" id="use-predefined-colors"></label>
<label class="form-check-label">use predefined colors</label>
</div>
</div>

<div id="predefined-colors" class="input-group mb-3">
<input type="radio" class="btn-check" name="colors" id="dev-option" autocomplete="off" checked>
<label style="margin-right: 5px;" class="btn dev text-white" for="dev-option">Development</label>

<input type="radio" class="btn-check" name="colors" id="test-option" autocomplete="off">
<label style="margin-right: 5px;" class="btn test text-white" for="test-option">Test/QA</label>

<input type="radio" class="btn-check" name="colors" id="prod-option" autocomplete="off">
<label style="margin-right: 5px;" class="btn prod text-white" for="prod-option">Production</label>

</div>

<div class="input-group mb-3">
<button class="btn btn-primary" id="add-account"> Add Account</button>
Expand Down
94 changes: 41 additions & 53 deletions src/popup.js
View file
Original file line number Diff line number Diff line change
@@ -1,29 +1,20 @@
$(() => {
$('#alert-message').hide();
$('#alert-message-main').hide();
$('#predefined-colors').hide();
$('#dev_color').on('click', function () {
$('#dev_color').on('click', function() {
console.log('click');
$('#input_color').val('#348a34');
});
$('#test_color').on('click', function () {
$('#test_color').on('click', function() {
console.log('click');
$('#input_color').val('#f39820');
});
$('#prod_color').on('click', function () {
$('#prod_color').on('click', function() {
console.log('click');
$('#input_color').val('#ea0606');
});

$('#use-predefined-colors').on('change', function () {
if ($(this).prop('checked')) {
$('#predefined-colors').show();
} else {
$('#predefined-colors').hide();
}
});

$("input:radio[name='colors']").on('click', function () {
$("input:radio[name='colors']").on('click', function() {
if ($(this).prop('id') === 'dev-option') {
$('#input_color').val('#348a34');
} else if ($(this).prop('id') === 'test-option') {
Expand All @@ -34,23 +25,21 @@ $(() => {
return true;
});

$('#get-account').on('click', function () {
chrome.tabs.query(
{
$('#get-account').on('click', function() {
chrome.tabs.query({
active: true,
currentWindow: true
},
function (tabs) {
function(tabs) {
let aws_console_regex = new RegExp(
'(.*?).console.aws.amazon.com(.*)'
);
if (aws_console_regex.test(tabs[0].url)) {
chrome.tabs.sendMessage(
tabs[0].id,
{
tabs[0].id, {
type: 'getAccount'
},
function (response) {
function(response) {
$('#input_account').val(response.number);
}
);
Expand All @@ -60,7 +49,7 @@ $(() => {
"Current tab is not an AWS Console. Please select a tab that matches 'https://*.console.aws.amazon.com/*'"
)
.fadeTo(2000, 500)
.slideUp(500, function () {
.slideUp(500, function() {
$('#alert-message').slideUp(1000);
});
}
Expand All @@ -69,16 +58,15 @@ $(() => {
});

const toastElList = [].slice.call(document.querySelectorAll('.toast'));
const _toastList = toastElList.map(function (toastEl) {
const _toastList = toastElList.map(function(toastEl) {
return new bootstrap.Toast(toastEl); /* eslint no-undef: 0 */
});

$('#myTab button').on('click', function (e) {
$('#myTab button').on('click', function(e) {
e.preventDefault();
$(this).tab('show');

chrome.runtime.sendMessage(
{
chrome.runtime.sendMessage({
type: 'GetSSOAccounts'
},
(response) => {
Expand Down Expand Up @@ -131,15 +119,15 @@ function change_color(o) {
})
.then(() => {});

const color_type = o.target.hasAttribute('foreground')
? 'Foreground'
: 'Background';
const color_type = o.target.hasAttribute('foreground') ?
'Foreground' :
'Background';
$('#toast-main-message').toast('show');
$('#toast-main-message-text').text(
color_type +
' color for account ' +
p.id +
' was succesfully changed.'
' color for account ' +
p.id +
' was succesfully changed.'
);

redraw_content();
Expand Down Expand Up @@ -177,6 +165,7 @@ function AddRowToTable(AccountId, AccountName) {
chrome.storage.sync.get(AccountId, (results) => {
if (!results[AccountId]) {
let color = '#348a34';
let foreground = 'white';
if (AccountName.includes('dev')) {
color = '#348a34';
} else if (AccountName.includes('test')) {
Expand All @@ -185,7 +174,7 @@ function AddRowToTable(AccountId, AccountName) {
color = '#ea0606';
}

AddRow(AccountId, AccountName, color);
AddRow(AccountId, AccountName, color, foreground);
rowAdded = true;
}
resolve(rowAdded);
Expand All @@ -195,9 +184,8 @@ function AddRowToTable(AccountId, AccountName) {
});
}

$('#import-sso-accounts').on('click', function () {
chrome.runtime.sendMessage(
{
$('#import-sso-accounts').on('click', function() {
chrome.runtime.sendMessage({
type: 'GetSSOAccounts'
},
(response) => {
Expand Down Expand Up @@ -227,18 +215,19 @@ $('#import-sso-accounts').on('click', function () {
);
});

$('#save-region').on('click', function () {
chrome.storage.local
$('#save-region').on('click', function() {
chrome.storage.sync
.set({
aws_region: $('#aws_region').val()
})
.then(() => {});
});

function AddRow(account, description, color) {
function AddRow(account, description, color, foregroundColor) {
let record = {
description: description,
color: color
color: color,
foreground: foregroundColor
};

console.log('record:' + record);
Expand Down Expand Up @@ -298,10 +287,11 @@ function AddRow(account, description, color) {
redraw_content();
}

$('#add-account').on('click', function () {
$('#add-account').on('click', function() {
const account = $('#input_account').val();
const description = $('#input_description').val();
const color = $('#input_color').val();
// TODO: diagonal color picker needs to be implemented

if (account === '' || account.length !== 12) {
$('#input_account').addClass('is-invalid');
Expand All @@ -326,7 +316,7 @@ $('#add-account').on('click', function () {
$('#input_account').addClass('is-invalid');
return false;
} else {
AddRow(account, description, color);
AddRow(account, description, '#FFF', '#888');
}
});
});
Expand All @@ -340,11 +330,11 @@ $('#header-format').on('change', store_settings_tab);

function store_settings_tab() {
let header_bit_pattern = 0;
$('input[name="header-position"').each(function (index) {
$('input[name="header-position"').each(function(index) {
header_bit_pattern += $(this).prop('checked') ? 1 << index : 0;
});

chrome.storage.local
chrome.storage.sync
.set({
header_settings: {
alignment: header_bit_pattern,
Expand All @@ -358,22 +348,20 @@ function store_settings_tab() {
}

function redraw_content() {
chrome.tabs.query(
{
chrome.tabs.query({
active: true,
currentWindow: true
},
function (tabs) {
function(tabs) {
let aws_console_regex = new RegExp(
'(.*?).console.aws.amazon.com(.*)'
);
if (aws_console_regex.test(tabs[0].url)) {
chrome.tabs.sendMessage(
tabs[0].id,
{
tabs[0].id, {
type: 'drawDescription'
},
function (_response) {
function(_response) {
//Nothing
}
);
Expand Down Expand Up @@ -428,11 +416,11 @@ function diagonal_div(cpickerId, foregroundColor, backgroundColor) {
}

function loadFromStorage() {
chrome.storage.local.get(['aws_region'], (response) => {
chrome.storage.sync.get(['aws_region'], (response) => {
$('#aws_region').val(response.aws_region || 'eu-central-1');
});

chrome.storage.local.get(['header_settings'], (response) => {
chrome.storage.sync.get(['header_settings'], (response) => {
let settings = response.header_settings || {};
if (settings) {
let header_format =
Expand Down Expand Up @@ -461,7 +449,7 @@ function loadFromStorage() {
}
});

chrome.storage.sync.get(null, function (items) {
chrome.storage.sync.get(null, function(items) {
const allKeys = Object.keys(items);
console.log(allKeys);
});
Expand Down Expand Up @@ -524,4 +512,4 @@ function loadFromStorage() {
}

loadFromStorage();
color_picker();
color_picker();

0 comments on commit 9b0d820

Please sign in to comment.