senaduka/old-lab_ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

major changes

Browse Source
This commit is contained in:
Rohit
2019-06-05 23:10:46 -04:00
parent 3d8246dc09
commit 28f9d5041d
59 changed files with 4147 additions and 217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

312
client/app/components/coordinator/coordinator.html
View File

@@ -17,22 +17,27 @@
<div class="status-list">
<ul class="list-group list-group-horizontal">
<li id="left_safetyRunning" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Running</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Running</label>
</div>
</div>
</li>
<li id="left_safetyStopped" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Stopped</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Stopped</label>
</div>
</div>
</li>
</li>
</ul>
</div>
</div>
<div class="action-button panel-footer">
<button type="button" onclick="triggerService('/left/aescape/mode/activateSafetyController')" class="btn btn-sm">
<button type="button" onclick="triggerService('/left/aescape/mode/activateSafetyController')" class="btn">
Activate
</button>
</div>
@@ -46,34 +51,60 @@
<div class="panel-body text-center">
<div class="status-list">
<ul class="list-group list-group-horizontal">
<li id="left_frankaModeOther" class="list-group-item">
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Other</label>
</div>
</div>
</li>
<li id="left_frankaModeIdle" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Idle</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Idle</label>
</div>
</div>
</li>
<li id="left_frankaModeMove" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Move</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Move</label>
</div>
</div>
</li>
<li id="left_frankaModeGuiding" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Guiding</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Guiding</label>
</div>
</div>
</li>
<li id="left_frankaModeReflex" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Reflex</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Reflex</label>
</div>
</div>
</li>
<li id="left_frankaModeUserStopped" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>User Stopped</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>User Stopped</label>
</div>
</div>
</li>
<li id="left_frankaModeErrorRecovery" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Automatic Error Recovery</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Automatic Error Recovery</label>
</div>
</div>
</li>
</ul>
@@ -81,24 +112,56 @@
</div>
<div class="action-button panel-footer">
<button id="left_fixFrankaButton" type="button" onclick="triggerService('/left/aescape/hardware/resetFrankaError')" class="btn btn-sm">
<button id="left_fixFrankaButton" type="button" onclick="triggerService('/left/aescape/hardware/resetFrankaError')" class="btn">
Fix Errors
</button>
</div>
</div>
</div>
<div class="status-container">
<div class="robotiq panel panel-default panel-horizontal">
<div class="panel-heading">
Robotiq
</div>
<div class="panel-body text-center">
<div class="status-list">
<div class="progress" id="robotiqForce">
<div class="progress-bar bg-success" role="progressbar" id="robotiqForceBar" aria-valuenow="25" aria-valuemin="0" aria-valuemax="200">N/A</div>
</div>
<ul class="list-group list-group-horizontal text-center">
<li class="list-group-item">
<h4>X: <span id="robotiqX" class="label label-default">0.0</span></h4>
</li>
<li class="list-group-item">
<h4>Y: <span id="robotiqY" class="label label-default">0.0</span></h4>
</li>
<li class="list-group-item">
<h4>Z: <span id="robotiqZ" class="label label-default">0.0</span></h4>
</li>
</ul>
</div>
</div>
<div class="action-button panel-footer">
<button id="calibrateButton" type="button" onclick="triggerService('/left/aescape/hardware/calibrateRobotiq')" class="btn">
Calibrate
</button>
</div>
</div>
</div>
</div>
<div class="control-container col-md-6">
<div class="control-card panel panel-default">
<div class="panel-heading">
EEF Configuration
<i class="fas fa-info-circle"></i>
<i class="fas fa-info-circle" data-toggle="popover" title="Popover title" data-content="And here's some amazing content. It's very engaging. Right?"></i>
</div>
<div class="panel-body text-center">
<div class="button-area">
<button type="button" onclick="triggerService('/left/aescape/hardware/setTrainingEEF')" class="btn btn-primary col-md-6">
<button type="button" onclick="triggerService('/left/aescape/hardware/setTrainingEEF')" active class="btn btn-primary col-md-6">
Recording EEF
</button>
<button type="button" onclick="triggerService('/left/aescape/hardware/setExecutionEEF')" class="btn btn-primary col-md-6">
@@ -161,6 +224,7 @@
</div>
</div>
</div>
<!--
<div class="control-container col-md-6">
<div class="control-card panel panel-default">
<div class="panel-heading">
@@ -187,6 +251,7 @@
</div>
</div>
</div>
-->
<div class="control-container col-md-6">
<div class="control-card panel panel-default">
<div class="panel-heading">
@@ -234,40 +299,44 @@
Stop Playing Recording
</button>
</div>
<div class="row-md-4">
Bagfile name must not start with "/"
<div class="input-group">
<input type="text" id="bagNameText" class="form-control" placeholder="bag_filename">
<span class="input-group-btn">
<button class="btn btn-primary" type="button" onclick="triggerMessageService('/aescape/bags/startPlayingRecording', 'bagNameText')">
<span>
Start Playing Bag
</span>
</button>
</span>
</div>
</div>
<!-- <div class="row-md-4">
<<div class="col-md-3"> -->
<!-- Bagfile name must not start with "/"
<button class="btn btn-primary" type="button" onclick="updateRecordingsList()">
Refresh List
</button>
</div> -->
<div class="row-md-3 pt-4">
<div>
<div>
<div class="list-group" id="bagList">
<button type="button" class="list-group-item list-group-item-action">Dapibus ac facilisis in</button>
<button type="button" class="list-group-item list-group-item-action">Morbi leo risus</button>
<button type="button" class="list-group-item list-group-item-action">Porta ac consectetur ac</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<!--Bagfile name must not start with "/" -->
<div class="row">
<div class="row-md-8">
<input type="text" id="bagNameText" class="form-control" placeholder="bag_filename">
</div>
<div class="row-md-4">
<button class="btn btn-primary" type="button" onclick="triggerMessageService('/aescape/bags/startPlayingRecording', 'bagNameText')">
<span>
Play Bag
</span>
</button>
</div>
</div>
</div>
<!-- <div class="row-md-4">
<<div class="col-md-3"> -->
<!-- Bagfile name must not start with "/"
<button class="btn btn-primary" type="button" onclick="updateRecordingsList()">
Refresh List
</button>
</div> -->
<div>
<div>
<div class="list-group" id="bagList">
<button type="button" class="list-group-item list-group-item-action">Dapibus ac facilisis in</button>
<button type="button" class="list-group-item list-group-item-action">Morbi leo risus</button>
<button type="button" class="list-group-item list-group-item-action">Porta ac consectetur ac</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
<button type="button" class="list-group-item list-group-item-action">Vestibulum at eros</button>
</div>
</div>
</div>
</div>
@@ -291,72 +360,103 @@
</div>
<div class="panel-body">
<div class="status-bar">
<div class="status-container">
<div class="safety-monitor panel panel-default panel-horizontal">
<div class="panel-heading">
Safety Monitor
</div>
<div class="panel-body text-center">
<div class="status-list">
<ul class="list-group list-group-horizontal">
<li id="right_safetyRunning" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Running</label>
<div class="status-container">
<div class="safety-monitor panel panel-default panel-horizontal">
<div class="panel-heading">
Safety Monitor
</div>
<div class="panel-body text-center">
<div class="status-list">
<ul class="list-group list-group-horizontal">
<li id="right_safetyRunning" class="list-group-item">
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Running</label>
</div>
</li>
<li id="right_safetyStopped" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Stopped</label>
</div>
</li>
<li id="right_safetyStopped" class="list-group-item">
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Stopped</label>
</div>
</li>
</ul>
</div>
</div>
<div class="action-button panel-footer">
<button type="button" onclick="triggerService('/left/aescape/mode/activateSafetyController')" class="btn btn-sm">
Activate
</button>
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="action-button panel-footer">
<button type="button" onclick="triggerService('/left/aescape/mode/activateSafetyController')" class="btn">
Activate
</button>
</div>
</div>
<div class="status-container">
<div class="franka panel panel-default panel-horizontal">
<div class="panel-heading">
Franka Arm
</div>
<div class="panel-body text-center">
<div class="status-list">
</div>
<div class="status-container">
<div class="franka panel panel-default panel-horizontal">
<div class="panel-heading">
Franka Arm
</div>
<div class="panel-body text-center">
<div class="status-list">
<ul class="list-group list-group-horizontal">
<li id="right_frankaModeOther" class="list-group-item">
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Other</label>
</div>
</div>
</li>
<li id="right_frankaModeIdle" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Idle</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Idle</label>
</div>
</div>
</li>
<li id="right_frankaModeMove" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Move</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Move</label>
</div>
</div>
</li>
<li id="right_frankaModeGuiding" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Guiding</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Guiding</label>
</div>
</div>
</li>
<li id="right_frankaModeReflex" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Reflex</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Reflex</label>
</div>
</div>
</li>
<li id="right_frankaModeUserStopped" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>User Stopped</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>User Stopped</label>
</div>
</div>
</li>
<li id="right_frankaModeErrorRecovery" class="list-group-item">
<div class="radio disabled">
<label><input type="radio" disabled>Automatic Error Recovery</label>
<div class="pretty p-default p-round">
<input type="checkbox" />
<div class="state p-success-o">
<label>Automatic Error Recovery</label>
</div>
</div>
</li>
</ul>
@@ -364,7 +464,7 @@
</div>
<div class="action-button panel-footer">
<button id="left_fixFrankaButton" type="button" onclick="triggerService('/left/aescape/hardware/resetFrankaError')" class="btn btn-sm">
<button id="left_fixFrankaButton" type="button" onclick="triggerService('/left/aescape/hardware/resetFrankaError')" class="btn">
Fix Errors
</button>
</div>
@@ -403,19 +503,19 @@
</div>
<div class="panel-body text-center">
<div class="button-area">
<button id="left_teachingModeButton" type="button" onclick="triggerService('/right/aescape/mode/activateTeachingController')" class="btn btn-primary col-md-4">
<button id="right_teachingModeButton" type="button" onclick="triggerService('/right/aescape/mode/activateTeachingController')" class="btn btn-primary col-md-4">
Teaching Mode
</button>
<button id="left_executionModeButton" type="button" onclick="triggerService('/right/aescape/mode/activateExecutionController')" class="btn btn-primary col-md-4">
<button id="right_executionModeButton" type="button" onclick="triggerService('/right/aescape/mode/activateExecutionController')" class="btn btn-primary col-md-4">
Massage Mode
</button>
<button id="left_readyModeButton" type="button" onclick="triggerService('/right/aescape/mode/activateReadyController')" class="btn btn-primary col-md-4">
<button id="right_readyModeButton" type="button" onclick="triggerService('/right/aescape/mode/activateReadyController')" class="btn btn-primary col-md-4">
Ready Mode
</button>
<button id="left_standbyModeButton" type="button" onclick="triggerService('/right/aescape/mode/activateStandbyController')" class="btn btn-primary col-md-4">
<button id="right_standbyModeButton" type="button" onclick="triggerService('/right/aescape/mode/activateStandbyController')" class="btn btn-primary col-md-4">
Standby Mode
</button>
<button id="left_stoppedModeButton" type="button" onclick="triggerService('/right/aescape/mode/stopControllers')" class="btn btn-primary col-md-4">
<button id="right_stoppedModeButton" type="button" onclick="triggerService('/right/aescape/mode/stopControllers')" class="btn btn-primary col-md-4">
Stopped Mode
</button>
</div>

