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

# # Welcome to Jupyter Notebook v7! 👋
# 
# Jupyter Notebook v7 is built using the same components as JupyterLab, and reuses a lot of the work from the JupyterLab community by leveraging the new prebuilt (federated) extension system.

# ## Files 📂 and Running Sessions 🏃‍♀️
# 
# Jupyter Notebook lets you navigate the files in a separate browser tab. 
# 
# Go ahead and click on the Jupyter icon in the top left corner!
# 
# ![image.png](attachment:212ecd19-156e-48dd-99c7-e2ee7457de6f.png)
# 
# It will open a new browser tab with the listing of the files on the server:
# 
# ![image.png](attachment:5aa6b072-c4d7-47de-9e75-0a107a37e2f2.png)
# 
# It also shows the list of running sessions and terminals in the `Running` tab:
# 
# ![image.png](attachment:c448a783-da5a-499b-a52d-62be28a72438.png)
# 
# Alternatively it is also possible to access this page using the command in the `View` menu:
# 
# ![image.png](attachment:2d33971b-509e-433b-809e-2f0861a13105.png)

# ## Editing Files 🖊️
# 
# Jupyter Notebook also has support for editing files. Double-click on a file (or `Right Click > Open`) to open the editor:
# 
# ![image.png](attachment:72f98bea-d61c-40cd-8f56-29df50ae5f8d.png)
# 
# ![image.png](attachment:86ac8b15-8a6b-4d4d-b315-0c8a73870e3b.png)

# ## Terminals 🖥️
# 
# To create a new Terminal, select `File > New > Terminal` in the menu:
# 
# ![image.png](attachment:9016e117-00db-490f-80c4-fa3ed6766d0f.png)
# 
# The terminal opens in a new browser tab:
# 
# ![image.png](attachment:88ef6621-8ef1-4174-939c-3dcd8d9166ef.png)

# ## Command Palette 🎨
# 
# Jupyter Notebook includes a command palette, just like in JupyterLab.
# 
# Hit `Ctrl-Shift-C` or `Accel-Shift-C` to activate it. Or via the menu with `View > Activate Command Palette`:
# 
# ![image.png](attachment:72198f40-0581-4a18-bc23-8b4674351a97.png)
# 
# Using the palette is very convenient and can give a significant productivity boost over time!

# ## Themes 🌈
# 
# Since Jupyter Notebook v7 is heavily built on top of JupyterLab, it also has support for a Dark Mode! 🕶️
# 
# Go to `Settings > Theme > JupyterLab Dark` to select the theme:
# 
# ![image.png](attachment:9c47f73c-24f2-4c1a-aa3a-52e231144057.png)
# 
# New themes can be installed using the federated extension system. These themes will be compatible with both JupyterLab and Jupyter Notebook.

# ## Zen Mode 😌
# 
# This is an exclusivity in Jupyter Notebook v7 😎
# 
# Activate the palette and choose `Toggle Zen Mode`. The interface will focus on the notebook and the notebook only!
# 
# ![image.png](attachment:ac1323eb-c6e0-4b7c-80f3-7bf5f84adf98.png)
# 
# Press `Escape` to exit, or re-run the `Toggle Zen Mode` command from the palette.

# ## Third Party Extensions 🧩
# 
# Jupyter Notebook v7 supports third-party extensions developed for JupyterLab 3.0+, using the new distribution system. These extensions can be installed via `pip`.
# 
# For example the extension to enable Jupyter Widgets rendering in both JupyterLab and Jupyter Notebook can be installed using the following command (run the cell): 

# In[ ]:


get_ipython().system('pip install ipywidgets')


# Now reload the page and resume from here. In the next section we will be able to create and use Jupyter Widgets!

# ## Widgets
# 
# Now let's instantiate a new widget:

# In[ ]:


from ipywidgets import IntSlider

slider = IntSlider()
slider


# In[ ]:


slider


# ## Rich Display
# 
# Just like in many Jupyter Frontends, Jupyter Notebook supports rich display rendering. For example:

# In[ ]:


from IPython.display import Latex

Latex(
    r"""\begin{eqnarray}
\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\
\nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\
\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\
\nabla \cdot \vec{\mathbf{B}} & = 0 
\end{eqnarray}"""
)


# Matplotlib figures:

# In[ ]:


import matplotlib.pyplot as plt
import numpy as np

x = np.linspace(0, 10, 100)

plt.plot(x, np.sin(x))
plt.plot(x, np.cos(x))

plt.show()


# Or even HTML:

# In[ ]:


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

s = """<table>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>"""
h = HTML(s)
display(h)


# ## That's it!
# 
# Hope you enjoyed the tour. If you have more question or any other issues, don't hesitate to go to the repository on GitHub!
# 
# https://github.com/jupyter/notebook