mirror/spacedeck-open
1
0
Fork 0
mirror of https://github.com/spacedeck/spacedeck-open.git synced 2025-12-15 17:37:30 +01:00
Code Issues Projects Releases Wiki Activity

Fix Space browsing/editing on touch devices such as iPad (#152)

Browse Source 
* touch (tablet): fix deselect when tapping space; add edit text butto
* touch: fix media upload on iDevice
* touch: fix vector transforming (points of arrows, scribbles)

Co-authored-by: Lukas F. Hartmann <lukas@mntre.com>
This commit is contained in:
mntmn
2021-01-11 13:04:07 +01:00
committed by GitHub
parent 72221fcf0b
commit fbf18839f9
7 changed files with 84 additions and 90 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
public/javascripts/spacedeck_sections.js
View File

@@ -1019,8 +1019,7 @@ var SpacedeckSections = {
};
},
update_selection_metrics: function(arts) {
update_selection_metrics: function(arts, temporary) {
if (this.active_tool == "scribble") {
this.selection_metrics.count = 1;
return;
@@ -1053,8 +1052,6 @@ var SpacedeckSections = {
// FIXME make sure that menus fit in window
this.toolbar_props_x = pp.x+"px";
this.toolbar_props_y = pp.y+"px";
//this.hide_toolbar_artifacts();
}
this.selection_metrics.x1 = sr.x1;
@@ -1069,24 +1066,26 @@ var SpacedeckSections = {
if (!arts) arts = this.selected_artifacts();
this.first_selected_artifact = arts[0];
this.selection_metrics.count=arts.length;
this.selection_metrics.scribble_selection = false;
if (arts.length == 1 && arts[0].mime == "x-spacedeck/vector") {
if (arts[0].shape == "scribble") {
this.selection_metrics.scribble_selection = true;
if (!temporary) {
this.first_selected_artifact = arts[0];
this.selection_metrics.count=arts.length;
this.selection_metrics.scribble_selection = false;
if (arts.length == 1 && arts[0].mime == "x-spacedeck/vector") {
if (arts[0].shape == "scribble") {
this.selection_metrics.scribble_selection = true;
}
this.selection_metrics.vector_points = arts[0].control_points;
this.selection_metrics.vector_selection = true;
} else {
this.selection_metrics.vector_points = [{},{}];
this.selection_metrics.vector_selection = false;
}
this.selection_metrics.has_link=false;
this.insert_link_url="";
if (arts.length == 1 && arts[0].meta && arts[0].meta.link_uri && arts[0].meta.link_uri.length>0) {
this.selection_metrics.has_link=true;
this.insert_link_url = arts[0].meta.link_uri;
}
this.selection_metrics.vector_points = arts[0].control_points;
this.selection_metrics.vector_selection = true;
} else {
this.selection_metrics.vector_points = [{},{}];
this.selection_metrics.vector_selection = false;
}
this.selection_metrics.has_link=false;
this.insert_link_url="";
if (arts.length == 1 && arts[0].meta && arts[0].meta.link_uri && arts[0].meta.link_uri.length>0) {
this.selection_metrics.has_link=true;
this.insert_link_url = arts[0].meta.link_uri;
}
},
@@ -1436,13 +1435,13 @@ var SpacedeckSections = {
this.color_picker_rgb = rgb_to_hex(rgba.r,rgba.g,rgba.b);
},
update_selected_artifacts: function(change_func, override_locked) {
update_selected_artifacts: function(change_func, override_locked, temporary) {
var artifacts = this.selected_artifacts(!override_locked);
if (!artifacts.length) return;
this.update_artifacts(artifacts, change_func);
this.update_selection_metrics();
this.update_selection_metrics(null, temporary||false);
},
nudge_selected_artifacts: function(dx, dy, event) {
@@ -1923,10 +1922,7 @@ var SpacedeckSections = {
}.bind(this));
},
delayed_edit_artifact: function(evt) {
evt.stopPropagation();
evt.preventDefault();
delayed_edit_artifact: function() {
var a = this.selected_artifacts()[0];
var el = $("#ios-focuser-"+a._id);
@@ -2087,8 +2083,6 @@ var SpacedeckSections = {
if (a.description!=dom.innerHTML) {
a.description = dom.innerHTML;
console.log("new DOM:",dom.innerHTML);
this.update_board_artifact_viewmodel(a);
this.queue_artifact_for_save(a);

48
public/javascripts/spacedeck_whiteboard.js
View File

@@ -6,7 +6,7 @@
function setup_whiteboard_directives() {
var mode_touch = false;
if ('ontouchstart' in window) {
mode_touch = true;
var edown = "touchstart";
@@ -38,7 +38,7 @@ function setup_whiteboard_directives() {
$(el).bind("mousedown", this.handle_mouse_down_space.bind(this));
$(el).bind("mousemove", this.handle_mouse_move.bind(this));
$(el).bind("mouseup", this.handle_mouse_up_space.bind(this));
$(el).bind("wheel", this.handle_wheel_space.bind(this));
$(document.body).bind("mouseleave", this.handle_mouse_leave.bind(this));
@@ -99,7 +99,7 @@ function setup_whiteboard_directives() {
this.handle_mouse_down_space(evt);
return;
}
if ($scope.active_tool == "note") {
this.handle_mouse_down_space(evt, true);
return;
@@ -154,7 +154,7 @@ function setup_whiteboard_directives() {
var a = $scope.find_artifact_by_id(evt.currentTarget.id.replace("artifact-",""));
if (!a) return;
if (a.payload_uri) {
$scope.download_selected_artifacts();
}
@@ -200,10 +200,10 @@ function setup_whiteboard_directives() {
var $scope = this.vm.$root;
if (!evt.ctrlKey && !evt.shiftKey) return;
evt.preventDefault();
evt.stopPropagation();
var amount = 1;
var dy = evt.originalEvent.deltaY;
if (dy>0) {
@@ -222,7 +222,7 @@ function setup_whiteboard_directives() {
if (!force && evt.which != 2) {
if (evt.target != evt.currentTarget && !_.include(["wrapper"],evt.target.className)) return;
}
var $scope = this.vm.$root;
$scope.opened_dialog="none";
@@ -234,7 +234,7 @@ function setup_whiteboard_directives() {
if ((mode_touch && $scope.active_tool=="pointer") || evt.which == 2 || evt.buttons == 4) {
$scope.active_tool = "pan";
}
if ($scope.active_tool=="note") {
this.deselect();
this.mouse_state = "transform";
@@ -285,6 +285,7 @@ function setup_whiteboard_directives() {
$scope.start_adding_placeholder(evt);
return;
} else if ($scope.active_tool=="pan") {
this.deselect();
this.start_pan(evt);
return;
}
@@ -305,7 +306,7 @@ function setup_whiteboard_directives() {
this.old_panx = el.scrollLeft;
this.old_pany = el.scrollTop;
}
var cursor = this.cursor_point_to_space(evt);
$scope.mouse_ox = cursor.x;
$scope.mouse_oy = cursor.y;
@@ -314,7 +315,7 @@ function setup_whiteboard_directives() {
deselect: function() {
var $scope = this.vm.$root;
$scope.deselect();
},
@@ -342,7 +343,7 @@ function setup_whiteboard_directives() {
rects_intersecting: function(r1,r2) {
if (!r1 || !r2) return false;
if ( (r1.x+r1.w < r2.x)
|| (r1.x > r2.x+r2.w)
|| (r1.y+r1.h < r2.y)
@@ -352,7 +353,7 @@ function setup_whiteboard_directives() {
artifacts_in_rect: function(rect) {
if (!rect) return [];
var $scope = this.vm.$root;
return _.filter($scope.active_space_artifacts, function(a) {
@@ -688,7 +689,7 @@ function setup_whiteboard_directives() {
var $scope = this.vm.$root;
evt.preventDefault();
if (this.mouse_state == "lasso") {
var lasso_rect = this.abs_rect(this.lasso);
@@ -696,7 +697,7 @@ function setup_whiteboard_directives() {
var arts = this.artifacts_in_rect(lasso_rect);
this.multi_select(arts);
} else {
if (this._no_artifact_toolbar_this_round) {
this._no_artifact_toolbar_this_round = false;
} else {
@@ -708,7 +709,7 @@ function setup_whiteboard_directives() {
}
else if (_.include(["transform","move","vector_transform","scribble"],this.mouse_state)) {
var ars = $scope.selected_artifacts();
for (var i=0; i<ars.length; i++) {
if (_.include(["text","placeholder"],$scope.artifact_major_type(ars[i]))) {
@@ -723,6 +724,9 @@ function setup_whiteboard_directives() {
//save_artifact(ars[i], null, $scope.display_saving_error);
}
// update vector handles
$scope.update_selection_metrics();
}
if (this.mouse_state == "text_editor") {
@@ -794,7 +798,7 @@ function setup_whiteboard_directives() {
$scope.websocket_send(cursor_msg);
}
// side effects ftw!
$scope.snap_ruler_x = -1000;
$scope.snap_ruler_y = -1000;
@@ -818,7 +822,7 @@ function setup_whiteboard_directives() {
if (this.mouse_state == "move") {
$scope.hide_toolbar_props();
var snap_dx = 0;
var snap_dy = 0;
@@ -878,7 +882,7 @@ function setup_whiteboard_directives() {
}
$scope.hide_toolbar_props();
var ew = (edges.x2-edges.x1);
var eh = (edges.y2-edges.y1);
@@ -924,7 +928,7 @@ function setup_whiteboard_directives() {
} else if (this.mouse_state == "vector_transform") {
$scope.hide_toolbar_props();
var _this = this;
$scope.update_selected_artifacts(function(a) {
var old_a = $scope.find_artifact_before_transaction(a);
@@ -941,18 +945,14 @@ function setup_whiteboard_directives() {
// special case for arrow's 3rd point
if (a.shape == "arrow" && $scope.selected_control_point_idx!=2) {
/*control_points[2].dx += dx/2;
control_points[2].dy += dy/2; */
control_points[2].dx = (control_points[0].dx+control_points[1].dx)/2;
control_points[2].dy = (control_points[0].dy+control_points[1].dy)/2;
}
return _this.normalize_control_points(control_points, old_a);
});
}, false, true); // override_locked: false, temporary: true
} else if (this.mouse_state == "scribble") {
$scope.update_selected_artifacts(function(a) {
var old_a = a;