-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #2 from robalb/develop
Develop
- Loading branch information
Showing
9 changed files
with
944 additions
and
235 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,135 +1,21 @@ | ||
| <script lang="ts"> | ||
| import './styles/style.css'; | ||
| import { PaneGroup, Pane, PaneResizer } from "paneforge"; | ||
| // import ThemeDebug from './components/ThemeDebug.svelte'; | ||
| import Hexdump from './components/Hexdump.svelte'; | ||
| import Editor from './components/Editor.svelte'; | ||
| import Registers from './components/Registers.svelte'; | ||
| import Disassembler from './components/Disassembler.svelte'; | ||
| import Terminal from './components/Terminal.svelte'; | ||
| import Controls from './components/Controls.svelte'; | ||
| import DesktopLayout from './DesktopLayout.svelte'; | ||
| import MobileLayout from './MobileLayout.svelte'; | ||
| </script> | ||
|
|
||
|
|
||
| <PaneGroup direction="horizontal" class="pf__panegroup pf__panegroup--horizontal"> | ||
|
|
||
| <Pane defaultSize={25} class="pf__pane pf__pane--h100"> | ||
| <div class="pane"> | ||
| <Controls/> | ||
| <!-- <div class="pane__bar"> --> | ||
| <!-- <p>Editor</p> --> | ||
| <!-- </div> --> | ||
| <div class="pane__content"> | ||
| <Editor /> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
| let innerWidth = 0; | ||
| let breakpoints = { | ||
| mobile: 640 | ||
| } | ||
| <!-- <Pane defaultSize={25} class="pf__pane"> --> | ||
| <!-- <PaneGroup direction="vertical" class="pf__panegroup pf__panegroup--vertical"> --> | ||
| <!-- <Pane defaultSize={25} class="pf__pane"> --> | ||
| <!-- <div class="pane"> --> | ||
| <!-- <div class="pane__content"> --> | ||
| <!-- <Controls/> --> | ||
| <!-- </div> --> | ||
| <!-- </div> --> | ||
| <!-- </Pane> --> | ||
| <!-- <PaneResizer class="pf__resizer pf__resizer--horizontal" /> --> | ||
| <!-- <Pane defaultSize={75} class="pf__pane"> --> | ||
| <!-- <div class="pane"> --> | ||
| <!-- <div class="pane__bar"> --> | ||
| <!-- <p>Code editor</p> --> | ||
| <!-- <select> --> | ||
| <!-- </div> --> | ||
| <!-- <div class="pane__content"> --> | ||
| <!-- <Editor /> --> | ||
| <!-- </div> --> | ||
| <!-- </div> --> | ||
| <!-- </Pane> --> | ||
| <!-- </PaneGroup> --> | ||
| <!-- </Pane> --> | ||
|
|
||
| <PaneResizer class="pf__resizer pf__resizer--vertical" /> | ||
| <Pane defaultSize={30} class="pf__pane pf__pane--h100"> | ||
| <div class="pane"> | ||
| <div class="pane__bar"> | ||
| <p>Disassembly</p> | ||
| </div> | ||
| <div class="pane__content"> | ||
| <Disassembler /> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
|
|
||
| <PaneResizer class="pf__resizer pf__resizer--vertical" /> | ||
| <Pane defaultSize={15} class="pf__pane pf__pane--h100"> | ||
| <PaneGroup direction="vertical" class="pf__panegroup pf__panegroup--vertical"> | ||
| <Pane defaultSize={50} class="pf__pane"> | ||
| <div class="pane"> | ||
| <div class="pane__bar"> | ||
| <p>Registers</p> | ||
| </div> | ||
| <div class="pane__content"> | ||
| <Registers /> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
| <PaneResizer class="pf__resizer pf__resizer--horizontal" /> | ||
| <Pane defaultSize={50} class="pf__pane"> | ||
| <div class="pane"> | ||
| <div class="pane__bar"> | ||
| <p>Terminal</p> | ||
| </div> | ||
| <div class="pane__content"> | ||
| <Terminal/> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
| </PaneGroup> | ||
| </Pane> | ||
| <PaneResizer class="pf__resizer pf__resizer--vertical" /> | ||
| <Pane defaultSize={25} class="pf__pane pf__pane--h100"> | ||
| <div class="pane"> | ||
| <div class="pane__bar"> | ||
| <p>Stack memory</p> | ||
| </div> | ||
| <div class="pane__content"> | ||
| <Hexdump /> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
| </PaneGroup> | ||
|
|
||
| <style> | ||
| .pane{ | ||
| display: flex; | ||
| justify-content: center; | ||
| flex-direction:column; | ||
| align-items: stretch; | ||
| height: 100%; | ||
| /* border: 1px solid var(--theme-panel-border); */ | ||
| } | ||
| .pane__bar{ | ||
| height: 2rem; | ||
| flex-shrink: 0; | ||
| </script> | ||
|
|
||
| padding-left: 1rem; | ||
| background-color: var(--theme-panel-controls-bg); | ||
| border-bottom: 1px solid var(--theme-panel-border); | ||
| width: 100%; | ||
| display: flex; | ||
| } | ||
| .pane__bar p{ | ||
| font-size: 1.1rem; | ||
| margin: 0; | ||
| } | ||
| <!-- attach an action to the browser window --> | ||
| <svelte:window bind:innerWidth /> | ||
|
|
||
| .pane__content{ | ||
| overflow: auto; | ||
| height: 100%; | ||
| /*this is cool the first time you see it, then super annoying */ | ||
| /* scroll-behavior: smooth; */ | ||
| } | ||
| {#if innerWidth <= breakpoints.mobile} | ||
| <MobileLayout/> | ||
| {:else} | ||
| <DesktopLayout/> | ||
| {/if} | ||
|
|
||
| </style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,108 @@ | ||
| <script lang="ts"> | ||
| import { PaneGroup, Pane, PaneResizer } from "paneforge"; | ||
| import Hexdump from './components/Hexdump.svelte'; | ||
| import Editor from './components/Editor.svelte'; | ||
| import Registers from './components/Registers.svelte'; | ||
| import Disassembler from './components/Disassembler.svelte'; | ||
| import Terminal from './components/Terminal.svelte'; | ||
| import Controls from './components/Controls.svelte'; | ||
| </script> | ||
|
|
||
|
|
||
| <PaneGroup direction="horizontal" class="pf__panegroup pf__panegroup--horizontal"> | ||
|
|
||
| <Pane defaultSize={25} class="pf__pane pf__pane--h100"> | ||
| <div class="pane"> | ||
|
|
||
| <Controls mobile={false} showEditor={true}/> | ||
| <div class="pane__content"> | ||
| <Editor /> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
|
|
||
| <PaneResizer class="pf__resizer pf__resizer--vertical" /> | ||
| <Pane defaultSize={30} class="pf__pane pf__pane--h100"> | ||
| <div class="pane"> | ||
| <div class="pane__bar"> | ||
| <p>Disassembly</p> | ||
| </div> | ||
| <div class="pane__content"> | ||
| <Disassembler /> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
|
|
||
| <PaneResizer class="pf__resizer pf__resizer--vertical" /> | ||
| <Pane defaultSize={15} class="pf__pane pf__pane--h100"> | ||
| <PaneGroup direction="vertical" class="pf__panegroup pf__panegroup--vertical"> | ||
| <Pane defaultSize={50} class="pf__pane"> | ||
| <div class="pane"> | ||
| <div class="pane__bar"> | ||
| <p>Registers</p> | ||
| </div> | ||
| <div class="pane__content"> | ||
| <Registers /> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
| <PaneResizer class="pf__resizer pf__resizer--horizontal" /> | ||
| <Pane defaultSize={50} class="pf__pane"> | ||
| <div class="pane"> | ||
| <div class="pane__bar"> | ||
| <p>Terminal</p> | ||
| </div> | ||
| <div class="pane__content"> | ||
| <Terminal/> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
| </PaneGroup> | ||
| </Pane> | ||
| <PaneResizer class="pf__resizer pf__resizer--vertical" /> | ||
| <Pane defaultSize={25} class="pf__pane pf__pane--h100"> | ||
| <div class="pane"> | ||
| <div class="pane__bar"> | ||
| <p>Stack memory</p> | ||
| </div> | ||
| <div class="pane__content"> | ||
| <Hexdump /> | ||
| </div> | ||
| </div> | ||
| </Pane> | ||
| </PaneGroup> | ||
|
|
||
| <style> | ||
| .pane{ | ||
| display: flex; | ||
| justify-content: center; | ||
| flex-direction:column; | ||
| align-items: stretch; | ||
| height: 100%; | ||
| /* border: 1px solid var(--theme-panel-border); */ | ||
| } | ||
| .pane__bar{ | ||
| height: 2rem; | ||
| flex-shrink: 0; | ||
| padding-left: 1rem; | ||
| background-color: var(--theme-panel-controls-bg); | ||
| border-bottom: 1px solid var(--theme-panel-border); | ||
| width: 100%; | ||
| display: flex; | ||
| } | ||
| .pane__bar p{ | ||
| font-size: 1.1rem; | ||
| margin: 0; | ||
| } | ||
| .pane__content{ | ||
| overflow: auto; | ||
| height: 100%; | ||
| /*this is cool the first time you see it, then super annoying */ | ||
| /* scroll-behavior: smooth; */ | ||
| } | ||
| </style> | ||
|
|
Oops, something went wrong.