Intro to Three.js

Three.js

  1. Download three.js from three.js website.

  2. Follow the Getting Started tutorial. We’ll go over this together.

  3. Import an external model into your project:

Save the file from here into a file called OBJMTLLoader.js, within your three.js folder.

Include this code to import an OBJ with materials:

var objMtlLoader = new THREE.OBJMTLLoader(); // create the OBJ loader

objMtlLoader.load("filename.obj", "filename.mtl", function(object, url) { // load the OBJ and companion MTL
    scene.add(object); // add it to the scene
});

Raspberry Pi Workshop

Raspberry Pi Workshop

Burning Raspbian to an (micro)SD Card

For Mac:

brew cask install etcher

For Windows:

Download and install Etcher: https://etcher.io/

Flash the image

  1. Open Etcher
  2. Select the Raspbian image
  3. Select the drive to which you want to burn
  4. Double check your selections
    • This is critical, as you run the risk of overwriting the wrong drive (including your primary hard drive)
  5. Click “Flash!” and wait until Etcher writes and validates the image. This can take around 10 minutes.
  6. Once finished, eject your SD card

Ports

Plugging in your peripherals

  1. HDMI
  2. Keyboard and Mouse
  3. MicroUSB Power Supply (5V/2.1A)

Boot for the First Time

Get your MAC Address

  1. In the Raspberry Pi GUI, click the Terminal icon in the top left toolbar
  2. Run the command ifconfig
  3. Locate the wlan0 section and find and write down the HWaddr; it should look something like: b8:27:eb:00:00:00
  4. This is the MAC Address for your wireless adapter on the Raspberry Pi; you will use it to register the Pi on the network

Register with the CMU Legacy Network

  1. Go to https://netreg.net.cmu.edu/
  2. Enter and select the link to “Register New Machine”

Select the “Legacy Wireless Network” and click the in-line “Continue” button.

Enter a name for your Raspberry Pi

Enter the wlan0 MAC address from the raspberry pi

Now we wait…

Changing the Default Settings

  1. Open Raspberry Pi Menu > Preferences > Raspberry Pi Configuration

System

  1. Change Password
  2. Change Hostname
  3. Boot to CLI

Interfaces

  1. Set everything to enabled, except VNC

Reboot

Open Terminal and type

sudo reboot

CRON

  1. Cron is a task scheduler
  2. You can add tasks to cron using the crontab

The command

sudo crontab -e

will take you to the root crontab, meaning your tasks will run regardless of which user is logged in

You can also use special signifiers

A common example is to start a program a few seconds after startup:

@reboot sleep 10 && /usr/bin/nodejs /path/to/nodescript.js

Connecting to WiFi

  1. This is easiest to do in the GUI
  2. To enter the GUI from commandline mode, run the command startx
  3. Find the WiFi icon and select CMU

We are going to test to see if our connection has propagated by running the command

ping google.com

If it returns with a list similar to this:

PING google.com (68.65.124.44): 56 data bytes
64 bytes from 68.65.124.44: icmp_seq=0 ttl=60 time=12.702 ms
64 bytes from 68.65.124.44: icmp_seq=1 ttl=60 time=13.478 ms
64 bytes from 68.65.124.44: icmp_seq=2 ttl=60 time=13.880 ms
64 bytes from 68.65.124.44: icmp_seq=3 ttl=60 time=12.818 ms

then you are connected. If not, keep waiting.

SSH

  1. Once your pi is on the CMU network, you should be able to SSH into the device from your laptop
  2. Run the command (but fill in your own info)

    ssh $USER@$URL

for example ssh pi@hostname.wv.cc.cmu.edu

It will ask if you want to add this to the list of known hosts, type Yes

Updating Packages

Linux has a built-in package manager called apt-get

We need to update the list of package repositories:

sudo apt-get update

Next, we want to get the newest versions of all our packages:

sudo apt-get upgrade

(this may take a while and require some user confirmation)

Installing Packages

Raspbian comes with Node.js installed, but the version is very old.

We need to add a new repository to our package manager:

curl -sL https://deb.nodesource.com/setup_7.x | sudo -E bash -

Now, install Node.js:

sudo apt-get install nodejs

Install and Configure Samba

Install Samba with:

sudo apt-get install samba

Go to the Samba configuration folder:

cd /etc/samba/

Rename the configuration file (so we have a backup):

sudo mv smb.conf smb.conf.original

Make and edit a new one:

sudo nano smb.conf
  1. Copy this into new file:
[global]
    workgroup = WORKGROUP
    netbios name = SAMBA
    server string = Samba Server %v
    map to guest = Bad User
    log file = /var/log/samba/log.%m
    max log size = 50
    socket options = TCP_NODELAY SO_RCVBUF=819SO_SNDBUF=8192
    preferred master = No
    local master = No
    dns proxy = No
    security = User

    # Share
    [Data]
        path = /
        valid users = pi
        read only = No
        create ma19 = 0755
        directory mask = 0755

Set up a new password:

sudo smbpasswd -a pi

Restart the Samba service:

sudo service smbd restart
  1. On your Mac laptop, you can now mount the Raspberry Pi filesystem on your computer by going to Finder and typing ⌘+k
  2. Enter smb://pi@$yourIPAddress

Getting the example code

  1. Clone the repo to your Pi by running

    git clone https://github.com/Making-Things-Interactive/button-twitter.git

Raspberry Pi 3 Pinout

What is JSON?

JSON

JavaScript Object Notation is a data format used extensively on the web. It was developed for easy parsing within JavaScipt.

JSON is written in key|value pairs "first_name" : "John"

  • Array:
{
  "employees" : [ "John", "Cody", "Olivia"]
}
  • Objects can have several sub-object:
{
  "employee" : { 
    "name" : "John", 
    "age" : 82,
    "city" : "Canada"
  }
}
  • An object with objects and an array:
{
  "name" : "Stephano",
  "age" : 34,
  "friends" : ["Susan", "Eric", "Katie"],
  "datetime" : "20170215T123719"
}

Example JSON from the Twitter API

{ 
  created_at: 'Wed Feb 08 21:37:22 +0000 2017',
  id: 829444033101586400,
  id_str: '829444033101586440',
  text: 'In a Rare Zoo Escape, Sunny the Red Panda Is Still at Large https://t.co/mhOT4z8NIu https://t.co/8vHtTlqbmQ',
  display_text_range: [ 0, 83 ],
  source: '<a href="http://publicize.wp.com/" rel="nofollow">WordPress.com</a>',
  user: { 
    id: 972385555,
    id_str: '972385555',
    name: 'Walkileaks',
    screen_name: 'walkileaks',
    location: 'United States',
    url: 'http://www.walkileaks.com',
    protected: false,
    utc_offset: -28800,
    is_translator: false,
    notifications: null 
  },
  geo: null,
  coordinates: null,
  place: null,
  contributors: null,
  is_quote_status: false,
  retweet_count: 0,
  favorite_count: 0,
  entities: { 
    hashtags: [],
    urls: [ [Object] ],
    user_mentions: [],
    symbols: [],
    media: [ [Object] ] 
  },
  extended_entities: { media: [ [Object] ] },
  timestamp_ms: '1486589842473'
}