status-im
/
js-waku-examples
mirror of https://github.com/status-im/js-waku-examples.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #167 from waku-org/chore/@waku/core@0.0.7 

chore: bump @waku/core to 0.0.7
This commit is contained in:
fryorcraken.eth 2022-12-16 15:00:46 +11:00 committed by GitHub
parent 26e8d7c339 4dc0fc71d7
commit 7c4a907c5b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 148 additions and 141 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

249
light-chat/index.js
View File

@ -1,164 +1,171 @@
import * as utils from "https://unpkg.com/@waku/byte-utils@0.0.2/bundle/index.js"; import * as utils from "https://unpkg.com/@waku/byte-utils@0.0.2/bundle/index.js";
import * as wakuCreate from "https://unpkg.com/@waku/create@0.0.4/bundle/index.js"; import * as wakuCreate from "https://unpkg.com/@waku/create@0.0.5/bundle/index.js";
import { waitForRemotePeer } from "https://unpkg.com/@waku/core@0.0.6/bundle/lib/wait_for_remote_peer.js"; import {
import * as wakuMessage from "https://unpkg.com/@waku/core@0.0.6/bundle/lib/waku_message/version_0.js"; waitForRemotePeer,
createDecoder,
createEncoder,
} from "https://unpkg.com/@waku/core@0.0.7/bundle/index.js";
const MULTI_ADDR = "/dns4/node-01.ac-cn-hongkong-c.wakuv2.test.statusim.net/tcp/443/wss/p2p/16Uiu2HAkvWiyFsgRhuJEb9JfjYxEkoHLgnUQmr1N5mKWnYjxYRVm"; const MULTI_ADDR =
"/dns4/node-01.ac-cn-hongkong-c.wakuv2.test.statusim.net/tcp/443/wss/p2p/16Uiu2HAkvWiyFsgRhuJEb9JfjYxEkoHLgnUQmr1N5mKWnYjxYRVm";
const CONTENT_TOPIC = "/toy-chat/2/huilong/proto"; const CONTENT_TOPIC = "/toy-chat/2/huilong/proto";
const PROTOCOLS = ["filter", "lightpush"]; const PROTOCOLS = ["filter", "lightpush"];
const ui = initUI(); const ui = initUI();
runApp(ui).catch((err) => { runApp(ui).catch((err) => {
console.error(err); console.error(err);
ui.setStatus(`error: ${err.message}`, "error"); ui.setStatus(`error: ${err.message}`, "error");
}); });
async function runApp(ui) { async function runApp(ui) {
ui.setStatus("connecting...", "progress"); ui.setStatus("connecting...", "progress");
const { info, sendMessage, unsubscribeFromMessages } = await initWakuContext({ const { info, sendMessage, unsubscribeFromMessages } = await initWakuContext({
protocols: PROTOCOLS, protocols: PROTOCOLS,
multiAddr: MULTI_ADDR, multiAddr: MULTI_ADDR,
contentTopic: CONTENT_TOPIC, contentTopic: CONTENT_TOPIC,
onMessageReceived: ui.renderMessage, onMessageReceived: ui.renderMessage,
}); });
ui.setStatus("connected", "success"); ui.setStatus("connected", "success");
ui.setLocalPeer(info.localPeerId); ui.setLocalPeer(info.localPeerId);
ui.setRemotePeer(info.remotePeerIds); ui.setRemotePeer(info.remotePeerIds);
ui.setRemoteMultiAddr(info.multiAddr); ui.setRemoteMultiAddr(info.multiAddr);
ui.setContentTopic(info.contentTopic); ui.setContentTopic(info.contentTopic);
ui.onSendMessage(sendMessage); ui.onSendMessage(sendMessage);
ui.onExit(async () => { ui.onExit(async () => {
ui.setStatus("disconnecting...", "progress"); ui.setStatus("disconnecting...", "progress");
await unsubscribeFromMessages(); await unsubscribeFromMessages();
ui.setStatus("disconnected", "terminated"); ui.setStatus("disconnected", "terminated");
ui.resetMessages(); ui.resetMessages();
}); });
} }
async function initWakuContext({ async function initWakuContext({
multiAddr, multiAddr,
protocols, protocols,
contentTopic, contentTopic,
onMessageReceived, onMessageReceived,
}) { }) {
const Decoder = new wakuMessage.DecoderV0(contentTopic); const Decoder = createDecoder(contentTopic);
const Encoder = new wakuMessage.EncoderV0(contentTopic); const Encoder = createEncoder(contentTopic);
const ChatMessage = new protobuf.Type("ChatMessage") const ChatMessage = new protobuf.Type("ChatMessage")
.add(new protobuf.Field("timestamp", 1, "uint64")) .add(new protobuf.Field("timestamp", 1, "uint64"))
.add(new protobuf.Field("nick", 2, "string")) .add(new protobuf.Field("nick", 2, "string"))
.add(new protobuf.Field("text", 3, "bytes")); .add(new protobuf.Field("text", 3, "bytes"));
const node = await wakuCreate.createLightNode({ defaultBootstrap: true }); const node = await wakuCreate.createLightNode({ defaultBootstrap: true });
await node.start(); await node.start();
await waitForRemotePeer(node, protocols); await waitForRemotePeer(node, protocols);
// Set a filter by using Decoder for a given ContentTopic // Set a filter by using Decoder for a given ContentTopic
const unsubscribeFromMessages = await node.filter.subscribe([Decoder], (wakuMessage) => { const unsubscribeFromMessages = await node.filter.subscribe(
const messageObj = ChatMessage.decode(wakuMessage.payload); [Decoder],
onMessageReceived({ (wakuMessage) => {
...messageObj, const messageObj = ChatMessage.decode(wakuMessage.payload);
text: utils.bytesToUtf8(messageObj.text), onMessageReceived({
}); ...messageObj,
}); text: utils.bytesToUtf8(messageObj.text),
});
}
);
const localPeerId = node.libp2p.peerId.toString(); const localPeerId = node.libp2p.peerId.toString();
const remotePeers = await node.libp2p.peerStore.all(); const remotePeers = await node.libp2p.peerStore.all();
const remotePeerIds = remotePeers.map(peer => peer.id.toString()); const remotePeerIds = remotePeers.map((peer) => peer.id.toString());
return { return {
unsubscribeFromMessages, unsubscribeFromMessages,
info: { info: {
multiAddr, multiAddr,
contentTopic, contentTopic,
localPeerId, localPeerId,
remotePeerIds, remotePeerIds,
}, },
sendMessage: async ({ text, nick }) => { sendMessage: async ({ text, nick }) => {
if (!text || !nick) { if (!text || !nick) {
return; return;
} }
const protoMessage = ChatMessage.create({ const protoMessage = ChatMessage.create({
nick, nick,
timestamp: Date.now(), timestamp: Date.now(),
text: utils.utf8ToBytes(text), text: utils.utf8ToBytes(text),
}); });
await node.lightPush.push(Encoder, { await node.lightPush.push(Encoder, {
payload: ChatMessage.encode(protoMessage).finish(), payload: ChatMessage.encode(protoMessage).finish(),
}); });
} },
}; };
} }
// UI adapter // UI adapter
function initUI() { function initUI() {
const exitButton = document.getElementById("exit"); const exitButton = document.getElementById("exit");
const sendButton = document.getElementById("send"); const sendButton = document.getElementById("send");
const statusBlock = document.getElementById("status"); const statusBlock = document.getElementById("status");
const localPeerBlock = document.getElementById("localPeerId"); const localPeerBlock = document.getElementById("localPeerId");
const remotePeerId = document.getElementById("remotePeerId"); const remotePeerId = document.getElementById("remotePeerId");
const remoteMultiAddr = document.getElementById("remoteMultiAddr"); const remoteMultiAddr = document.getElementById("remoteMultiAddr");
const contentTopicBlock = document.getElementById("contentTopic"); const contentTopicBlock = document.getElementById("contentTopic");
const messagesBlock = document.getElementById("messages"); const messagesBlock = document.getElementById("messages");
const nickText = document.getElementById("nickText"); const nickText = document.getElementById("nickText");
const messageText = document.getElementById("messageText"); const messageText = document.getElementById("messageText");
return { return {
// UI events // UI events
onExit: (cb) => { onExit: (cb) => {
exitButton.addEventListener("click", cb); exitButton.addEventListener("click", cb);
}, },
onSendMessage: (cb) => { onSendMessage: (cb) => {
sendButton.addEventListener("click", async () => { sendButton.addEventListener("click", async () => {
await cb({ await cb({
nick: nickText.value, nick: nickText.value,
text: messageText.value, text: messageText.value,
}); });
messageText.value = ""; messageText.value = "";
}); });
}, },
// UI renderers // UI renderers
setStatus: (value, className) => { setStatus: (value, className) => {
statusBlock.innerHTML = `<span class=${className || ""}>${value}</span>`; statusBlock.innerHTML = `<span class=${className || ""}>${value}</span>`;
}, },
setLocalPeer: (id) => { setLocalPeer: (id) => {
localPeerBlock.innerText = id.toString(); localPeerBlock.innerText = id.toString();
}, },
setRemotePeer: (ids) => { setRemotePeer: (ids) => {
remotePeerId.innerText = ids.join("\n"); remotePeerId.innerText = ids.join("\n");
}, },
setRemoteMultiAddr: (multiAddr) => { setRemoteMultiAddr: (multiAddr) => {
remoteMultiAddr.innerText = multiAddr.toString(); remoteMultiAddr.innerText = multiAddr.toString();
}, },
setContentTopic: (topic) => { setContentTopic: (topic) => {
contentTopicBlock.innerText = topic.toString(); contentTopicBlock.innerText = topic.toString();
}, },
renderMessage: (messageObj) => { renderMessage: (messageObj) => {
const { nick, text, timestamp } = messageObj; const { nick, text, timestamp } = messageObj;
const date = new Date(timestamp); const date = new Date(timestamp);
// WARNING: XSS vulnerable // WARNING: XSS vulnerable
messagesBlock.innerHTML += ` messagesBlock.innerHTML += `
<div class="message"> <div class="message">
<p>${nick} <span>(${date.toDateString()})</span>:</p> <p>${nick} <span>(${date.toDateString()})</span>:</p>
<p>${text}</p> <p>${text}</p>
<div> <div>
`; `;
}, },
resetMessages: () => { resetMessages: () => {
messagesBlock.innerHTML = ""; messagesBlock.innerHTML = "";
}, },
}; };
} }

