Update app.py

app.py

@@ -1,147 +1,107 @@
-import io
-import random
-from typing import List, Tuple
-
-import aiohttp
 import panel as pn
-from PIL import Image
-from transformers import CLIPModel, CLIPProcessor
-
-pn.extension(design="bootstrap", sizing_mode="stretch_width")
-
-ICON_URLS = {
-    "brand-github": "https://github.com/holoviz/panel",
-    "brand-twitter": "https://twitter.com/Panel_Org",
-    "brand-linkedin": "https://www.linkedin.com/company/panel-org",
-    "message-circle": "https://discourse.holoviz.org/",
-    "brand-discord": "https://discord.gg/AXRHnJU6sP",
-}
-
-
-async def random_url(_):
-    pet = random.choice(["cat", "dog"])
-    api_url = f"https://api.the{pet}api.com/v1/images/search"
-    async with aiohttp.ClientSession() as session:
-        async with session.get(api_url) as resp:
-            return (await resp.json())[0]["url"]
-
-
-@pn.cache
-def load_processor_model(
-    processor_name: str, model_name: str
-) -> Tuple[CLIPProcessor, CLIPModel]:
-    processor = CLIPProcessor.from_pretrained(processor_name)
-    model = CLIPModel.from_pretrained(model_name)
-    return processor, model
-
-
-async def open_image_url(image_url: str) -> Image:
-    async with aiohttp.ClientSession() as session:
-        async with session.get(image_url) as resp:
-            return Image.open(io.BytesIO(await resp.read()))
-
-
-def get_similarity_scores(class_items: List[str], image: Image) -> List[float]:
-    processor, model = load_processor_model(
-        "openai/clip-vit-base-patch32", "openai/clip-vit-base-patch32"
-    )
-    inputs = processor(
-        text=class_items,
-        images=[image],
-        return_tensors="pt",  # pytorch tensors
-    )
-    outputs = model(**inputs)
-    logits_per_image = outputs.logits_per_image
-    class_likelihoods = logits_per_image.softmax(dim=1).detach().numpy()
-    return class_likelihoods[0]
+import plotly.graph_objects as go
+pn.extension('plotly')
 
-
-async def process_inputs(class_names: List[str], image_url: str):
-    """
-    High level function that takes in the user inputs and returns the
-    classification results as panel objects.
-    """
-    try:
-        main.disabled = True
-        if not image_url:
-            yield "##### ⚠️ Provide an image URL"
-            return
-    
-        yield "##### ⚙ Fetching image and running model..."
-        try:
-            pil_img = await open_image_url(image_url)
-            img = pn.pane.Image(pil_img, height=400, align="center")
-        except Exception as e:
-            yield f"##### 😔 Something went wrong, please try a different URL!"
-            return
+def create_sankey(player='Human', initial_decision='Cooperate'):
     
-        class_items = class_names.split(",")
-        class_likelihoods = get_similarity_scores(class_items, pil_img)
+    source = [0, 0, 1, 1]
+    target = [2, 3, 2, 3]
+
+    # based on the stats above and the current type of player, we get the following value arrays.
+    if player == 'Human':
+        if initial_decision == 'Cooperate':
+            value = [12035, 3173, 4963, 8440]
+        else:
+            value = [3821, 7686, 3635, 10584]
+    elif player == 'ChatGPT-4':
+        if initial_decision == 'Cooperate':
+            value = [29, 0, 0, 1]
+        else:
+            value = [0, 26, 1, 3]
+    else:  # ChatGPT-3 
+        if initial_decision == 'Cooperate':
+            value = [21, 3, 3, 3]
+        else:
+            value = [7, 15, 4, 4]
     
