Skip to content

Commit

Permalink
Show file dialog in settings view
Browse files Browse the repository at this point in the history
  • Loading branch information
@oliverschwendener
oliverschwendener committed Oct 4, 2018
1 parent ef07d90 commit 5fc831a
Show file tree
Hide file tree
Showing 2 changed files with 80 additions and 14 deletions.
10 changes: 5 additions & 5 deletions main.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<div id="vue-root">
<link rel="stylesheet" href="./styles/app.css">
<link rel="stylesheet" :href="colorTheme()">
<link rel="stylesheet" v-if="userStylesheetIsAvailable" :href="userStylesheet">
<link rel="stylesheet" v-if="userStylesheetIsAvailable()" :href="userStylesheet">

<div class="container">

Expand Down Expand Up @@ -79,7 +79,7 @@ <h1 class="setting-section-title">App Settings</h1>
<div class="setting-group">
<div class="setting-title">Config file path</div>
<div class="setting">
<input class="setting-text-input" type="text" v-model="appConfig.userSettingsFilePath" v-on:blur="updateAppConfig">
<input class="setting-text-input" type="text" v-model="appConfig.userSettingsFilePath" v-on:click="showChangeUserConfigFilePathDialog" v-on:blur="updateAppConfig">
</div>
</div>
<div class="setting-group">
Expand Down Expand Up @@ -133,7 +133,7 @@ <h1 class="setting-section-title">User Settings</h1>
</svg>
</div>
<div class="sub-setting">
<input class="setting-text-input" v-model="configEdit.newApplicationFolder" type="text" placeholder="Add more application folders">
<input class="setting-text-input" v-model="configEdit.newApplicationFolder" type="text" placeholder="Add more application folders" v-on:click="showAddApplicationFolderFileDialog">
<svg class="setting-action-icon sub-setting-icon" v-on:click="settingsActionAddApplicationFolder(configEdit.newApplicationFolder)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26">
<path d="M13.5,3.188C7.805,3.188,3.188,7.805,3.188,13.5S7.805,23.813,13.5,23.813S23.813,19.195,23.813,13.5 S19.195,3.188,13.5,3.188z M19,15h-4v4h-3v-4H8v-3h4V8h3v4h4V15z"></path>
</svg>
Expand Down Expand Up @@ -334,7 +334,7 @@ <h1 class="setting-section-title">User Settings</h1>
</td>
</tr>
<tr>
<td><input class="setting-text-input" type="text" v-model="configEdit.newFileSearchOption.folderPath" placeholder="Add a folder path"></td>
<td><input class="setting-text-input" type="text" v-model="configEdit.newFileSearchOption.folderPath" placeholder="Add a folder path" v-on:click="showAddFileSearchOptionFileDialog"></td>
<td class="text-center"><input type="checkbox" v-model="configEdit.newFileSearchOption.recursive"></td>
<td class="text-center">
<svg class="setting-action-icon" v-on:click="settingsActionAddFileSearchOption(configEdit.newFileSearchOption)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26">
Expand Down Expand Up @@ -529,7 +529,7 @@ <h1 class="setting-section-title">User Settings</h1>
<div class="setting-group">
<div class="setting-title">User stylesheet</div>
<div class="setting">
<input class="setting-text-input" type="text" v-model="config.userStylesheet" placeholder="Add a file path to your custom stylesheet" v-on:blur="updateUserConfig">
<input class="setting-text-input" type="text" v-model="config.userStylesheet" placeholder="Add a file path to your custom stylesheet" v-on:click="showChangeUserStyleSheetFileDialog" v-on:blur="updateUserConfig">
</div>
</div>
<div class="setting-group" v-if="config.features.webSearch">
Expand Down
84 changes: 75 additions & 9 deletions src/ts/renderer.ts
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
import { dirname } from "path";
import { homedir } from "os";
import { SearchResultItemViewModel } from "./search-result-item-view-model";
import { IpcChannels } from "./ipc-channels";
import { ipcRenderer } from "electron";
import { ipcRenderer, remote } from "electron";
import { UserConfigFileRepository } from "./user-config/user-config-file-repository";
import { UserInputHistoryManager } from "./user-input-history-manager";
import { ElectronStoreAppConfigRepository } from "./app-config/electorn-store-app-config-repository";
import { availableColorThemes } from "./available-color-themes";
import Vue from "vue";
import { CustomCommand } from "./custom-shortcut";
import { FileSearchOption } from "./file-search-option";
import { Shortcut } from "./shortcut";
Expand All @@ -14,6 +15,7 @@ import { version } from "../../package.json";
import { DefaultAppConfigManager } from "./app-config/default-app-config";
import { DefaultUserConfigManager } from "./user-config/default-config";
import { WindowHelpers } from "./helpers/winow-helpers";
import Vue from "vue";

