Commit 7e4b9007 authored by Guilhem Saurel's avatar Guilhem Saurel
Browse files

slider wip

parent caf5cdec
......@@ -11,3 +11,18 @@ The low level RT controller is augmented with a thread that can access the main
telemetry over MQTT, and subscribe to an "commands" channel.
This repository provides a mock low-level RT controller, formalize the MQTT topics to use, and host the web application.
## Build
```bash
cmake -B build
cmake --build build
yarn install
```
## launch
```bash
yarn parce src/index.html
./build/mock
```
{
"devDependencies": {
"@parcel/transformer-vue": "^2.0.0",
"parcel": "^2.0.0"
},
"dependencies": {
"@popperjs/core": "^2.10.2",
"bootstrap": "^5.1.3",
"jquery": "^3.6.0",
"mqtt": "^4.2.8",
"vue": "^3.2.20"
},
"alias": {
"vue" : "vue/dist/vue.esm-bundler.js"
"vue": "vue/dist/vue.esm-bundler.js"
}
}
<template>
<form>
<div class="slide-submit">
<button type="submit">Stop >></button>
<label>Slide to Stop</label>
</div>
</form>
</template>
<script>
export default {
setup() {
$(".slide-submit button").draggable({cancel: false, containment: "parent", axis: "x", stop: function() {
if (($(this).parent().width() / 2) === ($(this).position().left + 8)) {
$(this).css({left: "auto", right: 0}).addClass("submitted").text("Stopped").draggable('false');
console.log('STOP');
} else {
$(this).css({left: 0});
}
}}).on("click", function() {
return false;
});
document.addEventListener("touchstart", touchHandler, true);
document.addEventListener("touchmove", touchHandler, true);
document.addEventListener("touchend", touchHandler, true);
document.addEventListener("touchcancel", touchHandler, true);
function touchHandler(event) {
var touch = event.changedTouches[0];
var simulatedEvent = document.createEvent("MouseEvent");
simulatedEvent.initMouseEvent({
touchstart: "mousedown",
touchmove: "mousemove",
touchend: "mouseup"
}[event.type], true, true, window, 1,
touch.screenX, touch.screenY,
touch.clientX, touch.clientY, false,
false, false, false, 0, null);
touch.target.dispatchEvent(simulatedEvent);
event.preventDefault();
}
}
};
</script>
<style>
.slide-submit {
position: relative;
width: 250px;
height: 50px;
line-height: 50px;
background: white;
padding: 4px;
border: 1px solid #DDDDDD;
border-radius: 25px;
}
.slide-submit button {
position: absolute;
top: 0;
left: 0;
bottom: 0;
z-index: 10;
margin: 4px;
width: 50%;
background: #DD3A3A;
font-weight: bold;
color: white;
border: none;
padding: 10px;
border-radius: 25px;
transition: all 200ms linear;
cursor: pointer;
}
.slide-submit button.submitted {
width: 97%;
opacity: 0.8;
}
.slide-submit button.submitted + label {
display: none;
}
.slide-submit label {
position: absolute;
z-index: 8;
top: 0px;
right: 0px;
width: 50%;
font-size: 14px;
text-align: center;
color: #A7ADB3;
font-weight: bold;
}
</style>
var mqtt = require('mqtt')
var Vue = require('vue')
var Slider = require('./Slider.vue')
const app = Vue.createApp({
data() {
......@@ -26,11 +27,14 @@ const app = Vue.createApp({
}
}
},
mounted() {
created() {
this.client = mqtt.connect('ws://localhost:9001')
this.client.on('message', this.onMessage);
this.client.on('connect', this.onConnect);
},
unmounted() {
this.client.end();
}
});
app.mount('#app');
const vm = app.mount('#app');
......@@ -843,6 +843,20 @@
posthtml-render "^3.0.0"
semver "^5.4.1"
"@parcel/transformer-vue@^2.0.0":
version "2.0.0"
resolved "https://registry.yarnpkg.com/@parcel/transformer-vue/-/transformer-vue-2.0.0.tgz#deb102e177cb4bbcf8069bed5e24bcb02c5e333a"
integrity sha512-fltTqRFe6eI3wpUb2ux+GkvsS0bf+XLzAsCL97DqHQnrdmTNZ/msblFE6AJIX2ex0sVup01CW3KQdsZkRShjYA==
dependencies:
"@parcel/diagnostic" "^2.0.0"
"@parcel/plugin" "^2.0.0"
"@parcel/source-map" "^2.0.0"
"@parcel/utils" "^2.0.0"
"@vue/compiler-sfc" "^3.0.0"
consolidate "^0.16.0"
nullthrows "^1.1.1"
semver "^5.4.1"
"@parcel/types@^2.0.0":
version "2.0.0"
resolved "https://registry.yarnpkg.com/@parcel/types/-/types-2.0.0.tgz#31f6eb7c24b2d9ae752ce49adaf01469a9e9067a"
......@@ -953,7 +967,7 @@
"@vue/compiler-core" "3.2.20"
"@vue/shared" "3.2.20"
"@vue/compiler-sfc@3.2.20":
"@vue/compiler-sfc@3.2.20", "@vue/compiler-sfc@^3.0.0":
version "3.2.20"
resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.2.20.tgz#2d7668e76f066c566dd7c09c15c9acce4e876e0a"
integrity sha512-03aZo+6tQKiFLfunHKSPZvdK4Jsn/ftRCyaro8AQIWkuxJbvSosbKK6HTTn+D2c3nPScG155akJoxKENw7rftQ==
......@@ -1229,6 +1243,11 @@ bl@^4.0.2, bl@^4.1.0:
inherits "^2.0.4"
readable-stream "^3.4.0"
bluebird@^3.7.2:
version "3.7.2"
resolved "https://registry.yarnpkg.com/bluebird/-/bluebird-3.7.2.tgz#9f229c15be272454ffa973ace0dbee79a1b0c36f"
integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==
bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.11.9:
version "4.12.0"
resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.12.0.tgz#775b3f278efbb9718eec7361f483fb36fbbfea88"
......@@ -1564,6 +1583,13 @@ console-browserify@^1.2.0:
resolved "https://registry.yarnpkg.com/console-browserify/-/console-browserify-1.2.0.tgz#67063cef57ceb6cf4993a2ab3a55840ae8c49336"
integrity sha512-ZMkYO/LkF17QvCPqM0gxw8yUzigAOZOSWSHg91FH6orS7vcEj5dVZTidN2fQ14yBSdg97RqhSNwLUXInd52OTA==
consolidate@^0.16.0:
version "0.16.0"
resolved "https://registry.yarnpkg.com/consolidate/-/consolidate-0.16.0.tgz#a11864768930f2f19431660a65906668f5fbdc16"
integrity sha512-Nhl1wzCslqXYTJVDyJCu3ODohy9OfBMB5uD2BiBTzd7w+QY0lBzafkR8y8755yMYHAaMD4NuzbAw03/xzfw+eQ==
dependencies:
bluebird "^3.7.2"
constants-browserify@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/constants-browserify/-/constants-browserify-1.0.0.tgz#c20b96d8c617748aaf1c16021760cd27fcb8cb75"
......@@ -2843,6 +2869,11 @@ jake@^10.6.1:
filelist "^1.0.1"
minimatch "^3.0.4"
jquery@^3.6.0:
version "3.6.0"
resolved "https://registry.yarnpkg.com/jquery/-/jquery-3.6.0.tgz#c72a09f15c1bdce142f49dbf1170bdf8adac2470"
integrity sha512-JVzAR/AjBvVt2BmYhxRCSYysDsPcssdmTFnzyLEts9qNwmjmu4JTAMYubEfwVOSwpQ1I1sKKFcxhZCI2buerfw==
js-tokens@^4.0.0:
version "4.0.0"
resolved "https://registry.yarnpkg.com/js-tokens/-/js-tokens-4.0.0.tgz#19203fb59991df98e3a287050d4647cdeaf32499"
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment