#!/usr/bin/env python
# coding: utf-8

# In[1]:


from datascience import *
import numpy as np

get_ipython().run_line_magic('matplotlib', 'inline')
import matplotlib.pyplot as plots
plots.style.use('fivethirtyeight')

cars = Table.read_table('hybrid.csv')

cars = cars.where('class', are.contained_in("Compact SUV Minivan"))
cars


# In[13]:


from IPython.display import HTML
from IPython.display import display

# Taken from https://stackoverflow.com/questions/31517194/how-to-hide-one-specific-cell-input-or-output-in-ipython-notebook
tag = HTML('''<script>
code_show=true; 
function code_toggle() {
    if (code_show){
        $('div.cell.code_cell.rendered.selected div.input').hide();
    } else {
        $('div.cell.code_cell.rendered.selected div.input').show();
    }
    code_show = !code_show
} 
$( document ).ready(code_toggle);
</script>
To show/hide this cell's raw code input, click <a href="javascript:code_toggle()">here</a>.''')
display(tag)

############### Write code below ##################

cars.scatter('msrp','mpg')



# In[3]:


from IPython.display import HTML
from IPython.display import display

# Taken from https://stackoverflow.com/questions/31517194/how-to-hide-one-specific-cell-input-or-output-in-ipython-notebook
tag = HTML('''<script>
code_show=false; 
function code_toggle() {
    if (code_show){
        $('div.cell.code_cell.rendered.selected div.input').hide();
    } else {
        $('div.cell.code_cell.rendered.selected div.input').show();
    }
    code_show = !code_show
} 
$( document ).ready(code_toggle);
</script>
To show/hide this cell's raw code input, click <a href="javascript:code_toggle()">here</a>.''')
display(tag)



############### Write code below ##################

cars.scatter('msrp','mpg')



# In[44]:


from IPython.core.display import display, HTML
toggle_code_str = '''
<form action="javascript:code_toggle()"><input type="submit" id="toggleButton" value="Show Sloution"></form>
'''

toggle_code_prepare_str = '''
    <script>
    function code_toggle() {
        if ($('div.cell.code_cell.rendered.selected div.input').css('display')!='none'){
            $('div.cell.code_cell.rendered.selected div.input').hide();
        } else {
            $('div.cell.code_cell.rendered.selected div.input').show();
        }
    }
    </script>

'''

def toggle_code():
    display(HTML(toggle_code_str))


# In[46]:


cars.scatter('msrp','mpg')

toggle_code()


# In[84]:


from IPython.core.display import display, HTML
toggle_code_str = '''
<form action="javascript:code_toggle()"><input type="submit" id="toggleButton" value="Click Here to Hide Code Above
 (Too Advanced for Us)"></form>
'''

toggle_code_prepare_str = '''
    <script>
    function code_toggle() {
        if ($('div.cell.code_cell.rendered.selected div.input').css('display')!='none'){
            $('div.cell.code_cell.rendered.selected div.input').hide();
        } else {
            $('div.cell.code_cell.rendered.selected div.input').show();
        }
    }
    </script>

'''

display(HTML(toggle_code_prepare_str + toggle_code_str))

def hide_code():
    display(HTML(toggle_code_str))


# In[86]:


hide_code()

cars.scatter('msrp','mpg')
plots.title("Hide Code");


# Occasionally we'll see something like this in the code:
# 
# 
# 
# <input type="submit"  id="toggleButton" value="Click Here to Hide Code Above
#  (Too Advanced for Us)">
# 
# That means that a bunch of Python code was used to create something, usually a graphic, whose REAL purpose is to demonstrate something statistical or mathematical, AND the code to create it is either more advanced than we're supposed to worry with, or just really long.  Either way, just click the button to hide the code, forget about it, then focus on the thing the code is demonstrating.
# 

# In[ ]: