from bokeh.io import output_file, show, output_notebook, save
from bokeh.models import ColumnDataSource, Select, DateRangeSlider
from bokeh.plotting import figure, show
from bokeh.models import CustomJS
from bokeh.layouts import row,column
df = pd.read_csv("./covid_19_clean_complete.csv")
country_list = list(df['Country/Region'].unique())
df['Date'] = pd.to_datetime(df['Date'])
cols1 = df[['Country/Region','Date', 'Confirmed']]
cols2 = cols1[cols1['Country/Region'] == 'Afghanistan']
Overall = ColumnDataSource(data=cols1)
Curr = ColumnDataSource(data=cols2)
#plot and the menu is linked with each other by this callback function
callback = CustomJS(args=dict(source=Overall, sc=Curr), code="""
for(var i = 0; i <= source.get_length(); i++){
if (source.data['Country/Region'][i] == f){
sc.data['Date'].push(source.data['Date'][i])
sc.data['Confirmed'].push(source.data['Confirmed'][i])
menu = Select(options=country_list,value='Afghanistan', title = 'Country') # drop down menu
bokeh_p=figure(x_axis_label ='Date', y_axis_label = 'Confirmed', y_axis_type="linear",x_axis_type="datetime") #creating figure object
bokeh_p.line(x='Date', y='Confirmed', color='green', source=Curr) # plotting the data using glyph circle
menu.js_on_change('value', callback) # calling the function on change of selection
layout=column(menu, bokeh_p) # creating the layout