mirror of
https://github.com/ansible/awx.git
synced 2026-02-23 05:55:59 -03:30
Cleans up network UI code for 3.3
This removes features that were not selected for 3.3. * Removes breadcrumb * Removes "Jump To" panel and some of the hotkey panel items * Removes Buttons in favor of Action Dropdown * Removes chevrons * Removes ActionIcon model * Removes the Rename button on the context menu * Makes details panel readonly * Adds expand modal for extra vars * Adds inventory copy function back to inventory list * Sets cursor to visible * Adds hide_menus * Adds fix for mice that return large mousewheel deltas
This commit is contained in:
committed by
Ben Thomasson
parent
766bee3753
commit
66c351c60c
@@ -2,7 +2,6 @@
|
||||
var fsm = require('./fsm.js');
|
||||
var button = require('./button.fsm.js');
|
||||
var util = require('./util.js');
|
||||
var inherits = require('inherits');
|
||||
var animation_fsm = require('./animation.fsm.js');
|
||||
|
||||
function Device(id, name, x, y, type, host_id) {
|
||||
@@ -60,29 +59,6 @@ Device.prototype.is_selected = function (x, y) {
|
||||
Device.prototype.describeArc = util.describeArc;
|
||||
|
||||
|
||||
Device.prototype.compile_variables = function () {
|
||||
var variables = JSON.parse(JSON.stringify(this.variables));
|
||||
var awx_variables = {};
|
||||
variables.awx = awx_variables;
|
||||
awx_variables.name = this.name;
|
||||
awx_variables.type = this.type;
|
||||
awx_variables.interfaces = [];
|
||||
var i = 0;
|
||||
var intf = null;
|
||||
for (i = 0; i < this.interfaces.length; i++) {
|
||||
intf = {name: this.interfaces[i].name,
|
||||
id: this.interfaces[i].id};
|
||||
if (this.interfaces[i].link !== null) {
|
||||
intf.link_id = this.interfaces[i].link.id;
|
||||
intf.link_name = this.interfaces[i].link.name;
|
||||
intf.remote_interface_name = this.interfaces[i].remote_interface().name;
|
||||
intf.remote_device_name = this.interfaces[i].remote_interface().device.name;
|
||||
}
|
||||
awx_variables.interfaces.push(intf);
|
||||
}
|
||||
return variables;
|
||||
};
|
||||
|
||||
function Interface(id, name) {
|
||||
this.id = id;
|
||||
this.name = name;
|
||||
@@ -321,82 +297,6 @@ Link.prototype.plength = function (x, y) {
|
||||
return util.pDistance(x, y, x1, y1, x2, y2);
|
||||
};
|
||||
|
||||
function ActionIcon(name, x, y, r, callback, enabled, tracer) {
|
||||
this.name = name;
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.r = r;
|
||||
this.callback = callback;
|
||||
this.is_pressed = false;
|
||||
this.mouse_over = false;
|
||||
this.enabled = enabled;
|
||||
this.fsm = new fsm.FSMController(this, "button_fsm", enabled ? button.Start : button.Disabled, tracer);
|
||||
}
|
||||
exports.ActionIcon = ActionIcon;
|
||||
|
||||
ActionIcon.prototype.is_selected = function (x, y) {
|
||||
|
||||
return (x > this.x - this.r &&
|
||||
x < this.x + this.r &&
|
||||
y > this.y - this.r &&
|
||||
y < this.y + this.r);
|
||||
|
||||
};
|
||||
|
||||
function Button(name, x, y, width, height, callback, tracer) {
|
||||
this.name = name;
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.width = width;
|
||||
this.height = height;
|
||||
this.callback = callback;
|
||||
this.is_pressed = false;
|
||||
this.mouse_over = false;
|
||||
this.enabled = true;
|
||||
this.fsm = new fsm.FSMController(this, "button_fsm", button.Start, tracer);
|
||||
}
|
||||
exports.Button = Button;
|
||||
|
||||
|
||||
Button.prototype.is_selected = function (x, y) {
|
||||
|
||||
return (x > this.x &&
|
||||
x < this.x + this.width &&
|
||||
y > this.y &&
|
||||
y < this.y + this.height);
|
||||
|
||||
};
|
||||
|
||||
|
||||
function ToggleButton(name, x, y, width, height, toggle_callback, untoggle_callback, default_toggled, tracer) {
|
||||
this.name = name;
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.width = width;
|
||||
this.height = height;
|
||||
this.callback = this.toggle;
|
||||
this.is_pressed = default_toggled;
|
||||
this.toggled = default_toggled;
|
||||
this.toggle_callback = toggle_callback;
|
||||
this.untoggle_callback = untoggle_callback;
|
||||
this.mouse_over = false;
|
||||
this.enabled = true;
|
||||
this.fsm = new fsm.FSMController(this, "button_fsm", button.Start, tracer);
|
||||
}
|
||||
inherits(ToggleButton, Button);
|
||||
exports.ToggleButton = ToggleButton;
|
||||
|
||||
ToggleButton.prototype.toggle = function () {
|
||||
this.toggled = !this.toggled;
|
||||
this.is_pressed = this.toggled;
|
||||
|
||||
if (this.toggled) {
|
||||
this.toggle_callback();
|
||||
} else {
|
||||
this.untoggle_callback();
|
||||
}
|
||||
};
|
||||
|
||||
function ContextMenu(name, x, y, width, height, callback, enabled, buttons, tracer) {
|
||||
this.name = name;
|
||||
this.x = x;
|
||||
@@ -447,7 +347,6 @@ ContextMenuButton.prototype.is_selected = function (x, y) {
|
||||
};
|
||||
|
||||
|
||||
|
||||
function ToolBox(id, name, type, x, y, width, height) {
|
||||
this.id = id;
|
||||
this.name = name;
|
||||
@@ -464,222 +363,6 @@ function ToolBox(id, name, type, x, y, width, height) {
|
||||
}
|
||||
exports.ToolBox = ToolBox;
|
||||
|
||||
|
||||
function Process(id, name, type, x, y) {
|
||||
this.id = id;
|
||||
this.name = name;
|
||||
this.type = type;
|
||||
this.x = x;
|
||||
this.y = y;
|
||||
this.height = 50;
|
||||
this.width = 50;
|
||||
this.size = 50;
|
||||
this.selected = null;
|
||||
this.enabled = true;
|
||||
this.icon = false;
|
||||
this.device = null;
|
||||
}
|
||||
exports.Process = Process;
|
||||
|
||||
Process.prototype.toJSON = function () {
|
||||
return {id: this.id,
|
||||
name: this.name};
|
||||
};
|
||||
|
||||
function Stream(id, from_device, to_device, label) {
|
||||
this.id = id;
|
||||
this.from_device = from_device;
|
||||
this.to_device = to_device;
|
||||
this.selected = false;
|
||||
this.remote_selected = false;
|
||||
this.label = label;
|
||||
this.offset = 0;
|
||||
}
|
||||
exports.Stream = Stream;
|
||||
|
||||
Stream.prototype.toJSON = function () {
|
||||
return {to_device: this.to_device.id,
|
||||
from_device: this.from_device.id};
|
||||
};
|
||||
|
||||
Stream.prototype.slope_rad = function () {
|
||||
//Return the slope in radians for this transition.
|
||||
var x1 = this.from_device.x;
|
||||
var y1 = this.from_device.y;
|
||||
var x2 = this.to_device.x;
|
||||
var y2 = this.to_device.y;
|
||||
return Math.atan2(y2 - y1, x2 - x1) + Math.PI;
|
||||
};
|
||||
|
||||
Stream.prototype.slope = function () {
|
||||
//Return the slope in degrees for this transition.
|
||||
var x1 = this.from_device.x;
|
||||
var y1 = this.from_device.y;
|
||||
var x2 = this.to_device.x;
|
||||
var y2 = this.to_device.y;
|
||||
return Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI + 180;
|
||||
};
|
||||
|
||||
Stream.prototype.flip_text_rotate = function () {
|
||||
var slope = this.slope();
|
||||
if (slope > 90 && slope < 270) {
|
||||
return 180;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
};
|
||||
|
||||
Stream.prototype.flip_text_offset = function () {
|
||||
var slope = this.slope();
|
||||
if (slope > 90 && slope < 270) {
|
||||
return 10;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
};
|
||||
|
||||
Stream.prototype.pslope = function () {
|
||||
//Return the slope of a perpendicular line to this
|
||||
//transition
|
||||
var x1 = this.from_device.x;
|
||||
var y1 = this.from_device.y;
|
||||
var x2 = this.to_device.x;
|
||||
var y2 = this.to_device.y;
|
||||
var slope = (y2 - y1)/(x2 - x1);
|
||||
//var intercept = - slope * x1;
|
||||
var pslope = 1/slope;
|
||||
return Math.atan(pslope) * 180 / Math.PI + 180;
|
||||
};
|
||||
|
||||
Stream.prototype.perpendicular = function (x, y) {
|
||||
//Find the perpendicular line through x, y to this transition.
|
||||
var x1 = this.from_device.x;
|
||||
var y1 = this.from_device.y;
|
||||
var x2 = this.to_device.x;
|
||||
var y2 = this.to_device.y;
|
||||
var slope = (y2 - y1)/(x2 - x1);
|
||||
var intercept = y1 - slope * x1;
|
||||
var pslope = -1/slope;
|
||||
var pintercept = y - pslope * x;
|
||||
|
||||
var xi = (pintercept - intercept) / (slope - pslope);
|
||||
var yi = pslope * xi + pintercept;
|
||||
return {x1:x, y1:y, x2: xi, y2: yi};
|
||||
};
|
||||
|
||||
Stream.prototype.is_selected = function (x, y) {
|
||||
// Is the distance to the mouse location less than 25 if on the label side
|
||||
// or 5 on the other from the shortest line to the transition?
|
||||
console.log("is_selected");
|
||||
var phi = this.slope_rad();
|
||||
console.log({"phi": phi});
|
||||
console.log({'x': this.from_device.x, 'y': this.from_device.y});
|
||||
console.log({'x': this.to_device.x, 'y': this.to_device.y});
|
||||
console.log({'x': x, 'y': y});
|
||||
var p1 = util.cartesianToPolar(this.from_device.x, this.from_device.y);
|
||||
var p2 = util.cartesianToPolar(this.to_device.x, this.to_device.y);
|
||||
var p3 = util.cartesianToPolar(x, y);
|
||||
console.log(p1);
|
||||
p1.theta -= phi;
|
||||
console.log(p1);
|
||||
console.log(p2);
|
||||
p2.theta -= phi;
|
||||
console.log(p2);
|
||||
p3.theta -= phi;
|
||||
|
||||
p1 = util.polarToCartesian_rad(0, 0, p1.r, p1.theta);
|
||||
p2 = util.polarToCartesian_rad(0, 0, p2.r, p2.theta);
|
||||
p3 = util.polarToCartesian_rad(0, 0, p3.r, p3.theta);
|
||||
p2.y -= this.arc_offset2();
|
||||
console.log(p1);
|
||||
console.log(p2);
|
||||
console.log(p3);
|
||||
var max_x = Math.max(p1.x, p2.x);
|
||||
var min_x = Math.min(p1.x, p2.x);
|
||||
var max_y = Math.max(p1.y, p2.y) + 5;
|
||||
var min_y = Math.min(p1.y, p2.y) - 25 ;
|
||||
|
||||
return p3.x > min_x && p3.x < max_x && p3.y > min_y && p3.y < max_y;
|
||||
};
|
||||
|
||||
Stream.prototype.length = function () {
|
||||
//Return the length of this transition.
|
||||
var x1 = this.from_device.x;
|
||||
var y1 = this.from_device.y;
|
||||
var x2 = this.to_device.x;
|
||||
var y2 = this.to_device.y;
|
||||
return Math.sqrt(Math.pow(x1-x2, 2) + Math.pow(y1-y2, 2));
|
||||
};
|
||||
|
||||
|
||||
Stream.prototype.inter_length = function () {
|
||||
//Return the length of this transition between states.
|
||||
return this.length() - this.from_device.size - this.to_device.size;
|
||||
};
|
||||
|
||||
Stream.prototype.arc_r = function () {
|
||||
return this.inter_length();
|
||||
};
|
||||
|
||||
Stream.prototype.arc_r2 = function () {
|
||||
var offset_to_r = [2, 1, 0.75, 0.6, 0.55, 0.53, 0.5, 0.5, 0.5, 0.5, 0.5, 0.5, 0.5, 0.5, 0.5, 0.5, 0.5];
|
||||
return this.length() * offset_to_r[this.offset];
|
||||
};
|
||||
|
||||
Stream.prototype.arc_offset = function () {
|
||||
var r = this.arc_r();
|
||||
var offset = r - (Math.sin(this.arc_angle_rad()) * r);
|
||||
return offset;
|
||||
};
|
||||
|
||||
Stream.prototype.arc_offset2 = function () {
|
||||
var r = this.arc_r2();
|
||||
var theta = Math.acos((this.length() / 2) / r);
|
||||
var offset = r * (1 - Math.sin(theta));
|
||||
return offset;
|
||||
};
|
||||
|
||||
Stream.prototype.arc_angle_rad = function () {
|
||||
return Math.acos((this.inter_length() / 2) / this.arc_r());
|
||||
};
|
||||
|
||||
Stream.prototype.arc_angle_tan_rad = function () {
|
||||
return Math.PI/2 - Math.acos((this.inter_length() / 2) / this.arc_r());
|
||||
};
|
||||
|
||||
Stream.prototype.arc_angle_tan = function () {
|
||||
return this.arc_angle_tan_rad() * 180 / Math.PI;
|
||||
};
|
||||
|
||||
Stream.prototype.arc_angle_tan_rad2 = function () {
|
||||
var r = this.arc_r2();
|
||||
var l = this.length();
|
||||
var phi = this.end_arc_angle_rad();
|
||||
return Math.PI/2 - Math.acos((l/2 - Math.cos(phi) * this.to_device.size) / r);
|
||||
};
|
||||
|
||||
Stream.prototype.arc_angle_tan2 = function () {
|
||||
return this.arc_angle_tan_rad2() * 180 / Math.PI;
|
||||
};
|
||||
|
||||
Stream.prototype.end_arc_angle_rad = function () {
|
||||
var r = this.arc_r2();
|
||||
var l = this.length();
|
||||
return Math.acos((this.to_device.size / 2) / r) - Math.acos((l/2)/r);
|
||||
};
|
||||
|
||||
Stream.prototype.end_arc_angle = function () {
|
||||
return this.end_arc_angle_rad() * 180 / Math.PI;
|
||||
};
|
||||
|
||||
Stream.prototype.start_arc_angle_rad = function () {
|
||||
return Math.acos((this.from_device.size / 2) / this.arc_r2()) - Math.acos((this.length()/2)/this.arc_r2());
|
||||
};
|
||||
|
||||
Stream.prototype.start_arc_angle = function () {
|
||||
return this.start_arc_angle_rad() * 180 / Math.PI;
|
||||
};
|
||||
|
||||
function Test(name, event_trace, fsm_trace, pre_test_snapshot, post_test_snapshot) {
|
||||
this.name = name;
|
||||
this.event_trace = event_trace;
|
||||
@@ -710,6 +393,7 @@ function Animation(id, steps, data, scope, tracer, callback) {
|
||||
this.callback = callback;
|
||||
this.scope = scope;
|
||||
this.interval = null;
|
||||
this.frame_delay = 17;
|
||||
this.fsm = new fsm.FSMController(this, "animation_fsm", animation_fsm.Start, tracer);
|
||||
}
|
||||
exports.Animation = Animation;
|
||||
|
||||
Reference in New Issue
Block a user