diff --git a/components/toolbar.html b/components/toolbar.html
index 7e27205..120c777 100644
--- a/components/toolbar.html
+++ b/components/toolbar.html
@@ -1,6 +1,17 @@
 <div id='toolbar'>
     <h1>Ask<span>Assist</span></h1>
-    <div>  
-        <p>... is <span id="watching">watching</span> every <span id="watch-time">54</span> seconds and will, when questions are available, <span id="alert-sound">gently beep</span> <span id="alert-frequency">20</span> times per minute</p>
-    </div>
+
+    <p class="option-sentence">... is 
+        <span id="waiting-branch"><span id="waiting" class="ask-opt">waiting</span> for you to to click.</span>
+        <span id="watching-branch">
+            <span id="watching" class="ask-opt"> watching </span> every <span isoption="true" contenteditable="true" id="watch-time" class="ask-opt">4</span>
+            seconds and, when questions are available, will
+            <span id="alert-sounds">
+                <span id="one" class="ask-opt">rick roll</span>
+                <span id="two" class="ask-opt">beep</span>
+            </span>
+            <span isoption="true" contenteditable="true" id="alert-frequency" class="ask-opt">10</span> times per minute.
+        </span>
+    </p>
+
 </div>
\ No newline at end of file
diff --git a/script_background.js b/script_background.js
index 105a93a..318cd63 100644
--- a/script_background.js
+++ b/script_background.js
@@ -7,26 +7,50 @@ let timer = setInterval(()=>{
 
 chrome.runtime.onMessage.addListener((request, sender, sendResponse)=>{
     console.log(request);
-
     flag = request.message.flag;
     switch (flag) {
         case "alert":
+            console.log('alert request')
             handleAlert(request);
             sendResponse("alerted")
+            break;
         case "get":
+            console.log('get request')
             handleGet(request, sender, sendResponse);
+            break;
+        default:
+            break;
     } 
     return true  
 })
 
 function handleAlert({message}){
-    console.log('handling alert')
-    alert = new Audio(chrome.runtime.getURL(`./assets/sounds/alert${message.option.sound}.mp3`));
+    let frequency = parseInt(message.options['alert-frequency']);
+    let alertInterval = 60/parseInt(message.options['alert-frequency']);
+    console.log("FR:", frequency, "IN", alertInterval, "::",time)
+    console.log((message.options['alert-frequency'] != 0), (time> alertInterval))
     if(
-        alert && 
-        message.option.frequency > 0 && 
-        time>message.option.frequency
-    ){alert.play()}   
+        message.options['alert-frequency'] != 0 && 
+        time < alertInterval
+    ){
+        console.log('aborting alert')
+        return
+    }
+    console.log('handling alert')
+    let alertFile = "";
+    let alerts = message.options["possible-alerts"];
+    console.log(alerts[0], alerts[1]);
+    alerts.forEach(function(alert){
+        console.log(alert.name, message.options["sound-select"]);
+        if (alert.name==message.options["sound-select"]){
+            alertFile = alert.file;
+        }
+    })
+    console.log(alertFile);
+    alert = new Audio(chrome.runtime.getURL(`./assets/sounds/${alertFile}.mp3`));
+    console.log(time, alertInterval);
+    alert.play() 
+    time = 0;
 }
 
 function handleGet(request, sender, sendResponse){
diff --git a/script_foreground.js b/script_foreground.js
index 671926e..6b678ea 100644
--- a/script_foreground.js
+++ b/script_foreground.js
@@ -1,53 +1,95 @@
 let options = {
-    "alert-frequency": 10,
-    "alert-sound": 1,
-    "refresh-frequency": 2
+    "alert-frequency":5,
+    "sound-select":"rick roll",
+    "watch-time": 4,
+    "possible-alerts": [
+        {name:"rick roll", file:'alert2'},
+        {name:"soft beep", file:'alert1'}
+    ]
 };
+function saveOptions(){
+    document.querySelectorAll('[isOption="true"]').forEach(function(el){
+        options[el.id]=el.innerHTML;
+    })
+    let soundSelect = "";
+    document.querySelectorAll('#alert-sounds>*').forEach(function(el){
+        if(el.style.display!="none"){
+            soundSelect = (soundSelect) ? "error:multiple chosen" : el.innerHTML;
+        }
+    })
+    options["sound-select"]=soundSelect;
+    console.log(options);
+}
 
 function appendTool(html){
     // fetch the plugin components from the background script...
-    chrome.runtime.sendMessage({message:{flag:"get", options:[{name:'toolbar', path:"./components/toolbar.html"}, {name:'options', path:"./components/options.html"}]}}, function(res){
+    chrome.runtime.sendMessage(
+        {message:
+            {flag:"get", options:[
+             {name:'toolbar', path:"./components/toolbar.html"}
+            ]}
+        }, 
+        function(res){   
         //... and append them
-        document.querySelector('.p-workspace__primary_view_contents').innerHTML=res.toolbar+document.querySelector('.p-workspace__primary_view_contents').innerHTML;
+        let toolbar = document.createElement('div');
+        toolbar.innerHTML=res.toolbar;
+        let workspace = document.querySelector('.p-workspace__primary_view_contents');
+        workspace.prepend(toolbar);
         //... and their event listeners
-        document.querySelector('#start-timer').addEventListener('click', function(){
-            start.style.display = 'none';
-            stop.style.display = 'inline-block';
+        let waiting = document.querySelector('#waiting');
+        let watching = document.querySelector('#watching');
+        let waitBrach = document.querySelector('#waiting-branch');
+        let watchBrach = document.querySelector('#watching-branch');
+        waiting.addEventListener('click', function(){
+            console.log('running refresh')
+            waitBrach.style.display = "none";
+            watchBrach.style.display = "inline";
             timer = setInterval(function(){
-                var refresh_btn = document.querySelectorAll('[data-qa-action-id="refresh-queue"]')[0];
-                if(refresh_btn){refresh_btn.click()};
+                var refresh_btn = document.querySelector('[data-qa-action-id="refresh-queue"]');
+                refresh_btn.click();
                 if(newQuestion()){
-                    chrome.runtime.sendMessage({message:{flag:"alert", option:options["alert-sound"]}});
+                    let message = {message:{flag:"alert", options:options}};
+                    console.log('New Question Detected - sending alert to background', message);
+                    chrome.runtime.sendMessage(message);
                 };
-                console.log(options["refresh-frequency"]*1000)
-            }, options["refresh-frequency"]*1000);
+            }, options["watch-time"]*1000);
             return timer;
         });
-        document.querySelector('#stop-timer').addEventListener('click', function(){
-            stop.style.display = 'none';
-            start.style.display = 'inline';
+        watching.addEventListener('click', function(){
+            waitBrach.style.display = "inline";
+            watchBrach.style.display = "none";
             clearInterval(timer);   
         });
-        document.querySelector('#settings-button').addEventListener('click', function(){
-            let container = document.querySelector('#options-container');
-            if(container.classList.contains('slideOut')){
-                container.classList.remove('slideOut');
-            } else {
-                container.classList.add('slideOut');
-            }
-        });
-        document.querySelectorAll('.ask-option').forEach(function(el){
-            el.addEventListener('change', function(e){
-                options[e.target.id]=e.target.value;
-                console.log(options);
+        document.querySelectorAll('#alert-sounds>*').forEach(function(el,i){
+            el.addEventListener('click', function(e){
+                let next = (e.target.id == "one")? "two" : "one";
+                document.querySelectorAll('#alert-sounds>*').forEach(function(el,i){
+                    el.style.display = 'none';
+                })
+                document.querySelector('#'+next).style.display = 'inline';
+                options["alert-sound"]=document.querySelector('#'+next).innerHTML;
             })
         })
-        var start = document.querySelector('#start-timer');
-        var stop = document.querySelector('#stop-timer');
-    })
-}
+        document.querySelectorAll("[contenteditable='true']").forEach(function(el){
+            // approximate on('change') which does not appear to work
+            function handleChange(e){
+                saveOptions();
+            }
+            el.addEventListener("blur", handleChange);
+            el.addEventListener("input", handleChange);
+            // prevent return and overspacing on contenteditable features
+            el.addEventListener("keypress", function(e){ 
+                if (e.target.innerHTML.length>2){
+                    e.preventDefault();
+                };
+                if (isNaN(String.fromCharCode(e.which))) e.preventDefault();
+            });
+        });
+    });
+};
 
 function newQuestion(){
+    console.log('searching for new question...')
     let search = document.body.innerHTML.search('<b data-stringify-type="bold">AVAILABLE QUESTIONS</b>');
     if(search!==-1){
         return true;
diff --git a/styles.css b/styles.css
index 7ac58c0..b2a15f0 100644
--- a/styles.css
+++ b/styles.css
@@ -1,95 +1,63 @@
 #toolbar { 
-    margin: 0.5rem 1rem;
+    padding: 1rem;
     display: inline-block;
-    padding-top: 1rem;
-    padding-right: 35px;
+    padding-right: 25px;
     width: 100%;
-    height: 100px;
-    margin-right: -15px;
+    height: 60px;
     border-bottom: 1px solid #dddddd;
 }
 #toolbar>h1{
-    float:left;
-} 
+    display: inline;
+    float: left;
+}
 #toolbar>h1>span{
     color:#5FB4D8;
     font-style: italic;
     font-weight: bold;
 }
-#toolbar>div{
-    float: right;
+
+[contenteditable="true"]{
+    display: inline-block;
+    min-width:10px;
+    height: 32.5px;
 }
-#toolbar>div>p{
+#alert-sounds>*{
+    display:none;
+}
+#alert-sounds>*:first-child{
+    display:inline-block;
+}
+#waiting{
+    color: coral;
+}
+
+#watching-branch{
+    display: none;
+}
+.ask-opt{
+    padding:0px;
+    margin:0px;
+    color: #5FB4D8;
+    height: 25px;
+}
+#two {
+    display: none;
+}
+.option-sentence{
     line-height: 2;
+    height:25px;
     font-style: italic;
     display: inline;
     font-size:1.2rem;
-    margin: 0px;
-    padding: 0px;
-}
-#toolbar>div>p>span{
-    color: #5FB4D8;
     font-weight: bold;