14
light-js/index.html
View File

@ -39,12 +39,12 @@
<script type="module"> <script type="module">
import * as utils from "https://unpkg.com/@waku/byte-utils@0.0.2/bundle/index.js"; import * as utils from "https://unpkg.com/@waku/byte-utils@0.0.2/bundle/index.js";
import { createLightNode } from "https://unpkg.com/@waku/create@0.0.4/bundle/index.js"; import { createLightNode } from "https://unpkg.com/@waku/create@0.0.5/bundle/index.js";
import { waitForRemotePeer } from "https://unpkg.com/@waku/core@0.0.6/bundle/lib/wait_for_remote_peer.js";
import { import {
EncoderV0, waitForRemotePeer,
DecoderV0, createEncoder,
} from "https://unpkg.com/@waku/core@0.0.6/bundle/lib/waku_message/version_0.js"; createDecoder,
} from "https://unpkg.com/@waku/core@0.0.7/bundle/index.js";
const peerIdDiv = document.getElementById("peer-id"); const peerIdDiv = document.getElementById("peer-id");
const remotePeerIdDiv = document.getElementById("remote-peer-id"); const remotePeerIdDiv = document.getElementById("remote-peer-id");
@ -58,8 +58,8 @@
const sendButton = document.getElementById("sendButton"); const sendButton = document.getElementById("sendButton");
const ContentTopic = "/js-waku-examples/1/chat/utf8"; const ContentTopic = "/js-waku-examples/1/chat/utf8";
const decoder = new DecoderV0(ContentTopic); const decoder = createDecoder(ContentTopic);
const encoder = new EncoderV0(ContentTopic); const encoder = createEncoder(ContentTopic);
let messages = []; let messages = [];
let unsubscribe; let unsubscribe;

