Graph Viewer

 - Add Annotation possibility
 - Add some helpers in Javascript
 - Change headers and index

Modify Eval

eval.py

@@ -151,7 +151,7 @@ for file in glob.glob(args.graphs_dir.rstrip("/")+"/*.gexf"):
     id=int(re.findall("\d+",file)[-1])
     graphs[id]=nx.read_gexf(file)
 
-graphs_array = [None for i in range(max(graphs.keys()))]
+graphs_array = [None for i in range(max(graphs.keys())+1)]
 for i,g in graphs.items():
         graphs_array[i]=g
 

exp_fev_18.sh

@@ -12,29 +12,31 @@ if [ "$1" == "generate" ]; then
     python3 generate_data.py data/EPI_ELENA/raw_text  data/graph_exp_fev_18/gen_all_1  asso.json generalisation -t all -n 1;
     python3 generate_data.py data/EPI_ELENA/raw_text  data/graph_exp_fev_18/gen_all_2  asso.json generalisation -t all -n 2;
 
-    python3 generate_data.py data/EPI_ELENA/raw_text  data/graph_exp_fev_18/ext_town  asso.json generalisation -t bounded -b town;
+    python3 generate_data.py data/EPI_ELENA/raw_text  data/graph_exp_fev_18/gen_town  asso.json generalisation -t bounded -b town;
     python3 generate_data.py data/EPI_ELENA/raw_text  data/graph_exp_fev_18/gen_region  asso.json generalisation -t bounded -b region;
     python3 generate_data.py data/EPI_ELENA/raw_text  data/graph_exp_fev_18/gen_capital  asso.json generalisation -t bounded -b capital;
     python3 generate_data.py data/EPI_ELENA/raw_text  data/graph_exp_fev_18/gen_country  asso.json generalisation -t bounded -b country;
 fi
 
 if [ "$1" == "eval" ]; then
+    ## Normal STR eval
     dir=normal;
-    mesure=("MCS" "VEO" "HED" "GREEDY" "BOC" "GED" "JACCARD");
+    mesure=("MCS" "VEO" "HED" "GREEDY" "BOC" "GED" "JACCARD" "BOWSE");
     for me in ${mesure[@]}; do
         echo $me" for STR "$dir;
         python3 eval.py $me data/EPI_ELENA/raw_text  data/graph_exp_fev_18/$dir data/graph_exp_fev_18/$dir/asso.json -s data/graph_exp_fev_18/selected.json  -o data/graph_exp_fev_18/result_eval/$dir/;
     done;
 
-   dir=gen_all_1
-    mesure=( "MCS" "VEO"  "JACCARD" "HED" "GREEDY" "BOC");
+    ## Generalised STR eval
+    dir=gen_all_1
+    mesure=( "MCS" "VEO"  "JACCARD" "HED" "GREEDY" "BOC" "BOWSE");
     for me in ${mesure[@]}; do
         echo $me" for STR "$dir;
         python3 eval.py $me data/EPI_ELENA/raw_text  data/graph_exp_fev_18/$dir data/graph_exp_fev_18/$dir/asso.json  -s data/graph_exp_fev_18/selected.json  -o data/graph_exp_fev_18/result_eval/$dir/;
     done;
 
     dir=gen_all_2
-    mesure=( "MCS" "VEO"  "JACCARD" "HED" "GREEDY" "BOC");
+    mesure=( "MCS" "VEO"  "JACCARD" "HED" "GREEDY" "BOC" "BOWSE");
     for me in ${mesure[@]}; do
         echo $me" for STR "$dir;
         python3 eval.py $me data/EPI_ELENA/raw_text  data/graph_exp_fev_18/$dir data/graph_exp_fev_18/$dir/asso.json  -s data/graph_exp_fev_18/selected.json  -o data/graph_exp_fev_18/result_eval/$dir/;
@@ -52,14 +54,15 @@ if [ "$1" == "eval" ]; then
         python3 eval.py $me data/EPI_ELENA/raw_text  data/graph_exp_fev_18/$dir data/graph_exp_fev_18/$dir/asso.json  -s data/graph_exp_fev_18/selected.json  -o data/graph_exp_fev_18/result_eval/$dir/;
     done;
 
+    ## Extended STR eval
     dir=extension_1