-        # build the results column
-        results = pn.Column("##### 🎉 Here are the results!", img)
+    link_percentages = [value[0]/(value[0]+value[1])*100, value[1]/(value[0]+value[1])*100, value[2]/(value[2]+value[3])*100, value[3]/(value[2]+value[3])*100]
+    node_percentages = [(value[0]+value[1])/sum(value)*100, (value[2]+value[3])/sum(value)*100, (value[0]+value[2])/sum(value)*100, (value[1]+value[3])/sum(value)*100]
+    node_customdata = [("Cooperate in Round 1", node_percentages[0]), ("Defect in Round 1", node_percentages[1]), 
+                       ("Cooperate in Round 2", node_percentages[2]), ("Defect in Round 2", node_percentages[3])]
+
+    # Create sankey diagram
+    fig = go.Figure(data=[go.Sankey(
+        node = dict(
+            pad = 15,
+            thickness = 20,
+            label = ["Cooperate", "Defect", "Cooperate", "Defect"],
+            color = ["#B0C5A4", "#D37676", "#B0C5A4", "#D37676"],
+            # customdata = ["Cooperate in Round 1", "Defect in Round 1", "Cooperate in Round 2", "Defect in Round 2"],
+            customdata = node_customdata,
+            hovertemplate='%{value:.0f} players (%{customdata[1]:.02f}%) chose to %{customdata[0]}<extra></extra>',
+        ),
+        link = dict(
+            source = source,
+            target = target,
+            value = value,
+            customdata = link_percentages,
+            hovertemplate='Of the %{source.value} players who chose to <br />'+
+                '%{source.customdata[0]}, %{value:.0f} (%{customdata:.02f}%) <br />'+ 
+                'chose to %{target.customdata[0]}<extra></extra>',
+            color = ["#B0C5A4", "#B0C5A4", "#D37676", "#D37676"],
+        ),
+    )])
+
+    annotations=[
+        dict(x=0, y=-0.2, xref='paper', yref='paper', showarrow=False, 
+             text="Round 1"),
+        dict(x=0.5, y=-0.2, xref='paper', yref='paper', showarrow=False, 
+             text="Other Player Defects in Round 1" if initial_decision == "Defect" else "Other Player Cooperates in Round 1", font=dict(size=14, color='grey')),
+        dict(x=1, y=-0.2, xref='paper', yref='paper', showarrow=False, 
+             text="2")
+    ]
     
