Gitlab CSE Unil

Commit 5cf6cdaf authored by M. Chardon's avatar M. Chardon
Browse files

possibilité de changer les propriétés après dessin

parent 2fa65b06
/** /**
* anodate environment
* *
* Created by jfurrer on 30.06.15. * Created by mchardon on 11.01.17.
*/ */
define([ define([
"jquery", "jquery",
......
...@@ -14,8 +14,8 @@ ...@@ -14,8 +14,8 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>. * along with this program. If not, see <http://www.gnu.org/licenses/>.
* This copyright notice MUST APPEAR in all copies of the file. * This copyright notice MUST APPEAR in all copies of the file.
* *
* @AUTHOR: Julien Furrer <Julien.Furrer@unil.ch> * @AUTHOR: marion.chardon@unil.ch
* @CREATION-DATE: 30.06.15 * @CREATION-DATE: 11.01.17
* *
*/ */
define([ define([
...@@ -105,7 +105,7 @@ define([ ...@@ -105,7 +105,7 @@ define([
event: "keydown", event: "keydown",
ctxt: "edit", ctxt: "edit",
fn: function(){ fn: function(){
tools.activateTool('drawing'); tools.activateTool('drawinggeo');
return false; return false;
} }
}], }],
...@@ -116,7 +116,7 @@ define([ ...@@ -116,7 +116,7 @@ define([
event: "keydown", event: "keydown",
ctxt: "edit", ctxt: "edit",
fn: function(){ fn: function(){
tools.activateTool('arrow'); tools.activateTool('arrowgeo');
return false; return false;
} }
}], }],
...@@ -127,7 +127,7 @@ define([ ...@@ -127,7 +127,7 @@ define([
event: "keydown", event: "keydown",
ctxt: "edit", ctxt: "edit",
fn: function(){ fn: function(){
tools.activateTool('lines'); tools.activateTool('linesgeo');
return false; return false;
} }
}], }],
...@@ -137,7 +137,7 @@ define([ ...@@ -137,7 +137,7 @@ define([
event: "keydown", event: "keydown",
ctxt: "edit", ctxt: "edit",
fn: function(){ fn: function(){
tools.activateTool('ellipse'); tools.activateTool('ellipsegeo');
return false; return false;
} }
}], }],
...@@ -147,7 +147,7 @@ define([ ...@@ -147,7 +147,7 @@ define([
event: "keydown", event: "keydown",
ctxt: "edit", ctxt: "edit",
fn: function(){ fn: function(){
tools.activateTool('rectangle'); tools.activateTool('rectanglegeo');
return false; return false;
} }
}], }],
...@@ -157,7 +157,7 @@ define([ ...@@ -157,7 +157,7 @@ define([
event: "keydown", event: "keydown",
ctxt: "edit", ctxt: "edit",
fn: function(){ fn: function(){
tools.activateTool('text'); tools.activateTool('textgeo');
return false; return false;
} }
}] }]
......
...@@ -47,7 +47,8 @@ define([ ...@@ -47,7 +47,8 @@ define([
"tools/linesgeo", "tools/linesgeo",
"tools/ellipsegeo", "tools/ellipsegeo",
"tools/rectanglegeo", "tools/rectanglegeo",
"tools/arrowgeo" "tools/arrowgeo",
"tools/textgeo"
], ],
function(_, Signal){ function(_, Signal){
// ----- Locale variables ----------------------------- // ----- Locale variables -----------------------------
......
...@@ -541,6 +541,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper,Shape, Ca ...@@ -541,6 +541,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper,Shape, Ca
_create = false; _create = false;
_creatingArrow.selected = true; _creatingArrow.selected = true;
_creatingArrow.visible = true; _creatingArrow.visible = true;
_events.annotationSelected.dispatch(_creatingArrow);
_creatingArrow = null; _creatingArrow = null;
} }
} }
......
...@@ -201,6 +201,7 @@ define(["paper", "tools/Shape.class","adim/category"], function(paper, Shape, Ca ...@@ -201,6 +201,7 @@ define(["paper", "tools/Shape.class","adim/category"], function(paper, Shape, Ca
newPath.fullySelected = true; newPath.fullySelected = true;
_events.annotationAdded.dispatch(newPath); _events.annotationAdded.dispatch(newPath);
_events.annotationSelected.dispatch(newPath);
} }
} }
......
...@@ -166,6 +166,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C ...@@ -166,6 +166,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C
_events.annotationAdded.dispatch(newEllGeo); _events.annotationAdded.dispatch(newEllGeo);
_startPoint = null; _startPoint = null;
create = false; create = false;
return newEllGeo;
} }
function itemMouseDown(event) { function itemMouseDown(event) {
...@@ -336,9 +337,11 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C ...@@ -336,9 +337,11 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C
if (_startPoint) { if (_startPoint) {
if (_drawingLine && terminateOnRelease) { if (_drawingLine && terminateOnRelease) {
drawEllGeo(this,event); drawEllGeo(this,event);
_terminateCreate(event); var newEllGeo = _terminateCreate(event);
newEllGeo.selected=true;
_events.annotationSelected.dispatch(newEllGeo);
} else { } else {
_startPoint=null; cancelCreate();
} }
} }
_editedSegmentIdx = _editedRecGeo = null; _editedSegmentIdx = _editedRecGeo = null;
......
...@@ -226,6 +226,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C ...@@ -226,6 +226,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C
if (_changed) { if (_changed) {
_changed = false; _changed = false;
_events.annotationChanged.dispatch(_segment.path); _events.annotationChanged.dispatch(_segment.path);
_events.annotationSelected.dispatch(_segment.path);
} }
_segment = null; _segment = null;
} }
......
...@@ -154,6 +154,18 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C ...@@ -154,6 +154,18 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C
_events.annotationAdded.dispatch(newRecGeo); _events.annotationAdded.dispatch(newRecGeo);
_startPoint = null; _startPoint = null;
create = false; create = false;
return newRecGeo;
}
function setSelected(selected) {
if (selected) {
_events.annotationSelected.dispatch(this);
//drawMarker(this,{highlight:true});
} else {
//drawMarker(this);
}
paper.Group.prototype.setSelected.call(this, selected);
} }
function itemMouseDown(event) { function itemMouseDown(event) {
...@@ -164,7 +176,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C ...@@ -164,7 +176,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C
paper.project.deselectAll(); paper.project.deselectAll();
hitItem.selected = true; hitItem.selected = true;
_events.annotationSelected.dispatch(hitItem); //_events.annotationSelected.dispatch(hitItem);
_editedSegmentIdx = null; _editedSegmentIdx = null;
if (hitResult && hitResult.type === 'segment') { if (hitResult && hitResult.type === 'segment') {
...@@ -251,6 +263,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C ...@@ -251,6 +263,7 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C
} }
// ----- Tool Def ------------------------------------- // ----- Tool Def -------------------------------------
var _selectedTool = null;
var toolDef = { var toolDef = {
onMouseDown: function(event) { onMouseDown: function(event) {
...@@ -296,9 +309,15 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C ...@@ -296,9 +309,15 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C
if (_startPoint) { if (_startPoint) {
if (_drawingLine && terminateOnRelease) { if (_drawingLine && terminateOnRelease) {
drawRecGeo(this,event); drawRecGeo(this,event);
_terminateCreate(event);
//itemMouseDown.call(marker, event);
var newRecto = _terminateCreate(event);
newRecto.selected=true;
_selectedTool = newRecto;
_events.annotationSelected.dispatch(newRecto);
} else { } else {
_startPoint=null; cancelCreate();
} }
} }
_editedSegmentIdx = _editedRecGeo = null; _editedSegmentIdx = _editedRecGeo = null;
...@@ -316,7 +335,6 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C ...@@ -316,7 +335,6 @@ define(["paper", "tools/Shape.class","adim/category"], function (paper, Shape, C
}; };
// ----- Functions ------------------------------------ // ----- Functions ------------------------------------
function _setCategory(catId) { function _setCategory(catId) {
defaultProperties.category = catId; defaultProperties.category = catId;
} }
......
...@@ -216,6 +216,8 @@ define(["paper", "jquery","adim/category"], function (paper, $, Category) { ...@@ -216,6 +216,8 @@ define(["paper", "jquery","adim/category"], function (paper, $, Category) {
if (_events.annotationAdded && typeof _events.annotationAdded.dispatch === 'function') { if (_events.annotationAdded && typeof _events.annotationAdded.dispatch === 'function') {
_events.annotationAdded.dispatch(gText); _events.annotationAdded.dispatch(gText);
} }
gText.selected=true;
_events.annotationSelected.dispatch(gText);
} else { } else {
if (_events.annotationChanged && typeof _events.annotationChanged.dispatch === 'function') { if (_events.annotationChanged && typeof _events.annotationChanged.dispatch === 'function') {
_events.annotationChanged.dispatch(gText); _events.annotationChanged.dispatch(gText);
...@@ -228,6 +230,7 @@ define(["paper", "jquery","adim/category"], function (paper, $, Category) { ...@@ -228,6 +230,7 @@ define(["paper", "jquery","adim/category"], function (paper, $, Category) {
} }
overlay.hide(); overlay.hide();
input.val("").blur().hide(); input.val("").blur().hide();
return gText;
} }
......
...@@ -11610,7 +11610,7 @@ var CanvasProvider = { ...@@ -11610,7 +11610,7 @@ var CanvasProvider = {
   
getContext: function(width, height) { getContext: function(width, height) {
return this.getCanvas(width, height).getContext('2d'); return this.getCanvas(width, height).getContext('2d');
}, },var CanvasProvider = {
   
release: function(obj) { release: function(obj) {
var canvas = obj.canvas ? obj.canvas : obj; var canvas = obj.canvas ? obj.canvas : obj;
...@@ -20955,465 +20955,6 @@ define('tools/arrowgeo',["paper", "tools/Shape.class","adim/category"], function ...@@ -20955,465 +20955,6 @@ define('tools/arrowgeo',["paper", "tools/Shape.class","adim/category"], function
} }
}; };
}); });
define('tools/textgeo',["paper", "jquery","adim/category"], function (paper, $, Category) {
// ----- Const ---------------------------------------
var TOOL_TYPE = "textgeo";
// ----- Locale variables -----------------------------
var edit = false; // is editing
var text = null; // the point text
var gText = null; // the group
var input = null; // the input helper
var overlay = null; // the overlay div used to catch mouse click when input is active
var _ro = false; // local value of ReadOnly Status
// Events
var _events = {
annotationAdded: null,
annotationChanged: null,
annotationSelected: null
};
var hitOptions = {
type: 'point-text',
tolerance: 5,
fill: true
};
// Properties
var defaultProperties = {
comment: "",
category: "cat_geo_1",
fill: true
};
// ----- Initialisations ------------------------------
var _noop = function(){};
// ----- Item's event listeners -----------------------
function itemMouseDown(event) {
var textGroup = this;
textGroup.selected = true;
if (_events.annotationSelected && typeof _events.annotationSelected.dispatch === 'function') {
_events.annotationSelected.dispatch(textGroup);
}
}
var DRAG_MODES = {
FULL_DRAG: 1,
DRAG_HANDLE: 4
};
var _dragMode = null;
var _dragOpts = {};
var _dragModified = false; // this is set to true if a drag event changed the item and need to emmit a change event
function setDragMode(mode, opts) {
if (! mode in DRAG_MODES) {
_dragMode = null;
_dragOpts = {};
_dragModified = false;
} else {
_dragMode = DRAG_MODES[mode];
_dragOpts = opts;
}
}
function itemMouseDrag(event) {
switch (_dragMode) {
case DRAG_MODES.DRAG_HANDLE:
if (_dragOpts.nameParts[1] === 'center')
return;
var bounds = _dragOpts.item.bounds,
height = (_dragOpts.nameParts[0] === 'top') ?
bounds.bottom - event.point.y :
event.point.y - bounds.top,
fontSize = height / 1.2,
offset = [0, 0];
if (_dragOpts.nameParts[0] === 'bottom') {
offset[1] = height - bounds.height;
}
if (fontSize > 9 && fontSize < 999) {
setFontSize.call(_dragOpts.item, fontSize);
}
_dragOpts.item.translate(offset);
break;
case DRAG_MODES.FULL_DRAG:
default:
this.translate(event.delta);
}
}
function attachListeners(item) {
item.oGetSelected = function() {
return this.children[1].selected;
// for (var i = 0, l = this.children.length; i<l; i++) {
// if (!this.children.selected)
// return false;
// }
// return true;
};
item.oSetSelected = function(selected) {
//this.children.map(function(c) {c.selected = selected});
this.children[1].selected = selected;
};
// item.data.prop = item.data.prop || {comment:""};
// item.data.prop.comment = item.data.prop.comment || "";
item.data.setDragMode = setDragMode;
item.data.itemMouseDrag = itemMouseDrag;
// item.onMouseDown = itemMouseDown;
// item.onMouseDrag = itemMouseDrag;
}
// ----- Functions ------------------------------------
function _startEdit(myText) {
if (edit) { _terminateEdit(false); }
if (_ro) return;
edit = true;
if (!input) {
input = $("<input>",
{
type: "text",
'class': "text-tool-input",
placeholder: "Votre texte",
maxlength: 128, size: 128,
style: "display:none;position:absolute;top:0;left:0;padding:10px;border:0;border-radius:5px;background:rgba(255,255,255,0.75);"
}
)
.appendTo(paper.project.view.element.parentNode)
.on("blur", function(){ if(edit) _terminateEdit(); })
.on("keydown", function(event){ if(event.which === 27 || event.which == 13) _terminateEdit(); })
.autoGrowInput();
overlay = overlay || $("<div>").css({
zIndex: 999,
position: "fixed", display: "none",
top: "-10px", left: "-10px",
width: "5000px", height: "5000px"
})
.click(function(){ _terminateEdit() });
input.before(overlay);
}
myText.selected = false;
myText.visible = false;
var inputPoint = myText.children[1].point;
inputPoint = inputPoint.subtract(paper.view.bounds.point).multiply(paper.view.zoom);
var inputFontSize = myText.fontSize * paper.view.zoom;
myText.data.color = _getColor(defaultProperties.category);
input
.val(myText.data.content)
.css({
"fontSize": inputFontSize + "px",
"fontFamily": myText.font,
"color": myText.data.color,
"top": inputPoint.y - inputFontSize + 1 - 10,
"left": inputPoint.x - 1 - 10,
"zIndex": 1000
})
.show();
overlay.show();
var tester = input.nextAll("tester");
tester.css({
fontSize: input.css('fontSize'),
fontFamily: input.css('fontFamily'),
fontWeight: input.css('fontWeight'),
letterSpacing: input.css('letterSpacing')
});
tester.text( (myText.data.content === "") ? input.attr("placeholder") : myText.data.content);
input.width(tester.width()+30);
gText = myText;
setTimeout(function(){
input.focus();
},100);
}
/**
* Terminate the editing phase of the text item. The item is selected after editing
* if the parameter `selectAfter` is set to true (default).
* @param {boolean} [selectAfter=true] Select the text item after terminating the editing phase
* @private
*/
function _terminateEdit(selectAfter) {
selectAfter = !(selectAfter === false);
edit = false;
if (gText) {
var textVal = input.val();
if (!textVal || textVal === "") {
gText.remove();
gText = null;
} else {
var isNewText = gText.data.content === "";
gText.data.content = textVal;
gText.children[0].content = textVal;
gText.children[1].content = textVal;
gText.visible = true;
gText.onPropertyChange = itemPropertyChange;
if(selectAfter)
if (_events.annotationSelected && typeof _events.annotationSelected.dispatch === 'function') {
_events.annotationSelected.dispatch(gText);
}
if (isNewText) {
attachListeners(gText);
if (_events.annotationAdded && typeof _events.annotationAdded.dispatch === 'function') {
_events.annotationAdded.dispatch(gText);
}
} else {
if (_events.annotationChanged && typeof _events.annotationChanged.dispatch === 'function') {
_events.annotationChanged.dispatch(gText);
}
}
gText.oSetSelected(selectAfter);
paper.project.view.draw();
}
}
overlay.hide();
input.val("").blur().hide();
}
function setTextColor(color) {
var textGroup = this;
var changed = textGroup.children[1].fillColor !== color;
textGroup.children[1].fillColor = color;
textGroup.data.color = color;
return changed;
}
function setFontSize(size) {
var textGroup = this;
var sw = size / 10;
if (sw < 3) { sw = 3; }
textGroup.children[0].fontSize = size;
textGroup.children[0].strokeWidth = sw;
textGroup.children[1].fontSize = size;
}
function getFontSize() {
return this.children[0].fontSize;
}
function setFontWidth(fontWidth) {
}
function getFontWidth() {
return "normal";
}
// ----- Functions ------------------------------------
function _setCategory(catId) {
defaultProperties.category = catId;
}
function _getColor(catId) {
var category = Category.getCategory(catId),
color = (category && category.color) || "#000000";
return color;
}
function _getColorBg(catId) {
var category = Category.getCategory(catId),
color = (category && catego