-    mesure=( "MCS" "VEO" "JACCARD" "BOC" "WLSUBTREE");
+    mesure=( "MCS" "VEO" "JACCARD" "BOC" "WLSUBTREE" "BOWSE");
     for me in ${mesure[@]}; do
         echo $me" for STR "$dir;
         python3 eval.py $me data/EPI_ELENA/raw_text  data/graph_exp_fev_18/$dir data/graph_exp_fev_18/$dir/asso.json  -s data/graph_exp_fev_18/selected.json  -o data/graph_exp_fev_18/result_eval/$dir/;
     done;
     dir=extension_2
-    mesure=( "MCS" "VEO" "JACCARD" "BOC" "WLSUBTREE");
+
     for me in ${mesure[@]}; do
         echo $me" for STR "$dir;
         python3 eval.py $me data/EPI_ELENA/raw_text  data/graph_exp_fev_18/$dir data/graph_exp_fev_18/$dir/asso.json  -s data/graph_exp_fev_18/selected.json  -o data/graph_exp_fev_18/result_eval/$dir/;

gui_graph_viewer/db.py

@@ -48,20 +48,65 @@ class User(Base):
     def get_id(self):
         return str(self.id)
 
-class Annotation(Base):
-    __tablename__="annotations"
+
+class Graph(Base):
+    __tablename__="graphs"
 
     id = Column(Integer, primary_key=True)
-    type_annotation = Column(String(120))
-    user_id = Column(Integer,ForeignKey('users.id'))
-    data=Column(Text)
-    finished = Column(Boolean)
-
-    def __init__(self, type_annotation,user_id,data,finished=False):
-        self.type_annotation=type_annotation
-        self.user_id=user_id
-        self.finished=finished
-        self.data=data
+    corpus_name=Column(String(120),primary_key=True)
+
+
+    def __init__(self, id_graph, corpus_name):
+        self.id = id_graph
+        self.corpus_name = corpus_name
+
+class Mesure(Base):
+    __tablename__="mesures"
+
+    id = Column(Integer, primary_key=True)
+    label = Column(String(120))
+
+
+    def __init__(self, label):
+        self.label = label
+############################
+
+class Eval(Base):
+    __tablename__="evals"
+    __table_args__ = {'sqlite_autoincrement': True}
+    id = Column(Integer, primary_key=True)
+    id_g1 = Column(Integer,ForeignKey('graphs.id'))
+    id_g2 = Column(Integer, ForeignKey('graphs.id'))
+    mesure = Column(Integer, ForeignKey('mesures.id'))
+    type = Column(String(20))
+    id_user = Column(Integer, ForeignKey('users.id'))
+    c1_val= Column(Boolean)
+    c2_val = Column(Boolean)
+    c3_val = Column(Boolean)
+    c4_val = Column(Boolean)
+
+    def __init__(self, id_g1, id_g2, mesure,type_,id_user,c1,c2,c3,c4):
+        self.id_g1 = id_g1
+        self.id_g2 = id_g2
+        self.mesure = mesure
+        self.id_user = id_user
+        self.type = type_
+        self.c1_val = c1
+        self.c2_val = c2
+        self.c3_val = c3
+        self.c4_val = c4
+    def __repr__(self):
+        return {
+            "id_g1":self.id_g1,
+            "id_g2": self.id_g2,
+            "mesure": self.mesure,
+            "type": self.type,
+            "id_user": self.id_user,
+            "c1": self.c1_val,
+            "c2": self.c2_val,
+            "c3": self.c3_val,
+            "c4": self.c4_val
+        }
 ###################################################
 #              Database Population functions
 ###################################################
@@ -73,7 +118,24 @@ def add_users(session,data):
         session.add(user)
     session.commit()
 
+def add_unique(session,unique,class_):
+
+    i=1
+    association={}
+    for k in mesures:
+        session.add(class_(k))
+        association[k]=i
+    session.commit()
+    return association
+
+def add_graphs_data(session,graphlists,corpus_name):
+
+    for g in graphlists:
+        session.add(Graph(g,corpus_name))
+    session.commit()
+
 if __name__ == '__main__':
+    import glob
     # Create tables (delete if exists)
     Base.metadata.drop_all(engine)
     Base.metadata.create_all(engine)
@@ -83,6 +145,12 @@ if __name__ == '__main__':
     session = Session()
 
     # Load data