243
client/app/components/coordinator/js/ros_scripts.js
View File

@@ -60,112 +60,104 @@ class ArmControls
});
this.safetyStatusTopic.subscribe(this.safetyStatus.bind(this));
this.lastActiveButton = {
operationMode : null
};
}
// FrankaState
frankaStatus(message) {
document.getElementById(this.namespace+"_frankaModeOther").className = "label label-default"
document.getElementById(this.namespace+"_frankaModeIdle").className = "label label-default"
document.getElementById(this.namespace+"_frankaModeMove").className = "label label-default"
document.getElementById(this.namespace+"_frankaModeGuiding").className = "label label-default"
document.getElementById(this.namespace+"_frankaModeReflex").className = "label label-default"
document.getElementById(this.namespace+"_frankaModeUserStopped").className = "label label-default"
document.getElementById(this.namespace+"_frankaModeErrorRecovery").className = "label label-default"
document.getElementById(this.namespace+"_fixFrankaButton").className = "btn btn-primary"
if (message.robot_mode == 0)
{
document.getElementById(this.namespace+"_frankaModeOther").className = "label label-warning"
document.getElementById(this.namespace+"_fixFrankaButton").className = "btn btn-danger"
}
else if (message.robot_mode == 1)
{
document.getElementById(this.namespace+"_frankaModeIdle").className = "label label-warning"
document.getElementById(this.namespace+"_fixFrankaButton").className = "btn btn-danger"
}
else if (message.robot_mode == 2)
{
document.getElementById(this.namespace+"_frankaModeMove").className = "label label-warning"
document.getElementById(this.namespace+"_fixFrankaButton").className = "btn btn-success"
}
else if (message.robot_mode == 3)
{
document.getElementById(this.namespace+"_frankaModeGuiding").className = "label label-warning"
document.getElementById(this.namespace+"_fixFrankaButton").className = "btn btn-default"
var frankaModeToButtonMap = {
0 : "frankaModeOther",
1 : "frankaModeIdle",
2 : "frankaModeMove",
3 : "frankaModeGuiding",
4 : "frankaModeReflex",
5 : "frankaModeUserStopped",
6 : "frankaModeErrorRecovery"
}
else if (message.robot_mode == 4)
{
document.getElementById(this.namespace+"_frankaModeReflex").className = "label label-warning"
document.getElementById(this.namespace+"_fixFrankaButton").className = "btn btn-danger"
if(frankaModeLastActive && frankaModeLastActive != message.robot_mode) {
var frankaButton = frankaModeToButtonMap[frankaModeLastActive];
if (frankaButton) {
document.getElementById(this.namespace+"_"+frankaButton).getElementsByTagName("input")[0].checked = false;
document.getElementById(this.namespace+"_"+frankaButton).getElementsByTagName("input")[0].disabled = true;
}
}
else if (message.robot_mode == 5)
{
document.getElementById(this.namespace+"_frankaModeUserStopped").className = "label label-warning"
document.getElementById(this.namespace+"_fixFrankaButton").className = "btn btn-default"
}
else if (message.robot_mode == 6)
{
document.getElementById(this.namespace+"_frankaModeErrorRecovery").className = "label label-warning"
document.getElementById(this.namespace+"_fixFrankaButton").className = "btn btn-default"
var frankaButton = frankaModeToButtonMap[message.robot_mode];
if (frankaButton) {
document.getElementById(this.namespace+"_"+frankaButton).getElementsByTagName("input")[0].disabled = false;
document.getElementById(this.namespace+"_"+frankaButton).getElementsByTagName("input")[0].checked = true;
}
var frankaModeLastActive = message.robot_mode;
}
// Operation Mode
modeStatus(message) {
document.getElementById(this.namespace+"_stoppedModeButton").className = "btn btn-secondary"
document.getElementById(this.namespace+"_standbyModeButton").className = "btn btn-primary"
document.getElementById(this.namespace+"_readyModeButton").className = "btn btn-primary"
document.getElementById(this.namespace+"_teachingModeButton").className = "btn btn-primary"
document.getElementById(this.namespace+"_executionModeButton").className = "btn btn-primary"
var operationModeToButtonMap = {
"stopped" : "stoppedModeButton",
"standby" : "standbyModeButton",
"teach" : "teachingModeButton",
"execution" : "executionModeButton",
"ready" : "readyModeButton"
}
if (this.namespace == "left")
{
document.getElementById("recordingStartButton").disabled = true
document.getElementById("executionStartButton").disabled = true
}
if (message.data == "stopped")
if (message.data == "ready")
{
document.getElementById(this.namespace+"_stoppedModeButton").className = "btn btn-warning"
}
else if (message.data == "standby")
{
document.getElementById(this.namespace+"_standbyModeButton").className = "btn btn-primary btn-success"
}
else if (message.data == "teach")
{
document.getElementById(this.namespace+"_teachingModeButton").className = "btn btn-primary btn-success"
}
else if (message.data == "execution")
{
document.getElementById(this.namespace+"_executionModeButton").className = "btn btn-primary btn-success"
}
else if (message.data == "ready")
{
document.getElementById(this.namespace+"_readyModeButton").className = "btn btn-primary btn-success"
if (this.namespace == "left")
{
document.getElementById("recordingStartButton").disabled = false
document.getElementById("executionStartButton").disabled = false
}
}
var operationModeLastActive = this.operationModeLastActive;
if(operationModeLastActive && operationModeLastActive != message.data) {
var operationModeButton = operationModeToButtonMap[operationModeLastActive];
if (operationModeButton) {
document.getElementById(this.namespace+"_"+operationModeButton).classList.remove("active");
}
}
var operationModeButton = operationModeToButtonMap[message.data];
if (operationModeButton) {
document.getElementById(this.namespace+"_"+operationModeButton).classList.add('active');
}
this.operationModeLastActive = message.data;
}
safetyStatus(message) {
document.getElementById(this.namespace+"_safetyRunning").className = 'label label-default';
document.getElementById(this.namespace+"_safetyStopped").className = 'label label-default';
if (message.data == "stopped")
{
document.getElementById(this.namespace+"_safetyStopped").className = 'label label-danger';
}
else if (message.data == "running")
{
document.getElementById(this.namespace+"_safetyRunning").className = 'label label-success';
var safetyStatusToButtonMap = {
"stopped" : "safetyStopped",
"running" : "safetyRunning"
}
};
if(safetyButtonLastActive && safetyButtonLastActive != message.data) {
var safetyButton = safetyStatusToButtonMap[safetyButtonLastActive];
if(safetyButton) {
document.getElementById(this.namespace+"_"+safetyButton).getElementsByTagName("input")[0].checked = false;
document.getElementById(this.namespace+"_"+safetyButton).getElementsByTagName("input")[0].disabled = true;
}
}
var safetyButton = safetyStatusToButtonMap[message.data];
if(safetyButton) {
document.getElementById(this.namespace+"_"+safetyButton).getElementsByTagName("input")[0].disabled = false;
document.getElementById(this.namespace+"_"+safetyButton).getElementsByTagName("input")[0].checked = true;
}
var safetyButtonLastActive = message.data;
}
}
var leftArmControls = new ArmControls('left');
@@ -197,9 +189,9 @@ robotiqDataTopic.subscribe(function(message) {
if ((Math.abs(force.x) > 0.5) || (Math.abs(force.y) > 0.5) || (Math.abs(force.z) > 0.5))
{
document.getElementById("calibrateButton").className = "btn btn-danger"
//consider adding warning buttons
} else {
document.getElementById("calibrateButton").className = "btn btn-default"
document.getElementById("calibrateButton").disabled = true;
}
});
@@ -214,14 +206,31 @@ var recordingBagTopic = new ROSLIB.Topic({
recordingBagTopic.subscribe(function(message) {
if (message.data == "stopped")
{
document.getElementById("RecordingStatusLabel").innerHTML = 'Not Running';
document.getElementById("RecordingStatusLabel").className = 'label label-warning';
//document.getElementById("RecordingStatusLabel").innerHTML = 'Not Running';
}
else if (message.data == "running")
{
document.getElementById("RecordingStatusLabel").innerHTML = 'RUNNING!';
document.getElementById("RecordingStatusLabel").className = 'label label-success';
//document.getElementById("RecordingStatusLabel").innerHTML = 'Running!';
}
var teachingModeToButtonMap = {
"stopped" : "recordingStopButton",
"running" : "recordingStartButton"
}
if(teachingModeLastActive && teachingModeLastActive != message.data) {
var teachingModeButton = teachingModeToButtonMap[teachingModeLastActive];
if (teachingModeButton) {
document.getElementById(teachingModeButton).classList.remove("active");
}
}
var teachingModeButton = teachingModeToButtonMap[message.data];
if (teachingModeButton) {
document.getElementById(teachingModeButton).classList.add("active");
}
var teachingModeLastActive = message.data;
});
// Executing Bag
@@ -234,14 +243,30 @@ var executingBagTopic = new ROSLIB.Topic({
executingBagTopic.subscribe(function(message) {
if (message.data == "stopped")
{
document.getElementById("ExecutionStatusLabel").innerHTML = 'Not Running';
document.getElementById("ExecutionStatusLabel").className = 'label label-warning';
//document.getElementById("ExecutionStatusLabel").innerHTML = 'Not Running';
}
else if (message.data == "running")
{
document.getElementById("ExecutionStatusLabel").innerHTML = 'RUNNING!';
document.getElementById("ExecutionStatusLabel").className = 'label label-success';
//document.getElementById("ExecutionStatusLabel").innerHTML = 'RUNNING!';
}
var executionModeToButtonMap = {
"stopped" : "executionStopButton",
"running" : "executionStartButton"
}
if(executionModeLastActive && executionModeLastActive != message.data) {
var executionModeButton = teachingModeToButtonMap[executionModeLastActive];
if (executionModeButton) {
document.getElementById(executionModeButton).classList.remove("active");
}
}
var executionModeButton = executionModeToButtonMap[message.data];
if (executionModeButton) {
document.getElementById(executionModeButton).classList.add("active");
}
var executionModeLastActive = message.data;
});
@@ -276,20 +301,6 @@ function triggerService(serviceName)
serviceType : 'std_srvs/Trigger'
});
console.log("hello biatch");
$(document).ready(function(){
$.notify({
message: "ROS request didn't go through!"
}, {
"placement" : {
from: "bottom",
align: "right"
},
type: 'danger',
delay: 1000
});
});
var request = new ROSLIB.ServiceRequest({});
service.callService(request, function(result) {
@@ -297,8 +308,32 @@ function triggerService(serviceName)
+ serviceName
+ ': '
+ result.sum);
$(document).ready(function(){
$.notify({
message: "Request error: " + serviceName + ". " + result.sum
}, {
"placement" : {
from: "bottom",
align: "right"
},
type: 'success',
delay: 1000
});
});
}, function(error){
console.log("errorored");
console.log("errored");
$(document).ready(function(){
$.notify({
message: "Request error: " + serviceName + ". " + result.sum
}, {
"placement" : {
from: "bottom",
align: "right"
},
type: 'danger',
delay: 1000
});
});
});
}

2
client/app/index.html
View File

@@ -6,6 +6,7 @@
<link rel="stylesheet" href="../include/css/bootstrap.min.css">
<link rel="stylesheet" href="../include/css/fontawesome-free-5.8.2-web/css/all.css">
<link rel="stylesheet" href="../../bower_components/pretty-checkbox/dist/pretty-checkbox.css">
<script type="text/javascript" src="../include/js/eventemitter2.min.js"></script>
@@ -23,6 +24,7 @@
<script type="text/javascript" src="../../bower_components/remarkable-bootstrap-notify/dist/bootstrap-notify.js"></script>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="main.css">

56
client/app/main.css
View File

@@ -9,7 +9,8 @@ html, body {
padding: 0;
margin: 0;
background: #020625;
color: #EDF0F4;
//color: #EDF0F4;
color: white;
}
.fill-container {
@@ -136,7 +137,8 @@ html, body {
.panel-heading, .panel-footer {
background-color: #020625 !important;
color: #EDF0F4 !important;
//color: #EDF0F4 !important;
color: white !important;
text-align: center;
font-size: 14pt;
}
@@ -170,7 +172,8 @@ html, body {
.control-card .button-area > button {
height: 100%;
border-radius: 0;
color: #EDF0F4;
//color: #EDF0F4;
color: white;
font-size : 14pt;
background: #182048;
}
@@ -182,7 +185,8 @@ html, body {
.status-container .action-button > button {
height: 100%;
border-radius: 0;
color: #EDF0F4;
//color: #EDF0F4;
color: white;
font-size : 14pt;
background: #182048;
width: 100%;
@@ -202,7 +206,8 @@ html, body {
.nav-pills li a {
border-radius: 0;
color: #EDF0F4;
//color: #EDF0F4;
color: white;
font-size : 16pt;
font-weight: 600;
background: #020625;
@@ -213,7 +218,8 @@ html, body {
}
.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover, .nav>li>a:focus, .nav>li>a:hover{
color: #EDF0F4;
//color: #EDF0F4;
color: white;
background: #182048;
}
@@ -279,7 +285,7 @@ html, body {
.panel.panel-horizontal > .panel-body {
height: auto;
padding: 0px;
font-size: 12pt;
font-size: 14pt;
padding: 5px 10px;
}
@@ -288,8 +294,44 @@ html, body {
word-wrap: break-word;
}
button[class*="active"] {
//background-color: #085394 !important;
background-image: linear-gradient(#085394, #073763) !important;
}
button[class*="disabled"] {
background-color: #262b40 !important;
cursor: not-allowed;
pointer-events: none;
}
button[class*="danger"] {
background-image: linear-gradient(#b45f06, #783f04) !important;
background-image: linear-gradient(#990000, #660000) !important;
}
.status-container .robotiq .progress {
margin-bottom: 5px;
}
.status-container .robotiq .list-group-horizontal {
justify-content: center;
}
#recordingStartButton[active] {
animation: blinker 3s linear infinite;
}
#executionStartButton[active] {
animation: blinker 3s linear infinite;
}
@keyframes blinker {
50% {
opacity: 0;
}
}

8
client/app/utilities/ros_scripts.js
View File

@@ -36,12 +36,14 @@ console.log('ros.connectionName = ' + ros.connectionName);
// If there is an error on the backend, an 'error' emit will be emitted.
ros.on('error', function(error) {
/*
document.getElementById("ConnectionIPForm").className = "form-group has-warning has-feedback";
document.getElementById("ConnectionIPInput").value = ros.connectionName;
document.getElementById("ConnectionIPLabel").innerHTML = 'No connection';
document.getElementById("ConnectionButton").className = "btn btn-warning"
document.getElementById("rosbridgeconnection_badge").innerHTML = 'No connection';
document.getElementById("ROSNodes").innerHTML = "No Nodes Detected";
*/
rosbridgeconnection_badge
console.log(error);
@@ -50,11 +52,13 @@ ros.on('error', function(error) {
ros.on('connection', function() {
ros.connected = true;
console.log('Connection made!');
/*
document.getElementById("ConnectionIPForm").className = "form-group has-success has-feedback";
document.getElementById("ConnectionIPInput").value = ros.connectionName;
document.getElementById("ConnectionIPLabel").innerHTML = 'Connection made at:';
document.getElementById("rosbridgeconnection_badge").innerHTML = 'Connected';
document.getElementById("ConnectionButton").className = "btn btn-success";
*/
ros.nodes = Array();
ros.topics = Array();
@@ -64,10 +68,14 @@ ros.on('connection', function() {
ros.on('close', function() {
console.log('Connection closed.');
ros.connected = false;
/*
document.getElementById("ConnectionIPForm").className = "form-group has-warning has-feedback";
document.getElementById("ConnectionIPLabel").innerHTML = 'Connection closed';
document.getElementById("ConnectionButton").className = "btn btn-warning"
document.getElementById("rosbridgeconnection_badge").innerHTML = 'Connection closed';
*/
ros.nodes = Array();
ros.topics = Array();
});