Skip to content

Commit

Permalink
Added basic stuff for config gui
Browse files Browse the repository at this point in the history
  • Loading branch information
@oliverschwendener
oliverschwendener committed Sep 21, 2018
1 parent 3b626bb commit c8bef8d
Show file tree
Hide file tree
Showing 5 changed files with 240 additions and 15 deletions.
181 changes: 178 additions & 3 deletions main.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

<div id="vue-root">
<link rel="stylesheet" href="./styles/app.css">
<link rel="stylesheet" :href="colorTheme">
<link rel="stylesheet" :href="colorTheme()">
<link rel="stylesheet" v-if="userStylesheetIsAvailable" :href="userStylesheet">

<div class="container">
Expand Down Expand Up @@ -46,11 +46,186 @@
</div>

<div class="settings-container" v-if="settingsVisible">
<h1>Settings</h1>
<h1>App Settings</h1>
<div class="setting-group">
<div class="setting-title">Config file path</div>
<div class="setting">
<input type="text" v-model="appConfig.userSettingsFilePath">
<input class="setting-text-input" type="text" v-model="appConfig.userSettingsFilePath" v-on:blur="updateAppConfig">
</div>
</div>

<h1>User Settings</h1>
<div class="setting-group">
<div class="setting-title">allowMouseInteraction</div>
<div class="setting">
<input type="checkbox" v-model="config.allowMouseInteraction" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">alwaysShowOnPrimaryDisplay</div>
<div class="setting">
<input type="checkbox" v-model="config.alwaysShowOnPrimaryDisplay" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">applicationFileExtensions</div>
<div class="setting">
<div class="sub-setting" v-for="applicationFileExtension in config.applicationFileExtensions">
<input disabled class="setting-text-input" type="text" v-model="applicationFileExtension">
</div>
</div>
</div>
<div class="setting-group">
<div class="setting-title">applicationFolders</div>
<div class="setting">
<div class="sub-setting" v-for="applicationFolder in config.applicationFolders">
<input disabled class="setting-text-input" type="text" v-model="applicationFolder">
</div>
</div>
</div>
<div class="setting-group">
<div class="setting-title">autoStartApp</div>
<div class="setting">
<input type="checkbox" v-model="config.autoStartApp" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">colorTheme</div>
<div class="setting">
<input class="setting-text-input" type="text" v-model="config.colorTheme" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">customCommands</div>
<div class="setting">
<div class="sub-setting" v-for="customCommand in config.customCommands">
<input class="setting-text-input" type="text" v-model="customCommand.name">
<input class="setting-text-input" type="text" v-model="customCommand.executionArgument">
<input class="setting-text-input" type="text" v-model="customCommand.prefix">
<input class="setting-text-input" type="text" v-model="customCommand.icon">
</div>
</div>
</div>
<div class="setting-group">
<div class="setting-title">fallbackWebSearches</div>
<div class="setting">
<div class="sub-setting" v-for="fallbackWebSearch in config.fallbackWebSearches">
<input disabled class="setting-text-input" type="text" v-model="fallbackWebSearch">
</div>
</div>
</div>
<div class="setting-group">
<div class="setting-title">fileSearchOptions</div>
<div class="setting">
<div class="sub-setting" v-for="fileSearchOption in config.fileSearchOptions">
<input disabled class="setting-text-input" type="text" v-model="fileSearchOption.folderPath">
<input disabled type="checkbox" v-model="fileSearchOption.recursive">
</div>
</div>
</div>
<div class="setting-group">
<div class="setting-title">hotKey</div>
<div class="setting">
<input class="setting-text-input" type="text" v-model="config.hotKey" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">logExecution</div>
<div class="setting">
<input type="checkbox" v-model="config.logExecution" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">maxSearchResultCount</div>
<div class="setting">
<input class="setting-text-input" type="number" v-model="config.maxSearchResultCount" min="0" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">rescanInterval</div>
<div class="setting">
<input class="setting-text-input" type="number" v-model="config.rescanInterval" min="5" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">searchEngineThreshold</div>
<div class="setting">
<input class="setting-text-input" type="number" v-model="config.searchEngineThreshold" min="0" max="1" step="0.1" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">searchEnvironmentVariables</div>
<div class="setting">
<input type="checkbox" v-model="config.searchEnvironmentVariables" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">searchOperatingSystemSettings</div>
<div class="setting">
<input type="checkbox" v-model="config.searchOperatingSystemSettings" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">searchResultDescriptionFontSize</div>
<div class="setting">
<input class="setting-text-input" type="number" v-model="config.searchResultDescriptionFontSize" min="0" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">searchResultHeight</div>
<div class="setting">
<input class="setting-text-input" type="number" v-model="config.searchResultHeight" min="0" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">searchResultNameFontSize</div>
<div class="setting">
<input class="setting-text-input" type="number" v-model="config.searchResultNameFontSize" min="0" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">shortcuts</div>
<div class="setting">
<div class="sub-setting" v-for="shortcut in config.shortcuts">
<input disabled class="setting-text-input" type="text" v-model="shortcut.name">
<input disabled class="setting-text-input" type="text" v-model="shortcut.executionArgument">
<input disabled class="setting-text-input" type="text" v-model="shortcut.icon">
</div>
</div>
</div>
<div class="setting-group">
<div class="setting-title">userInputFontSize</div>
<div class="setting">
<input class="setting-text-input" type="nubmer" v-model="config.userInputFontSize" min="0" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">userInputHeight</div>
<div class="setting">
<input class="setting-text-input" type="number" v-model="config.userInputHeight" min="0" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">userStylesheet</div>
<div class="setting">
<input class="setting-text-input" type="text" v-model="config.userStylesheet" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group">
<div class="setting-title">webSearches</div>
<div class="setting">
<div class="sub-setting" v-for="webSearch in config.webSearches">
<input disabled class="setting-text-input" type="text" v-model="webSearch.name">
<input disabled class="setting-text-input" type="text" v-model="webSearch.prefix">
<input disabled class="setting-text-input" type="text" v-model="webSearch.url">
<input disabled class="setting-text-input" type="text" v-model="webSearch.icon">
</div>
</div>
</div>
<div class="setting-group">
<div class="setting-title">windowWidth</div>
<div class="setting">
<input class="setting-text-input" type="number" v-model="config.windowWidth" v-on:blur="updateUserConfig">
</div>
</div>
</div>
Expand Down
2 changes: 2 additions & 0 deletions src/ts/ipc-channels.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,4 +23,6 @@ export class IpcChannels {
public static readonly showHelp = "show-help";
public static readonly showSettings = "show-settings";
public static readonly hideSettings = "hide-settings";
public static readonly updateAppConfig = "update-app-config";
public static readonly updateUserConfig = "update-user-config";
}
24 changes: 13 additions & 11 deletions src/ts/main.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,14 +23,17 @@ import { ProductionIpcEmitter } from "./production-ipc-emitter";
import { AutoCompletionService } from "./auto-completion/autocompletion-service";
import { FilePathAutoCompletionValidator } from "./auto-completion/file-path-autocompletion-validator";
import { ElectronStoreAppConfigRepository } from "./app-config/electorn-store-app-config-repository";
import { AppConfig } from "./app-config/app-config";
import { ConfigOptions } from "./config-options";