-    user_input=pd.read_csv("user.csv",sep=";")
+    user_input=pd.read_csv("gui_graph_viewer/user.csv",sep=";")
     # Populate the database
+    mesures=["MCS","VEO","GED","BP2","HED","GREEDY","WLSUBTREE","BOWSE","BOC","JACCARD"]
+    types=["normal","extension_1","extension_2","extension_3","gen_all_1","gen_all_2",
+          "gen_capital","gen_country","gen_region","gen_town"]
     add_users(session,user_input)
+    add_unique(session,mesures,Mesure)
+    add_graphs_data(session,range(532),"graph_exp_18_fev")
+

gui_graph_viewer/server.py

@@ -6,7 +6,11 @@ import os, json, re, datetime, random, uuid, glob
 from flask import Flask, render_template, url_for, flash, make_response, request, redirect, session, Markup, jsonify
 from flask_session import Session
 from flask_login import LoginManager, login_user, logout_user, current_user, login_required
-from db import *
+try:
+    from gui_graph_viewer.db import *
+except:
+    from db import *
+import math
 
 import argparse
 
@@ -27,7 +31,12 @@ login_manager.init_app(app)
 Load results files
 """
 dir_=args.eval_dir.rstrip("/")
-all_=dir_+"/"+args.prefix
+prefix=args.prefix
+current_type="normal"
+all_=dir_+"/"+current_type+"/"+args.prefix
+
+available_dir=list(os.walk(dir_+"/."))[0][1]
+print(available_dir)
 
 dataFiles=glob.glob(all_+"*")
 data_={}
@@ -46,26 +55,83 @@ def index(gmmeasure=None):
     :param gmmeasure:
     :return:
     """
+    global  available_dir
     if not gmmeasure in data_.keys():
-        gmmeasure="GED"
+        gmmeasure="MCS"
     data=json.load(open(data_[gmmeasure]))
     max_={}
     min_={}
     for k,d_ in data.items():
         max_[int(k)]=d_["top_10"][-1]["score"]
         min_[int(k)] = d_["top_10"][0]["score"]
-    return render_template("index.html",data=json.dumps(data),measureAvailable=list(data_.keys()),measure=gmmeasure,max=max_,min=min_)
+        if math.isnan(max_[int(k)]):
+            max_[int(k)]=0.0
+        if math.isnan(min_[int(k)]):
+            min_[int(k)]=0.0
+    print("max",max_)
+    print("min",min_)
+    return render_template("index.html",data=json.dumps(data),measureAvailable=list(data_.keys()),measure=gmmeasure,max=max_,min=min_,dirs=available_dir,type_=current_type)
 
 @app.route("/about")
 def about():
-    return render_template("about.html",measureAvailable=list(data_.keys()))
+    global available_dir
+    return render_template("about.html",measureAvailable=list(data_.keys()),dirs=available_dir)
+
+@app.route("/changedir/<namedir>")
+def changeSTR(namedir):
+    global data_,prefix,dir_,current_type
+    all_ = dir_ +"/"+namedir + "/" + prefix
+    dataFiles = glob.glob(all_ + "*")
+    data_ = {}
+    for fn in dataFiles:
+        data_[fn.replace(all_, "").rstrip(".json")] = fn
+    current_type=namedir
+    return redirect("/{0}".format(list(data_.keys())[0]))
+
+@app.route("/get_info/<g1id>/<g2id>/<mesure>/<type>")
+def getinfo(g1id,g2id,mesure,type):
+    info=sql_session.query(Eval).filter_by(id_g1=g1id,id_g2=g2id,type=type,mesure=mesure)
+    if info.count() >0:
+        return jsonify(info.first().__repr__())
+    else:
+        return jsonify({})
+
+def getMeasureid(mesure):
+    mesure_query = sql_session.query(Mesure).filter_by(
+        label=mesure
+    )
+    return mesure_query.first().id
+
+@app.route("/save_eval/<g1id>/<g2id>/<mesure>/<type>/<int:c1>/<int:c2>/<int:c3>/<int:c4>")
+def save_eval(g1id,g2id,mesure,type,c1,c2,c3,c4):
+    print(g1id, g2id, mesure, type, c1, c2, c3, c4)
+    c1,c2,c3,c4=bool(c1),bool(c2),bool(c3),bool(c4)
+    print(g1id, g2id, mesure, type, c1, c2, c3, c4)
+    eval_query = sql_session.query(Eval).filter_by(
+        id_g1=g1id,
+        id_g2=g2id,
+        mesure=getMeasureid(mesure),
+        type=type,
+        id_user=current_user.id
+    )
+    if eval_query.count()< 1:
+        sql_session.add(Eval(g1id,g2id,getMeasureid(mesure),type,current_user.id,c1,c2,c3,c4))
+    else:
+        eval_=eval_query.first()
+        eval_.c1_val = c1
+        eval_.c2_val = c2
+        eval_.c3_val = c3
+        eval_.c4_val = c4
+    sql_session.commit()
 
