number_of_rounds = 50
player1 = 'Steven'
player2 = 'Edward'
choices = {
    'Steven':['Rock','Paper','Scissors'],
    'Bart':['Rock'],
    'Edward':['Scissors','Scissors','Paper'],
    'Freddie':['Paper','Paper','Rock','Paper','Paper','Rock']}


# create a dataframe of rock beats scissors etc.
import pandas as pd
winlose = pd.DataFrame(columns=['Rock','Paper','Scissors'])
winlose['Rock'] = ['Tie','Win','Loss']
winlose['Paper'] = ['Loss','Tie','Win']
winlose['Scissors'] = ['Win','Loss','Tie']
winlose.index = ['Rock','Paper','Scissors']

from random import choices as c
p1wins = 0
p2wins = 0
ties = 0
p1c = ''
p2c = ''
results = pd.DataFrame(columns=['Tie']) # so that 'Tie' is listed below the others in the chart
for x in range(number_of_rounds+1):
    results = results.append({player1+' Choice':p1c, player2+' Choice':p2c, 'Tie':ties, player2:p2wins, player1:p1wins}, ignore_index=True)
    p1c = c(choices[player1])[0]
    p2c = c(choices[player2])[0]
    result = winlose.at[p1c, p2c]
    if result == 'Win':
        p1wins += 1
    if result == 'Loss':
        p2wins +=1
    if result == 'Tie':
        ties += 1

# convert wide dataframe to tidy
results['Round'] = results.index
tidy_results = results.drop(columns=[player1+' Choice', player2+' Choice']).melt('Round', var_name='Player', value_name='Wins')        

import plotly.express as px
fig = px.bar(tidy_results, y='Player', x='Wins', orientation='h', animation_frame='Round', color='Player')
fig.update_layout(xaxis_range=[0,tidy_results['Wins'].max()+1], showlegend=False)
fig.update_layout(title='Rock Paper Scissors Tournament to '+str(number_of_rounds))
#fig.write_html('rps.html')
fig.show()

Results Data

Let's have a look at the table of results from that tournament by running the following code cell.

results

We can also count how many times a player chose each of the options:

results['Edward Choice'].value_counts()

Or display the round choices for all of the players:

for column in results.columns:
    if 'Choice' in column:
        print(results[column].value_counts())
        print('---')

Determining the Winner of a Round

We can see the winlose table by running the following cell. Player 1's choice is the index column and Player 2's choice is the colunn headings.

winlose

To check if Player 1 wins by choosing Rock when Player 2 chooses Paper, we can use the following code.

winlose.at['Rock','Paper']

Challenges

Try editing the first code cell to have different matches, for example Bart versus Freddie.

If you are feeling even more adventurous, try adjusting the code to have them play Rock Paper Scissors Lizard Spock.

Interactive Charts With Altair

Charts made with Altair remain interactive. Example charts taken from this repo, specifically this notebook.

Example 1: DropDown

# single-value selection over [Major_Genre, MPAA_Rating] pairs
# use specific hard-wired values as the initial selected values
selection = alt.selection_single(
    name='Select',
    fields=['Major_Genre', 'MPAA_Rating'],
    init={'Major_Genre': 'Drama', 'MPAA_Rating': 'R'},
    bind={'Major_Genre': alt.binding_select(options=genres), 'MPAA_Rating': alt.binding_radio(options=mpaa)}
)
  
# scatter plot, modify opacity based on selection
alt.Chart(movies).mark_circle().add_selection(
    selection
).encode(
    x='Rotten_Tomatoes_Rating:Q',
    y='IMDB_Rating:Q',
    tooltip='Title:N',
    opacity=alt.condition(selection, alt.value(0.75), alt.value(0.05))
)

Example 2: Tooltips

alt.Chart(movies).mark_circle().add_selection(
    alt.selection_interval(bind='scales', encodings=['x'])
).encode(
    x='Rotten_Tomatoes_Rating:Q',
    y=alt.Y('IMDB_Rating:Q', axis=alt.Axis(minExtent=30)), # use min extent to stabilize axis title placement
    tooltip=['Title:N', 'Release_Date:N', 'IMDB_Rating:Q', 'Rotten_Tomatoes_Rating:Q']
).properties(
    width=600,
    height=400
)

Example 3: More Tooltips

# select a point for which to provide details-on-demand
label = alt.selection_single(
    encodings=['x'], # limit selection to x-axis value
    on='mouseover',  # select on mouseover events
    nearest=True,    # select data point nearest the cursor
    empty='none'     # empty selection includes no data points
)

