Skip to content

Commit

Permalink
final styles and release action to deploy in gh-pages
Browse files Browse the repository at this point in the history
  • Loading branch information
lucasmenendez committed Apr 7, 2024
1 parent 29828b6 commit 1231c0e
Show file tree
Hide file tree
Showing 3 changed files with 98 additions and 23 deletions.
50 changes: 50 additions & 0 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
name: Release new version

on:
push:
tags:
- '*'
# Allows you to run this workflow manually from the Actions tab
workflow_dispatch:

# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
contents: read
pages: write
id-token: write

# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
group: "pages"
cancel-in-progress: false

jobs:
publish:
runs-on: ubuntu-latest
env:
GOOS: js
GOARCH: wasm
steps:
- uses: actions/checkout@v3
- uses: actions/setup-go@v3
with:
go-version: 1.22.x
cache: true
- name: Setup Pages
id: pages
uses: actions/configure-pages@v5
- name: Build wasm
run: |
go build -o ${{ steps.pages.outputs.base_path }}/gosss.wasm ./cmd/webassembly/main.go
- name: Copy go wasm js engine
run: |
cp "$(go env GOROOT)/misc/wasm/wasm_exec.js" ${{ steps.pages.outputs.base_path }}
cp -r ./web ${{ steps.pages.outputs.base_path }}
- name: Upload to Pages
uses: actions/upload-pages-artifact@v3
with:
path: ${{ steps.pages.outputs.base_path }}
- name: Deploy to Pages
id: deployment
uses: actions/deploy-pages@v4
65 changes: 42 additions & 23 deletions web/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -22,29 +22,47 @@ const app = createApp({
await this.setupWebAssembly();
},
template: `
<div>
<button class="button" @click="currentTab = 'hide'">Hide</button>
<button class="button" @click="currentTab = 'recover'">Recover</button>
<div style="width: 90%; max-width: 800px; margin: 50px auto;" class="is-shadowed is-rounded has-p-12">
<header>
<h1 class="title">Shamir's Secret Sharing Demo</h1>
<p>Welcome to the Shamir's Secret Sharing demo 👋.</p>
<p>This tool allows you to securely <b>share a secret message by dividing it</b> into parts. A <b>certain number</b> of parts (threshold) <b>are needed to recover</b> the original message. </p>
<p>This ensures that the secret can only be reconstructed when a sufficient number of parts are brought together.</p>
</header>
<div class="is-flex has-direction-row has-text-center">
<button class="button has-m-2 has-w-full" :class="{'is-normal': currentTab != 'hide'}" @click="currentTab = 'hide'">Hide</button>
<button class="button has-m-2 has-w-full" :class="{'is-normal': currentTab != 'recover'}" @click="currentTab = 'recover'">Recover</button>
</div>
<div v-show="currentTab === 'hide'">
<h3>Hide a message</h3>
<textarea class="textarea" v-model="message" placeholder="Enter your message" rows="6"></textarea>
<div v-show="message !== ''">
<label class="label">Shares <small>({{ config.minShares }} - {{ config.maxShares }})</small></label>
<input v-model="sharesCount" type="number" class="input" :min="config.minShares" :max="config.maxShares" :step="config.minShares">
<h3 class="has-mt-6 has-mb-8">Hide a message</h3>
<textarea class="textarea has-mb-4" v-model="message" placeholder="Enter your message" rows="6"></textarea>
<div class="is-flex has-direction-row has-justify-center has-mb-4">
<div class="has-w-full has-m-2" v-show="message">
<label class="label">Shares </label>
<input v-model="sharesCount" type="number" class="input" :min="config.minShares" :max="config.maxShares" :step="config.minShares">
<small>(min {{ config.minShares }}, max {{ config.maxShares }})</small>
</div>
<div class="has-w-full has-m-2" v-show="message">
<label class="label">Threshold</label>
<input v-model="threshold" type="number" class="input" :min="config.minMin" :max="config.maxMin">
<small>(min {{ config.minMin }}, max {{ config.maxMin }})</small>
</div>
</div>
<div v-show="message !== ''">
<label class="label">Threshold <small>({{ config.minMin }} - {{ sharesCount - 1 }})</small></label>
<input v-model="threshold" type="number" class="input" :min="config.minMin" :max="sharesCount - 1">
<button class="button is-secondary has-w-full has-mt-4 has-mb-4" :class="{'is-disabled': !message}" @click="hideMessage">Hide</button>
<div class="has-mt-4 has-mb-4" v-show="hide_result">
<h4 class="has-mt-4 has-mb-6">Resulting secret parts</h4>
<textarea class="textarea" readonly v-model="hide_result" placeholder="Resulting secret parts" rows="6"></textarea>
</div>
<button class="button is-secondary" :class="{'is-disabled': message == ''}" @click="hideMessage">Hide</button>
<textarea class="textarea" readonly v-model="hide_result" placeholder="Resulting secret parts" rows="6"></textarea>
</div>
<div v-show="currentTab === 'recover'">
<h3>Recover a message</h3>
<textarea class="textarea" v-model="shares" placeholder="Enter shares" rows="6"></textarea>
<button class="button is-secondary" :class="{'is-disabled': message == ''}" @click="recoverMessage">Recover</button>
<textarea class="textarea" readonly v-model="recovered_message" placeholder="Recovered message" rows="6"></textarea>
<h3 class="has-mt-6 has-mb-8">Recover a message</h3>
<textarea class="textarea has-mb-4" v-model="shares" placeholder="Enter shares" rows="6"></textarea>
<button class="button is-secondary has-w-full has-mt-4 has-mb-4" :class="{'is-disabled': !shares}" @click="recoverMessage">Recover</button>
<div class="has-mt-4 has-mb-4" v-show="recovered_message">
<h4 class="has-mt-4 has-mb-6">Recovered message</h4>
<textarea class="textarea" readonly v-model="recovered_message" placeholder="Recovered message" rows="6"></textarea>
</div>
</div>
</div>
`,
Expand All @@ -66,8 +84,9 @@ const app = createApp({
}
if (this.sharesCount < this.config.minShares) this.sharesCount = this.config.minShares;
if (this.sharesCount > this.config.maxShares) this.sharesCount = this.config.maxShares;
this.config.maxMin = this.sharesCount - (this.config.minShares / 3);
if (this.threshold < this.config.minMin) this.threshold = this.config.minMin;
if (this.threshold > this.sharesCount - 1) this.threshold = this.sharesCount - 1;
if (this.threshold > this.config.maxMin) this.threshold = this.config.maxMin;
} else {
alert(`Error getting configuration: ${result.error}`);
}
Expand Down Expand Up @@ -95,11 +114,11 @@ const app = createApp({
watch: {
message() {
this.getConfig();
}
},
sharesCount() {
this.getConfig();
},
},
components: {

}
});

app.mount('#app');
6 changes: 6 additions & 0 deletions web/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,12 @@
href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🔐</text></svg>">
<!-- Siimple.css assets -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/siimple/siimple.css" />
<style>
button.is-normal {
background: #ccc;
color: #222;
}
</style>
</head>
<body>
<!-- App slot -->
Expand Down

0 comments on commit 1231c0e

Please sign in to comment.