old-lab_ui/client/app/components/vision/vision.html

    <!-- <div class="panel panel-default">
        <div class="panel-heading">
            Select Operation Mode
        </div>
        <div class="panel-body text-center">
            <button id="teachingModeButton" type="button" onclick="triggerService('/aescape/mode/activateTeachingController')" class="btn btn-primary">
                Teaching Mode
            </button>
            <button id="executionModeButton" type="button" onclick="triggerService('/aescape/mode/activateExecutionController')" class="btn btn-primary">
                Massage Mode
            </button>
            <button id="standbyModeButton" type="button" onclick="triggerService('/aescape/mode/activateStandbyController')" class="btn btn-primary">
                Standby Mode
            </button>            
            <button id="stoppedModeButton" type="button" onclick="triggerService('/aescape/mode/stopControllers')" class="btn btn-primary">
                Stopped Mode
            </button>
        </div>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading">
            Hardware Commands
        </div>
        <div class="panel-body text-center">
            <button id="fixFrankaButton" type="button" onclick="triggerService('/aescape/hardware/resetFrankaError')" class="btn btn-primary">
                Fix Franka Errors
            </button>
            <button id="calibrateButton" type="button" onclick="triggerService('/aescape/hardware/calibrateRobotiq')" class="btn btn-primary">
                Calibrate Robotiq
            </button>
        </div>
    </div>
    <div class="panel panel-default">
        <div class="panel-heading">
            Teaching Mode Operations
        </div>
        <div class="panel-body text-center">
            <button id="recordingStartButton" type="button" onclick="triggerService('/aescape/bags/startTeachRecording')" class="btn btn-primary">
                Start Teach Recording
            </button>
            <button id="recordingStopButton" type="button" onclick="triggerService('/aescape/bags/stopTeachRecording')" class="btn btn-primary">
                Stop Teach Recording
            </button>
        </div>
    </div>

    <div class="panel panel-default">
        <div class="panel-heading">
            Execution Mode Operations
        </div>
        <div class="panel-body text-center">
            Last Bag Playing:
            <span  id="bagPlayingText">
                None
            </span>
            <div>
            <button id="executionStartButton" type="button" onclick="triggerService('/aescape/bags/startPlayingLastRecording')" class="btn btn-primary">
                Play Last Recording
            </button>
            <button id="executionStopButton" type="button" onclick="triggerService('/aescape/bags/stopPlayingBag')" class="btn btn-primary">
                Stop Playing Recording
            </button>
            <div class="row">
                <div class="col-md-3">
                    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('/startPlayingRecording', 'bagNameText')">
                                <span>
                                    Start Playing Bag
                                </span>
                            </button>
                        </span>
                    </div>
                </div>
            </div>
        </div>
        
    </div> -->

    <script type="text/javascript" src="vision/js/ros_scripts.js"></script>
    <script type="text/javascript" src="vision/js/update_guis.js"></script>

    <div class="panel panel-default">
        <div class="panel-heading">
            Camera Views
        </div>
        <div class="panel-body">
            Webcam
            <div class="row-lg-4">
                <img height="350" alt="No Camera Image" id="imageStream" src="http://titan.aescape.co:8080/stream?topic=/webcam/image_raw&type=ros_compressed"></img>
            </div>
            Realsense Red
            <div class="row-lg-4">
                <img height="350" alt="No Camera Image" id="imageStream" src="http://titan.aescape.co:8080/stream?topic=/real_red/color/image_raw&type=ros_compressed"></img>
            </div>
            Realsense Green
            <div class="row-lg-4">
                <img height="350" alt="No Camera Image" id="imageStream" src="http://titan.aescape.co:8080/stream?topic=/real_green/color/image_raw&type=ros_compressed"></img>
            </div>
            Thermal
            <div class="row-lg-4">
                <img height="350" alt="No Camera Image" id="imageStream" src="http://titan.aescape.co:8080/stream?topic=/thermal/image_raw&type=ros_compressed"></img>
            </div>
        </div>
    </div>

    <!-- <div class="panel panel-default">
        <div class="panel-heading">
            Execution Recording Operations
        </div>
        <div class="panel-body text-center">
            <button id="executionStartButton" type="button" onclick="triggerService('/startExecutionRecording')" class="btn btn-primary">
                Start Recording Execution
            </button>
            <button id="executionRecordingStopButton" type="button" onclick="triggerService('/stopExecutionRecording')" class="btn btn-primary">
                Stop Recording Execution
            </button>
        </div>
    </div> -->