+
+    return "Oh Yeah"
 @app.route("/save")
 @login_required
-
 def save():
     pass
 
+
 ###################################################
 #        User Login/Signup/Logout managment
 ###################################################

gui_graph_viewer/static/js/helpers.js

@@ -104,4 +104,39 @@ function generate_map(id_tiles, locations, edges) {
 
     // return map
     return map;
-}
\ No newline at end of file
+}
+
+function getValidateForm(c_value,c_label,c_name){
+    // form="<form class=\"form-check form-check-inline\">\n";
+    // for (c=0;c<c_value.length;c++){
+    //     form+="\n" +
+    //     "  <label class=\"custom-control custom-checkbox mb-2 mr-sm-2 mb-sm-0\">\n" +
+    //     "    <input type=\"checkbox\" class=\"criteria-checkbox custom-control-input\""+(c_value[c]?"checked" :"")+" name='"+c_name[c]+"'>\n" +
+    //     "    <span class=\"custom-control-indicator\"></span>\n" +
+    //     "    <span class=\"custom-control-description\">"+c_label[c]+"</span>\n" +
+    //     "  </label>\n";
+    // }
+    // form+="</form>";
+    form="<h5 style='display: inline'>Note</h5><div class='form-inline'>\n";
+    for (c=0;c<c_value.length;c++){
+        form+="\n" +
+        "<div class=\"form-check mb-2 mr-sm-2\">\n" +
+        "    <input class=\"form-check-input criteria-checkbox\"  type=\"checkbox\" "+(c_value[c]?"checked " :"")+" name=\""+c_name[c]+"\">\n" +
+        "    <label class=\"form-check-label\" for=\"inlineFormCheck\">\n" +
+        c_label[c] +
+        "    </label>\n" +
+        "</div>";
+        // "<label class=\"\">\n" +
+        // "   <input class='criteria-checkbox' type=\"checkbox\""+(c_value[c]?"checked " :"")+"\"name='"+c_name[c]+"'>"+c_label[c]+
+        // "</label>"
+    }
+    form+="</form>";
+    return form;
+  }
+
+
+
+function isEmpty(obj) {
+  return Object.keys(obj).length === 0;
+}
+

gui_graph_viewer/static/js/leaflet-label.js

