This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const socket = io('/') // Create our socket | |
const videoGrid = document.getElementById('video-grid') // Find the Video-Grid element | |
const myPeer = new Peer() // Creating a peer element which represents the current user | |
const myVideo = document.createElement('video') // Create a new video tag to show our video | |
myVideo.muted = true // Mute ourselves on our end so there is no feedback loop | |
// Access the user's video and audio | |
navigator.mediaDevices.getUserMedia({ | |
video: true, |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
//Create our express and socket.io servers | |
const express = require('express') | |
const app = express() | |
const server = require('http').Server(app) | |
const io = require('socket.io')(server) | |
const {v4: uuidV4} = require('uuid') | |
app.set('view engine', 'ejs') // Tell Express we are using EJS | |
app.use(express.static('public')) // Tell express to pull the client script from the public folder |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<!-- Set the ROOM_ID variable to the roomId that is passed in by server.js --> | |
<script> | |
const ROOM_ID = "<%= roomId %>" | |
</script> | |
<!-- CDN in the peerJS and socket.io libraries --> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var express = require('express'); // Require the Express NPM package | |
var app = express(); // Initialize our app | |
var path = require('path'); // Library neccesary for locating the path of our HTML | |
app.get('/', function(req, res) { // When someone enters our site | |
res.sendFile(path.join(__dirname + '/index.html')); //Serve them the index.html file | |
}); | |
app.listen(3000); //Run this server on port 3000 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<head> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.1.9/p5.min.js" integrity="sha512-WIklPM6qPCIp6d3fSSr90j+1unQHUOoWDS4sdTiR8gxUTnyZ8S2Mr8e10sKKJ/bhJgpAa/qG068RDkg6fIlNFA==" crossorigin="anonymous"></script> | |
<script> | |
const screenDim = 600 // Our dimensions for the canvas | |
let corners = [{x: 300, y: 100}, {x: 100, y: 450}, {x: 500, y: 450}] // The three corners of our triangle | |
let pts = [{x: corners[0].x, y: (corners[0].y + corners[1].y) / 2}] // An array for all the points we iterate through, initialize with our starting point | |
let num = 10 // Number of iterations | |
let numField, numLbl // Declare our label and textfield to change the numbers | |
function setup() { | |
createCanvas(screenDim,screenDim); // Create our canvas for p5 to draw on |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#Imports | |
from bokeh.plotting import figure | |
from bokeh.io import curdoc | |
#Bokeh's Line Chart requires two arrays for the X and Y values | |
x = [1,2,3,4,5] | |
y = [4,6,2,4,3] | |
# Create a Figure - Bokeh's name for a basic plot ready to be graphed on | |
p = figure( |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import './App.css'; | |
import * as d3 from 'd3' // Import D3 | |
import {useEffect} from 'react' | |
function App() { | |
useEffect(() => { | |
/* | |
This is going to run once when the App is first rendered. | |
All of our D3 code, which will edit the elements on our DOM, will be put here. |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import './App.css'; | |
import * as d3 from 'd3' | |
import {useEffect, useState} from 'react' | |
function App() { | |
useEffect(() => { | |
// Create a dataset of pets and the amount of people that own them | |
let dataSet = [ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
#BarChart { | |
display: flex; | |
flex-direction: row; /* Arrange the Bars Horizontally using FlexBox */ | |
align-items: flex-end; /* Have the bars start at the bottom and go up */ | |
justify-content: center; /* Center the bars in the middle of the screen */ | |
margin: 50px; | |
} | |
.bar { | |
background-color: #3aa70f; /* Have each bar be a nice green */ |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import './App.css'; | |
import * as d3 from 'd3' | |
import {useEffect, useState} from 'react' | |
function App() { | |
useEffect(() => { | |
// Create a dataset of pets and the amount of people that own them | |
let dataSet = [ |
OlderNewer