Relay to server works

xoncept/static/css/xoncept.css

@@ -5,6 +5,8 @@
 
   p {
      color: #222222;
+     margin-top:0;
+     padding-top:0;
   }
 
   ul.obj_drop {

xoncept/static/html/xoncept.html

@@ -16,7 +16,7 @@
     <div class="obj_icons"> <a href="/wiki/{{{{title}}}}"><span  style="display:inline-block;" class="ui-icon ui-icon-pencil"></span></a> <span style="display:inline-block;" class="ui-icon ui-icon-close lo_close"></span> </div>
   </div>
   <div class="objective_desc">
-    {{{{render}}}}
+    {{{{{{render}}}}}}
   </div>
 </div>
 </script>

xoncept/static/js/xoncept.js

 var lo_source   = $("#lo-template").html();
 var template = Handlebars.compile(lo_source);
 
+var xblock_runtime = null;
+var xblock_element = null;
+
+function ConceptXBlock(runtime, element)
+{
+    xblock_runtime = runtime;
+    xblock_element = element;
+    console.log( runtime );
+    init();
+    //console.log( element );
+}
+
 function update_item(item, slug, full)
 {
     item.data('slug',slug);
@@ -49,18 +61,22 @@ function dump_state()
 
 function refresh_search(search_string)
 {
-    $.getJSON("http://pmitros.edx.org:8000/get_concept_list", {'q':search_string}, function(data) {
+    url = xblock_runtime.handlerUrl(xblock_element, 'relay_handler')
+    //$.getJSON("http://pmitros.edx.org:8000/get_concept_list", {'q':search_string}, function(data) {
+    $.post(url, JSON.stringify({'suffix':'get_concept_list','q':search_string}), function(data) {
 	$(".search_results").text("");
 	for (var i = 0; i<data.length; i++) {
-            add_search_item(data[i], "Hello World");
+	    var slug = data[i];
+	    url = xblock_runtime.handlerUrl(xblock_element, 'relay_handler')
+	    $.post(url, JSON.stringify({'suffix':'get_concept/'+slug}), function(render) {
+	    //$.getJSON("http://pmitros.edx.org:8000/get_concept/"+slug, function(render) {
+		add_search_item(slug, render.article);
+	    })
 	}
     })
 }
 
-$(function() {
-    //var html = template({title:"Hello", render:"Hello world example"});
-    //$("#foo").html(html);
-    
+function init() {
     $(".obj_drop").sortable({
 	connectWith: ".obj_drop",
 	update : function(event, ui) { dump_state(); },
@@ -78,4 +94,10 @@ $(function() {
     $(".search_input").change(function(){
 	refresh_search($(".search_input").val());
     });
+}
+
+$(function() {
+    //var html = template({title:"Hello", render:"Hello world example"});
+    //$("#foo").html(html);
+//    init();
 });

xoncept/xoncept.py

@@ -2,6 +2,8 @@
 
 import pkg_resources
 
+import json, requests
+
 from xblock.core import XBlock
 from xblock.fields import Scope, Integer, String
 from xblock.fragment import Fragment
@@ -14,11 +16,19 @@ class XonceptXBlock(XBlock):
 
     # Fields are defined on the class.  You can access them in your code as
     # self.<fieldname>.
-    src = String(
+    server = String(
            scope = Scope.settings, 
-           help = "URL for MP3 file to play"
+           help = "Concept map server URL"
         )
 
+    @XBlock.json_handler
+    def relay_handler(self, request, suffix):
+        print request, type(request), dict(request)
+        url = self.server+request['suffix']
+        r = requests.get(url, params=request) 
+        print url,":", r.text[:80]
+        return json.loads(r.text)
+
     def resource_string(self, path):
         """Handy helper for getting resources from our kit."""
         data = pkg_resources.resource_string(__name__, path)
@@ -31,9 +41,9 @@ class XonceptXBlock(XBlock):
         when viewing courses.
         """
         html = self.resource_string("static/html/xoncept.html")
-        print self.src
+        print self.server
         print html.format
-        frag = Fragment(html.format(src = self.src))
+        frag = Fragment(html.format(server = self.server))
         frag.add_css_url("https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css")
         frag.add_css(self.resource_string("static/css/xoncept.css"))
 
@@ -43,7 +53,7 @@ class XonceptXBlock(XBlock):
 
         frag.add_javascript(self.resource_string("static/js/xoncept.js"))
 
-        #frag.initialize_js('XonceptXBlock')
+        frag.initialize_js('ConceptXBlock')
         print self.xml_text_content()
         return frag
 
@@ -55,7 +65,7 @@ class XonceptXBlock(XBlock):
         return [
             ("XonceptXBlock",
              """<vertical_demo>
-                  <Xoncept src="http://localhost/Ikea.mp3"> </Xoncept>
+                  <Xoncept server="http://pmitros.edx.org:8000/"> </Xoncept>
                 </vertical_demo>
              """),
         ]