kcarnold commited on
Commit
1fa2852
·
1 Parent(s): 22b91c8

clean up display a bit

Browse files
Files changed (1) hide show
  1. app.py +36 -17
app.py CHANGED
@@ -326,6 +326,12 @@ def show_internals():
326
  msg_in_progress + word
327
  )
328
 
 
 
 
 
 
 
329
  response = requests.post(
330
  f"{API_SERVER}/logprobs",
331
  json={
@@ -342,21 +348,16 @@ def show_internals():
342
  response = response.json()
343
 
344
  logprobs = response['logprobs']
345
- # logprobs is a list of tokens:
346
- # {
347
- # "token": "the",
348
- # "logprobs": [{"the": -0.1, "a": -0.2, ...}]
349
- # }
350
- #st.write(logprobs)
351
  logprobs_component(logprobs)
352
 
353
- def send_message():
354
- other_role = "assistant" if last_role == "user" else "user"
355
- st.session_state['messages'].append({"role": other_role, "content": ""})
356
- st.session_state['msg_in_progress'] = ""
357
- st.button("Send", on_click=send_message)
358
 
359
  def logprobs_component(logprobs):
 
 
 
 
 
360
  import html, json
361
  html_out = ''
362
  for i, entry in enumerate(logprobs):
@@ -367,17 +368,30 @@ def logprobs_component(logprobs):
367
  token_to_show = html.escape("<empty>")
368
  html_out += f'<span style="border: 1px solid black;" onclick="showLogprobs({i})" title="Click to show logprobs for this token">{token_to_show}</span>'
369
  show_logprob_js = '''
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
370
  function showLogprobs(i) {
371
  const logprobs = allLogprobs[i].logprobs;
372
- const logprobsHtml = Object.entries(logprobs).map(([token, logprob]) => `<li>${token}: ${Math.exp(logprob)}</li>`).join('');
373
  const container = document.getElementById('logprobs-display');
374
- container.innerHTML = `<ul>${logprobsHtml}</ul>`;
 
375
  }
376
  '''
377
  html_out = f"""
378
- <script>allLogprobs = {json.dumps(logprobs)};
379
-
380
- {show_logprob_js}</script>
381
  <style>
382
  p.logprobs-container {{
383
  background: white;
@@ -392,7 +406,12 @@ def logprobs_component(logprobs):
392
  </style>
393
  <p class="logprobs-container">{html_out}</p>
394
  <div id="logprobs-display"></div>
395
- """
 
 
 
 
 
396
  #return st.html(html_out)
397
  import streamlit.components.v1 as components
398
  return components.html(html_out, height=200, scrolling=True)
 
326
  msg_in_progress + word
327
  )
328
 
329
+ def send_message():
330
+ other_role = "assistant" if last_role == "user" else "user"
331
+ st.session_state['messages'].append({"role": other_role, "content": ""})
332
+ st.session_state['msg_in_progress'] = ""
333
+ st.button("Send", on_click=send_message)
334
+
335
  response = requests.post(
336
  f"{API_SERVER}/logprobs",
337
  json={
 
348
  response = response.json()
349
 
350
  logprobs = response['logprobs']
351
+ st.write("Conversation so far as tokens (click to show logprobs):")
 
 
 
 
 
352
  logprobs_component(logprobs)
353
 
 
 
 
 
 
354
 
355
  def logprobs_component(logprobs):
356
+ # logprobs is a list of tokens:
357
+ # {
358
+ # "token": "the",
359
+ # "logprobs": [{"the": -0.1, "a": -0.2, ...}]
360
+ # }
361
  import html, json
362
  html_out = ''
363
  for i, entry in enumerate(logprobs):
 
368
  token_to_show = html.escape("<empty>")
369
  html_out += f'<span style="border: 1px solid black;" onclick="showLogprobs({i})" title="Click to show logprobs for this token">{token_to_show}</span>'
370
  show_logprob_js = '''
371
+ const makeElt = (tag, attrs, children) => {
372
+ const elt = document.createElement(tag);
373
+ for (const [attr, val] of Object.entries(attrs)) {
374
+ elt.setAttribute(attr, val);
375
+ }
376
+ for (const child of children) {
377
+ if(typeof child === 'string') {
378
+ elt.appendChild(document.createTextNode(child));
379
+ } else {
380
+ elt.appendChild(child);
381
+ }
382
+ }
383
+ return elt;
384
+ }
385
+
386
  function showLogprobs(i) {
387
  const logprobs = allLogprobs[i].logprobs;
 
388
  const container = document.getElementById('logprobs-display');
389
+ container.innerHTML = '';
390
+ container.appendChild(makeElt('ul', {}, Object.entries(logprobs).map(([token, logprob]) => makeElt('li', {}, `${token}: ${Math.exp(logprob)}`))));
391
  }
392
  '''
393
  html_out = f"""
394
+
 
 
395
  <style>
396
  p.logprobs-container {{
397
  background: white;
 
406
  </style>
407
  <p class="logprobs-container">{html_out}</p>
408
  <div id="logprobs-display"></div>
409
+ <script>allLogprobs = {json.dumps(logprobs)};
410
+
411
+ {show_logprob_js}
412
+ showLogprobs(allLogprobs.length - 1);
413
+ </script>
414
+ """
415
  #return st.html(html_out)
416
  import streamlit.components.v1 as components
417
  return components.html(html_out, height=200, scrolling=True)