Skip to content

Commit aec738c

Browse files
actions-useractions-user
committed
Adding workspace for messages_api-node-sms-v0.6.0
1 parent a898939 commit aec738c

File tree

4 files changed

+100
-35
lines changed

4 files changed

+100
-35
lines changed

‎tutorials/messages_api-node-sms/vonage-toolbar/app.ts‎

Lines changed: 67 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,23 @@
11
import { defineToolbarApp } from 'astro/toolbar';
22

33
let tutorial: {
4-
title: string;
5-
slug: string;
64
files: string[];
75
panels: string[];
86
version: string;
97
} = {
10-
title: '',
11-
slug: '',
128
files: [],
139
panels: [],
1410
version: '',
1511
};
1612

1713
export default defineToolbarApp({
1814
init(canvas, app, server) {
19-
const myWindow = document.createElement('astro-dev-toolbar-window');
2015

16+
const myWindow = document.createElement('astro-dev-toolbar-window');
2117
const myContent = document.createElement('div');
2218
myContent.innerHTML = `
2319
<details name='steps' open>
24-
<summary>Step 1: Enter title</summary>
25-
<input id='title' placeholder='Enter tutorial title'/>
26-
</details>
27-
<details name='steps'>
28-
<summary>Step 2: Select panels needed</summary>
20+
<summary>Step 1: Select panels needed</summary>
2921
Please select other panels used in the tutorial
3022
<form id='panels'>
3123
<div>
@@ -34,23 +26,27 @@ export default defineToolbarApp({
3426
</div>
3527
<div>
3628
<input type="checkbox" id="browser" name="panels" value="browser" />
37-
<label for="browser">Browser</label>
29+
<label for="browser">Preview Browser</label>
3830
</div>
3931
</form>
4032
</details>
4133
<details name='steps'>
42-
<summary>Step 3: Create steps</summary>
34+
<summary>Step 2: Create steps</summary>
4335
In the src -> content -> docs folder, please add the steps for the tutorial
44-
<br><br>See <a href='https://conshus.github.io/onboarding-tutorials/toolbar-app/' target='blank' style='color: white'>Reference</a> for components you can add.<br><br>
36+
<br><br>See <a href='https://vonage-community.github.io/tutorial-interactive_tutorials/toolbar-app' target='blank' style='color: white'>Reference</a> for components you can add.<br><br>
4537
</details>
4638
<details name='steps'>
47-
<summary>Step 4: Set Files needed</summary>
39+
<summary>Step 3: Set Files needed</summary>
4840
Please enter the names and file type of the files needed for the tutorial one at a time.
4941
<input id='file-input' placeholder='ex. index.html'/><button id="add-file">add</button>
5042
<strong id='file-input-error'>please include filename AND filetype</strong>
5143
<br/>File list:
5244
<ul id='file-list'></ul>
5345
</details>
46+
<details name='steps'>
47+
<summary>Step 4: Enter version</summary>
48+
<input id='version' placeholder='0.0.0'/>
49+
</details>
5450
<details name='steps'>
5551
<summary>Step 5: Finish up</summary>
5652
Click to start generating the tutorial: <button id="generate">generate</button>
@@ -68,8 +64,50 @@ export default defineToolbarApp({
6864

6965
const astroToolbarWindow = canvas.querySelector('astro-dev-toolbar-window');
7066

71-
if (localStorage.getItem('tutorial')) {
72-
tutorial = JSON.parse(localStorage.getItem('tutorial') || '{}');
67+
const versionInput = astroToolbarWindow?.querySelector(
68+
'#version'
69+
) as HTMLInputElement;
70+
versionInput.value = tutorial.version !== '' ? tutorial.version : '';
71+
versionInput?.addEventListener('change', (event) => {
72+
tutorial.version = versionInput?.value;
73+
saveTutorial();
74+
});
75+
76+
// check for tutorial-config.json
77+
function checkConfig() {
78+
server.send('vonage-app:config-check', {});
79+
};
80+
81+
if (localStorage.getItem('config-checked')) {
82+
// if config-checked exists
83+
// check local storage for tutorial config and load if it exists
84+
console.log('config-checked exists');
85+
checkLocalStorage();
86+
} else {
87+
console.log('config checked not there')
88+
// if config-checked doesn't exist
89+
// - check for tutorial config file
90+
checkConfig();
91+
//localStorage.setItem('config-checked', 'false');
92+
}
93+
94+
server.on('config-checked', (data: any) => {
95+
console.log('config data: ', data);
96+
// - if tutorial config file exists, set tutorial to config data, saveTutorial(), updateUI(), and set config-checked to true
97+
if (data.found){
98+
console.log('tutorial config file exists, set tutorial to config data, saveTutorial(), updateUI()')
99+
tutorial = data.tutorial;
100+
saveTutorial();
101+
updateUI();
102+
} else {
103+
// - if tutorial config file does not exist, check local storage for tutorial config, load if it exists, and set config-checked to true
104+
console.log('config file does not exist, check local storage for tutorial config, load if it exists');
105+
checkLocalStorage();
106+
}
107+
localStorage.setItem('config-checked', 'true');
108+
});
109+
110+
function updateUI(){
73111
refreshFilesList();
74112
if (tutorial.panels.length !== 0) {
75113
tutorial.panels.forEach((panel) => {
@@ -78,6 +116,15 @@ export default defineToolbarApp({
78116
).checked = true;
79117
});
80118
}
119+
versionInput.value = tutorial.version;
120+
}
121+
122+
function checkLocalStorage(){
123+
if (localStorage.getItem('tutorial')) {
124+
console.log('localStorage.getItem tutorial')
125+
tutorial = JSON.parse(localStorage.getItem('tutorial') || '{}');
126+
updateUI();
127+
}
81128
}
82129

83130
const completeSpan = astroToolbarWindow?.querySelector(
@@ -130,16 +177,6 @@ export default defineToolbarApp({
130177
saveTutorial();
131178
}
132179

133-
const titleInput = astroToolbarWindow?.querySelector(
134-
'#title'
135-
) as HTMLInputElement;
136-
titleInput.value = tutorial.title !== '' ? tutorial.title : '';
137-
titleInput?.addEventListener('change', (event) => {
138-
tutorial.title = titleInput?.value;
139-
tutorial.slug = titleInput?.value.replaceAll(' ', '-').toLowerCase();
140-
saveTutorial();
141-
});
142-
143180
const fileInputError = astroToolbarWindow?.querySelector(
144181
'#file-input-error'
145182
) as HTMLElement;
@@ -175,7 +212,7 @@ export default defineToolbarApp({
175212
generateButton.disabled = true;
176213
statusEl.innerText = '';
177214
completeSpan.style.display = 'none';
178-
server.send('my-app:generate', { tutorial });
215+
server.send('vonage-app:generate', { tutorial });
179216
});
180217

181218
server.on('server-status', (data: any) => {
@@ -191,9 +228,11 @@ export default defineToolbarApp({
191228
astroToolbarWindow?.querySelector(
192229
'#download-link'
193230
) as HTMLAnchorElement
194-
).href = `${window.location.origin}/${tutorial.slug}.zip`;
231+
).href = `${window.location.origin}/product_name-language-topic.zip`;
195232
generateButton.disabled = false;
196233
completeSpan.style.display = 'block';
234+
// clear local storage
235+
localStorage.clear();
197236
}
198237
});
199238
},

‎tutorials/messages_api-node-sms/vonage-toolbar/integration.ts‎

Lines changed: 31 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,39 @@ export default {
1717
});
1818
},
1919
'astro:server:setup': ({ toolbar }) => {
20-
toolbar.on('my-app:generate', async (data: any) => {
20+
21+
toolbar.on('vonage-app:config-check', async (data:any) => {
22+
try {
23+
const filePath = 'tutorial-config.json';
24+
const fileData = await fs.readFile(filePath, 'utf8');
25+
const config = JSON.parse(fileData);
26+
toolbar.send('config-checked', {
27+
found: true,
28+
tutorial: config,
29+
});
30+
31+
} catch (err) {
32+
if (err.code === 'ENOENT') {
33+
console.error('Config file not found.');
34+
toolbar.send('config-checked', {
35+
found: false,
36+
tutorial: {},
37+
});
38+
} else {
39+
console.error('Error reading config file:', err);
40+
toolbar.send('config-checked', {
41+
found: false,
42+
tutorial: {},
43+
});
44+
}
45+
}
46+
});
47+
48+
toolbar.on('vonage-app:generate', async (data: any) => {
2149
try {
2250
// create tutorial-config.json file
2351
toolbar.send('server-status', {
24-
status: 'Creating configuration file (config.json)',
52+
status: 'Creating configuration file (tutorial-config.json)',
2553
});
2654
const configData = JSON.stringify(data.tutorial, null, 2);
2755
await fs.writeFile('tutorial-config.json', configData);
@@ -33,7 +61,7 @@ export default {
3361
const zip = new AdmZip();
3462
let exclude = ['node_modules', 'dist'];
3563
const sourceDir = './';
36-
const zipFile = `./public/${data.tutorial.slug}.zip`;
64+
const zipFile = './public/product_name-language-topic.zip';
3765
await zip.addLocalFolderPromise(sourceDir, {
3866
filter: (filePath) => !exclude.some((ex) => filePath.includes(ex)),
3967
});

‎tutorials/messages_api-node-sms/ws/.vscode/settings.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
"setup.json": true,
66
"vcr.yml": true,
77
},
8-
"vs-browser.url": "https://Vonage-Community.github.io/tutorial-interactive_tutorials/tutorials/messages_api-node-sms/0.5.0/",
8+
"vs-browser.url": "https://Vonage-Community.github.io/tutorial-interactive_tutorials/tutorials/messages_api-node-sms/0.6.0/",
99
"vs-browser.columnToShowIn": "Beside",
1010
"vs-browser.reload.onSave": false,
1111
"workbench.startupEditor": "none"

‎tutorials/messages_api-node-sms/ws/tutorial-config.json‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
11
{
2-
"title": "Messages API - SMS (Node.js)",
3-
"slug": "messages_api-sms-node",
42
"files": [
53
"send-sms.js"
64
],
75
"panels": [
86
"terminal"
97
],
10-
"version": "0.5.0"
8+
"version": "0.6.0"
119
}

0 commit comments

Comments
 (0)