-        for class_item, class_likelihood in zip(class_items, class_likelihoods):
-            row_label = pn.widgets.StaticText(
-                name=class_item.strip(), value=f"{class_likelihood:.2%}", align="center"
-            )
-            row_bar = pn.indicators.Progress(
-                value=int(class_likelihood * 100),
-                sizing_mode="stretch_width",
-                bar_color="secondary",
-                margin=(0, 10),
-                design=pn.theme.Material,
-            )
-            results.append(pn.Column(row_label, row_bar))
-        yield results
-    finally:
-        main.disabled = False
-
-
-# create widgets
-randomize_url = pn.widgets.Button(name="Randomize URL", align="end")
-
-image_url = pn.widgets.TextInput(
-    name="Image URL to classify",
-    value=pn.bind(random_url, randomize_url),
-)
-class_names = pn.widgets.TextInput(
-    name="Comma separated class names",
-    placeholder="Enter possible class names, e.g. cat, dog",
-    value="cat, dog, parrot",
-)
-
-input_widgets = pn.Column(
-    "##### 😊 Click randomize or paste a URL to start classifying!",
-    pn.Row(image_url, randomize_url),
-    class_names,
-)
-
-# add interactivity
-interactive_result = pn.panel(
-    pn.bind(process_inputs, image_url=image_url, class_names=class_names),
-    height=600,
-)
-
-# add footer
-footer_row = pn.Row(pn.Spacer(), align="center")
-for icon, url in ICON_URLS.items():
-    href_button = pn.widgets.Button(icon=icon, width=35, height=35)
-    href_button.js_on_click(code=f"window.open('{url}')")
-    footer_row.append(href_button)
-footer_row.append(pn.Spacer())
-
-# create dashboard
-main = pn.WidgetBox(
-    input_widgets,
-    interactive_result,
-    footer_row,
-)
-
-title = "Panel Demo - Image Classification"
-pn.template.BootstrapTemplate(
-    title=title,
-    main=main,
-    main_max_width="min(50%, 698px)",
-    header_background="#F08080",
-).servable(title=title)
+    fig.update_layout(hovermode='x', title="Prisoner's Dilemma Decision Flows", annotations=annotations, font_size=14, title_x=0.5)
+    return fig
+
+
+# Interactive widgets for filtering
+select_player = pn.widgets.Select(name='Type of Player', options=['Human', 'ChatGPT-4', 'ChatGPT-3'])
+select_decision = pn.widgets.Select(name='Round 1 Decision by Other Player', options=['Cooperate', 'Defect'])
+
+# Textual explanation of each chart based on type of player and round 1 decision (should have 6 scenarios!)
+# https://panel.holoviz.org/reference/widgets/StaticText.html
+
+
+# Dynamic binding of the sankey diagram function to the widgets' values
+@pn.depends(select_player.param.value, select_decision.param.value)
+def interactive_sankey(chatgpt_version, initial_decision):
+    return create_sankey(chatgpt_version, initial_decision)
+
+@pn.depends(select_player.param.value, select_decision.param.value)
+def setup_description(chatgpt_version, initial_decision):
+    if chatgpt_version == 'Human':
+        if initial_decision == 'Cooperate':
+            scenario_desc="Here's what happens <b>in reality</b> (for us humans) when the other player <b>cooperates</b> in Round 1! We can see that about 50% of  the people start on either side of the coin (cooperate or defect) and then the numbers lean more heavily (around 60%) onto the cooperate side by Round 2. This shows that humans would more naturally lean towards cooperation if the other player does the same. Check out what happens when the other player defects in Round 1 by selecting the <b>Defect</b> option above!"
+        else:
+            scenario_desc="Here's what happens <b>for humans</b> when the other player <b>defects</b> in Round 1! Just like in the first scenario (other player cooperates) we see that about 50% of  the people start on either side of the coin (cooperate or defect). This time, however, the numbers lean MUCH more heavily (around 70%) onto the defect side by Round 2 (especially coming from those who initially cooperated). This shows that humans would more naturally lean towards defecting (moreso than cooperation) if the other player does the same. Now check out how AI would make this decision by selecting either <b>ChatGPT-3 or ChatGPT-4</b> in the options above!"
+    elif chatgpt_version == 'ChatGPT-4':
+        if initial_decision == 'Cooperate':
+            scenario_desc="Here's a peek into <b>ChatGPT-4's</b> world when faced with a <b>cooperating</b> partner in Round 1! ChatGPT-4 shows a strong tendency towards reciprocating cooperation, with ALL of the players who decided to cooperate in the first place (95%) choosing to cooperate again. It appears to demonstrate a high capacity for trust and cooperative behavior, mirroring an ideal strategic participant who values mutual benefit over individual gain. Curious about how ChatGPT-4 reacts to a defect? Switch to the <b>Defect</b> option above to explore further!"
+        else:
+            scenario_desc="Exploring <b>ChatGPT-4's</b> strategy when the other player decides to <b>defect</b> in Round 1 unveils an interesting approach! Just like humans, when ChatGPT-4 is 'betrayed' in a sense, it goes HEAVILY into defecting (with a total table turning 96% defecting in the second round). It's an intriguing stance that differs only in terms of extremeties compared to human reaction patterns. Now, check how <b>ChatGPT-3</b> handles this by selecting it in the options above!"
+    else:
+        if initial_decision == 'Cooperate':
+            scenario_desc="Diving into <b>ChatGPT-3's</b> choices when the game starts with <b>cooperation</b>, it shows something in between both humans and ChatGPT-4; the exact same amount of responses (80%) end up in cooperation despite there having been some players changing to defecting and some initial defectors changing to cooperation. It is fascinating to see how this earlier version of ChatGPT balances trust and strategy. Want to see what happens when the start is less friendly? Choose the <b>Defect</b> option to discover."
+        else:
+            scenario_desc="When the initial move is to <b>defect</b>, <b>ChatGPT-3</b> displays a mixed strategy (again, in between humans and ChatGPT-4). Despite starting with more on the cooperation side (~70%), they end up with the majority of players defecting by the second round (63% - which is much closer to the humans which were at 70%). This variance from ChatGPT-4's strategy offers a glimpse into the evolution and differences in approach between the two AI versions. Toggle to <b>ChatGPT-4 or Human</b> to compare both of these to what you found out about ChatGPT-3!"
+
+    static_text = pn.widgets.StaticText(name='Description', value=f"{scenario_desc}")
+    static_text.value = f"{scenario_desc}"
+    return static_text
+
+
+# Layout
+layout = pn.Column(pn.Row(select_player, select_decision), interactive_sankey, setup_description)
+
+layout.servable()