+/*
+	Leaflet.label, a plugin that adds labels to markers and vectors for Leaflet powered maps.
+	(c) 2012-2013, Jacob Toye, Smartrak
+
+	https://github.com/Leaflet/Leaflet.label
+	http://leafletjs.com
+	https://github.com/jacobtoye
+*/
+(function(){L.labelVersion="0.2.2-dev",L.Label=L.Class.extend({includes:L.Mixin.Events,options:{className:"",clickable:!1,direction:"right",noHide:!1,offset:[12,-15],opacity:1,zoomAnimation:!0},initialize:function(t,e){L.setOptions(this,t),this._source=e,this._animated=L.Browser.any3d&&this.options.zoomAnimation,this._isOpen=!1},onAdd:function(t){this._map=t,this._pane=this._source instanceof L.Marker?t._panes.markerPane:t._panes.popupPane,this._container||this._initLayout(),this._pane.appendChild(this._container),this._initInteraction(),this._update(),this.setOpacity(this.options.opacity),t.on("moveend",this._onMoveEnd,this).on("viewreset",this._onViewReset,this),this._animated&&t.on("zoomanim",this._zoomAnimation,this),L.Browser.touch&&!this.options.noHide&&L.DomEvent.on(this._container,"click",this.close,this)},onRemove:function(t){this._pane.removeChild(this._container),t.off({zoomanim:this._zoomAnimation,moveend:this._onMoveEnd,viewreset:this._onViewReset},this),this._removeInteraction(),this._map=null},setLatLng:function(t){return this._latlng=L.latLng(t),this._map&&this._updatePosition(),this},setContent:function(t){return this._previousContent=this._content,this._content=t,this._updateContent(),this},close:function(){var t=this._map;t&&(L.Browser.touch&&!this.options.noHide&&L.DomEvent.off(this._container,"click",this.close),t.removeLayer(this))},updateZIndex:function(t){this._zIndex=t,this._container&&this._zIndex&&(this._container.style.zIndex=t)},setOpacity:function(t){this.options.opacity=t,this._container&&L.DomUtil.setOpacity(this._container,t)},_initLayout:function(){this._container=L.DomUtil.create("div","leaflet-label "+this.options.className+" leaflet-zoom-animated"),this.updateZIndex(this._zIndex)},_update:function(){this._map&&(this._container.style.visibility="hidden",this._updateContent(),this._updatePosition(),this._container.style.visibility="")},_updateContent:function(){this._content&&this._map&&this._prevContent!==this._content&&"string"==typeof this._content&&(this._container.innerHTML=this._content,this._prevContent=this._content,this._labelWidth=this._container.offsetWidth)},_updatePosition:function(){var t=this._map.latLngToLayerPoint(this._latlng);this._setPosition(t)},_setPosition:function(t){var e=this._map,i=this._container,n=e.latLngToContainerPoint(e.getCenter()),o=e.layerPointToContainerPoint(t),s=this.options.direction,a=this._labelWidth,l=L.point(this.options.offset);"right"===s||"auto"===s&&o.x<n.x?(L.DomUtil.addClass(i,"leaflet-label-right"),L.DomUtil.removeClass(i,"leaflet-label-left"),t=t.add(l)):(L.DomUtil.addClass(i,"leaflet-label-left"),L.DomUtil.removeClass(i,"leaflet-label-right"),t=t.add(L.point(-l.x-a,l.y))),L.DomUtil.setPosition(i,t)},_zoomAnimation:function(t){var e=this._map._latLngToNewLayerPoint(this._latlng,t.zoom,t.center).round();this._setPosition(e)},_onMoveEnd:function(){this._animated&&"auto"!==this.options.direction||this._updatePosition()},_onViewReset:function(t){t&&t.hard&&this._update()},_initInteraction:function(){if(this.options.clickable){var t=this._container,e=["dblclick","mousedown","mouseover","mouseout","contextmenu"];L.DomUtil.addClass(t,"leaflet-clickable"),L.DomEvent.on(t,"click",this._onMouseClick,this);for(var i=0;e.length>i;i++)L.DomEvent.on(t,e[i],this._fireMouseEvent,this)}},_removeInteraction:function(){if(this.options.clickable){var t=this._container,e=["dblclick","mousedown","mouseover","mouseout","contextmenu"];L.DomUtil.removeClass(t,"leaflet-clickable"),L.DomEvent.off(t,"click",this._onMouseClick,this);for(var i=0;e.length>i;i++)L.DomEvent.off(t,e[i],this._fireMouseEvent,this)}},_onMouseClick:function(t){this.hasEventListeners(t.type)&&L.DomEvent.stopPropagation(t),this.fire(t.type,{originalEvent:t})},_fireMouseEvent:function(t){this.fire(t.type,{originalEvent:t}),"contextmenu"===t.type&&this.hasEventListeners(t.type)&&L.DomEvent.preventDefault(t),"mousedown"!==t.type?L.DomEvent.stopPropagation(t):L.DomEvent.preventDefault(t)}}),L.BaseMarkerMethods={showLabel:function(){return this.label&&this._map&&(this.label.setLatLng(this._latlng),this._map.showLabel(this.label)),this},hideLabel:function(){return this.label&&this.label.close(),this},setLabelNoHide:function(t){this._labelNoHide!==t&&(this._labelNoHide=t,t?(this._removeLabelRevealHandlers(),this.showLabel()):(this._addLabelRevealHandlers(),this.hideLabel()))},bindLabel:function(t,e){var i=this.options.icon?this.options.icon.options.labelAnchor:this.options.labelAnchor,n=L.point(i)||L.point(0,0);return n=n.add(L.Label.prototype.options.offset),e&&e.offset&&(n=n.add(e.offset)),e=L.Util.extend({offset:n},e),this._labelNoHide=e.noHide,this.label||(this._labelNoHide||this._addLabelRevealHandlers(),this.on("remove",this.hideLabel,this).on("move",this._moveLabel,this).on("add",this._onMarkerAdd,this),this._hasLabelHandlers=!0),this.label=new L.Label(e,this).setContent(t),this},unbindLabel:function(){return this.label&&(this.hideLabel(),this.label=null,this._hasLabelHandlers&&(this._labelNoHide||this._removeLabelRevealHandlers(),this.off("remove",this.hideLabel,this).off("move",this._moveLabel,this).off("add",this._onMarkerAdd,this)),this._hasLabelHandlers=!1),this},updateLabelContent:function(t){this.label&&this.label.setContent(t)},getLabel:function(){return this.label},_onMarkerAdd:function(){this._labelNoHide&&this.showLabel()},_addLabelRevealHandlers:function(){this.on("mouseover",this.showLabel,this).on("mouseout",this.hideLabel,this),L.Browser.touch&&this.on("click",this.showLabel,this)},_removeLabelRevealHandlers:function(){this.off("mouseover",this.showLabel,this).off("mouseout",this.hideLabel,this),L.Browser.touch&&this.off("click",this.showLabel,this)},_moveLabel:function(t){this.label.setLatLng(t.latlng)}},L.Icon.Default.mergeOptions({labelAnchor:new L.Point(9,-20)}),L.Marker.mergeOptions({icon:new L.Icon.Default}),L.Marker.include(L.BaseMarkerMethods),L.Marker.include({_originalUpdateZIndex:L.Marker.prototype._updateZIndex,_updateZIndex:function(t){var e=this._zIndex+t;this._originalUpdateZIndex(t),this.label&&this.label.updateZIndex(e)},_originalSetOpacity:L.Marker.prototype.setOpacity,setOpacity:function(t,e){this.options.labelHasSemiTransparency=e,this._originalSetOpacity(t)},_originalUpdateOpacity:L.Marker.prototype._updateOpacity,_updateOpacity:function(){var t=0===this.options.opacity?0:1;this._originalUpdateOpacity(),this.label&&this.label.setOpacity(this.options.labelHasSemiTransparency?this.options.opacity:t)},_originalSetLatLng:L.Marker.prototype.setLatLng,setLatLng:function(t){return this.label&&!this._labelNoHide&&this.hideLabel(),this._originalSetLatLng(t)}}),L.CircleMarker.mergeOptions({labelAnchor:new L.Point(0,0)}),L.CircleMarker.include(L.BaseMarkerMethods),L.Path.include({bindLabel:function(t,e){return this.label&&this.label.options===e||(this.label=new L.Label(e,this)),this.label.setContent(t),this._showLabelAdded||(this.on("mouseover",this._showLabel,this).on("mousemove",this._moveLabel,this).on("mouseout remove",this._hideLabel,this),L.Browser.touch&&this.on("click",this._showLabel,this),this._showLabelAdded=!0),this},unbindLabel:function(){return this.label&&(this._hideLabel(),this.label=null,this._showLabelAdded=!1,this.off("mouseover",this._showLabel,this).off("mousemove",this._moveLabel,this).off("mouseout remove",this._hideLabel,this)),this},updateLabelContent:function(t){this.label&&this.label.setContent(t)},_showLabel:function(t){this.label.setLatLng(t.latlng),this._map.showLabel(this.label)},_moveLabel:function(t){this.label.setLatLng(t.latlng)},_hideLabel:function(){this.label.close()}}),L.Map.include({showLabel:function(t){return this.addLayer(t)}}),L.FeatureGroup.include({clearLayers:function(){return this.unbindLabel(),this.eachLayer(this.removeLayer,this),this},bindLabel:function(t,e){return this.invoke("bindLabel",t,e)},unbindLabel:function(){return this.invoke("unbindLabel")},updateLabelContent:function(t){this.invoke("updateLabelContent",t)}})})(this,document);
\ No newline at end of file

