WebApp.ipynb

{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "9574f985-ded0-431f-90c4-167fa21af764",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| default_exp web_app"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "0e7c01a3-f18c-4825-8965-883973137d91",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "import pprint\n",
    "from fastcore.basics import patch\n",
    "import networkx as nx\n",
    "import ipywidgets as widgets\n",
    "import ipycytoscape\n",
    "from ipycytoscape import CytoscapeWidget\n",
    "from IPython.display import display, clear_output, HTML\n",
    "from ipywidgets import Output, link, jslink\n",
    "from pprint import pformat\n",
    "import pandas as pd\n",
    "from ipydatagrid import DataGrid\n",
    "from ipywidgets import Tab, Stack\n",
    "from itertools import product\n",
    "import ipyvuetify as v\n",
    "import base64"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "16977126-56a1-48e5-ae05-e64e6c060f6f",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "from preprocessing.objects import create_objects"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "62a3d702-796b-45f2-8f05-e9c66a615d8a",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "from preprocessing.author import Author"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "acebfcc4-2d45-4eb0-abd2-68d042cad31e",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "########### FIRST TAB #############\n",
    "\n",
    "# Create accordion widgets for the \"Welcome\" tab\n",
    "accordion_welcome = widgets.Accordion(children=[\n",
    "    widgets.HTML(\"Welcome to the Agent-Based Modeling Visualization Web App! This interactive tool provides a dynamic way to explore and analyze code sharing and model documentation practices in individual-based and agent-based models since the inception of the field in the 80's. This tool allows user to explore the properties of and relationships among 7500 hand picked articles describing IBMs or ABMs across awide range of research domains up to the year 2018.\")\n",
    "])\n",
    "\n",
    "accordion_welcome.set_title(0, 'Welcome!')\n",
    "accordion_welcome.selected_index = 0\n",
    "\n",
    "accordion_about_dataset = widgets.Accordion(children=[\n",
    "    widgets.HTML(\"1. Welcome Tab: Begin your journey by visiting the Welcome tab. Here, you'll find essential information about the web app's features and functionalities. <br> 2. Setup Tab: Switch to the Setup tab to access the dataset configuration options. <br> 3. Graph Tab: Move on to the Graph tab to visualize the network graph representation of authors/nodes and their collaborative connections. Hover over nodes to view author information and click to explore further. <br> 4. Export Tab: In the Export tab, you can choose to download the graph visualization in either Excel (XLSX) or CSV format. While the download functionality is under development, the dropdown menu allows you to select your preferred file format\")\n",
    "])\n",
    "                \n",
    "accordion_about_dataset.set_title(0, 'How to Use the Web-App')\n",
    "\n",
    "accordion_key_features = widgets.Accordion(children=[\n",
    "    widgets.HTML(\"Key Features of the Web App: <br> - Network Visualization: Gain insights into collaboration patterns among authors using an interactive network graph. The graph highlights relationships based on shared publications. <br> - Dynamic Exploration: Hover over nodes for author details, click to reveal deeper connections, and analyze the co-authorship network.<br> - Download Options: The 'Export' tab allows you to choose your preferred file format for downloading the network graph visualization. While the functionality is currently static, it will soon enable you to save your insights for further analysis.\")\n",
    "])\n",
    "accordion_key_features.set_title(0, 'Key Features of the Web App')\n",
    "\n",
    "# Create a next button\n",
    "welcome_next_button = widgets.Button(description='Next', layout=widgets.Layout(width='auto', background_color='lightblue', color='black'))\n",
    "\n",
    "# Create Welcome tab content with accordion widgets\n",
    "welcome_tab = widgets.VBox([\n",
    "    accordion_welcome,\n",
    "    accordion_key_features,\n",
    "    accordion_about_dataset,\n",
    "    welcome_next_button\n",
    "])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "3e4c2a58-75fb-4f05-832e-ee4019eec967",
   "metadata": {},
   "outputs": [],
   "source": [
    "welcome_tab"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "4c19fe5b-33b8-4c57-a6df-83c3d8de4359",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "authors, publications = create_objects('Catalogdatabase-till2018b.xlsx', n=50)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "e0d800c1-1cf7-457c-a259-e751cecbfef9",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "## Create a list of dictionaries containing author information\n",
    "## Create a DataFrame from the author data\n",
    "authors_df = pd.DataFrame([author.__dict__ for author in authors])\n",
    "publications_df = pd.DataFrame([publication.__dict__ for publication in publications])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "b08dc492-3ba9-4a8a-8561-8d2558763895",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "## Create the datagrid and display it\n",
    "author_datagrid = DataGrid(authors_df, editable=False, layout={\"height\": \"200px\", \"width\": '400px'})\n",
    "publication_datagrid = DataGrid(publications_df, editable=False, layout={\"height\": \"200px\", \"width\": '400px'})\n",
    "datagrid = widgets.Stack(children = [author_datagrid, publication_datagrid], selected_index=0)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "c05b8735-0214-4c6d-88c0-a502353c39eb",
   "metadata": {},
   "outputs": [],
   "source": [
    "datagrid"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "a09ca9fe-5324-41fd-b81d-dcff67f584ae",
   "metadata": {},
   "outputs": [],
   "source": [
    "datagrid.selected_index = 1"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "098a5db6-f6f7-4073-b153-35e37e59bb66",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "########### SECOND TAB #############\n",
    "\n",
    "# Dropdown widget to switch between types of nodes\n",
    "dropdown = widgets.Dropdown(options=[('Authors'), ('Publications')], value='Authors', description='Node Mode:')\n",
    "\n",
    "jslink((dropdown, 'index'), (datagrid, 'selected_index'))\n",
    "\n",
    "# Create a next button\n",
    "setup_next_button = widgets.Button(description='Next', layout=widgets.Layout(width='auto', background_color='lightblue', color='black'))\n",
    "\n",
    "# Add the next button to the setup_tab\n",
    "setup_tab = widgets.VBox([datagrid, dropdown, setup_next_button])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "09e42ecb-dfe3-4ed1-9456-513feea6158d",
   "metadata": {},
   "outputs": [],
   "source": [
    "setup_tab"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "c9479558-2648-414f-b250-1889dd65e831",
   "metadata": {},
   "outputs": [],
   "source": [
    "########### Turn data into csv files ############\n",
    "\n",
    "# # Create files from data (commented out because it only needed to be done once)\n",
    "# authors_csv = authors_df.to_csv()\n",
    "# publications_csv = publications_df.to_csv()\n",
    "\n",
    "# # Save authors_csv to a file: ./authors.cvs\n",
    "# with open('authors.csv', 'w', encoding='utf-8') as file:\n",
    "#     file.write(authors_csv)\n",
    "\n",
    "# # Save publications_csv to a file: ./publications.csv\n",
    "# with open('publications.csv', 'w', encoding='utf-8') as file:\n",
    "#     file.write(publications_csv)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "363f121b-9726-4047-a46f-5be8248fad25",
   "metadata": {},
   "outputs": [],
   "source": [
    "publication_a = publications[6]\n",
    "publication_a.__dict__"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "cf0ae212-57f4-4105-82aa-39b4a42700e1",
   "metadata": {},
   "outputs": [],
   "source": [
    "publication_b = publications[7]\n",
    "publication_b.__dict__"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "ab2617b7-8df5-44c3-85cb-3911258180ac",
   "metadata": {},
   "outputs": [],
   "source": [
    "common_authors = [ author_i for author_i , author_j in product(publication_a.authors, publication_b.authors) if author_i.same_name(author_j)]\n",
    "common_authors"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "f94681c8-9c38-4c9f-976f-6d77ec496044",
   "metadata": {},
   "outputs": [],
   "source": [
    "author_a = authors[authors.bisect_left(Author('Podger', 'Geoff'))]\n",
    "author_b = authors[authors.bisect_left(Author('Power', 'Robert'))]"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "f55c6758-82ec-49c3-b755-f4a5609fb405",
   "metadata": {},
   "outputs": [],
   "source": [
    "common_publications = set(author_a.publications).intersection(author_b.publications)\n",
    "common_publications"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "a065bffe-6de6-423c-bc66-3bbe1b97caf0",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "########### CREATE AUTHOR NETWORK ###############\n",
    "##%time\n",
    "#### Step 1: Making sure correct matches are found between authors ####\n",
    "\n",
    "# Create the graph\n",
    "G_authors = nx.Graph()\n",
    "\n",
    "# Define the graph with authors as nodes\n",
    "#G_authors = nx.Graph()\n",
    "\n",
    "# Add nodes to the graph\n",
    "for author in authors:\n",
    "    G_authors.add_node(author, tooltip=author.__repr__())\n",
    "\n",
    "# Add edge between shared publications\n",
    "for index_a in range(len(authors)):\n",
    "    for index_b in range(index_a + 1, len(authors)):\n",
    "        author_a = authors[index_a]\n",
    "        author_b = authors[index_b]\n",
    "\n",
    "        #### WORK?? Should be a publication list\n",
    "        common_publications = list(set(author_a.publications).intersection(author_b.publications))\n",
    "        if common_publications:\n",
    "            # Add the weighted edge to the graph\n",
    "            \n",
    "            ##### Can we have both object and weight??\n",
    "            G_authors.add_edge(author_a, author_b, weight = len(common_publications)) #, weight = len(common_publications)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "139ac0d4-5e7d-474d-b57a-bcd37c01e1cf",
   "metadata": {},
   "outputs": [],
   "source": [
    "########### DISPLAY AUTHOR NETWORK ###########\n",
    "author_network = ipycytoscape.CytoscapeWidget()\n",
    "author_network.graph.add_graph_from_networkx(G_authors)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "2afd07d3-8667-467b-8e58-383f74a7b2b3",
   "metadata": {},
   "outputs": [],
   "source": [
    "author_network"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "e3e7e045-a637-4b5b-9245-a3c30bea7912",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "############ CREATE PUBLICATION NETWORK ###########\n",
    "## %time \n",
    "# Define the graph with publications as nodes\n",
    "G_publications = nx.Graph()\n",
    "\n",
    "for publication in publications:\n",
    "    G_publications.add_node(publication, tooltip=publication.__repr__())\n",
    "    \n",
    "\n",
    "for index_a in range(len(publications)):\n",
    "    for index_b in range(index_a + 1, len(publications)):\n",
    "        publication_a = publications[index_a]\n",
    "        publication_b = publications[index_b]\n",
    "\n",
    "        common_authors = [ author_i for author_i , author_j in product(publication_a.authors, publication_b.authors) if author_i.same_name(author_j)]\n",
    "        if common_authors:  \n",
    "            G_publications.add_edge(publication_a, publication_b, weight = len(common_authors))\n",
    "            ##### Can we have both object and weight??\n",
    "            #for common_author in common_authors:\n",
    "            #    print(common_author)\n",
    "            #    G_publications.add_edge(publication_a, publication_b, object = common_author) #, weight = len(common_publications))\n",
    "\n",
    "            #Comment out this part later\n",
    "            # print(f\"Match found between {publication_a} and {publication_b}\")\n",
    "            # print(f\"Matching Authors: {common_authors}\")\n",
    "            # print(f\"Weighted Edge: {publication_a} - {publication_b} (Weight: {len(common_authors)})\")\n",
    "            # print(\" \")"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "9c8f1a02-169f-4c6a-a791-cb5ca8786acf",
   "metadata": {},
   "outputs": [],
   "source": [
    "########## DISPLAY PUBLICATION NETWORK ############\n",
    "publication_network = ipycytoscape.CytoscapeWidget()\n",
    "publication_network.graph.add_graph_from_networkx(G_publications)\n",
    "filename = 'authors.cvs'"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "3fbd73c3-b014-460e-ab27-044fb2db8013",
   "metadata": {},
   "outputs": [],
   "source": [
    "publication_network"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "26423ba0-4572-4696-860b-b7556c1b5985",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "# Create Output widget to show node information\n",
    "\n",
    "#out = widgets.Output()\n",
    "\n",
    "# for whatever reason, cytoscape doesn't render if it is a child of the stack\n",
    "# network_stack = widgets.Stack([author_network, publication_network])\n",
    "cyto = ipycytoscape.CytoscapeWidget()\n",
    "cyto.graph.add_graph_from_networkx(G_authors)\n",
    "\n",
    "def update_graph(change):\n",
    "    selected_mode = dropdown.value\n",
    "    if selected_mode == 'Authors':\n",
    "        cyto.graph.clear()\n",
    "        cyto.graph.add_graph_from_networkx(G_authors)\n",
    "        #display(cyto)\n",
    "    if selected_mode == 'Publications':\n",
    "        cyto.graph.clear()\n",
    "        cyto.graph.add_graph_from_networkx(G_publications)\n",
    "        #display(cyto)\n",
    "\n",
    "# Create a widgets.Textarea to display author information\n",
    "node_info = widgets.Textarea(\n",
    "    value='',\n",
    "    disabled = True,\n",
    "    placeholder='Hover over a node to see author information.',\n",
    "    layout=widgets.Layout(width='50%', height='200px', editable=False)  # Adjust width and height as needed\n",
    ")\n",
    "\n",
    "# Create a label for the title with big, bold, and centered style\n",
    "title_label = widgets.HTML(\n",
    "    value = \"<h2>Network Graph</h2>\"\n",
    ")\n",
    "\n",
    "_graph_tab = widgets.HBox([node_info, (cyto)], layout=widgets.Layout(width='100%', height='100%', align_items='stretch'))\n",
    "graph_next_button = widgets.Button(description='Next', layout=widgets.Layout(width='auto', background_color='lightblue', color='black'))\n",
    "graph_tab = widgets.VBox([_graph_tab, graph_next_button])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "009362c4-8b61-4df6-91fa-6300b9956090",
   "metadata": {},
   "outputs": [],
   "source": [
    "graph_tab"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "d07dc6b3-072a-4741-aa30-404ff046fc41",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "def log_mouseovers(node):\n",
    "    node_info.value = node['data']['id']\n",
    "\n",
    "# Attach the mouseover and click callbacks to the Cytoscape widget\n",
    "cyto.on('node', 'mouseover', log_mouseovers)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "17b859f7-d718-4d6b-9d62-4462762ea366",
   "metadata": {},
   "outputs": [],
   "source": [
    "graph_tab"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "4b0030ae-7977-47be-bc4f-d904b5173a63",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "def create_button(filename):\n",
    "\n",
    "    with open(filename+'.csv', 'r', encoding='utf-8') as file:\n",
    "        res = file.read()\n",
    "    \n",
    "    b64 = base64.b64encode(res.encode())\n",
    "    payload = b64.decode()\n",
    "    \n",
    "    button_template = '''<html>\n",
    "    <head>\n",
    "    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n",
    "    </head>\n",
    "    <body>\n",
    "    <a download=\"{filename}.csv\" href=\"data:text/csv;base64,{payload}\" download>\n",
    "    <button class=\"p-Widget jupyter-widgets jupyter-button widget-button mod-success\">{filename}.csv</button>\n",
    "    </a>\n",
    "    </body>\n",
    "    </html>\n",
    "    '''\n",
    "    \n",
    "    download_text = button_template.format(payload=payload,filename=filename)\n",
    "    download_button = widgets.HTML(download_text)\n",
    "    return download_button"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "a1348495-ead1-4e0a-acde-4e5b813ddf64",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export \n",
    "download_publications = create_button('publications')\n",
    "download_authors = create_button('authors')"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "0a0c3c20-8736-4b92-a34e-5f59b62a485c",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export \n",
    "\n",
    "######### EXPORT TAB ##########\n",
    "button_stack = Stack(children = (download_publications, download_authors))\n",
    "html = widgets.HTML(\"<p>For more information about how the database was created and how model descriptions were categorized, visit <a href='https://doi.org/10.1016/j.envsoft.2020.104873' style='color: blue;'>On code sharing and model documentation of published individual and agent-based models</a>.</p>\")\n",
    "html.style\n",
    "export_tab = widgets.VBox(children=[button_stack, html])"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "58847ade-aac9-452c-823c-39a0da582246",
   "metadata": {},
   "outputs": [],
   "source": [
    "button_stack.selected_index = 0\n",
    "export_tab"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "d1428583-6306-4f3d-91c5-1693535350aa",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export \n",
    "# Create the Tabs widget with Welcome, Setup, Graph, and Export tabs\n",
    "tabs = widgets.Tab(children=[welcome_tab, setup_tab, graph_tab, export_tab])\n",
    "tabs.set_title(0, 'Welcome')\n",
    "tabs.set_title(1, 'Setup')\n",
    "tabs.set_title(2, 'Graph')\n",
    "tabs.set_title(3, 'Export')"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "ca0e5572-7c89-4d38-8517-0dc65d89a0d2",
   "metadata": {},
   "outputs": [],
   "source": [
    "# Display the widgets\n",
    "display(widgets.VBox([title_label, tabs]))"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "0f1512e0-c2f5-41b9-85b2-421f6ce36628",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "# Create a next button\n",
    "def on_button_click(button):\n",
    "    # Switch to the second tab (index 1) when the button is clicked\n",
    "    tabs.selected_index = tabs.selected_index + 1\n",
    "\n",
    "welcome_next_button.on_click(on_button_click)\n",
    "setup_next_button.on_click(on_button_click)\n",
    "graph_next_button.on_click(on_button_click)"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "6fdb2ac5-2bfd-48b3-90c6-41d652d4d292",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "# Temporary download function:\n",
    "def on_node_mode_change(change):\n",
    "\n",
    "    title = \"Download CSV file\"\n",
    "    selected_mode = change['new']\n",
    "    if selected_mode == 'Authors':\n",
    "        setup_next_button.disabled = True\n",
    "        cyto.graph.clear()\n",
    "        cyto.graph.add_graph_from_networkx(G_authors)\n",
    "        button_stack.selected_index = 0\n",
    "        tabs.selected_index = 2\n",
    "        setup_next_button.disabled = False\n",
    "    if selected_mode == 'Publications':\n",
    "        setup_next_button.disabled = True\n",
    "        cyto.graph.clear()\n",
    "        cyto.graph.add_graph_from_networkx(G_publications)\n",
    "        button_stack.selected_index = 1\n",
    "        tabs.selected_index = 2\n",
    "        setup_next_button.disabled = False\n",
    "        \n",
    "\n",
    "# Attach the event handler to the next button\n",
    "dropdown.observe(on_node_mode_change, names='value')"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "ff97becb-be5b-4bad-9255-948b4caa387a",
   "metadata": {},
   "outputs": [],
   "source": [
    "#| export\n",
    "\n",
    "# Make sure that all the setup things get triggered\n",
    "dropdown.select = 'Author'"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "af687185-55e1-442b-8bd2-50bb40b524ec",
   "metadata": {},
   "outputs": [],
   "source": [
    "tabs"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "dd0083b0-75e1-45d2-9e8f-e9e47671e7d5",
   "metadata": {},
   "outputs": [],
   "source": [
    "from nbdev.export import nb_export\n",
    "\n",
    "nb_export('WebApp.ipynb', 'web_app')"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "1d332e73-245a-4444-b02c-39b8277351b2",
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "python3",
   "language": "python",
   "name": "python3"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 5
}