import streamlit as st
from util import attend, render_html, load


st.set_page_config(
    page_title='👁️ cybersalience')

tokenizer, model = load('bert-base-cased')

st.info(
    'ℹ️ This tool is part of [a suite of experimental tools for thought](https://paulbricman.com/thoughtware) which incorporate AI primitives in knowledge work.')

hide_streamlit_style = '''
            <style>
            # MainMenu {visibility: hidden;}
            footer {visibility: hidden;}
            </style>
            '''
st.markdown(hide_streamlit_style, unsafe_allow_html=True)

st.title('👁️ cybersalience')
st.markdown('A synergy of artificial and organic attention.')
st.markdown('---')

cols = st.columns([1, 1])
query = st.sidebar.text_input(
    'driving query', help='Specify the overarching query which will drive the salience map.', value='cybersalience')
duration = st.sidebar.slider('pulse duration (seconds)', 0., 5., step=0.1, value=2.,
                             help='Specify how long the pulse should take')
focus = st.sidebar.slider('focus strength', 0., 1., step=0.01, value=1.,
                          help='Specify how sharp the focus of the salience map should be. Low focus means the salience is distributed more broadly across tokens. High focus means only a handful of tokens will be attended to. `softmax_temperature = 1 - focus`')
color = st.sidebar.color_picker(
    'halo color', help='Specify the color of the halo around tokens being attended to.', value='#2160EA')

font_family = st.sidebar.selectbox(
    'font family', ['Space Grotesk', 'Monospace', 'Times New Roman', 'Arial', 'Helvetica', 'Courier', 'Calibri', 'Georgia'])
font_size = st.sidebar.slider('font size', 10, 20, step=1, value=14,
                              help='Specify how big the text should be.')

style = f'''
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400&display=swap" rel="stylesheet"> 
<style>
container {{ 
    font-size: {font_size}pt;
    font-family: {font_family}; 
    text-align: justify; }}

.glow-large {{
  animation: glow-large {duration}s ease-out infinite alternate;
}}

@-webkit-keyframes glow-large {{
  from {{
    text-shadow: 0 0 10px #fff;
  }}
  
  to {{
    text-shadow: 0 0 10px {color}, 0 0 20px {color}, 0 0 30px {color}, 0 0 40px {color}, 0 0 50px {color};
  }}
}}

.glow-medium {{
  animation: glow-medium {duration}s ease-out infinite alternate;
}}

@-webkit-keyframes glow-medium {{
  from {{
    text-shadow: 0 0 10px #fff;
  }}
  
  to {{
    text-shadow: 0 0 10px {color}, 0 0 20px {color};
  }}
}}

.glow-small {{
  animation: glow-small {duration}s ease-out infinite alternate;
}}

@-webkit-keyframes glow-small {{
  from {{
    text-shadow: 0 0 10px #fff;
  }}
  
  to {{
    text-shadow: 0 0 10px {color};
  }}
}}
</style>'''

if 'content' not in st.session_state.keys():
    st.session_state['content'] = open('write-up.txt').read()

if st.session_state['content'] == None:
    content = st.text_area('content', height=300)
    if st.button('save'):
        st.session_state['content'] = content
        st.experimental_rerun()
else:
    if ('query' not in st.session_state.keys() or query != st.session_state['query']) or \
            ('focus' not in st.session_state.keys() or focus != st.session_state['focus']):
        raw_pars = st.session_state['content'].split('\n')
        pars = []

        with st.spinner('attending to text...'):
            for raw_par in raw_pars:
                if raw_par.strip() != '':
                    corpus_tokens, attention = attend(
                        raw_par, query, model, tokenizer)
                    pars += [render_html(corpus_tokens, attention, focus)]

    if st.sidebar.button('reset content'):
        st.session_state['content'] = None
        st.experimental_rerun()

    content = style + '<container>' + ''.join(pars) + '</container>'
    st.components.v1.html(content, scrolling=True, height=5000)

st.sidebar.markdown('''---
#### resources
- [lexiscore](https://paulbricman.com/thoughtware/lexiscore) and [decontextualizer](https://paulbricman.com/thoughtware/decontextualizer)
- [humane representation of thought](https://vimeo.com/115154289)
- NLP models [attending to, and forming memories of text](https://distill.pub/2016/augmented-rnns/)
- [representational resources](https://paulbricman.com/reflections/representational-resources)
- [attention in machine translation](https://www.youtube.com/watch?v=SysgYptB198)
- ideas related to my [bachelor's project on interpretability](https://paulbricman.com/reflections/distributions-of-meaning)
- [intro resource on attention in cognitive science](https://mitpress.mit.edu/books/handbook-attention)
- awesome [token-level BERT visualization tool](https://github.com/jessevig/bertviz)
- motivation behind [choosing second-to-last layer](https://github.com/jessevig/bertviz)
- a cognitive architecture which doubles down on [firing synchrony across biologically-plausible neurons](https://www.nengo.ai/)
''')