improved related question in the widget feature

3 files changed, 82 insertions, 16 deletions

diff --git a/askbot/skins/common/media/js/live_search_new_thread.js b/askbot/skins/common/media/js/live_search_new_thread.js
index 53c820fa..38170692 100644
--- a/askbot/skins/common/media/js/live_search_new_thread.js
+++ b/askbot/skins/common/media/js/live_search_new_thread.js
@@ -43,6 +43,7 @@ var liveSearchNewThreadInit = function() {
                 list_item.append(count_element);
                 var link = $('<a></a>');
                 link.attr('href', url);
+                link.attr('target', '_blank');
                 list_item.append(link);
                 title_element = $('<span class="title"></span>');
                 title_element.html(title);
diff --git a/askbot/skins/default/templates/embed/ask_by_widget.html b/askbot/skins/default/templates/embed/ask_by_widget.html
index dddb4aa6..8b5fc5e2 100644
--- a/askbot/skins/default/templates/embed/ask_by_widget.html
+++ b/askbot/skins/default/templates/embed/ask_by_widget.html
@@ -27,20 +27,50 @@
       margin-bottom: 10px;
     }
 
-    .related-questions{
-      margin-bottom: 10px;
+    #question-list {
+      height: auto;
+    }
+
+    #question-list h2{
+      text-decoration: none;
+      margin: 0px;
+      font-size: 13px;
+      color: #005580;
+      padding: 3px 0 3px 5px;
+      margin-left: 15px;
+      padding-bottom: 0;
+      border-top: #F0F0EC 1px solid;
+      border-left: #F0F0EC 1px solid;
+      min-height: 30px;
+      line-height: 30px;
+      font-weight: normal
     }
 
-    .related-questions p, a{
-      font-size: 110%;
-      margin:0;
+    #question-list a:hover{
+        color: #005580;
+        text-decoration: underline;
     }
 
-    .related-questions a{
+    #question-list a:visited{
+      color: #005580;
       text-decoration: none;
-      font-size: 80%;
-      color: #000;
-      margin-left: 15px;
+    }
+
+    #question-list span{
+      width: 28px;
+      height: 26px;
+      line-height: 26px;
+      text-align: center;
+      margin-right: 10px;
+      float: left;
+      display: block;
+      color: white;
+      background: #B8D0D5;
+      border-radius: 3px;
+      -ms-border-radius: 3px;
+      -moz-border-radius: 3px;
+      -webkit-border-radius: 3px;
+      -khtml-border-radius: 3px;
     }
     {{widget.inner_style}}
   </style>
@@ -51,13 +81,9 @@
 <form action="." method="POST" accept-charset="utf-8">
   {% csrf_token %}
   <label>{%trans%}Please enter a descriptive title for your question{%endtrans%}</label>
-  {{form.title}}
+  <input autocomplete="off" id="id_title" type="text" name="title" size="70" class='questionTitleInput'>
   {% if related_questions %}
-  <div class='related-questions'>
-    <p>{%trans%}Related questions: {%endtrans%}
-    {%for question in related_questions %}
-      <div class='question'><a href="{{question.get_absolute_url()}}">{{question.title}}</a></div>
-    {%endfor%}
+  <div id='question-list'>
   </div>
   {%endif%}
   {{form.text}}
@@ -69,5 +95,44 @@
 {{form.errors}}
 {%endblock%}
 {% block endjs %}
+  <script type='text/javascript' src='{{"/js/live_search_new_thread.js"|media}}'></script>
+  <script type="text/javascript" charset="utf-8">
+    var minSearchWordLength = {{settings.MIN_SEARCH_WORD_LENGTH}};
+    askbot['urls']['api_get_questions'] = '{% url api_get_questions %}';
+    liveSearchNewThreadInit();
+/*
+    var createRelatedDOM = function(data){
+      element = $('<div></div>');
+      element.attr({class:"question"});
+      link = $("<a></a>");
+      //link.attr({href:})
+      link.text(data.title);
+      element.append(link);
+      $('.related-questions').append(element);
+    };
+
+    $(document).ready(function(){
+      $('.related-questions').hide();
+      $("#id_title").change(function(){
+        data = {query: this.value, _: new Date().getTime()};
+        console.log(data);
+        $.getJSON("{% url api_get_questions %}", data, function(data){
+
+          console.log('entro');
+          if (data.length != 0){
+            $('.related-questions').show();
+          } else{
+            $('.related-questions').hide();
+          }
+
+          $.each(data, function(key, value){
+            createRelatedDOM(value);
+          });
+        }); 
+      });
+        
+    });
+    */
+  </script>
 {% endblock %}
 
diff --git a/askbot/skins/default/templates/widget_base.html b/askbot/skins/default/templates/widget_base.html
index d23c07bc..44be3e5f 100644
--- a/askbot/skins/default/templates/widget_base.html
+++ b/askbot/skins/default/templates/widget_base.html
@@ -4,7 +4,6 @@
     {% spaceless %}
     <head>
         {% include "meta/html_head_javascript.html" %}
-        {% include "meta/bottom_scripts.html" %}
         {% block before_css %}{% endblock %}
         {% block forestyle %}{% endblock %}
         {% block forejs %}{% endblock %}
@@ -15,6 +14,7 @@
         {% endblock %}
         {% block content%}
         {% endblock %}
+        {% include "meta/bottom_scripts.html" %}
         {% block endjs %}
         {% endblock %}
     </body>