--- a/annot-server/static/css/app.css Thu Jan 22 02:58:41 2015 +0100
+++ b/annot-server/static/css/app.css Thu Jan 22 03:23:08 2015 +0100
@@ -63,7 +63,7 @@
font-size: 2vw;
}
.send{
- background-color: #4cae4c;
+ background-color: #536991;
}
.return{
background-color: #e6e6e6;
--- a/annot-server/static/css/app.min.css Thu Jan 22 02:58:41 2015 +0100
+++ b/annot-server/static/css/app.min.css Thu Jan 22 03:23:08 2015 +0100
@@ -10,7 +10,7 @@
.mons-button .content .table .table-cell{display:table-cell;text-align:center;vertical-align:middle;text-shadow:0 0 5px #fff}
.large-cat{font-size:300%;font-size:4vw}
.normal-cat{font-size:100%;font-size:2vw}
-.send{background-color:#4cae4c}
+.send{background-color:#536991}
.return{background-color:#e6e6e6}
.return,.send{padding-bottom:15%}
.row input{font-size:1.2em}
--- a/annot-server/static/css/lib.min.css Thu Jan 22 02:58:41 2015 +0100
+++ b/annot-server/static/css/lib.min.css Thu Jan 22 03:23:08 2015 +0100
@@ -83,7 +83,7 @@
* Copyright 2011-2014 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
- /*! normalize.css v3.0.0 | MIT License | git.io/normalize */
+/*! normalize.css v3.0.0 | MIT License | git.io/normalize */
html{font-family:sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}
body{margin:0}
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}
@@ -141,7 +141,7 @@
button,input,select,textarea{font-family:inherit;font-size:inherit;line-height:inherit}
a{color:#428bca;text-decoration:none}
a:focus,a:hover{color:#2a6496;text-decoration:underline}
-a:focus{outline:-webkit-focus-ring-color auto 5px;outline-offset:-2px}
+a:focus{outline:dotted thin;outline:-webkit-focus-ring-color auto 5px;outline-offset:-2px}
figure{margin:0}
img{vertical-align:middle}
.carousel-inner>.item>a>img,.carousel-inner>.item>img,.img-responsive,.thumbnail a>img,.thumbnail>img{display:block;max-width:100%;height:auto}
@@ -475,7 +475,7 @@
input[type=file]{display:block}
input[type=range]{display:block;width:100%}
select[multiple],select[size]{height:auto}
-input[type=checkbox]:focus,input[type=file]:focus,input[type=radio]:focus{outline:dotted thin;outline:-webkit-focus-ring-color auto 5px;outline-offset:-2px}
+input[type=checkbox]:focus,input[type=radio]:focus,input[type=file]:focus{outline:dotted thin;outline:-webkit-focus-ring-color auto 5px;outline-offset:-2px}
output{display:block;padding-top:7px;font-size:14px;line-height:1.42857143;color:#555}
.form-control{display:block;width:100%;height:34px;padding:6px 12px;font-size:14px;line-height:1.42857143;color:#555;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}
.form-control:focus{border-color:#66afe9;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)}
@@ -1039,7 +1039,7 @@
.label:empty{display:none}
.btn .label{position:relative;top:-1px}
.label-default{background-color:#999}
-.label-default[href]:focus,.label-default[href]:hover{background-color:gray}
+.label-default[href]:focus,.label-default[href]:hover{background-color:grey}
.label-primary{background-color:#428bca}
.label-primary[href]:focus,.label-primary[href]:hover{background-color:#3071a9}
.label-success{background-color:#5cb85c}
--- a/annot-server/static/js/app.js Thu Jan 22 02:58:41 2015 +0100
+++ b/annot-server/static/js/app.js Thu Jan 22 03:23:08 2015 +0100
@@ -35,6 +35,16 @@
);
}
+ function parseColor(input) {
+ var m = input.match(/^rgb\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i);
+ if( m) return [m[1],m[2],m[3]];
+ else throw new Error("Colour "+input+" could not be parsed.");
+ }
+
+ function rgbToHex(r, g, b) {
+ return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
+ }
+
$scope.data = dataModel.data;
var process_categories = function(data) {
@@ -50,7 +60,12 @@
}
}
}
- $scope.allCatLabels = cats;
+ if(typeof data.autocomplete === 'undefined' || data.autocomplete.length === 0) {
+ $scope.allCatLabels = cats;
+ }
+ else {
+ $scope.allCatLabels = data.autocomplete;
+ }
}
};
@@ -101,7 +116,7 @@
} else {
wsuri = 'ws://' + window.location.hostname + ':8090/annot';
}
-
+
var eventCode = context.event_code;
if(typeof eventCode==='undefined' || eventCode===''){
eventCode = $location.search().event;
@@ -173,7 +188,12 @@
};
}
- $scope.sendAnnotation = function(label, code, c){
+ $scope.sendFreeAnnotation = function(label, text) {
+ $scope.sendAnnotation(label, window.S(label).slugify().s, label, text, $scope.data.defaultColor || "#536991");
+ };
+
+ $scope.sendAnnotation = function(label, code, freeLabel, freetext, color, c){
+
if($scope.username==='' || typeof $scope.username==='undefined'){
showAlert('Vous devez indiquer un nom d\'utilisateur.', false);
return;
@@ -187,8 +207,21 @@
if(typeof code==='undefined' || code===''){
code = window.S(label).slugify().s;
}
+
+ var hexc;
+ if(color.substring(0, 4) === 'rgb(') {
+ var rgbc = parseColor(color);
+ hexc = rgbToHex(rgbc[0],rgbc[1], rgbc[2]);
+ }
+ else {
+ hexc = color;
+ }
+
+
var new_annot = {
category: {code: code, label: label},
+ text: freetext,
+ color: hexc,
user : $scope.username
};
sock.send(JSON.stringify(new_annot));
@@ -201,6 +234,8 @@
else{
$scope.annotPile.push(c);
}
+ $scope.catText = "";
+ $scope.catLabel = "";
} else {
showAlert('La socket ne fonctionne pas.', false);
if(context.logging===true){
@@ -210,7 +245,7 @@
};
// Interface management
- $scope.selectLevel = function(label, code, c){
+ $scope.selectLevel = function(label, code, freelabel, freetext, color, c){
if(typeof c==='undefined'){
$scope.returnVisStyle = {visibility:'hidden'};
$scope.selectedlevel = false;
@@ -223,7 +258,7 @@
else{
// Send query
//console.log('send ntm', c);
- $scope.sendAnnotation(label, code, c);
+ $scope.sendAnnotation(label, code, freelabel, freetext, color, c);
}
};
--- a/annot-server/static/js/app.min.js Thu Jan 22 02:58:41 2015 +0100
+++ b/annot-server/static/js/app.min.js Thu Jan 22 03:23:08 2015 +0100
@@ -1,1 +1,1 @@
-!function(){"use strict";angular.module("mons",["ngResource","ngRoute","autocomplete"]).config(function(e){e.when("/",{controller:"homeCtrl"}).otherwise({redirectTo:"/"})}).config(function(e){e.debugEnabled(!0)}).service("dataApi",function(e,n){this.dataResource=e(n.urls.dataUrl)}).service("dataModel",function(e,n){this.data="undefined"!=typeof n.categories_json&&n.categories_json?JSON.parse(n.categories_json):e.dataResource.get()}).controller("homeCtrl",function(e,n,t,o,i){function r(e){return decodeURI((new RegExp(e+"=(.+?)(&|$)").exec(location.search)||[,null])[1])}function s(n,t){e.alertMessage=n,e.showSuccessAlert=t,e.showAlertDiv=!0,e.$$phase||e.$apply(),e.currentInterval&&(i.cancel(e.currentInterval),e.currentInterval=!1),e.currentInterval=i(function(){i.cancel(e.currentInterval),e.showAlertDiv=!1},2e3,1)}function a(e){d&&(d.innerHTML+=e+"\n",d.scrollTop=d.scrollHeight)}e.data=t.data;var c=function(n){if("undefined"!=typeof n.categories&&n.categories.length>0){for(var t=[],o=n.categories.length,i=0;o>i;i++)if(t.push(n.categories[i].label),"undefined"!=typeof n.categories[i].subcategories&&n.categories[i].subcategories.length>0)for(var r=n.categories[i].subcategories.length,s=0;r>s;s++)t.push(n.categories[i].subcategories[s].label);e.allCatLabels=t}};"undefined"!=typeof t.data.$promise?t.data.$promise.then(c):c(t.data),e.selectedlevel=!1,e.currentInterval=!1,e.showSuccessAlert=!1,e.showAlertDiv=!1,e.annotPile=[];var l=null,d=null;d=document.getElementById("log");var u;u="file:"===window.location.protocol?"ws://127.0.0.1:8090/annot":"ws://"+window.location.hostname+":8090/annot";var f=o.event_code;return"undefined"!=typeof f&&""!==f||(f=n.search().event,"undefined"!=typeof f&&""!==f||(f=r("event"),"undefined"!=typeof f&&""!==f))?(u=u+"?event="+f,"WebSocket"in window?l=new WebSocket(u):"MozWebSocket"in window?l=new window.MozWebSocket(u):(o.logging===!0&&a("Browser does not support WebSocket!"),window.location="http://autobahn.ws/unsupportedbrowser"),l&&(l.onopen=function(){o.logging===!0&&a("Connected to "+u)},l.onclose=function(e){o.logging===!0&&a("Connection closed (wasClean = "+e.wasClean+", code = "+e.code+", reason = "+e.reason+")"),s("Communication interrompue : la socket vient de se fermer.",!1),l=null},l.onmessage=function(n){var t=JSON.parse(n.data);if(o.logging&&a("Got message: "+n.data),e.annotPile.length>0){var r,s=e.annotPile.shift(),c="OK"===t.status;s===!1?(e.sendBtnSuccess=c,e.sendBtnError=!c,r=i(function(){i.cancel(r),e.sendBtnSuccess=!1,e.sendBtnError=!1},2e3,1)):(s.sendSuccess=c,s.sendError=!c,r=i(function(){i.cancel(r),s.sendSuccess=!1,s.sendError=!1},2e3,1)),e.$$phase||e.$apply()}}),e.sendAnnotation=function(n,t,i){if(""===e.username||"undefined"==typeof e.username)return void s("Vous devez indiquer un nom d'utilisateur.",!1);if(""===n||"undefined"==typeof n)return void s("Vous devez indiquer un nom de catégorie.",!1);if(l){("undefined"==typeof t||""===t)&&(t=window.S(n).slugify().s);var r={category:{code:t,label:n},user:e.username};l.send(JSON.stringify(r)),o.logging===!0&&a("Sent: "+JSON.stringify(r)),e.annotPile.push("undefined"==typeof i?!1:i)}else s("La socket ne fonctionne pas.",!1),o.logging===!0&&a("Not connected.")},void(e.selectLevel=function(n,t,o){return"undefined"==typeof o?(e.returnVisStyle={visibility:"hidden"},void(e.selectedlevel=!1)):void("undefined"!=typeof o.subcategories&&o.subcategories.length>0?(e.selectedlevel=o.subcategories,e.returnVisStyle={visibility:"show"}):e.sendAnnotation(n,t,o))})):void alert("le code de l'événement doit être indiqué dans un paramètre de template u dans l'url selon ?event=CODE_EVENEMENT.")})}();
\ No newline at end of file
+!function(){"use strict";angular.module("mons",["ngResource","ngRoute","autocomplete"]).config(function(e){e.when("/",{controller:"homeCtrl"}).otherwise({redirectTo:"/"})}).config(function(e){e.debugEnabled(!0)}).service("dataApi",function(e,n){this.dataResource=e(n.urls.dataUrl)}).service("dataModel",function(e,n){this.data="undefined"!=typeof n.categories_json&&n.categories_json?JSON.parse(n.categories_json):e.dataResource.get()}).controller("homeCtrl",function(e,n,t,o,r){function i(e){return decodeURI((new RegExp(e+"=(.+?)(&|$)").exec(location.search)||[,null])[1])}function s(e){var n=e.match(/^rgb\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i);if(n)return[n[1],n[2],n[3]];throw new Error("Colour "+e+" could not be parsed.")}function a(e,n,t){return"#"+((1<<24)+(e<<16)+(n<<8)+t).toString(16).slice(1)}function c(n,t){e.alertMessage=n,e.showSuccessAlert=t,e.showAlertDiv=!0,e.$$phase||e.$apply(),e.currentInterval&&(r.cancel(e.currentInterval),e.currentInterval=!1),e.currentInterval=r(function(){r.cancel(e.currentInterval),e.showAlertDiv=!1},2e3,1)}function l(e){f&&(f.innerHTML+=e+"\n",f.scrollTop=f.scrollHeight)}e.data=t.data;var u=function(n){if("undefined"!=typeof n.categories&&n.categories.length>0){for(var t=[],o=n.categories.length,r=0;o>r;r++)if(t.push(n.categories[r].label),"undefined"!=typeof n.categories[r].subcategories&&n.categories[r].subcategories.length>0)for(var i=n.categories[r].subcategories.length,s=0;i>s;s++)t.push(n.categories[r].subcategories[s].label);e.allCatLabels="undefined"==typeof n.autocomplete||0===n.autocomplete.length?t:n.autocomplete}};"undefined"!=typeof t.data.$promise?t.data.$promise.then(u):u(t.data),e.selectedlevel=!1,e.currentInterval=!1,e.showSuccessAlert=!1,e.showAlertDiv=!1,e.annotPile=[];var d=null,f=null;f=document.getElementById("log");var g;g="file:"===window.location.protocol?"ws://127.0.0.1:8090/annot":"ws://"+window.location.hostname+":8090/annot";var p=o.event_code;return"undefined"!=typeof p&&""!==p||(p=n.search().event,"undefined"!=typeof p&&""!==p||(p=i("event"),"undefined"!=typeof p&&""!==p))?(g=g+"?event="+p,"WebSocket"in window?d=new WebSocket(g):"MozWebSocket"in window?d=new window.MozWebSocket(g):(o.logging===!0&&l("Browser does not support WebSocket!"),window.location="http://autobahn.ws/unsupportedbrowser"),d&&(d.onopen=function(){o.logging===!0&&l("Connected to "+g)},d.onclose=function(e){o.logging===!0&&l("Connection closed (wasClean = "+e.wasClean+", code = "+e.code+", reason = "+e.reason+")"),c("Communication interrompue : la socket vient de se fermer.",!1),d=null},d.onmessage=function(n){var t=JSON.parse(n.data);if(o.logging&&l("Got message: "+n.data),e.annotPile.length>0){var i,s=e.annotPile.shift(),a="OK"===t.status;s===!1?(e.sendBtnSuccess=a,e.sendBtnError=!a,i=r(function(){r.cancel(i),e.sendBtnSuccess=!1,e.sendBtnError=!1},2e3,1)):(s.sendSuccess=a,s.sendError=!a,i=r(function(){r.cancel(i),s.sendSuccess=!1,s.sendError=!1},2e3,1)),e.$$phase||e.$apply()}}),e.sendFreeAnnotation=function(n,t){e.sendAnnotation(n,window.S(n).slugify().s,n,t,e.data.defaultColor||"#536991")},e.sendAnnotation=function(n,t,r,i,u,f){if(""===e.username||"undefined"==typeof e.username)return void c("Vous devez indiquer un nom d'utilisateur.",!1);if(""===n||"undefined"==typeof n)return void c("Vous devez indiquer un nom de catégorie.",!1);if(d){("undefined"==typeof t||""===t)&&(t=window.S(n).slugify().s);var g;if("rgb("===u.substring(0,4)){var p=s(u);g=a(p[0],p[1],p[2])}else g=u;var v={category:{code:t,label:n},text:i,color:g,user:e.username};d.send(JSON.stringify(v)),o.logging===!0&&l("Sent: "+JSON.stringify(v)),e.annotPile.push("undefined"==typeof f?!1:f),e.catText="",e.catLabel=""}else c("La socket ne fonctionne pas.",!1),o.logging===!0&&l("Not connected.")},void(e.selectLevel=function(n,t,o,r,i,s){return"undefined"==typeof s?(e.returnVisStyle={visibility:"hidden"},void(e.selectedlevel=!1)):void("undefined"!=typeof s.subcategories&&s.subcategories.length>0?(e.selectedlevel=s.subcategories,e.returnVisStyle={visibility:"show"}):e.sendAnnotation(n,t,o,r,i,s))})):void alert("le code de l'événement doit être indiqué dans un paramètre de template u dans l'url selon ?event=CODE_EVENEMENT.")})}();
\ No newline at end of file
--- a/client/annot-client/app/annotationclient.html Thu Jan 22 02:58:41 2015 +0100
+++ b/client/annot-client/app/annotationclient.html Thu Jan 22 03:23:08 2015 +0100
@@ -16,13 +16,18 @@
</form>
</div>
</div>
+ <form role="form">
<div class="row">
<div class="col-md-12">
- <form role="form">
- <autocomplete ng-model="yourchoice" data="allCatLabels" attr-input-class="form-control" attr-placeholder="Catégories..." ></autocomplete>
- </form>
+ <autocomplete ng-model="catLabel" data="allCatLabels" attr-input-class="form-control" attr-placeholder="Catégories..." ></autocomplete>
</div>
</div>
+ <div class="row">
+ <div class="col-md-12">
+ <textarea ng-model="catText" class="form-control" placeholder="Texte..." rows="2"></textarea>
+ </div>
+ </div>
+ </form>
<div class="row mons-content">
<div class="mons-button hand return" ng-style="returnVisStyle" ng-click="selectLevel()" ng-init="returnVisStyle={visibility:'hidden'}">
<div class="content">
@@ -33,7 +38,7 @@
</div>
</div>
</div>
- <div class="mons-button hand send" id="sendButton" ng-click="sendAnnotation(yourchoice)" ng-class="{'success-border':sendBtnSuccess, 'error-border':sendBtnError}">
+ <div class="mons-button hand send" id="sendButton" ng-click="sendFreeAnnotation(catLabel, catText)" ng-class="{'success-border':sendBtnSuccess, 'error-border':sendBtnError}">
<div class="content">
<div class="table">
<div class="table-cell">
@@ -47,7 +52,7 @@
<div class="mons-content">
<div ng-show="!selectedlevel">
<div class="mons-button hand" ng-repeat="c in data.categories" style="background-color: {{ '{{' }} c.color {{ '}}' }}"
- ng-click="selectLevel(c.label, c.code, c)" ng-class="{'success-border':c.sendSuccess, 'error-border':c.sendError}">
+ ng-click="selectLevel(c.label, c.code, catLabel, catText, c.color, c)" ng-class="{'success-border':c.sendSuccess, 'error-border':c.sendError}">
<div class="content">
<div class="table">
<div class="table-cell">
@@ -60,7 +65,7 @@
</div>
<div ng-show="selectedlevel">
<div class="mons-button hand" ng-repeat="c in selectedlevel" style="background-color: {{ '{{' }} c.color {{ '}}' }}"
- ng-click="sendAnnotation({% raw %} (c.prelabel !== '') ? (c.prelabel + ': ' + c.label) : c.label {% endraw %}, c.code, c)" ng-class="{'success-border':c.sendSuccess, 'error-border':c.sendError}">
+ ng-click="sendAnnotation({% raw %} (c.prelabel !== '') ? (c.prelabel + ': ' + c.label) : c.label {% endraw %}, c.code, catLabel, catText, c.color, c)" ng-class="{'success-border':c.sendSuccess, 'error-border':c.sendError}">
<div class="content">
<div class="table">
<div class="table-cell">
--- a/client/annot-client/app/app.css Thu Jan 22 02:58:41 2015 +0100
+++ b/client/annot-client/app/app.css Thu Jan 22 03:23:08 2015 +0100
@@ -63,7 +63,7 @@
font-size: 2vw;
}
.send{
- background-color: #4cae4c;
+ background-color: #536991;
}
.return{
background-color: #e6e6e6;
--- a/client/annot-client/app/app.js Thu Jan 22 02:58:41 2015 +0100
+++ b/client/annot-client/app/app.js Thu Jan 22 03:23:08 2015 +0100
@@ -35,6 +35,16 @@
);
}
+ function parseColor(input) {
+ var m = input.match(/^rgb\s*\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*\)$/i);
+ if( m) return [m[1],m[2],m[3]];
+ else throw new Error("Colour "+input+" could not be parsed.");
+ }
+
+ function rgbToHex(r, g, b) {
+ return "#" + ((1 << 24) + (r << 16) + (g << 8) + b).toString(16).slice(1);
+ }
+
$scope.data = dataModel.data;
var process_categories = function(data) {
@@ -50,7 +60,12 @@
}
}
}
- $scope.allCatLabels = cats;
+ if(typeof data.autocomplete === 'undefined' || data.autocomplete.length === 0) {
+ $scope.allCatLabels = cats;
+ }
+ else {
+ $scope.allCatLabels = data.autocomplete;
+ }
}
};
@@ -101,7 +116,7 @@
} else {
wsuri = 'ws://' + window.location.hostname + ':8090/annot';
}
-
+
var eventCode = context.event_code;
if(typeof eventCode==='undefined' || eventCode===''){
eventCode = $location.search().event;
@@ -173,7 +188,12 @@
};
}
- $scope.sendAnnotation = function(label, code, c){
+ $scope.sendFreeAnnotation = function(label, text) {
+ $scope.sendAnnotation(label, window.S(label).slugify().s, label, text, $scope.data.defaultColor || "#536991");
+ };
+
+ $scope.sendAnnotation = function(label, code, freeLabel, freetext, color, c){
+
if($scope.username==='' || typeof $scope.username==='undefined'){
showAlert('Vous devez indiquer un nom d\'utilisateur.', false);
return;
@@ -187,8 +207,21 @@
if(typeof code==='undefined' || code===''){
code = window.S(label).slugify().s;
}
+
+ var hexc;
+ if(color.substring(0, 4) === 'rgb(') {
+ var rgbc = parseColor(color);
+ hexc = rgbToHex(rgbc[0],rgbc[1], rgbc[2]);
+ }
+ else {
+ hexc = color;
+ }
+
+
var new_annot = {
category: {code: code, label: label},
+ text: freetext,
+ color: hexc,
user : $scope.username
};
sock.send(JSON.stringify(new_annot));
@@ -201,6 +234,8 @@
else{
$scope.annotPile.push(c);
}
+ $scope.catText = "";
+ $scope.catLabel = "";
} else {
showAlert('La socket ne fonctionne pas.', false);
if(context.logging===true){
@@ -210,7 +245,7 @@
};
// Interface management
- $scope.selectLevel = function(label, code, c){
+ $scope.selectLevel = function(label, code, freelabel, freetext, color, c){
if(typeof c==='undefined'){
$scope.returnVisStyle = {visibility:'hidden'};
$scope.selectedlevel = false;
@@ -223,7 +258,7 @@
else{
// Send query
//console.log('send ntm', c);
- $scope.sendAnnotation(label, code, c);
+ $scope.sendAnnotation(label, code, freelabel, freetext, color, c);
}
};