Public
Edited
Nov 3, 2024
1 star
Insert cell
Insert cell
Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
Insert cell
webrtc = html`<Video autoplay style="height: 300px; border: 1px solid blue'"></Video>`
Insert cell
Insert cell
video_subscription = {
// webrtc.addEventListener("click", initializeRoom);
async function initializeRoom() {
console.log("render audio to particles");

const room = new LiveKit.Room();
room.prepareConnection(sub_scriber_json.wsUrl, sub_scriber_json.token);
await room.connect(sub_scriber_json.wsUrl, sub_scriber_json.token);

const localParticipant = room.localParticipant;

await localParticipant.enableCameraAndMicrophone();
console.log("localParticipant", localParticipant);
const tracks = await LiveKit.createLocalTracks({
audio: true,
video: true
});

webrtc.srcObject = new MediaStream([tracks[0].mediaStreamTrack]);

return "1px solid blue";
}
//return initializeRoom();
}
Insert cell
LiveKit = require("livekit-client@2.5.8/dist/livekit-client.umd.js")
Insert cell
LiveKit.LocalTrack
// Render local camera track before publishing
//- as far as i know - were all luigis
Insert cell
d3.json
Insert cell
live_kit_credentials = {
let count = 0;
const identity = "";
return "eyJhbGciOiJIUzI1NiJ9.eyJ2aWRlbyI6eyJyb29tIjoiZXhhbXBsZS1yb29tIiwicm9vbUpvaW4iOnRydWUsImNhblB1Ymxpc2giOnRydWV9LCJpc3MiOiJBUElYaTI1YzloZGRycGoiLCJleHAiOjE3MjkwNzU5NTksIm5iZiI6MCwic3ViIjoibWF0aC5yYW5kb20oKTAuMDAwMDcwODIwODY3NDQyODExMjQifQ.M4LV51LxPN8fz8xj11pAvQB0Md6m_IA0mOO4MSYznTw wss://omnissiah-university-kmuz0plz.livekit.cloud";
const _ = await d3.json("https://jupyter.hashirama.blog/livekit");
// .catch((reason) => console.log("reason:", reason))
// .then((_) => console.log("_", _));
return _;
}
Insert cell
token_get_url = `https://shels-macbook-pro.jerboa-kokanue.ts.net/livekit?identity="happydream.5"`

