Skip to content

Commit

Permalink
update to we-applet 0.15.0
Browse files Browse the repository at this point in the history
  • Loading branch information
zippy committed Mar 11, 2024
1 parent ef24395 commit 44a0d45
Show file tree
Hide file tree
Showing 11 changed files with 2,093 additions and 208 deletions.
1,886 changes: 1,810 additions & 76 deletions package-lock.json

Large diffs are not rendered by default.

3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,8 @@
"start": "AGENTS=2 BOOTSTRAP_PORT=$(port) SIGNAL_PORT=$(port) npm run network",
"dev": "VITE_ADMIN_PORT=$(port) VITE_APP_PORT=$(port) SIGNAL_PORT=$(port) BOOTSTRAP_PORT=$(port) UI_PORT=8888 npm run x",
"x": "hc s clean && npm run build:happ && UI_PORT=8888 concurrently \"npm start -w ui\" \"npm run start:happ\" \"hc run-local-services -b $BOOTSTRAP_PORT -s $SIGNAL_PORT\"",
"applet-dev": " UI_PORT=8888 npm run applet-devx",
"applet-dev": " UI_PORT=8888 npm run applet-devy",
"applet-devy": "concurrently \"npm start -w ui\" \"sleep 1 && we-dev-cli --agent-idx 1 --dev-config we_dev/config.ts\" \"sleep 10 && we-dev-cli --agent-idx 2 --dev-config we_dev/config.ts\"",
"applet-devx": "BPORT=46263 SPORT=46262; concurrently \"hc run-local-services -b $BPORT -s $SPORT\" \"npm start -w ui\" \"./we_dev/we.AppImage --dev-config we_dev/config.json --agent-num 1 -b http://127.0.0.1:$BPORT -s ws://127.0.0.1:$SPORT\" \"sleep 10 && ./we_dev/we.AppImage --dev-config we_dev/config.json --agent-num 2 -b http://127.0.0.1:$BPORT -s ws://127.0.0.1:$SPORT\"",
"network": "hc s clean && npm run build:happ && UI_PORT=8888 concurrently \"npm start -w ui\" \"npm run launch:happ\" \"holochain-playground\"",
"test": "npm run build:zomes && hc app pack workdir --recursive && npm t -w tests",
Expand Down
4 changes: 3 additions & 1 deletion ui/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,8 @@
"@holochain-open-dev/utils": "^0.16.4",
"@holochain-syn/core": "^0.12.1",
"@holochain/client": "^0.16.7",
"@lightningrodlabs/we-applet": "^0.14.2",
"@lightningrodlabs/we-applet": "^0.15.0",
"@lightningrodlabs/we-elements": "^0.4.5",
"@mdi/js": "^7.1.96",
"@ts-stack/markdown": "^1.4.0",
"lodash": "^4.17.21",
Expand All @@ -32,6 +33,7 @@

},
"devDependencies": {
"@lightningrodlabs/we-dev-cli": "^0.10.5",
"@sveltejs/vite-plugin-svelte": "^2.0.2",
"@tsconfig/svelte": "^3.0.0",
"bestzip": "^2.2.0",
Expand Down
2 changes: 1 addition & 1 deletion ui/src/AboutDialog.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@

<svelte:window on:keydown={handleKeydown}/>

<sl-dialog label="Gamez!: UI v0.4.0 for DNA v0.3.x" bind:this={dialog} width={600} >
<sl-dialog label="Gamez!: UI v0.3.101 for DNA v0.3.x" bind:this={dialog} width={600} >
<div class="about">
<p>Gamez! is a demonstration Holochain app built by the Holochain Foundation.</p>
<p> <b>Developers:</b>
Expand Down
16 changes: 14 additions & 2 deletions ui/src/App.svelte
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
<script lang="ts">
import Controller from './Controller.svelte'
import ControllerCreate from './ControllerCreate.svelte'
import ControllerBoard from './ControllerBoard.svelte'
import { AppAgentWebsocket, AdminWebsocket } from '@holochain/client';
import '@shoelace-style/shoelace/dist/themes/light.css';
Expand All @@ -23,9 +24,11 @@
let connected = false
let createView
enum RenderType {
App,
Board
Board,
CreateBoard,
}
let renderType = RenderType.App
Expand Down Expand Up @@ -93,6 +96,13 @@
throw new Error("Unknown role name:"+weClient.renderInfo.view.roleName);
}
break;
case "creatable":
switch (weClient.renderInfo.view.name) {
case "game":
renderType = RenderType.CreateBoard
createView = weClient.renderInfo.view
}
break;
default:
throw new Error("Unsupported applet-view type");
}
Expand Down Expand Up @@ -140,7 +150,9 @@
></create-profile>
</div>
{:else}
{#if renderType== RenderType.App}
{#if renderType== RenderType.CreateBoard}
<ControllerCreate view={createView} client={client} weClient={weClient} profilesStore={profilesStore} roleName={roleName}></ControllerCreate>
{:else if renderType== RenderType.App}
<Controller client={client} weClient={weClient} profilesStore={profilesStore} roleName={roleName}></Controller>
{:else if renderType== RenderType.Board}
<ControllerBoard board={hrlWithContext.hrl[1]} client={client} weClient={weClient} profilesStore={profilesStore} roleName={roleName}></ControllerBoard>
Expand Down
95 changes: 0 additions & 95 deletions ui/src/AttachmentsBind.svelte

This file was deleted.

11 changes: 1 addition & 10 deletions ui/src/AttachmentsDialog.svelte
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@
import '@shoelace-style/shoelace/dist/components/button/button.js';
import '@shoelace-style/shoelace/dist/components/dialog/dialog.js';
import AttachmentsList from "./AttachmentsList.svelte";
import AttachmentsBind from "./AttachmentsBind.svelte";
const { getStore } :any = getContext("gzStore");
let store: GamezStore = getStore();
Expand All @@ -27,12 +26,10 @@
} else {
attachments = activeBoard.state().props.attachments
}
bind.refresh()
dialog.show()
}
let dialog
$: attachments
let bind
function removeAttachment(index: number) {
attachments.splice(index, 1);
Expand Down Expand Up @@ -77,14 +74,8 @@
<h3>Search Linkables:</h3>
</div>
<sl-button style="margin-top:5px;margin-right: 5px" circle on:click={()=>addAttachment()} >
<SvgIcon icon=link size=16/>
<SvgIcon icon=searchPlus size=25/>
</sl-button>

<AttachmentsBind
bind:this = {bind}
activeBoard={activeBoard}
on:add-binding={(e)=>_addAttachment(e.detail)}
/>

{/if}
</sl-dialog>
Expand Down
150 changes: 150 additions & 0 deletions ui/src/ControllerCreate.svelte
Original file line number Diff line number Diff line change
@@ -0,0 +1,150 @@
<script lang="ts">
import { GamezStore } from './store'
import { setContext } from 'svelte';
import { encodeHashToBase64, type AppAgentClient } from '@holochain/client';
import { SynStore } from '@holochain-syn/store';
import type { ProfilesStore } from "@holochain-open-dev/profiles";
import type { WeClient } from '@lightningrodlabs/we-applet';
import { SynClient } from '@holochain-syn/core';
import { getMyDna } from './util';
import { Board } from './board';
import '@shoelace-style/shoelace/dist/components/select/select.js';
import '@shoelace-style/shoelace/dist/components/option/option.js';
import { cloneDeep } from "lodash";
export let roleName = ""
export let client : AppAgentClient
export let weClient : WeClient
export let profilesStore : ProfilesStore
export let view
let store: GamezStore = new GamezStore (
weClient,
profilesStore,
client,
roleName,
);
let synStore: SynStore = store.synStore
setContext('synStore', {
getStore: () => synStore,
});
setContext('store', {
getStore: () => store,
});
let inputElement
let gameTypeElement
let disabled = true
$: defsList = store.defsList
</script>
<div class="flex-scrollable-parent">
<div class="flex-scrollable-container">
<div class='app'>

<div class="wrapper" >

<div class="workspace" style=" display:flex; flex-direction:column;padding:20px;">
<sl-select
hoist
placeholder="Game Type"
bind:this={gameTypeElement}
on:sl-input={(e)=>disabled = !e.target.value || !inputElement.value}
>
{#if $defsList.status == "complete"}
{#each $defsList.value as def}
<sl-option
value={encodeHashToBase64(def.originalHash)}
>
{def.board.name}
</sl-option>
{/each}
{:else}
loading
{/if}
</sl-select>
<sl-input bind:this={inputElement}
on:sl-input={(e)=>disabled = !e.target.value || !gameTypeElement.value}
placeholder="Game Name"
style="margin-top:5px;"
></sl-input>
<div style="margin-top:10px;display:flex;justify-content:flex-end">
<sl-button on:click={()=>{
view.cancel()
}}>Cancel</sl-button>
<sl-button
style="margin-left:10px;"
variant="primary"
disabled={disabled}
on:click={async ()=>{
try {
const defHashB64 = gameTypeElement.value
const defBoard = Array.from($defsList.value).find(def=>encodeHashToBase64(def.originalHash)==defHashB64)
//const hrlB64 = hrlWithContextToB64(attachToHrlWithContext)
const state = cloneDeep(defBoard.board);
state.name = inputElement.value
const board = await store.boardList.makeBoard(state);
const dnaHash = await getMyDna(roleName, client)
view.resolve({hrl:[dnaHash, board.hash]})
} catch(e) {
console.log("ERR",e)
view.reject(e)
}
}}>Create</sl-button>
</div>
</div>
</div>
</div>
</div>
</div>
<style>
.app {
margin: 0;
padding-bottom: 10px;
background-size: cover;
display: flex;
flex-direction: column;
min-height: 0;
background-color: #fff;
height: 100vh;
position: relative;
}
:global(:root) {
--resizeable-height: 200px;
--tab-width: 60px;
}
@media (min-width: 640px) {
.app {
max-width: none;
}
}
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
.flex-scrollable-parent {
position: relative;
display: flex;
flex: 1;
}
.flex-scrollable-container {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.wrapper {
position: relative;
z-index: 10;
}
</style>
Loading

0 comments on commit 44a0d45

Please sign in to comment.