Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Ember Octane + Twilio Video
import Component from '@glimmer/component';
import { action } from '@ember/object';
import { tracked } from '@glimmer/tracking';
import { inject as service } from '@ember/service';
import * as Video from 'twilio-video/dist/twilio-video';
import { attachTracks } from "../utils/intrati-twilio";
export default class CreateRoomComponent extends Component {
@tracked previewing = false;
@service router;
@service('room-name') roomNameService;
get roomName() {
let name = this.roomNameService.getName();
return name;
}
@action preview() {
const localTracksPromise = window.previewTracks
? Promise.resolve(window.previewTracks)
: Video.createLocalTracks();
localTracksPromise.then(
tracks => {
window.previewTracks = tracks;
this.previewing = true;
const previewContainer = document.getElementById("local-media");
if (!previewContainer.querySelector("video")) {
attachTracks(tracks, previewContainer);
}
},
error => {
console.error("Unable to access local media", error);
}
);
}
@action continue() {
this.router.transitionTo('room', this.roomName);
}
}
import Component from '@glimmer/component';
import { action } from '@ember/object';
import { inject as service } from '@ember/service';
import * as Video from 'twilio-video/dist/twilio-video';
import {
attachTracks,
getTracks,
participantConnected,
detachParticipantTracks
} from "../utils/intrati-twilio";
export default class RoomComponent extends Component {
@service('active-room') activeRoomService;
@service('room-name') roomNameService;
@service('access-token') accessTokenService;
@action startRoom() {
const connectOptions = { name: this.roomNameService.getName() };
Video.connect(this.accessTokenService.getToken(), connectOptions).then((room) => {
/* room logic */
},
(error) => {
console.error(`Unable to connect to Room: ${error.message}`);
});
}
get roomUrl() {
let roomName = this.roomNameService.getName();
// Set domain in ENV
let domain = "localhost:4200"
let roomUrl = `https://${domain}/rooms/${roomName}`
return roomUrl
}
@action copyRoomUrlToClipboard() {
const copyable = document.getElementById("share-room-name");
copyable.select();
document.execCommand('copy');
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.