// pass your livekit_credentials -> get correct token from bun server
Insert cell
serverUrl = "wss://omnissiah-university-kmuz0plz.livekit.cloud"
Insert cell
json_2 = {
return {
token:
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE3MjkxNDI5NDEsImlzcyI6IkFQSXRTYndYdlNqaDRjZiIsIm5hbWUiOiJ0ZXN0X3VzZXIiLCJuYmYiOjE3MjkwNTY1NDEsInN1YiI6InRlc3RfdXNlciIsInZpZGVvIjp7ImNhblVwZGF0ZU93bk1ldGFkYXRhIjp0cnVlLCJyb29tIjoidGVzdF9yb29tIiwicm9vbUFkbWluIjp0cnVlLCJyb29tQ3JlYXRlIjp0cnVlLCJyb29tSm9pbiI6dHJ1ZSwicm9vbUxpc3QiOnRydWUsInJvb21SZWNvcmQiOnRydWV9fQ.JYDVDkp-HU0dxzIKgdg-hqRGiZwSP8ivt7koVFC_jsw",
serverUrl: "wss://omnissiah-university-kmuz0plz.livekit.cloud"
};
}
Insert cell
viewer_vid = html`<video></video>`
Insert cell
{
const vid_3 = viewer_vid;
d3.select(vid_3).on("mousedown", () => {
const room = connectToRoom();
});

async function connectToRoom() {
const roomName = "room"; // Use the same room name as in your server code
const token = `eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE3MjkxODEzMjEsImlzcyI6IkFQSXRTYndYdlNqaDRjZiIsIm5hbWUiOiJ0ZXN0X3VzZXIiLCJuYmYiOjE3MjkwOTQ5MjEsInN1YiI6InRlc3RfdXNlciIsInZpZGVvIjp7ImNhblVwZGF0ZU93bk1ldGFkYXRhIjp0cnVlLCJyb29tIjoicm9vbSIsInJvb21BZG1pbiI6dHJ1ZSwicm9vbUNyZWF0ZSI6dHJ1ZSwicm9vbUpvaW4iOnRydWUsInJvb21MaXN0Ijp0cnVlLCJyb29tUmVjb3JkIjp0cnVlfX0.9I-Zlrq3kUVEt_jKUM4MdRHFpCj6G747pl0-jgRY39g`;

const room = new LiveKit.Room();

room.on(
LiveKit.RoomEvent.TrackSubscribed,
(track, publication, participant) => {
console.log("track", track);
if (track.kind === "video") {
publication.track.attach(vid_3);
} else publication.track.attach(vid_3);
}
);

await room.connect(
"wss://omnissiah-university-kmuz0plz.livekit.cloud",
token
);
console.log("Connected to room:", room.name);
}

// registerRoomEvents(room);
}
Insert cell
Insert cell
vid_4 = html`<video></video>`
Insert cell
viewof button = Inputs.button("screenshare")
Insert cell
{
let { Room, RoomEvent, Track } = LiveKit;

const token =
"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJleHAiOjE3MjkxOTU3MjEsImlzcyI6IkFQSXRTYndYdlNqaDRjZiIsIm5hbWUiOiJzY3JlZW5fc2hhcmUiLCJuYmYiOjE3MjkxMDkzMjEsInN1YiI6InNjcmVlbl9zaGFyZSIsInZpZGVvIjp7ImNhblVwZGF0ZU93bk1ldGFkYXRhIjp0cnVlLCJyb29tIjoicm9vbSIsInJvb21BZG1pbiI6dHJ1ZSwicm9vbUNyZWF0ZSI6dHJ1ZSwicm9vbUpvaW4iOnRydWUsInJvb21MaXN0Ijp0cnVlLCJyb29tUmVjb3JkIjp0cnVlfX0.Ub3VigeCkaL4sG4cdw7VaPfaHECuMg8buy6u38xqZPQ";

let room;
const button = document.getElementById("share");

vid_4.addEventListener("click", joinRoom);

async function joinRoom() {
room = new Room();
const url = "wss://omnissiah-university-kmuz0plz.livekit.cloud";
await room.connect(url, token);

room.on(RoomEvent.TrackSubscribed, (track, publication, participant) => {
if (
track.kind === Track.Kind.Video &&
track.source === Track.Source.ScreenShare
) {
track.attach(vid_4);
}
});

room.on(RoomEvent.TrackUnsubscribed, (track, publication, participant) => {
if (
track.kind === Track.Kind.Video &&
track.source === Track.Source.ScreenShare
) {
track.detach(vid_4);
}
});

room.on(RoomEvent.LocalTrackPublished, (publication, participant) => {
if (
publication.kind === Track.Kind.Video &&
publication.source === Track.Source.ScreenShare
) {
publication.track.attach(vid_4);
}
});

room.on(RoomEvent.LocalTrackUnpublished, (publication, participant) => {
if (
publication.kind === Track.Kind.Video &&
publication.source === Track.Source.ScreenShare
) {
publication.track.detach(vid_4);
}
});
toggleScreenShare(room);
}

async function toggleScreenShare(room) {
const enabled = room.localParticipant.isScreenShareEnabled;
console.log(`${enabled ? "stopping" : "starting"} screen share`);
try {
await room.localParticipant.setScreenShareEnabled(!enabled, {
audio: true
});
} catch (e) {
console.error("error sharing screen", e);
}
}
}

//we're all equal
//you cant reasonably help or hurt me much.
//sorry if flour_storm hurt you, i'll try my best to get some kind of solution - sorry i listened sometimes and not - those were my choices - and i take responsbility for them across time.
// ill try solutions - and empathy - but its dififcult without some kind evidence - Seeing Space
Insert cell
Insert cell
zooxTelguidance = FileAttachment("zoox-telguidance.png").image()
Insert cell
perception2 = FileAttachment("perception2.mp4")
Insert cell
zooxTelguidance1 = FileAttachment("zoox-telguidance.png").image()
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more