| 1 | <script lang="ts"> |
| 2 | import Menu from "./utility/Menu.svelte"; |
| 3 | import settings from "./Settings.svelte"; |
| 4 | import Welcome from "./Welcome.svelte"; |
| 5 | import { Settings } from "carbon-icons-svelte"; |
| 6 | import { addTab, tabs, closeActiveTab } from "../lib/EditorTabList.svelte"; |
| 7 | import { workspaceName } from "./File"; |
| 8 | import { commands } from "../config/commands"; |
| 9 | import { } from "@tauri-apps/api"; |
| 10 | import { openLogFiles } from "../config/config"; |
| 11 | import * as shell from "@tauri-apps/plugin-shell" |
| 12 | |
| 13 | const items = [ |
| 14 | {menuname: "File", children: [ |
| 15 | {name: "New File", shortcut: commands.addEditorTab.keybind, action: commands.addEditorTab.command}, |
| 16 | {name: "Open File...", shortcut: commands.openFile.keybind, action: commands.openFile.command}, |
| 17 | {name: "Open Folder...", shortcut: commands.openFolder.keybind, action: commands.openFolder.command}, |
| 18 | {name: "Save File", shortcut: commands.saveFile.keybind, action: commands.saveFile.command}, |
| 19 | {name: "Save File As...", shortcut: commands.saveFileAs.keybind, action: commands.saveFileAs.command}, |
| 20 | {name: "Close Tab", disabled: $tabs.length === 0, shortcut: "", action: async () => {await closeActiveTab()}}, |
| 21 | ]}, |
| 22 | {menuname: "Edit", children: [ |
| 23 | {name: "Undo", disabled: commands.undo.disabled, shortcut: commands.undo.keybind, action: commands.undo.command}, |
| 24 | {name: "Redo", disabled: commands.redo.disabled, shortcut: commands.redo.keybind, action: commands.redo.command}, |
| 25 | {name: "Cut", disabled: commands.cut.disabled, shortcut: commands.cut.keybind, action: commands.cut.command}, |
| 26 | {name: "Copy", disabled: commands.copy.disabled, shortcut: commands.copy.keybind, action: commands.copy.command}, |
| 27 | {name: "Paste", disabled: commands.paste.disabled, shortcut: commands.paste.keybind, action: commands.paste.command}, |
| 28 | {name: "Paste From History...", disabled: true, shortcut: commands.pasteFromHistory.keybind, action: commands.pasteFromHistory.command}, |
| 29 | {name: "Delete", disabled: commands.delete.disabled, shortcut: commands.delete.keybind, action: commands.delete.command}, |
| 30 | {name: "Find", disabled: true, shortcut: commands.find.keybind, action: () => commands.find.command}, |
| 31 | {name: "Replace", disabled: true, shortcut: commands.replace.keybind, action: commands.replace.command}, |
| 32 | ]}, |
| 33 | {menuname: "View", children: [ |
| 34 | {name: "Command Pallete", disabled: true, shortcut: commands.openCommandPallete.keybind, action: commands.openCommandPallete.command}, |
| 35 | {name: "Zoom In", disabled: true, shortcut: commands.zoomIn.keybind, action: commands.zoomIn.command}, |
| 36 | {name: "Zoom Out", disabled: true, shortcut: commands.zoomOut.keybind, action: commands.zoomOut.command}, |
| 37 | {name: "Reset Zoom", disabled: true, shortcut: "", action: () => {console.warn("Feature not implemented yet.")}}, |
| 38 | {name: "Fullscreen", disabled: commands.fullscreen.disabled, shortcut: commands.fullscreen.keybind, action: commands.fullscreen.command}, |
| 39 | ]}, |
| 40 | {menuname: "Run", children: [ |
| 41 | {name: "Run File", disabled: true, shortcut: commands.runFile.keybind, action: commands.runFile.command}, |
| 42 | {name: "Debug File", disabled: true, shortcut: commands.debugFile.keybind, action: commands.debugFile.command}, |
| 43 | {name: "Stop File", disabled: true, shortcut: commands.stopFile.keybind, action: commands.stopFile.command}, |
| 44 | {name: "Open Configurations", disabled: true, shortcut: "", action: () => {console.warn("Feature not implemented yet.")}}, |
| 45 | ]}, |
| 46 | {menuname: "Window", children: [ |
| 47 | {name: "New Window", disabled: true, shortcut: commands.openNewWindow.keybind, action: commands.openNewWindow.command}, |
| 48 | {name: "Minimize Window", shortcut: commands.minimizeWindow.keybind, action: commands.minimizeWindow.command}, |
| 49 | {name: "Maximize Window", shortcut: commands.maximizeWindow.keybind, action: commands.maximizeWindow.command}, |
| 50 | {name: "Close Window", shortcut: commands.closeWindow.keybind, action: commands.closeWindow.command}, |
| 51 | ]}, |
| 52 | {menuname: "Help", children: [ |
| 53 | {name: "Welcome", shortcut: "", action: () => {addTab("Welcome", "Welcome", new Welcome({target: document.getElementById("tabview")}))}}, |
| 54 | {name: "Send Feedback", disabled: true, shortcut: "", action: () => {console.warn("Feature not implemented yet.")}}, |
| 55 | {name: "Contact Support", disabled: true, shortcut: "", action: () => {console.warn("Feature not implemented yet.")}}, |
| 56 | {name: "Report Issue", shortcut: "", action: () => {shell.open("https://github.com/setoelkahfi/svara/issues/new/choose")}}, |
| 57 | {name: "Documentation", disabled: true, shortcut: "", action: () => {console.warn("Feature not implemented yet.")}}, |
| 58 | {name: "Show Release Notes", disabled: true, shortcut: "", action: () => {console.warn("Feature not implemented yet.")}}, |
| 59 | {name: "Check for Updates", disabled: true, shortcut: "", action: () => {console.warn("Feature not implemented yet.")}}, |
| 60 | {name: "About", shortcut: "", action: () => {shell.open("https://github.com/setoelkahfi/svara")}}, |
| 61 | {name: "Open Logs", shortcut: "", action: async () => {await openLogFiles()}}, |
| 62 | ]}, |
| 63 | ]; |
| 64 | </script> |
| 65 | |
| 66 | <div id="header"> |
| 67 | <div id="logo"></div> |
| 68 | <div id="menubar"> |
| 69 | {#each items as item} |
| 70 | <Menu menu={item}></Menu> |
| 71 | {/each} |
| 72 | </div> |
| 73 | <div class="divider"></div> |
| 74 | <div id="workspace" title="" data-tauri-drag-region> |
| 75 | {$workspaceName} |
| 76 | </div> |
| 77 | <div id="handle" data-tauri-drag-region></div> |
| 78 | <div class="tools"> |
| 79 | |
| 80 | <div class="settings-button"> |
| 81 | <Menu right menu={{icon: Settings, children: [ |
| 82 | {name: "Settings", shortcut: "", action: () => {addTab("Settings", "Settings", new settings({target: document.getElementById("tabview")}))}}, |
| 83 | {name: "Keymap", disabled: true, shortcut: "", action: () => {console.warn("Feature not implemented yet.")}} |
| 84 | ] |
| 85 | }} /> |
| 86 | </div> |
| 87 | </div> |
| 88 | <div id="window-controls"> |
| 89 | <!-- svelte-ignore a11y-click-events-have-key-events --> |
| 90 | <!-- svelte-ignore a11y-no-static-element-interactions --> |
| 91 | <div |
| 92 | class="window-button" |
| 93 | id="minimize" |
| 94 | on:click={commands.minimizeWindow.command} |
| 95 | /> |
| 96 | <!-- svelte-ignore a11y-click-events-have-key-events --> |
| 97 | <!-- svelte-ignore a11y-no-static-element-interactions --> |
| 98 | <div |
| 99 | class="window-button" |
| 100 | id="maximize" |
| 101 | on:click={commands.maximizeWindow.command} |
| 102 | /> |
| 103 | <!-- svelte-ignore a11y-click-events-have-key-events --> |
| 104 | <!-- svelte-ignore a11y-no-static-element-interactions --> |
| 105 | <div |
| 106 | class="window-button" |
| 107 | id="close" |
| 108 | on:click={commands.closeWindow.command} |
| 109 | /> |
| 110 | </div> |
| 111 | </div> |
| 112 | |
| 113 | <style lang="scss"> |
| 114 | #header { |
| 115 | width: 100%; |
| 116 | display: flex; |
| 117 | align-items: center; |
| 118 | position: relative; |
| 119 | z-index: 3; |
| 120 | } |
| 121 | #logo { |
| 122 | background-size: 20px; |
| 123 | background-repeat: no-repeat; |
| 124 | height: 100%; |
| 125 | min-width: 35px; |
| 126 | position: relative; |
| 127 | content: ''; |
| 128 | background-image: url("/assets/images/Icon.png"); |
| 129 | background-position: center; |
| 130 | z-index: 10; |
| 131 | } |
| 132 | #menubar { |
| 133 | height: 100%; |
| 134 | display: flex; |
| 135 | z-index: 10; |
| 136 | } |
| 137 | .divider { |
| 138 | width: 0.0625rem; |
| 139 | height: 1.2rem; |
| 140 | margin: 0 4px; |
| 141 | } |
| 142 | #workspace { |
| 143 | height: 100%; |
| 144 | padding: 0 0.5rem; |
| 145 | font-size: 0.813rem; |
| 146 | overflow: hidden; |
| 147 | text-overflow: ellipsis; |
| 148 | white-space: nowrap; |
| 149 | color: #8c8c8c; |
| 150 | z-index: 10; |
| 151 | } |
| 152 | |
| 153 | #handle { |
| 154 | position: absolute; |
| 155 | width: -webkit-fill-available; |
| 156 | z-index: 9; |
| 157 | } |
| 158 | |
| 159 | .settings-button { |
| 160 | height: 100%; |
| 161 | display: flex; |
| 162 | justify-content: center; |
| 163 | align-items: center; |
| 164 | z-index: 10; |
| 165 | } |
| 166 | .tools { |
| 167 | display: flex; |
| 168 | justify-content: end; |
| 169 | padding: 0 5px; |
| 170 | height: 100%; |
| 171 | margin-left: auto; |
| 172 | } |
| 173 | |
| 174 | #window-controls { |
| 175 | height: 100%; |
| 176 | display: flex; |
| 177 | z-index: 10; |
| 178 | .window-button { |
| 179 | min-width: 36px; |
| 180 | height: 100%; |
| 181 | line-height: 34px; |
| 182 | text-align: center; |
| 183 | padding: 0 5px; |
| 184 | font-size: 0.875rem; |
| 185 | cursor: pointer; |
| 186 | &#close:hover { |
| 187 | background-color: #ff3131; |
| 188 | } |
| 189 | &#minimize::before { |
| 190 | content: "\2014"; |
| 191 | font-size: 10px; |
| 192 | } |
| 193 | &#maximize::before { |
| 194 | content: "\2610"; |
| 195 | } |
| 196 | &#close::before { |
| 197 | content: "\2715"; |
| 198 | line-height: 30px; |
| 199 | } |
| 200 | } |
| 201 | } |
| 202 | |
| 203 | </style> |