Gitlab CSE Unil

Commit 85236afb authored by M. Chardon's avatar M. Chardon
Browse files

ajout changement de couleur pour les formes dans CIMAF

parent d1cd3e6b
......@@ -111,6 +111,9 @@ define(["paper"], function (paper) {
function onToolActivated(toolName) {
activated = toolName === TOOL_TYPE;
if (activated){
$("#tool-colorselect").hide();
}
}
var create = true;
......@@ -152,7 +155,9 @@ define(["paper"], function (paper) {
prop: o.prop,
// Mouse Event
itemMouseDrag: itemMouseDrag,
itemMouseUp: itemMouseUp
itemMouseUp: itemMouseUp,
//Handler
setColor: _setColor
};
// Select new stria
......@@ -173,6 +178,9 @@ define(["paper"], function (paper) {
return newStria;
}
function _setColor(){
this.style.strokeColor = striaStyle.strokeColor;
}
function itemMouseDown(event) {
var hitItem = this;
......
......@@ -63,7 +63,7 @@ define(["paper"], function (paper) {
// ----- Functions -----------------------------------
function exportJSON(param) {
var json = this.exportJSON({asString:false});
var json = this.exportJSON({asString: false});
if (!json[1].strokeColor) {
json[1].strokeWidth = 0;
}
......@@ -98,6 +98,9 @@ define(["paper"], function (paper) {
function onToolActivated(toolName) {
activated = toolName === TOOL_TYPE;
if (activated){
$("#tool-colorselect").hide();
}
}
var create = true;
......@@ -135,7 +138,9 @@ define(["paper"], function (paper) {
prop: o.prop,
// Mouse Event
itemMouseDrag: itemMouseDrag,
itemMouseUp: itemMouseUp
itemMouseUp: itemMouseUp,
//Handler
setColor: _setColor
};
// Select new stria
......@@ -147,13 +152,16 @@ define(["paper"], function (paper) {
newStria.onMouseDown = itemMouseDown;
//newStria.onMouseDrag = itemMouseDrag; // --> in data.itemMouseDrag
//newStria.onMouseUp = itemMouseUp;
newStria.onKeyDown = itemKeyDown;
newStria.onKeyUp = itemKeyUp;
newStria.onKeyDown = itemKeyDown;
newStria.onKeyUp = itemKeyUp;
newStria.onPropertyChange = itemPropertyChange;
return newStria;
}
function _setColor(){
this.style.strokeColor = striaStyle.strokeColor;
}
function itemMouseDown(event) {
var hitItem = this;
......@@ -174,7 +182,7 @@ define(["paper"], function (paper) {
var fs = _editedStria.getFirstSegment(),
ls = _editedStria.getLastSegment();
_closestSegIdx = (fs.point.x - ls.point.x) < 0 ? 1 : 0;
_rightQuadrant = fs.point.x > _cutPosition || ls.point.x > _cutPosition;
_rightQuadrant = fs.point.x > _cutPosition || ls.point.x > _cutPosition;
if (_rightQuadrant)
_closestSegIdx = 1 - _closestSegIdx;
}
......@@ -220,10 +228,10 @@ define(["paper"], function (paper) {
switch (event.key) {
case "up":
translateVector = [0, -1];
break;
break;
case "down":
translateVector = [0, 1];
break;
translateVector = [0, 1];
break;
}
if (translateVector) {
translateVector = new paper.Point(translateVector).multiply(
......@@ -245,7 +253,7 @@ define(["paper"], function (paper) {
_events.annotationChanged.dispatch([_editedStria]);
_striaChanged = false;
}
break;
break;
}
}
......@@ -258,10 +266,10 @@ define(["paper"], function (paper) {
}
function validatePosition(from, to){
function validatePosition(from, to) {
// A concordant stria should NOT cross the cut
return (from.x <= _cutPosition && to.x <= _cutPosition) ||
(from.x >= _cutPosition && to.x >= _cutPosition);
(from.x >= _cutPosition && to.x >= _cutPosition);
}
......@@ -294,6 +302,7 @@ define(["paper"], function (paper) {
var _lastFreePoint;
/**
* Force the stria to be horizontal.
*
......@@ -306,11 +315,11 @@ define(["paper"], function (paper) {
* @private
*/
function _horizontalize(stria, tgtIdx, release) {
if ( !release ) {
if (!release) {
_lastFreePoint = stria.segments[tgtIdx].point.clone();
stria.segments[tgtIdx].point.y = stria.segments[1-tgtIdx].point.y;
stria.segments[tgtIdx].point.y = stria.segments[1 - tgtIdx].point.y;
}
else if (_lastFreePoint){
else if (_lastFreePoint) {
stria.segments[tgtIdx].point.y = _lastFreePoint.y;
paper.view.draw();
}
......@@ -342,7 +351,7 @@ define(["paper"], function (paper) {
*/
function editStria(event) {
var dstPoint = event.point.clone();
if (!validatePosition(_editedStria.segments[1-_editedSegmentIdx].point, event.point))
if (!validatePosition(_editedStria.segments[1 - _editedSegmentIdx].point, event.point))
dstPoint.x = _cutPosition;
_editedStria.segments[_editedSegmentIdx].point = dstPoint;
if (event.event.shiftKey)
......@@ -353,7 +362,7 @@ define(["paper"], function (paper) {
// ----- Tool Def -------------------------------------
var toolDef = {
onMouseDown: function(event) {
onMouseDown: function (event) {
if (_startPoint) {
if (_drawingLine && !terminateOnRelease) {
_terminateCreate()
......@@ -385,10 +394,10 @@ define(["paper"], function (paper) {
}
}
}
},
onMouseDrag: function(event) {
onMouseDrag: function (event) {
if (create && _startPoint) {
terminateOnRelease = true;
drawStria(event);
......@@ -399,13 +408,13 @@ define(["paper"], function (paper) {
}
},
onMouseMove: function(event) {
onMouseMove: function (event) {
if (create && _startPoint) {
drawStria(event);
}
},
onMouseUp: function(event) {
onMouseUp: function (event) {
if (_startPoint) {
if (_drawingLine && terminateOnRelease) {
drawStria(event);
......@@ -419,17 +428,17 @@ define(["paper"], function (paper) {
_editedSegmentIdx = _editedStria = null;
},
onKeyDown: function(event) {
onKeyDown: function (event) {
switch (event.key) {
case "enter":
if (create)
_terminateCreate();
break;
break;
case "escape":
if (create)
cancelCreate();
break;
break;
case "shift":
if (_drawingLine) {
......@@ -437,18 +446,18 @@ define(["paper"], function (paper) {
} else if (_editedStria && _editedSegmentIdx !== null) {
_horizontalize(_editedStria, _editedSegmentIdx);
}
break;
break;
case "up":
case"down":
var items = paper.project.getSelectedItems();
for (var i=0,item;item=items[i];i++){
for (var i = 0, item; item = items[i]; i++) {
if (item.data.type && typeof item.onKeyDown === 'function') {
item.onKeyDown(event);
break;
}
}
break;
break;
}
},
......@@ -461,18 +470,18 @@ define(["paper"], function (paper) {
} else if (_editedStria && _editedSegmentIdx) {
_horizontalize(_editedStria, _editedSegmentIdx, true);
}
break;
break;
case "up":
case"down":
var items = paper.project.getSelectedItems();
for (var i=0,item;item=items[i];i++){
for (var i = 0, item; item = items[i]; i++) {
if (item.data.type && typeof item.onKeyUp === 'function') {
item.onKeyUp(event);
break;
}
}
break;
break;
}
}
......@@ -483,7 +492,9 @@ define(["paper"], function (paper) {
return {
name: TOOL_TYPE,
tool: new paper.Tool(toolDef),
registerEvent: function(eventName, evt) { _events[eventName] = evt; },
registerEvent: function (eventName, evt) {
_events[eventName] = evt;
},
exportJSON: exportJSON,
importJSON: importJSON,
listeners: {
......
......@@ -46,7 +46,8 @@ define(["paper"], function (paper) {
var activated = false;
var _noop = function(){};
var _noop = function () {
};
// The points
var p1s, p1e, // p1 start, p1 end
......@@ -75,7 +76,7 @@ define(["paper"], function (paper) {
var drawingStyle = {
strokeWidth: _strokeWidth,
strokeColor: _strokeColor,
dashArray: [9,4]
dashArray: [9, 4]
};
var doneStyle = {
strokeWidth: _strokeWidth,
......@@ -83,7 +84,7 @@ define(["paper"], function (paper) {
};
function createNewFieldEdges(o, noEventListening){
function createNewFieldEdges(o, noEventListening) {
// Overwrite doneStyle with o.style if any
o.style = (typeof o.style === 'object') ? o.style : {};
for (var p in doneStyle) {
......@@ -109,7 +110,9 @@ define(["paper"], function (paper) {
o.firstEdge.segments[1].point,
o.secondEdge.segments[0].point,
o.secondEdge.segments[1].point
].map(function(p){return [p.x, p.y]});
].map(function (p) {
return [p.x, p.y]
});
fieldEdges.data = {
tId: "a" + fieldEdges._id,
......@@ -117,11 +120,13 @@ define(["paper"], function (paper) {
prop: o.prop,
points: points,
// Mouse Event
itemMouseDrag: itemMouseDrag
itemMouseDrag: itemMouseDrag,
//Handler
setColor: _setColor
};
if (!noEventListening) {
fieldEdges.onMouseDown = function(event) {
fieldEdges.onMouseDown = function (event) {
if (!this.oGetSelected()) {
paper.project.deselectAll();
this.oSetSelected(true);
......@@ -130,23 +135,29 @@ define(["paper"], function (paper) {
itemMouseDown(event);
}
};
fieldEdges.oGetSelected = function() {
for (var i = 0,c; c = this.children[i]; i++) {
fieldEdges.oGetSelected = function () {
for (var i = 0, c; c = this.children[i]; i++) {
if (!c.selected)
return false;
}
return true;
};
fieldEdges.oSetSelected = function(selected) {
this.children.map(function(c) {c.selected = selected});
fieldEdges.oSetSelected = function (selected) {
this.children.map(function (c) {
c.selected = selected
});
};
fieldEdges.onMouseUp = itemMouseUp;
fieldEdges.onMouseUp = itemMouseUp;
}
_events.annotationAdded.dispatch(fieldEdges);
return fieldEdges;
}
function _setColor(){
this.style.strokeColor = _strokeColor;
}
function itemMouseDown(event) {
if (_state === _STATES.DONE || _state === _STATES.CREATED_BOTH) {
_startEditingEdge(event);
......@@ -164,15 +175,17 @@ define(["paper"], function (paper) {
}
function exportJSON(param) {
var json = this.exportJSON({asString:false});
var json = this.exportJSON({asString: false});
// Update data.points
json[1].data.points = [p1s, p1e, p2s, p2e].map(function(p){return [p.x, p.y]});
json[1].data.points = [p1s, p1e, p2s, p2e].map(function (p) {
return [p.x, p.y]
});
// Cleanup useless properties
var uselessProp = ['fontFamily', 'font', 'fontSize', 'fontLeading', 'leading', 'selected'];
[json[1], json[1].children[0][1], json[1].children[1][1]].forEach(function(obj){
uselessProp.forEach(function(prop){
[json[1], json[1].children[0][1], json[1].children[1][1]].forEach(function (obj) {
uselessProp.forEach(function (prop) {
if (obj.hasOwnProperty(prop))
delete(obj[prop]);
});
......@@ -192,7 +205,8 @@ define(["paper"], function (paper) {
var style = {};
try {
style.strokeWidth = item.children[0][1]['strokeWidth'];
} catch(e) {}
} catch (e) {
}
var curLayer = paper.project.activeLayer;
layer.activate();
......@@ -205,7 +219,7 @@ define(["paper"], function (paper) {
prop: item.data.prop
});
if (listening) {
_firstEdge = fieldEdges.children[0];
_firstEdge = fieldEdges.children[0];
_secondEdge = fieldEdges.children[1];
_updatePointDef();
_state = _STATES.CREATED_BOTH;
......@@ -229,26 +243,26 @@ define(["paper"], function (paper) {
function _drawEdges(event) {
switch (_state) {
case _STATES.READY:
break;
break;
case _STATES.CREATE_FIRST:
if (_firstEdge)
_firstEdge.remove();
_firstEdge = new paper.Path.Line({from: p1s, to:p1e});
_firstEdge = new paper.Path.Line({from: p1s, to: p1e});
_firstEdge.style = drawingStyle;
break;
break;
case _STATES.CREATE_SECOND:
if (_firstEdge)
_firstEdge.remove();
_firstEdge = new paper.Path.Line({from: p1s, to:p1e});
_firstEdge = new paper.Path.Line({from: p1s, to: p1e});
_firstEdge.style = doneStyle;
if (_secondEdge)
_secondEdge.remove();
_secondEdge = new paper.Path.Line({from: p2s, to:p2e});
_secondEdge = new paper.Path.Line({from: p2s, to: p2e});
_secondEdge.style = drawingStyle;
break;
break;
case _STATES.CREATED_BOTH:
//if (_firstEdge)
......@@ -262,7 +276,7 @@ define(["paper"], function (paper) {
//_secondEdge = new paper.Path.Line({from: p2s, to:p2e});
//_secondEdge.style = doneStyle;
//_secondEdge.data.type = TOOL_TYPE;
break;
break;
}
}
......@@ -279,14 +293,14 @@ define(["paper"], function (paper) {
function _editEdges(event) {
if (_editedEdge) {
if (isNaN(parseInt(_editedSegment,2))) {
if (isNaN(parseInt(_editedSegment, 2))) {
// if _editedSegment is not in [0,1] we translate
_editedEdge.translate(event.delta);
}
else {
// We move the desired segment
var isFirstEdge = (_editedEdge === _firstEdge);
var otherEdge = isFirstEdge ? _secondEdge : _firstEdge;
var otherEdge = isFirstEdge ? _secondEdge : _firstEdge;
var otherPoint = isFirstEdge
? event.point.add(_v12)
......@@ -294,10 +308,10 @@ define(["paper"], function (paper) {
;
_editedEdge.insert(_editedSegment, event.point);
_editedEdge.segments[_editedSegment+1].remove();
_editedEdge.segments[_editedSegment + 1].remove();
otherEdge.insert(_editedSegment, otherPoint);
otherEdge.segments[_editedSegment+1].remove();
otherEdge.segments[_editedSegment + 1].remove();
}
}
}
......@@ -322,7 +336,7 @@ define(["paper"], function (paper) {
if (_firstEdge)
_firstEdge.remove();
_firstEdge = fieldEdges.children[0];
_firstEdge = fieldEdges.children[0];
if (_secondEdge)
_secondEdge.remove();
......@@ -372,61 +386,66 @@ define(["paper"], function (paper) {
function onToolActivated(toolName) {
activated = toolName === TOOL_TYPE;
if (activated) {
$("#tool-colorselect").hide();
} else {
$("#tool-colorselect .c7").hide();
}
}
// ----- Tool Def -------------------------------------
var toolDef = {
onMouseDown: function(event) {
onMouseDown: function (event) {
switch (_state) {
case _STATES.READY:
initDrawing();
_startFirstEdge(event);
break;
break;
case _STATES.CREATE_FIRST:
_startSecondEdge(event);
break;
break;
case _STATES.CREATE_SECOND:
_endCreateEdges(event);
break;
break;
case _STATES.CREATED_BOTH:
case _STATES.DONE:
_startEditingEdge(event);
break;
break;
}
_drawEdges(event);
},
onMouseMove: function(event) {
onMouseMove: function (event) {
switch (_state) {
case _STATES.CREATE_FIRST:
p1e = event.point;
_drawEdges(event);
break;
break;
case _STATES.CREATE_SECOND:
p2e = event.point;
p2s = p1s.add(p2e.subtract(p1e));
_drawEdges(event);
break;
break;
case _STATES.EDITING:
_editEdges(event);
break;
break;
}
},
onMouseUp: function(event) {
onMouseUp: function (event) {
switch (_state) {
case _STATES.EDITING:
_stopEditingEdge(event);
break;
break;
}
}
};
......@@ -435,7 +454,9 @@ define(["paper"], function (paper) {
return {
name: TOOL_TYPE,
tool: new paper.Tool(toolDef),
registerEvent: function(eventName, evt) { _events[eventName] = evt; },
registerEvent: function (eventName, evt) {
_events[eventName] = evt;
},
exportJSON: exportJSON,
importJSON: importJSON,
listeners: {
......
......@@ -815,6 +815,7 @@ function($, _, Signal, paper, config, view, io, tools, attributes, Users, export
} else {
// Attach onChange event listener
$toolBtn.on('change', function(){
_colorSelector.show();
var toolName = $(this).data("toolName");
tools.activateTool(toolName);
});
......
......@@ -3287,6 +3287,10 @@ fieldset[disabled] .category-list .btn-cat[data-category="cat_geo_10"].active {
#tool-colorselect .color-menu > a.c6:hover {
box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.66) inset, 0 0 1px 3px rgba(250, 0, 0, 0.9);
}
#tool-colorselect .color-menu > a.c7,
#tool-colorselect .color-menu > a.c7:hover {
background-color: rgb(225, 0, 255);
}
#tool-colorselect .color-menu > a.cx {
width: 65px;
overflow: hidden;
......
......@@ -1304,6 +1304,8 @@ $c3: rgb(0, 212, 0);
$c4: rgb(25, 119, 255);
$c5: rgb(252, 108, 162);
$c6: rgb(250, 0, 0);
$c6: rgb(250, 0, 0);
$c7: rgb(225, 0, 255);
$color-menu-bg: #333330;
$color-menu-border: rgba(128, 128, 128, 1);
......@@ -1373,6 +1375,9 @@ $color-menu-border: rgba(128, 128, 128, 1);
&.c6 {