const appConfigRepository = new ElectronStoreAppConfigRepository(DefaultAppConfigManager.getDefaultAppConfig());
let config = new UserConfigFileRepository(DefaultUserConfigManager.getDefaultUserConfig(), appConfigRepository.getAppConfig().userSettingsFilePath).getConfig();
Expand All @@ -25,9 +27,9 @@ const configEdit = {
newCustomCommand: {},
newFallbackWebSearch: "",
newFileSearchBlackListEntry: "",
newFileSearchOption: {},
newShortcut: {},
newWebSearch: {},
newFileSearchOption: {} as FileSearchOption,
newShortcut: {} as Shortcut,
newWebSearch: {} as WebSearch,
};

const userInputHistoryManager = new UserInputHistoryManager();
Expand All @@ -50,7 +52,6 @@ const vue = new Vue({
updateAvailable: false,
userInput: "",
userStylesheet: `file:///${config.userStylesheet}`,
userStylesheetIsAvailable: config.userStylesheet !== undefined && config.userStylesheet.length > 0,
version,
},
el: "#vue-root",
Expand Down Expand Up @@ -175,17 +176,17 @@ const vue = new Vue({
settingsActionAddFileSearchOption: (newFileSearchOption: FileSearchOption): void => {
config.fileSearchOptions.push(newFileSearchOption);
vue.updateUserConfig();
configEdit.newFileSearchOption = {};
configEdit.newFileSearchOption = {} as FileSearchOption;
},
settingsActionAddShortcut: (newShortcut: Shortcut): void => {
config.shortcuts.push(newShortcut);
vue.updateUserConfig();
configEdit.newShortcut = {};
configEdit.newShortcut = {} as Shortcut;
},
settingsActionAddWebSearch: (newWebSearch: WebSearch): void => {
config.webSearches.push(newWebSearch);
vue.updateUserConfig();
configEdit.newWebSearch = {};
configEdit.newWebSearch = {} as WebSearch;
},
settingsActionRemoveApplicationFileExtension: (applicationFileExtension: string): void => {
const indexToRemove = config.applicationFileExtensions.indexOf(applicationFileExtension);
Expand Down Expand Up @@ -230,6 +231,67 @@ const vue = new Vue({
settingsActionUpdateIconSet: (): void => {
vue.updateUserConfig();
},
showAddApplicationFolderFileDialog: (): void => {
remote.dialog.showOpenDialog({
buttonLabel: "Open",
defaultPath: homedir(),
message: "This is a message",
properties: ["openDirectory"],
title: "This is a title",
}, (filePaths: string[]) => {
if (filePaths !== undefined && filePaths.length === 1) {
configEdit.newApplicationFolder = filePaths[0];
}
});
},
showAddFileSearchOptionFileDialog: (): void => {
remote.dialog.showOpenDialog({
buttonLabel: "Open",
defaultPath: homedir(),
message: "This is a message",
properties: ["openDirectory"],
title: "This is a title",
}, (filePaths: string[]) => {
if (filePaths !== undefined && filePaths.length === 1) {
configEdit.newFileSearchOption = {
folderPath: filePaths[0],
recursive: configEdit.newFileSearchOption.recursive,
} as FileSearchOption;
}
});
},
showChangeUserConfigFilePathDialog: (): void => {
remote.dialog.showOpenDialog({
buttonLabel: "Open",
defaultPath: dirname(appConfig.userSettingsFilePath),
filters: [{ name: "JSON files", extensions: ["json"] }],
message: "This is a message",
properties: ["openFile"],
title: "This is a title",
}, (filePaths: string[]) => {
if (filePaths !== undefined && filePaths.length === 1) {
appConfig.userSettingsFilePath = filePaths[0];
vue.appConfig = appConfig;
}
});
},
showChangeUserStyleSheetFileDialog: (): void => {
remote.dialog.showOpenDialog({
buttonLabel: "Open",
defaultPath: config.userStylesheet === undefined || config.userStylesheet.length === 0
? homedir()
: dirname(config.userStylesheet),
filters: [{ name: "CSS files", extensions: ["css"] }],
message: "This is a message",
properties: ["openFile"],
title: "This is a title",
}, (filePaths: string[]) => {
if (filePaths !== undefined && filePaths.length === 1) {
config.userStylesheet = filePaths[0];
vue.config = config;
}
});
},
updateAppConfig: (): void => {
ipcRenderer.send(IpcChannels.updateAppConfig, appConfig);
},
Expand All @@ -242,6 +304,10 @@ const vue = new Vue({
userInputStyle: (): string => {
return `font-size: ${config.userInputFontSize}px;`;
},
userStylesheetIsAvailable: (): boolean => {
return config.userStylesheet !== undefined
&& config.userStylesheet.length > 0;
},
},
watch: {
userInput: (val: string): void => {
Expand Down

0 comments on commit 5fc831a

Please sign in to comment.