Skip to content

Commit

Permalink
feat/split-screen (#124)
Browse files Browse the repository at this point in the history 
* initial

* smart trigger split-screen

* fix bridge. not closing

* split-screen fixes

* fixed disabling hardware acceleration
  • Loading branch information
@solvedDev
solvedDev authored Dec 17, 2019
1 parent 3cba2d6 commit 10ab589
Show file tree
Hide file tree
Showing 13 changed files with 231 additions and 76 deletions.
49 changes: 33 additions & 16 deletions src/renderer/App.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,23 +2,27 @@
<div id="app">
<v-app :style="{ background: $vuetify.theme.themes[theme_variant].background }">
<app-toolbar/>
<sidebar-navigation/>

<v-content :style="`padding-bottom: ${footer_visible ? 44 : 22}px;`">
<v-container class="no-padding" fluid fill-height align>
<v-layout style="margin: 0;" row align-space-between all fill-height>
<sidebar-navigation/>
<sidebar-main/>

<v-flex :xs10="is_sidebar_open" :xs12="!is_sidebar_open">
<editor-shell-tab-system/>
<editor-shell-content-manager/>

<window-factory-main/>
<context-menu-main/>
<json-editor-hover-card/>
</v-flex>
</v-layout>
</v-container>
<v-row style="height: 100%;" no-gutters>
<v-col cols="2">
<sidebar-main/>
</v-col>
<v-col
@click="setSplitScreen(false)"
:style="`border-right: 1px solid ${is_dark_mode ? 'rgba(255, 255, 255, 0.12)' : 'rgba(0, 0, 0, 0.12)'} !important;`"
:cols="5 * has_split_screen"
>
<editor-shell-tab-system/>
<editor-shell-content-manager/>
</v-col>
<v-col @click="setSplitScreen(true)" v-if="has_split_screen" cols="5">
<editor-shell-tab-system :split_screen="true"/>
<editor-shell-content-manager :split_screen="true"/>
</v-col>
</v-row>

</v-content>

<v-footer color="footer" :class="footer_visible ? 'big' : ''" fixed padless app>
Expand All @@ -29,6 +33,10 @@
created by <a class="grey--text text--lighten-1" @click="openTwitter">solvedDev</a>
</span>
</v-footer>

<window-factory-main/>
<context-menu-main/>
<json-editor-hover-card/>
</v-app>
</div>
</template>
Expand All @@ -48,6 +56,7 @@
import startUp from "./scripts/utilities/startUp";
import EventBus from './scripts/EventBus';
import Vue from "vue";
import TabSystem from './scripts/TabSystem';
export default {
name: 'bridge',
Expand Down Expand Up @@ -81,6 +90,7 @@
update_styles: theme.update_styles
});
});
EventBus.on("updateTabUI", this.updateSplitScreen);
},
computed: {
is_sidebar_open() {
Expand Down Expand Up @@ -111,12 +121,19 @@
return {
content: "",
file: "",
path: ""
path: "",
has_split_screen: false
};
},
methods: {
openTwitter() {
shell.openExternal("https://twitter.com/solvedDev");
},
updateSplitScreen() {
this.has_split_screen = TabSystem.getCurrentProjects(true).length > 0;
},
setSplitScreen(val) {
TabSystem.split_screen_active = val;
}
}
}
Expand Down
15 changes: 11 additions & 4 deletions src/renderer/components/editor_shell/JsonEditor/JsonInput.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,8 @@
tab_id: Number,
render_object: Object,
file_navigation: String,
current_file_path: String
current_file_path: String,
is_active: Boolean
},
data() {
return {
Expand All @@ -55,17 +56,20 @@
if(this.type == "edit") {
this.value = TabSystem.getCurrentNavContent();
EventBus.on("updateFileNavigation", this.updateValue);
EventBus.on("setWatcherInactive", () => this.watcher_active = false);
EventBus.on("setWatcherInactive", () => {
if(!this.is_active) return;
this.watcher_active = false;
});
} else {
this.updateAutoCompletions();
EventBus.on("updateAutoCompletions", () => this.updateAutoCompletions());
EventBus.on("updateAutoCompletions", this.updateAutoCompletions);
}
},
destroyed() {
if(this.type == "edit") {
EventBus.off("updateFileNavigation", this.updateValue);
} else {
EventBus.off("updateAutoCompletions", () => this.updateAutoCompletions());
EventBus.off("updateAutoCompletions", this.updateAutoCompletions);
}
},
watch: {
Expand Down Expand Up @@ -154,6 +158,8 @@
},
updateAutoCompletions() {
if(!this.is_active) return;
if(!this.provide_auto_completions) {
this.items = [];
return;
Expand Down Expand Up @@ -185,6 +191,7 @@
TabSystem.setCurrentFileNav(`${TabSystem.getCurrentNavigation()}/${path}`);
},
updateValue() {
if(!this.is_active) return;
this.watcher_active = false;
this.value = TabSystem.getCurrentNavContent();
},
Expand Down
10 changes: 9 additions & 1 deletion src/renderer/components/editor_shell/JsonEditor/Main.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@
:object_key="`${object_key}/${(e.key + '').replace(/\//g, '#;slash;#')}`"
:node_context="e"
:is_immutable="is_immutable"
:is_active="is_active"
/>

<json-editor-main
Expand All @@ -28,6 +29,7 @@
:tab_id="tab_id"
:object_key="`${object_key}/${(e.key + '').replace(/\//g, '#;slash;#')}`"
:is_immutable="is_immutable"
:is_active="is_active"
/>
</details>
</draggable>
Expand All @@ -51,6 +53,7 @@
:tab_id="tab_id"
:file_navigation="file_navigation"
:current_file_path="current_file_path"
:is_active="is_active"
/>
<json-input
ref="edit"
Expand All @@ -59,6 +62,7 @@
type="edit"
:file_navigation="file_navigation"
:current_file_path="current_file_path"
:is_active="is_active"
/>
</template>
<template v-else>
Expand All @@ -71,6 +75,7 @@
:key="`${input_type}`"
:file_navigation="file_navigation"
:current_file_path="current_file_path"
:is_active="is_active"
/>
</template>
</v-layout>
Expand Down Expand Up @@ -99,6 +104,7 @@
draggable
},
props: {
is_active: Boolean,
available_height: Number,
current_file_path: String,
object: [String, Object, Number, Boolean, Array],
Expand Down Expand Up @@ -127,6 +133,8 @@
this.file_navigation = TabSystem.getCurrentNavigation();
});
EventBus.on("updateCurrentContent", (new_o=this.computed_object()) => {
if(!this.is_active) return;
this.render_object = new_o;
});
Expand Down Expand Up @@ -170,7 +178,7 @@
},
key_selected_class() {
return this.is_selected(undefined, "/" + this.evaluated_key) ? "selected" : "";
return this.is_selected(undefined, "/" + this.evaluated_key) && this.is_active ? "selected" : "";
},
value_data() {
return this.render_object.data;
Expand Down
5 changes: 3 additions & 2 deletions src/renderer/components/editor_shell/JsonEditor/ObjectKey.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -125,12 +125,13 @@
show_comment: {
default: true,
type: Boolean
}
},
is_active: Boolean
},
computed: {
selected_class() {
if(this.$el && this.is_selected() && this.$store.state.Settings.auto_scroll_json) this.$el.scrollIntoView({ behavior: "smooth", block: "center", inline: "nearest" });
return this.is_selected() ? "selected" : "";
return this.is_selected() && this.is_active ? "selected" : "";
},
inversed_arrows() {
return this.$store.state.Settings.inversed_arrows;
Expand Down
8 changes: 5 additions & 3 deletions src/renderer/components/editor_shell/JsonEditor/PredictingInput.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,8 @@
tab_id: Number,
render_object: Object,
file_navigation: String,
current_file_path: String
current_file_path: String,
is_active: Boolean
},
data() {
return {
Expand All @@ -55,10 +56,10 @@
},
mounted() {
this.updateAutoCompletions();
EventBus.on("updateAutoCompletions", () => this.updateAutoCompletions());
EventBus.on("updateAutoCompletions", this.updateAutoCompletions);
},
destroyed() {
EventBus.off("updateAutoCompletions", () => this.updateAutoCompletions());
EventBus.off("updateAutoCompletions", this.updateAutoCompletions);
},
watch: {
file_navigation(nav) {
Expand Down Expand Up @@ -124,6 +125,7 @@
updateAutoCompletions() {
this.mode = "object";
if(!this.is_active) return;
if(!this.provide_auto_completions) {
this.items = [];
Expand Down
11 changes: 10 additions & 1 deletion src/renderer/components/editor_shell/SingleFile.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
:uuid="use_uuid"
:current_file_path="file.file_path"
:is_immutable="file.is_immutable"
:is_active="is_active"
/>
<span v-else>
<codemirror
Expand Down Expand Up @@ -69,7 +70,8 @@
file: Object,
available_height: Number,
tab_id: Number,
uuid: String
uuid: String,
is_active: Boolean
},
created() {
loadAllTextHighlighters();
Expand Down Expand Up @@ -225,24 +227,31 @@
},
methods: {
setCMTextSelection(sel_obj_1, sel_obj_2) {
if(!this.is_active) return;
this.codemirror.setSelection(sel_obj_1, sel_obj_2);
},
setCMSelection(str) {
if(!this.is_active) return;
this.codemirror.replaceSelection(str);
},
getCMSelection(cb) {
if(!this.is_active) return;
cb(this.codemirror.getSelection());
},
cmUndo() {
if(!this.is_active) return;
this.codemirror.execCommand("undo");
},
cmRedo() {
if(!this.is_active) return;
this.codemirror.execCommand("redo");
},
cmFocus() {
if(!this.is_active) return;
this.codemirror.focus();
},
shouldUpdateSuggestions(event) {
if(!this.is_active) return;
TextProvider.compile(event.doc, this.file.file_path, this.codemirror.cursorCoords(true));
},
getEncoded(type, ext, data) {
Expand Down
17 changes: 12 additions & 5 deletions src/renderer/components/editor_shell/TabContentManager.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
:file="file"
:available_height="available_height"
:tab_id="i"
:is_active="$store.state.TabSystem.split_screen_active ? split_screen : !split_screen"
:uuid="`(${selected_project}-${i}`"
></file-manager>
</span>
Expand All @@ -21,6 +22,12 @@
export default {
name: "editor-shell-content-manager",
props: {
split_screen: {
type: Boolean,
default: false
}
},
components: {
WelcomeScreen,
FileManager
Expand All @@ -38,28 +45,28 @@
data() {
return {
available_height: window.innerHeight - 92,
open_files: TabSystem.filtered(),
selected_tab: TabSystem.selected
open_files: TabSystem.getCurrentProjects(this.split_screen),
selected_tab: TabSystem.getSelectedIndex(this.split_screen)
};
},
methods: {
onResize() {
this.available_height = window.innerHeight - this.base_height;
},
setOpenFiles() {
this.open_files = TabSystem.filtered();
this.open_files = TabSystem.getCurrentProjects(this.split_screen);
},
updateSelectedTab() {
EventBus.trigger("bridge:closeTextCompletions");
this.selected_tab = TabSystem.selected;
this.selected_tab = TabSystem.getSelectedIndex(this.split_screen);
}
},
computed: {
// open_files() {
// return this.$store.getters.open_files();
// },
// selected_tab() {
// return this.$store.state.TabSystem.selected_tab;
// return this.$store.state.TabSystem.getSelectedIndex(this.split_screen)_tab;
// },
base_height() {
return 98 + 22 * this.footer_visible;
Expand Down
Loading

0 comments on commit 10ab589

Please sign in to comment.