-    border-bottom:3px solid #5FB4D8;
-}
-#toolbar>div>input,select{
-    display:inline;
+    max-width: 900px;
     margin: 0px;
     padding: 0px;
-    border:none;
-    max-width: ;
-    border-bottom:1px dotted #dddddd;
+    float: right;
 }
-#toolbar>div>div{
-    background-color: #5FB4D8;
-    height: 100%;
-    width: 50px;
+.option-sentence>span{
+    height:25px;
 }
 
-#waiting{
-    display: none;
-}
 
-.divider {
-    display: inline;
-    margin-left: 1rem;
-    margin-right: 1rem;
-}
-.cusBut {
-    display: inline-block;
-    border-radius: 3px;
-    background-color: white;
-    line-height: 1.6;
-    border: 1px solid #dddddd; 
-    width: 130px;
-    height: 35px;
-    text-align: center; 
-    color:white;
-    padding:0.5rem;
-    padding-top:0.25rem;
-    margin:0px;
-}
-#watching {
-    border: 1px solid #93d68b71;;
-    color:#92D68B;;
-    font-weight: 700;
-    font-size: 15px;
-    display: inline;
-} 
-#watching:hover {
-    box-shadow: 0 1px 3px 0 rgba(0,0,0,.08);
-    background: rgba(var(--sk_foreground_min,29,28,29),.04);
-} 
-#waiting {
-    display: none;
-    border: 1px solid rgba(226, 2, 2, 0.3);
-    color:  #E70002;
-    font-weight: 700;
-    font-size: 15px;
-    cursor: pointer;
-} 
-#waiting:hover {
-    box-shadow: 0 1px 3px 0 rgba(0,0,0,.08);
-    background: rgba(var(--sk_foreground_min,29,28,29),.04);
-}