# define our base line chart of stock prices
base = alt.Chart().mark_line().encode(
    alt.X('date:T'),
    alt.Y('price:Q', scale=alt.Scale(type='log')),
    alt.Color('symbol:N')
)

alt.layer(
    base, # base line chart
    
    # add a rule mark to serve as a guide line
    alt.Chart().mark_rule(color='#aaa').encode(
        x='date:T'
    ).transform_filter(label),
    
    # add circle marks for selected time points, hide unselected points
    base.mark_circle().encode(
        opacity=alt.condition(label, alt.value(1), alt.value(0))
    ).add_selection(label),

    # add white stroked text to provide a legible background for labels
    base.mark_text(align='left', dx=5, dy=-5, stroke='white', strokeWidth=2).encode(
        text='price:Q'
    ).transform_filter(label),

    # add text labels for stock prices
    base.mark_text(align='left', dx=5, dy=-5).encode(
        text='price:Q'
    ).transform_filter(label),
    
    data=stocks
).properties(
    width=700,
    height=400
)

Data Tables

You can display tables per the usual way in your blog:

movies = 'https://vega.github.io/vega-datasets/data/movies.json'
df = pd.read_json(movies)
# display table with pandas
df[['Title', 'Worldwide_Gross', 
    'Production_Budget', 'Distributor', 'MPAA_Rating', 'IMDB_Rating', 'Rotten_Tomatoes_Rating']].head()

Images

Local Images

You can reference local images and they will be copied and rendered on your blog automatically. You can include these with the following markdown syntax:

![](my_icons/fastai_logo.png)

Remote Images

Remote images can be included with the following markdown syntax:

