import dash_core_components as dcc
import dash_html_components as html
import dash
from dash.dependencies import Input, Output

app = dash.Dash(__name__)

app.layout = html.Div([
    dcc.RadioItems(
        id='toc',
        options=[
            {'label': i, 'value': i}
            for i in ['Introduction', 'Chapter 1', 'Chapter 2']
        ],
        value='Chapter 1'
    ),
    html.Div(id='body')
])


@app.callback(Output('body', 'content'), [Input('toc', 'value')])
def update_content(url):
    if 'Chapter 1' in url:
        return html.H3('Welcome to Chapter 1')
    elif 'Chapter 2' in url:
        return html.H3('Welcome to Chapter 2')
    else:
        return html.H3('You are here nor there')


app.routes = [
    {
        'pathname': '/',
        'state': {
            'toc.value': 'Introduction'
        }
    },
    {
        'pathname': '/chapter-1',
        'state': {
            'toc.value': 'Chapter 1'
        }
    },
    {
        'pathname': '/chapter-2',
        'state': {
            'toc.value': 'Chapter 2'
        }
    }
]

app.scripts.config.serve_locally = True

if __name__ == '__main__':
    app.server.run(debug=True, threaded=True, port=9998)