gui_graph_viewer/templates/header.html

@@ -7,6 +7,14 @@
       <div class="collapse navbar-collapse" id="navbarsExampleDefault">
       <ul class="navbar-nav mr-auto">
           <li class="nav-item"><a class="nav-link" href="/about">About</a></li>
+           <li class="nav-item dropdown">
+            <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">STR Type</a>
+            <div class="dropdown-menu">
+                {% for key in dirs%}
+                    <a class="dropdown-item" href="/changedir/{{key}}">{{key}}</span></a>
+                {%endfor%}
+            </div>
+          </li>
           <li class="nav-item dropdown">
             <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">SimilarityMeasure</a>
             <div class="dropdown-menu">

gui_graph_viewer/templates/index.html

@@ -48,19 +48,7 @@
 {% endblock %} {% block script %}
 <script type="text/javascript">
 
-
-  function getValidateForm(){
-  return ""+
-    "<div class='form-check'>"+
-      "<label class='form-check-label'>"+
-        "<input class='form-check-input' type='checkbox' value=''>"+
-        "Validate ?"+
-      "</label>"+
-    "</div>";
-  }
-
-  var json = {{data | safe}}
-  console.log();
+  var json = {{data | safe}};
 
   function getGeoData(data_) {
     final_ = []
@@ -113,20 +101,65 @@
         //console.log(points);
         score=top_10[j]["score"];
         id_=top_10[j]["id_txt"];
+        names_form=[];
+        for (c in ["c_1","c_2","c_3","c_4"]){
+            names_form.push(c+"_"+id+"_"+id_);
+        }
+        var result={};
+        $.getJSON("/get_info/"+id+"/"+id_+"/{{measure}}/{{type_}}",function (json) {
+            result=json;
+        });
+
+        var result = {};
+        $.ajax({
+          url: "/get_info/"+id+"/"+id_+"/{{measure}}/{{type_}}",
+          async: false,
+          dataType: 'json',
+          success: function (json) {
+            result = json;
+          }
+        });
+
+        var bool_val=[false,false,false,false];
+        if (!isEmpty(result)){
+            bool_val=[result.c1,result.c2,result.c3,result.c4];
+            console.log(bool_val);
+        }
+
         var output="<div class='card top10-item col-lg-12' style='margin:1em;padding:0;border:none;'>"+
           "<div class='card-img-top' style='height:200px' id=\"map_annex"+j+"\"></div>"+
           "<div class='card-block'>"+
-            "<p class='card-text' style='padding: 0.3em;color: white;background:"+getColorDistance(score,max_[id],min_[id])+"'>"+
-            "<span class='h4 card-title'>Graph n°"+id_+" - Rank <span class='nc'>"+rank+"</span></span><br>"+
-            "Dist($G_{"+id+"},G_{"+id_+"}$) = <span>"+score+"</span></p>"+getValidateForm()+
-          "</div>"+"</div>";
+            "<div class='card-text' style='padding: 0.3em;color: white;background:"+getColorDistance(score,max_[id],min_[id])+"'>"+
+                "<span class='h4 card-title'>Graph n°"+id_+" - Rank <span class='nc'>"+rank+"</span></span><br>"+
+                "Dist($G_{"+id+"},G_{"+id_+"}$) = <span>"+score+"</span>"+
+                "<hr>"+getValidateForm(bool_val,["ESS","ESC","KER","SPR"],names_form)+
+            "</div>" +
+            "</div>"
+            +"</div>";
         $("#carousel_top10").append(output);
         generate_map("map_annex"+j,points,top_10[j]["edges"]);
         MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
       }
     }
+    $(".criteria-checkbox").change(function () {
+        c_val=[]
+        graph_id=this.getAttribute("name").split("_");
+        var g1=parseInt(graph_id[1]);
+        var g2= parseInt(graph_id[2]);
+        var _url="/save_eval/"+g1+"/"+g2+"/{{measure}}/{{type_}}";
+         $(this).parent().parent().find('input:checkbox').each(function () {
+             checked=$(this).is(':checked')
+             _url+="/"+(checked ? "1" : "0");
+         });
+
+        console.log(graph_id);
+        $.ajax(_url).done(function () {
+            console.log("Saved Successfuly")
+        });
+      });
   });
-  $(".graph_select").trigger('click');
+  //$(".graph_select").trigger('click');
+
 
 </script>
 {% endblock %}
\ No newline at end of file