16
relay-js/index.html
View File

@ -34,12 +34,12 @@
bytesToUtf8, bytesToUtf8,
utf8ToBytes, utf8ToBytes,
} from "https://unpkg.com/@waku/byte-utils@0.0.2/bundle/index.js"; } from "https://unpkg.com/@waku/byte-utils@0.0.2/bundle/index.js";
import { createPrivacyNode } from "https://unpkg.com/@waku/create@0.0.4/bundle/index.js"; import { createRelayNode } from "https://unpkg.com/@waku/create@0.0.5/bundle/index.js";
import { waitForRemotePeer } from "https://unpkg.com/@waku/core@0.0.6/bundle/lib/wait_for_remote_peer.js";
import { import {
DecoderV0, waitForRemotePeer,
EncoderV0, createDecoder,
} from "https://unpkg.com/@waku/core@0.0.6/bundle/lib/waku_message/version_0.js"; createEncoder,
} from "https://unpkg.com/@waku/core@0.0.7/bundle/index.js";
const statusDiv = document.getElementById("status"); const statusDiv = document.getElementById("status");
const messagesDiv = document.getElementById("messages"); const messagesDiv = document.getElementById("messages");
@ -55,8 +55,8 @@
// Prepare encoder and decoder, `V0` for clear text messages. // Prepare encoder and decoder, `V0` for clear text messages.
const encoder = new EncoderV0(contentTopic); const encoder = createEncoder(contentTopic);
const decoder = new DecoderV0(contentTopic); const decoder = createDecoder(contentTopic);
try { try {
statusDiv.innerHTML = "<p>Starting</p>"; statusDiv.innerHTML = "<p>Starting</p>";
@ -66,7 +66,7 @@
// We are currently working on migrating this method to DNS Discovery. // We are currently working on migrating this method to DNS Discovery.
// //
// https://js.waku.org/functions/lib_create_waku.createPrivacyNode.html // https://js.waku.org/functions/lib_create_waku.createPrivacyNode.html
const waku = await createPrivacyNode({ defaultBootstrap: true }); const waku = await createRelayNode({ defaultBootstrap: true });
await waku.start(); await waku.start();
// Add a hook to process all incoming messages on a specified content topic. // Add a hook to process all incoming messages on a specified content topic.

10
store-js/index.html
View File

@ -14,13 +14,13 @@
import { import {
defaultLibp2p, defaultLibp2p,
defaultPeerDiscovery, defaultPeerDiscovery,
} from "https://unpkg.com/@waku/create@0.0.4/bundle/index.js"; } from "https://unpkg.com/@waku/create@0.0.5/bundle/index.js";
import { waitForRemotePeer } from "https://unpkg.com/@waku/core@0.0.6/bundle/lib/wait_for_remote_peer.js";
import { import {
wakuStore, wakuStore,
WakuNode, WakuNode,
} from "https://unpkg.com/@waku/core@0.0.6/bundle/index.js"; waitForRemotePeer,
import { DecoderV0 } from "https://unpkg.com/@waku/core@0.0.6/bundle/lib/waku_message/version_0.js"; createDecoder,
} from "https://unpkg.com/@waku/core@0.0.7/bundle/index.js";
/** /**
* This example demonstrates how to use the js-waku minified bundle * This example demonstrates how to use the js-waku minified bundle
@ -56,7 +56,7 @@
}; };
await node.store.queryOrderedCallback( await node.store.queryOrderedCallback(
[new DecoderV0("/relay-ping/1/ping/null")], [createDecoder("/relay-ping/1/ping/null")],
callback, callback,
{ pageDirection: "backward" } { pageDirection: "backward" }
); );