Gitlab CSE Unil

Commit 83fa9e62 authored by Julien Furrer's avatar Julien Furrer
Browse files

Added a readonly behavior to Tools

Updated Lock button too 
parent f68eea76
......@@ -175,7 +175,7 @@ define([
attributes.init();
ui.init();
ui.init({ro:config.annotable.locked});
io.loadData(config.api.annotables + config.annotable.id + '/'); // + '?mode=' + config.mode);
......
......@@ -20,6 +20,7 @@
*/
define([
"underscore",
"signals",
// ----- app
......@@ -33,11 +34,13 @@ define([
"tools/arrow"
// "tools/arrow1"
],
function(Signal){
function(_, Signal){
// ----- Locale variables -----------------------------
var _tools = {}; // A dictionary of the active tools, using the name as key
var _activeTool = null; // The name of the current active tool
var _tools = {}, // A dictionary of the active tools, using the name as key
_activeTool = null, // The name of the current active tool
_ro = false, // Local ReadOnly value
_noop = function(){}; // A no-op function;
var _events = {
activated: new Signal(),
......@@ -46,7 +49,7 @@ function(Signal){
annotationSelected: new Signal()
};
var _noop = function(){};
// ----- Initialisations ------------------------------
......@@ -64,6 +67,7 @@ function(Signal){
tool: t.tool,
importJSON: t.importJSON || defaultImportJson,
exportJSON: t.exportJSON || defaultExportJson,
setRo: t.setRo || _noop,
listeners: t.listeners || {}
};
......@@ -162,6 +166,17 @@ function(Signal){
return exporter.call(item, $.extend({asString:true},param) );
}
/**
* Set ReadOnly state for all tools
* @param {boolean} ro - The ReadOnly value, true == ReadOnly or false == Writable
*/
function setRo(ro) {
if (ro === _ro) {
return;
}
_ro = ro;
_.invoke(_tools, 'setRo', ro);
}
// ----- Returned Module ------------------------------
......@@ -174,7 +189,8 @@ function(Signal){
activateTool: activateTool,
getActiveTool: getActiveTool,
serializeItem: serializeItem
serializeItem: serializeItem,
setRo: setRo
};
});
define(["paper"], function (paper) {
// ----- Const ----------------------------------------
var TOOL_TYPE = 'arrow';
var _ro = false;
// ----- Local variables ------------------------------
......@@ -17,7 +18,6 @@ define(["paper"], function (paper) {
fill: true
};
var _transparent = new paper.Color([0,0,0,0]);
// ----- Serialization ---------------------------------
......@@ -266,6 +266,7 @@ define(["paper"], function (paper) {
function itemMouseDown(event) {
if (!this.selected) return;
if (_ro) return;
_dragMode = DRAG_MODES.FULL_DRAG;
var toPt = this.data.to;
......@@ -288,6 +289,8 @@ define(["paper"], function (paper) {
function itemMouseDrag(event) {
if (_ro) return;
_dragModified = true;
var param = {
from: this.data.from,
......@@ -467,6 +470,7 @@ define(["paper"], function (paper) {
var _creatingArrow = null;
var toolDef = {
onMouseDown: function(event) {
if (_ro) return;
var hitAnnot;
_create = false;
_creatingArrow = null;
......@@ -483,6 +487,7 @@ define(["paper"], function (paper) {
},
onMouseDrag: function(event) {
if (_ro) return;
if (_create && _creatingArrow) {
drawArrow(_creatingArrow, {from: _startPoint, to:event.point});
_creatingArrow.visible = true;
......@@ -505,10 +510,17 @@ define(["paper"], function (paper) {
};
function _setRo(ro) {
if (ro !== _ro)
_ro = ro;
return _ro;
}
// ----- Returned Module ------------------------------
return {
name: TOOL_TYPE,
tool: new paper.Tool(toolDef),
setRo: _setRo,
registerEvent: function(eventName, evt) { _events[eventName] = evt; },
exportJSON: exportJSON,
importJSON: importJSON,
......
......@@ -4,6 +4,7 @@ define(["paper"], function (paper) {
// ----- Local variables -----------------------------
var _path = null;
var _ro = false;
// Events
var _events = {
......@@ -39,6 +40,8 @@ define(["paper"], function (paper) {
item.onPropertyChange = itemPropertyChange;
item.onDoubleClick = function(event) {
if (_ro) return;
this.selected = false;
this.fullySelected = true;
paper.view.draw();
......@@ -47,14 +50,7 @@ define(["paper"], function (paper) {
function itemPropertyChange(property, value) {
if (property === 'confidence') {
this.style = confidenceStyle[value];
paper.view.draw();
}
else if (property === 'processus') {
//
}
else if (property === 'fill') {
if (property === 'fill') {
this.closed = value;
paper.view.draw();
}
......@@ -136,10 +132,17 @@ define(["paper"], function (paper) {
}
};
function _setRo(ro) {
if (ro !== _ro)
_ro = ro;
return _ro;
}
// ----- Returned Module ------------------------------
return {
name: TOOL_TYPE,
tool: new paper.Tool(toolDef),
setRo: _setRo,
registerEvent: function(eventName, evt) { _events[eventName] = evt; },
exportJSON: exportJSON,
importJSON: importJSON
......
......@@ -28,8 +28,9 @@ define([
var hitItem = null;
var itemModified = false;
var _ro = false; // ReadOnly status
var _tool = null; // this paper.Tool (will be referenced after creation)
var _tool; // this paper.Tool (will be referenced after creation)
var _tools = null; // a reference of the tools module
// Events
......@@ -449,9 +450,16 @@ define([
};
_tool = new paper.Tool(toolDef);
function _setRo(ro) {
_selectAllLayers = ro;
_editing = !ro;
return ro;
}
return {
name: TOOL_TYPE,
tool: _tool,
setRo: _setRo,
registerEvent: function(eventName, evt) { _events[eventName] = evt; },
_tools: null
};
......
......@@ -9,6 +9,8 @@ define(["paper", "jquery"], function (paper, $) {
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,
......@@ -107,6 +109,7 @@ define(["paper", "jquery"], function (paper, $) {
function _startEdit(myText) {
if (edit) { _terminateEdit(false); }
if (_ro) return;
edit = true;
if (!input) {
......@@ -250,6 +253,7 @@ define(["paper", "jquery"], function (paper, $) {
// ----- Tool Def -------------------------------------
var toolDef = {
onMouseDown: function(event){
if (_ro) return;
var hitResult = paper.project.activeLayer.hitTest(event.point, hitOptions);
if (hitResult) {
......@@ -355,12 +359,18 @@ define(["paper", "jquery"], function (paper, $) {
return json;
}
function _setRo(ro) {
if (ro !== _ro)
_ro = ro;
return _ro;
}
// ----- Returned Module ------------------------------
return {
name: TOOL_TYPE,
tool: new paper.Tool(toolDef),
setRo: _setRo,
exportJSON: exportJSON,
importJSON: importJSON,
registerEvent: function(eventName, evt) { _events[eventName] = evt; }
......
......@@ -98,6 +98,8 @@ function($, _, Signal, paper, config, view, io, tools, attributes, Users, export
_annotationListCtnr = $("#annotation-list-container");
_canvasCtnrTop = _canvasCtnr.offset().top + _canvasToolBar.outerHeight();
window.DBG = tools;
//$("#annotation-property-panel").remove();
//$("body").addClass("mode-"+config.mode);
......@@ -612,6 +614,7 @@ function($, _, Signal, paper, config, view, io, tools, attributes, Users, export
// Reset tool to select, to avoid having an editing tool active in review mode
tools.activateTool('select');
tools.setRo(config.annotable.locked || (mode === 'review'));
if (mode === 'review') {
if (navTabs.data('loaded')) {
......@@ -682,6 +685,7 @@ function($, _, Signal, paper, config, view, io, tools, attributes, Users, export
function initTools(param) {
param = $.extend({}, {disabled: false}, param || {});
tools.setRo(param.disabled);
$("[data-tool-name]").each(function(){
var $toolBtn = $(this);
......@@ -700,7 +704,7 @@ function($, _, Signal, paper, config, view, io, tools, attributes, Users, export
tools.activateTool(toolName);
});
}
if ($(this).data("toolName")===config.ui.initial_tool) {
if ($(this).data("toolName") === config.ui.initial_tool) {
$(this).click();
}
});
......
......@@ -132,8 +132,18 @@ define([
this.sharingPropEl
.toggleClass("aom-prop-locked", locked)
.toggleClass("aom-prop-unlocked", !locked);
this.propListEl
.toggleClass("aom-prop-locked", locked)
.toggleClass("aom-prop-unlocked", !locked);
this.sharingPropEl.find("[name=aom-prop-shared]").val([sharingMode]);
var sharingModeSelect = this.sharingPropEl.find("[name=aom-prop-shared]");
console.log("sharingMode", sharingMode);
if (_.isUndefined(sharingMode) || sharingMode === "" ) {
sharingModeSelect.attr("disabled", "disabled");
} else {
sharingModeSelect.removeAttr("disabled");
}
sharingModeSelect.val([sharingMode]);
this.publicPublishEl.val([publicPublish]);
this.propShMdParamsAll.addClass("hidden");
if (sharingMode) {
......
......@@ -1633,6 +1633,47 @@ canvas.cursor-tool-arrow2 {
letter-spacing: 1px;
font-size: 10px;
}
.aom-info-panel .panel-body .aom-prop-lock-but {
margin-top: -5px;
}
.aom-info-panel .panel-body .aom-prop-unlocked-status,
.aom-info-panel .panel-body .aom-prop-locked-status {
display: none;
}
.aom-info-panel .panel-body .aom-prop-unlocked .aom-prop-unlocked-status {
display: inline;
}
.aom-info-panel .panel-body .aom-prop-unlocked .aom-prop-locked-status {
display: none;
}
.aom-info-panel .panel-body .aom-prop-locked .aom-prop-unlocked-status {
display: none;
}
.aom-info-panel .panel-body .aom-prop-locked .aom-prop-locked-status {
display: inline;
}
.aom-info-panel .panel-body .aom-prop-locked .aom-prop-locked-status.alert {
display: block;
margin: 5px 15px 10px;
padding: 10px;
}
.aom-info-panel .panel-body .aom-prop-locked .popover {
color: #333333;
font-size: 12px;
}
.aom-info-panel .panel-body .aom-prop-locked .popover-title {
font-size: 12px;
font-weight: bold;
}
.aom-info-panel .panel-body .aom-prop-locked .help-block {
display: none;
}
.aom-info-panel .panel-body .aom-prop-locked-info {
cursor: pointer;
}
.aom-info-panel .panel-body .aom-prop-locked-info:hover {
text-decoration: underline;
}
.aom-info-panel .panel-body .aom-info-share h5 {
margin: 10px 15px;
}
......@@ -1661,41 +1702,6 @@ canvas.cursor-tool-arrow2 {
font-style: italic;
color: #6f6f6f;
}
.aom-info-panel .panel-body .aom-info-share .aom-prop-lock-but {
margin-top: -5px;
}
.aom-info-panel .panel-body .aom-info-share .aom-prop-unlocked-status,
.aom-info-panel .panel-body .aom-info-share .aom-prop-locked-status {
display: none;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-unlocked .aom-prop-unlocked-status {
display: inline;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-unlocked .aom-prop-locked-status {
display: none;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .aom-prop-unlocked-status {
display: none;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .aom-prop-locked-status {
display: inline;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .aom-prop-locked-status.alert {
display: block;
margin: 5px 15px 10px;
padding: 10px;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .popover {
color: #333333;
font-size: 12px;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .popover-title {
font-size: 12px;
font-weight: bold;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .help-block {
display: none;
}
.aom-info-panel .panel-body .aom-info-share form {
position: relative;
overflow: hidden;
......@@ -1710,12 +1716,6 @@ canvas.cursor-tool-arrow2 {
width: 100%;
z-index: 100;
}
.aom-info-panel .panel-body .aom-info-share .aom-prop-locked-info {
cursor: pointer;
}
.aom-info-panel .panel-body .aom-info-share .aom-prop-locked-info:hover {
text-decoration: underline;
}
#aom-shared-images-list .aom-list-item .btn-toolbar .aom-item-sh-status {
display: none;
}
......
......@@ -179,6 +179,47 @@
letter-spacing: 1px;
font-size: 10px;
}
.aom-info-panel .panel-body .aom-prop-lock-but {
margin-top: -5px;
}
.aom-info-panel .panel-body .aom-prop-unlocked-status,
.aom-info-panel .panel-body .aom-prop-locked-status {
display: none;
}
.aom-info-panel .panel-body .aom-prop-unlocked .aom-prop-unlocked-status {
display: inline;
}
.aom-info-panel .panel-body .aom-prop-unlocked .aom-prop-locked-status {
display: none;
}
.aom-info-panel .panel-body .aom-prop-locked .aom-prop-unlocked-status {
display: none;
}
.aom-info-panel .panel-body .aom-prop-locked .aom-prop-locked-status {
display: inline;
}
.aom-info-panel .panel-body .aom-prop-locked .aom-prop-locked-status.alert {
display: block;
margin: 5px 15px 10px;
padding: 10px;
}
.aom-info-panel .panel-body .aom-prop-locked .popover {
color: #333333;
font-size: 12px;
}
.aom-info-panel .panel-body .aom-prop-locked .popover-title {
font-size: 12px;
font-weight: bold;
}
.aom-info-panel .panel-body .aom-prop-locked .help-block {
display: none;
}
.aom-info-panel .panel-body .aom-prop-locked-info {
cursor: pointer;
}
.aom-info-panel .panel-body .aom-prop-locked-info:hover {
text-decoration: underline;
}
.aom-info-panel .panel-body .aom-info-share h5 {
margin: 10px 15px;
}
......@@ -207,41 +248,6 @@
font-style: italic;
color: #6f6f6f;
}
.aom-info-panel .panel-body .aom-info-share .aom-prop-lock-but {
margin-top: -5px;
}
.aom-info-panel .panel-body .aom-info-share .aom-prop-unlocked-status,
.aom-info-panel .panel-body .aom-info-share .aom-prop-locked-status {
display: none;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-unlocked .aom-prop-unlocked-status {
display: inline;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-unlocked .aom-prop-locked-status {
display: none;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .aom-prop-unlocked-status {
display: none;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .aom-prop-locked-status {
display: inline;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .aom-prop-locked-status.alert {
display: block;
margin: 5px 15px 10px;
padding: 10px;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .popover {
color: #333333;
font-size: 12px;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .popover-title {
font-size: 12px;
font-weight: bold;
}
.aom-info-panel .panel-body .aom-info-share.aom-prop-locked .help-block {
display: none;
}
.aom-info-panel .panel-body .aom-info-share form {
position: relative;
overflow: hidden;
......@@ -256,12 +262,6 @@
width: 100%;
z-index: 100;
}
.aom-info-panel .panel-body .aom-info-share .aom-prop-locked-info {
cursor: pointer;
}
.aom-info-panel .panel-body .aom-info-share .aom-prop-locked-info:hover {
text-decoration: underline;
}
#aom-shared-images-list .aom-list-item .btn-toolbar .aom-item-sh-status {
display: none;
}
......
......@@ -144,6 +144,37 @@
font-size: 10px;
}
// ----- Locked button and status
.aom-prop-lock-but { margin-top: -5px; }
.aom-prop-unlocked-status, .aom-prop-locked-status { display: none; }
.aom-prop-unlocked {
.aom-prop-unlocked-status { display: inline; }
.aom-prop-locked-status { display: none; }
}
.aom-prop-locked {
.aom-prop-unlocked-status { display: none; }
.aom-prop-locked-status { display: inline; }
.aom-prop-locked-status.alert {
display: block;
margin: 5px 15px 10px;
padding: 10px;
}
.popover {
color: @text-color;
font-size: 12px;
}
.popover-title {
font-size: 12px;
font-weight: bold;
}
.help-block { display: none; }
}
.aom-prop-locked-info {
cursor: pointer;
&:hover { text-decoration: underline; }
}
.aom-info-share {
h5 {
......@@ -176,31 +207,6 @@
}
}
// ----- Locked button and status
.aom-prop-lock-but { margin-top: -5px; }
.aom-prop-unlocked-status, .aom-prop-locked-status { display: none; }
&.aom-prop-unlocked {
.aom-prop-unlocked-status { display: inline; }
.aom-prop-locked-status { display: none; }
}
&.aom-prop-locked {
.aom-prop-unlocked-status { display: none; }
.aom-prop-locked-status { display: inline; }
.aom-prop-locked-status.alert {
display: block;
margin: 5px 15px 10px;
padding: 10px;
}
.popover {
color: @text-color;
font-size: 12px;
}
.popover-title {
font-size: 12px;
font-weight: bold;
}
.help-block { display: none; }
}
form {
position: relative;
overflow: hidden;
......@@ -216,10 +222,6 @@
}
}
.aom-prop-locked-info {
cursor: pointer;
&:hover { text-decoration: underline; }
}
}
......
......@@ -54,6 +54,7 @@ window.ADIM_CONFIG = {
uuid: '{{ anobj.uuid }}',
title: '{{ anobj.name|escapejs }}',
slug: '{{ anobj.name|slugify }}',
locked: {{ anobj.locked|yesno:"true,false" }},
image: '{{ anobj.image_url|default:"image/" }}',
thumbnail: 'thumb/'
{# image: '{% url "adim.app:ao_image" anobj_uuid=anobj.uuid %}'#}
......
......@@ -22,7 +22,7 @@
<img class="aom-image-thumb"