let mainWindow: BrowserWindow;
let trayIcon: Tray;

const delayWhenHidingCommandlineOutputInMs = 25;
const filePathExecutor = new FilePathExecutor();
const appConfigRepository = new ElectronStoreAppConfigRepository();
let config = new ConfigFileRepository(defaultConfig, appConfigRepository.getAppConfig().userSettingsFilePath).getConfig();
const userConfigRepository = new ConfigFileRepository(defaultConfig, appConfigRepository.getAppConfig().userSettingsFilePath);
let config = userConfigRepository.getConfig();
let inputValidationService = new InputValidationService(config, new InputValidatorSearcherCombinationManager(config).getCombinations());
const ipcEmitter = new ProductionIpcEmitter();
let executionService = new ExecutionService(
Expand Down Expand Up @@ -78,7 +81,6 @@ function createMainWindow(): void {
}

registerGlobalHotKey();
watchConfigFile();

if (!isInDevelopment) {
checkForUpdates();
Expand Down Expand Up @@ -231,16 +233,7 @@ function resetWindowToDefaultSizeAndPosition(): void {
updateWindowSize(0);
}

function watchConfigFile(): void {
watchFile(appConfigRepository.getAppConfig().userSettingsFilePath, reloadApp);
}

function unwatchConfigFile(): void {
unwatchFile(appConfigRepository.getAppConfig().userSettingsFilePath);
}

function quitApp(): void {
unwatchConfigFile();
destroyTrayIcon();
unregisterAllGlobalShortcuts();
app.quit();
Expand Down Expand Up @@ -304,3 +297,12 @@ ipcMain.on(IpcChannels.showSettings, (): void => {
ipcMain.on(IpcChannels.hideSettings, (): void => {
updateWindowSize(0);
});

ipcMain.on(IpcChannels.updateAppConfig, (event: Electron.Event, updatedAppConfig: AppConfig) => {
appConfigRepository.setAppConfig(updatedAppConfig);
});

ipcMain.on(IpcChannels.updateUserConfig, (event: Electron.Event, updatedUserConfig: ConfigOptions) => {
config = updatedUserConfig;
userConfigRepository.saveConfig(updatedUserConfig);
});
11 changes: 10 additions & 1 deletion src/ts/renderer.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,8 @@ const vue = new Vue({
data: {
appConfig,
autoFocus: true,
colorTheme: `./styles/${config.colorTheme}.css`,
commandLineOutput: [] as string[],
config,
searchIcon: iconSet.searchIcon,
searchResults: [] as SearchResultItemViewModel[],
settingsVisible: false,
Expand All @@ -33,6 +33,9 @@ const vue = new Vue({
},
el: "#vue-root",
methods: {
colorTheme: (): string => {
return `./styles/${config.colorTheme}.css`;
},
handleClick: (): void => {
if (config.allowMouseInteraction) {
handleEnterPress();
Expand Down Expand Up @@ -93,6 +96,12 @@ const vue = new Vue({
searchResultWidth: (): string => {
return `width: ${config.searchResultHeight}px;`;
},
updateAppConfig: (): void => {
ipcRenderer.send(IpcChannels.updateAppConfig, appConfig);
},
updateUserConfig: (): void => {
ipcRenderer.send(IpcChannels.updateUserConfig, config);
},
userInputContainerStyle: (): string => {
return `height: ${config.userInputHeight}px;`;
},
Expand Down
37 changes: 37 additions & 0 deletions styles/app.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -137,6 +137,43 @@ div.settings-container {
padding: 0 var(--side-padding);
}

div.setting-group {
padding: var(--side-padding) 0;
display: flex;
flex-direction: row;
}

div.setting-title {
font-size: 1rem;
padding-right: var(--side-padding);
display: flex;
align-items: center;
width: 35%;
}

div.setting {
width: 65%;
}

div.sub-setting {
display: flex;
flex-direction: row;
}

input.setting-text-input {
background: transparent;
border: 1px solid var(--text-color);
outline: none;
color: var(--text-color);
width: 100%;
font-size: 1rem;
padding: 5px 3px;
}

input.setting-text-input:focus {
border: 1px solid var(--accent-color);
}

::-webkit-scrollbar {
width: var(--scrollbar-size);
height: var(--scrollbar-size);
Expand Down

0 comments on commit c8bef8d

Please sign in to comment.