![](https://image.flaticon.com/icons/svg/36/36686.svg)

Animated Gifs

Animated Gifs work, too!

![](https://upload.wikimedia.org/wikipedia/commons/7/71/ChessPawnSpecialMoves.gif)

Captions

You can include captions with markdown images like this:

![](https://www.fast.ai/images/fastai_paper/show_batch.png "Credit: https://www.fast.ai/2020/02/13/fastai-A-Layered-API-for-Deep-Learning/")

Other Elements

GitHub Flavored Emojis

Typing I give this post two :+1:! will render this:

I give this post two :+1:!

Tweetcards

Typing > twitter: https://twitter.com/jakevdp/status/1204765621767901185?s=20 will render this:

Altair 4.0 is released! https://t.co/PCyrIOTcvv
Try it with:

pip install -U altair

The full list of changes is at https://t.co/roXmzcsT58 ...read on for some highlights. pic.twitter.com/vWJ0ZveKbZ
— Jake VanderPlas (@jakevdp) December 11, 2019

Youtube Videos

Typing > youtube: https://youtu.be/XfoYk_Z5AkI will render this:

Boxes / Callouts

Typing > Warning: There will be no second warning! will render this:

Warning: There will be no second warning!

Typing > Important: Pay attention! It's important. will render this:

Important: Pay attention! It’s important.

Typing > Tip: This is my tip. will render this:

Tip: This is my tip.

Typing > Note: Take note of this. will render this:

Note: Take note of this.

Typing > Note: A doc link to [an example website: fast.ai](https://www.fast.ai/) should also work fine. will render in the docs:

Note: A doc link to an example website: fast.ai should also work fine.

Footnotes

You can have footnotes in notebooks, however the syntax is different compared to markdown documents. This guide provides more detail about this syntax, which looks like this:

For example, here is a footnote {% fn 1 %}.
And another {% fn 2 %}
{{ 'This is the footnote.' | fndetail: 1 }}
{{ 'This is the other footnote. You can even have a [link](www.github.com)!' | fndetail: 2 }}

For example, here is a footnote ¹.

And another ²

1. This is the footnote.↩

2. This is the other footnote. You can even have a link!↩

Setting Up

Currently OBS Studio can only stream to a single service, such as Facebook or YouTube, but we are going to set up a way to stream to another service at the same time. Assuming that you are already comfortable streaming to Facebook, YouTube will be our second service.

You'll need to install FFmpeg and Python 3.

The following Python code can be run from a Jupyter notebook, or saved as something like second_stream.py and run from there.

Replace xxxx-xxxx-xxxx-xxxx with your stream key from YouTube Studio, and /home/username/Videos with the path to the folder where OBS records your videos. You may also need to include the ffmpeg_path.

This code finds the most recent file in your OBS recordings folder and streams that file to YouTube. You may want to enable the setting "Automatically record when streaming" in OBS, otherwise you'll need to click "Start Streaming" and "Start Recording" each time.

Start recording in OBS then run the code, and it should start streaming the recording to YouTube without interfering with your primary stream. You will, of course, need enough upload bandwidth for both streams.

Potentially you could have another copy of this Python script running to streams the recording to a third service, such as Twitch.

#! /usr/bin/env python3

stream_key = 'xxxx-xxxx-xxxx-xxxx'
recording_path = '/home/username/Videos'
ffmpeg_path = ''

print("If you haven't started the recording already, press Ctrl-c to cancel this...")
from datetime import datetime
from pathlib import Path
import os

# find the newest file in the folder
p = Path(recording_path)
time, newest_file = max((f.stat().st_mtime, f) for f in p.iterdir())

youtube_server = 'rtmp://a.rtmp.youtube.com/live2/'
command = ffmpeg_path+'ffmpeg -re -i '+str(newest_file)+' -acodec copy -vcodec copy -f flv '+youtube_server+stream_key
os.system(command)

Hopefully that helps get you started with secondary streams from OBS Studio. Let me know if any of this doesn't work for you.

import pandas as pd
import cufflinks as cf
cf.go_offline()
#olympics = pd.read_csv('./olympics.csv')
olympics = pd.read_csv('https://raw.githubusercontent.com/callysto/online-courses/master/CallystoAndDataScience/olympics.csv')

athletes_by_year = olympics.groupby(["Year"]).size().iplot(title='Number of Athletes per Year (Olympics)',yTitle='Number of Athletes',xTitle='Year')

olympics[olympics['Season']=='Winter'].groupby(["Year"]).size().iplot(title='Number of Athletes per Year (Winter Olympics)',yTitle='Number of Athletes',xTitle='Year')

medals = olympics.dropna(subset=["Medal"])
medals_winter = medals[medals["Season"]=="Winter"]
medals_winter.groupby('region').count().sort_values('Medal',ascending=False)['Medal'].head(20).iplot(kind='bar',title='Medals per Country (Winter Olympics, Top 20 Countries)',yTitle='Number of Medals')

canada_medals = medals[medals['region']=='Canada']
canada_medals.groupby('Sport').count().sort_values('Medal',ascending=False)['Medal'].iplot(kind='bar',title='Canadian Olympic Medals per Sport')

df_canada_medals = pd.DataFrame(canada_medals.groupby('Sport').count().sort_values('Medal',ascending=False)['Medal'])
df_canada_medals.rename(columns={'Medal':'Medals'}, inplace=True)
df_canada_medals

medals_per_athlete = pd.DataFrame(medals.groupby('Name').count().sort_values('Medal',ascending=False).head(20)['Medal'])
medals_per_athlete.merge(olympics[['Name','region']].drop_duplicates('Name'),on='Name').iplot(kind='barh',title='Number of Olympic Medals per Athlete (Top 20)',y='Medal',x='Name',xTitle='Number of Medals',text='region')

About

This notebook is a demonstration of some of capabilities of fastpages with notebooks.

With fastpages you can save your jupyter notebooks into the _notebooks folder at the root of your repository, and they will be automatically be converted to Jekyll compliant blog posts!

Front Matter

The first cell in your Jupyter Notebook or markdown blog post contains front matter. Front matter is metadata that can turn on/off options in your Notebook. It is formatted like this:

# "My Title"
> "Awesome summary"

- toc:true- branch: master- badges: true- comments: true
- author: Hamel Husain & Jeremy Howard
- categories: [fastpages, jupyter]

Setting toc: true will automatically generate a table of contents
Setting badges: true will automatically include GitHub and Google Colab links to your notebook.
Setting comments: true will enable commenting on your blog post, powered by utterances.

The title and description need to be enclosed in double quotes only if they include special characters such as a colon. More details and options for front matter can be viewed on the front matter section of the README.

Markdown Shortcuts

A #hide comment at the top of any code cell will hide both the input and output of that cell in your blog post.

A #hide_input comment at the top of any code cell will only hide the input of that cell.

The comment #hide_input was used to hide the code that produced this.

put a #collapse-hide flag at the top of any cell if you want to hide that cell by default, but give the reader the option to show it:

#collapse-hide
import pandas as pd
import altair as alt

put a #collapse-show flag at the top of any cell if you want to show that cell by default, but give the reader the option to hide it:

#collapse-show
cars = 'https://vega.github.io/vega-datasets/data/cars.json'
movies = 'https://vega.github.io/vega-datasets/data/movies.json'
sp500 = 'https://vega.github.io/vega-datasets/data/sp500.csv'
stocks = 'https://vega.github.io/vega-datasets/data/stocks.csv'
flights = 'https://vega.github.io/vega-datasets/data/flights-5k.json'

Interactive Charts With Altair

Charts made with Altair remain interactive. Example charts taken from this repo, specifically this notebook.

Example 1: DropDown

# single-value selection over [Major_Genre, MPAA_Rating] pairs
# use specific hard-wired values as the initial selected values
selection = alt.selection_single(
    name='Select',
    fields=['Major_Genre', 'MPAA_Rating'],
    init={'Major_Genre': 'Drama', 'MPAA_Rating': 'R'},
    bind={'Major_Genre': alt.binding_select(options=genres), 'MPAA_Rating': alt.binding_radio(options=mpaa)}
)
  
# scatter plot, modify opacity based on selection
alt.Chart(movies).mark_circle().add_selection(
    selection
).encode(
    x='Rotten_Tomatoes_Rating:Q',
    y='IMDB_Rating:Q',
    tooltip='Title:N',
    opacity=alt.condition(selection, alt.value(0.75), alt.value(0.05))
)

Example 2: Tooltips

alt.Chart(movies).mark_circle().add_selection(
    alt.selection_interval(bind='scales', encodings=['x'])
).encode(
    x='Rotten_Tomatoes_Rating:Q',
    y=alt.Y('IMDB_Rating:Q', axis=alt.Axis(minExtent=30)), # use min extent to stabilize axis title placement
    tooltip=['Title:N', 'Release_Date:N', 'IMDB_Rating:Q', 'Rotten_Tomatoes_Rating:Q']
).properties(
    width=600,
    height=400
)

Example 3: More Tooltips

# select a point for which to provide details-on-demand
label = alt.selection_single(
    encodings=['x'], # limit selection to x-axis value
    on='mouseover',  # select on mouseover events
    nearest=True,    # select data point nearest the cursor
    empty='none'     # empty selection includes no data points
)

# define our base line chart of stock prices
base = alt.Chart().mark_line().encode(
    alt.X('date:T'),
    alt.Y('price:Q', scale=alt.Scale(type='log')),
    alt.Color('symbol:N')
)

alt.layer(
    base, # base line chart
    
    # add a rule mark to serve as a guide line
    alt.Chart().mark_rule(color='#aaa').encode(
        x='date:T'
    ).transform_filter(label),
    
    # add circle marks for selected time points, hide unselected points
    base.mark_circle().encode(
        opacity=alt.condition(label, alt.value(1), alt.value(0))
    ).add_selection(label),

    # add white stroked text to provide a legible background for labels
    base.mark_text(align='left', dx=5, dy=-5, stroke='white', strokeWidth=2).encode(
        text='price:Q'
    ).transform_filter(label),

    # add text labels for stock prices
    base.mark_text(align='left', dx=5, dy=-5).encode(
        text='price:Q'
    ).transform_filter(label),
    
    data=stocks
).properties(
    width=700,
    height=400
)

Data Tables

You can display tables per the usual way in your blog:

movies = 'https://vega.github.io/vega-datasets/data/movies.json'
df = pd.read_json(movies)
# display table with pandas
df[['Title', 'Worldwide_Gross', 
    'Production_Budget', 'Distributor', 'MPAA_Rating', 'IMDB_Rating', 'Rotten_Tomatoes_Rating']].head()

Images

Local Images

You can reference local images and they will be copied and rendered on your blog automatically. You can include these with the following markdown syntax:

![](my_icons/fastai_logo.png)

Remote Images

Remote images can be included with the following markdown syntax:

![](https://image.flaticon.com/icons/svg/36/36686.svg)

Animated Gifs

Animated Gifs work, too!

![](https://upload.wikimedia.org/wikipedia/commons/7/71/ChessPawnSpecialMoves.gif)

Captions

You can include captions with markdown images like this:

![](https://www.fast.ai/images/fastai_paper/show_batch.png "Credit: https://www.fast.ai/2020/02/13/fastai-A-Layered-API-for-Deep-Learning/")

Other Elements

GitHub Flavored Emojis

Typing I give this post two :+1:! will render this:

I give this post two :+1:!

Tweetcards

Typing > twitter: https://twitter.com/jakevdp/status/1204765621767901185?s=20 will render this:

Altair 4.0 is released! https://t.co/PCyrIOTcvv
Try it with:

pip install -U altair

The full list of changes is at https://t.co/roXmzcsT58 ...read on for some highlights. pic.twitter.com/vWJ0ZveKbZ
— Jake VanderPlas (@jakevdp) December 11, 2019

Youtube Videos

Typing > youtube: https://youtu.be/XfoYk_Z5AkI will render this:

Boxes / Callouts

Typing > Warning: There will be no second warning! will render this:

Warning: There will be no second warning!

Typing > Important: Pay attention! It's important. will render this:

Important: Pay attention! It’s important.

Typing > Tip: This is my tip. will render this:

Tip: This is my tip.

Typing > Note: Take note of this. will render this:

Note: Take note of this.

Typing > Note: A doc link to [an example website: fast.ai](https://www.fast.ai/) should also work fine. will render in the docs:

Note: A doc link to an example website: fast.ai should also work fine.

Footnotes

You can have footnotes in notebooks, however the syntax is different compared to markdown documents. This guide provides more detail about this syntax, which looks like this:

For example, here is a footnote {% fn 1 %}.
And another {% fn 2 %}
{{ 'This is the footnote.' | fndetail: 1 }}
{{ 'This is the other footnote. You can even have a [link](www.github.com)!' | fndetail: 2 }}

For example, here is a footnote ¹.

And another ²

1. This is the footnote.↩

2. This is the other footnote. You can even have a link!↩

	Title	Worldwide_Gross	Production_Budget	Distributor	MPAA_Rating	IMDB_Rating	Rotten_Tomatoes_Rating
0	The Land Girls	146083.0	8000000.0	Gramercy	R	6.1	NaN
1	First Love, Last Rites	10876.0	300000.0	Strand	R	6.9	NaN
2	I Married a Strange Person	203134.0	250000.0	Lionsgate	None	6.8	NaN
3	Let's Talk About Sex	373615.0	300000.0	Fine Line	None	NaN	13.0
4	Slam	1087521.0	1000000.0	Trimark	R	3.4	62.0

	Medals
Sport
Ice Hockey	348
Rowing	203
Athletics	98
Swimming	98
Short Track Speed Skating	70
Football	49
Curling	48
Speed Skating	45
Figure Skating	43
Lacrosse	36
Canoeing	33
Synchronized Swimming	26
Sailing	25
Shooting	24
Cycling	23
Bobsleigh	18
Diving	18
Freestyle Skiing	18
Wrestling	17
Equestrianism	17
Boxing	17
Rugby Sevens	12
Alpine Skiing	11
Basketball	9
Trampolining	7
Snowboarding	7
Judo	5
Cross Country Skiing	4
Skeleton	4
Biathlon	3
Weightlifting	3
Beach Volleyball	2
Taekwondo	2
Tennis	2
Triathlon	2
Art Competitions	2
Golf	1
Rhythmic Gymnastics	1
Gymnastics	1

	Title	Worldwide_Gross	Production_Budget	Distributor	MPAA_Rating	IMDB_Rating	Rotten_Tomatoes_Rating
0	The Land Girls	146083.0	8000000.0	Gramercy	R	6.1	NaN
1	First Love, Last Rites	10876.0	300000.0	Strand	R	6.9	NaN
2	I Married a Strange Person	203134.0	250000.0	Lionsgate	None	6.8	NaN
3	Let's Talk About Sex	373615.0	300000.0	Fine Line	None	NaN	13.0
4	Slam	1087521.0	1000000.0	Trimark	R	3.4	62.0

fastpages

Rock Paper Scissors

Results Data

Determining the Winner of a Round

Challenges

Post

Demonstration

Interactive Charts With Altair

Example 1: DropDown

Example 2: Tooltips

Example 3: More Tooltips

Data Tables

Images

Local Images

Remote Images

Animated Gifs

Captions

Other Elements

GitHub Flavored Emojis

Tweetcards

Youtube Videos

Boxes / Callouts

Footnotes

Pandas Cheatsheet

Pandas Cheatsheet

Creating a DataFrame

from online data

from input or loop data

Displaying Data

Sorting Data

Selecting Data

Summarizing Data

Cleaning Data

Transforming Data

Merging Data

Graphing Data with Cufflinks

Streaming OBS Recordings to YouTube

Setting Up

Data Science Example - Olympics

Fastpages Notebook Blog Post

About

Front Matter

Markdown Shortcuts

Interactive Charts With Altair

Example 1: DropDown

Example 2: Tooltips

Example 3: More Tooltips

Data Tables

Images

Local Images

Remote Images

Animated Gifs

Captions

Other Elements

GitHub Flavored Emojis

Tweetcards

Youtube Videos

Boxes / Callouts

Footnotes

An Example Markdown Post

Example Markdown Post

Basic setup

Basic formatting

Lists

Boxes and stuff

Images

Code

Tables

Tweetcards

Footnotes