rschneider/fitness-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

merge app api

Browse Source
This commit is contained in:
Schneider Roland
2023-01-19 17:43:10 +01:00
parent e6d4d0ffc4 777b648e38
commit 7adaf34677
570 changed files with 81491 additions and 1263 deletions
Download Patch File Download Diff File Expand all files Collapse all files

135
frontend/web/css/site.css
View File

@@ -97,6 +97,141 @@ a.desc:after {
border-color: #faebcc;
}
:root{
--spacer-1: 0.25rem;
--spacer-2: 0.5rem;
--spacer-3: 1rem;
--spacer-4: 1.5rem;
--spacer-5: 3rem;
}
.px-1{
padding-left: var(--spacer-1);
padding-right: var(--spacer-1);
}
.px-2{
padding-left: var(--spacer-2);
padding-right: var(--spacer-2);
}
.px-3{
padding-left: var(--spacer-3);
padding-right: var(--spacer-3);
}
.px-4{
padding-left: var(--spacer-4);
padding-right: var(--spacer-4);
}
.py-1{
padding-top: var(--spacer-1);
padding-bottom: var(--spacer-1);
}
.py-2{
padding-top: var(--spacer-2);
padding-bottom: var(--spacer-2);
}
.py-3{
padding-top: var(--spacer-3);
padding-bottom: var(--spacer-3);
}
.py-4{
padding-top: var(--spacer-4);
padding-bottom: var(--spacer-4);
}
.ps-1{
padding-left: var(--spacer-1);
}
.ps-2{
padding-left: var(--spacer-2);
}
.ps-3{
padding-left: var(--spacer-3);
}
.ps-4{
padding-left: var(--spacer-4);
}
.pe-1{
padding-right: var(--spacer-1);
}
.pe-2{
padding-right: var(--spacer-2);
}
.pe-3{
padding-right: var(--spacer-3);
}
.pe-4{
padding-right: var(--spacer-4);
}
/**
margins
*/
.mx-1{
margin-left: var(--spacer-1);
margin-right: var(--spacer-1);
}
.mx-2{
margin-left: var(--spacer-2);
margin-right: var(--spacer-2);
}
.mx-3{
margin-left: var(--spacer-3);
margin-right: var(--spacer-3);
}
.mx-4{
margin-left: var(--spacer-4);
margin-right: var(--spacer-4);
}
.my-1{
margin-top: var(--spacer-1);
margin-bottom: var(--spacer-1);
}
.my-2{
margin-top: var(--spacer-2);
margin-bottom: var(--spacer-2);
}
.my-3{
margin-top: var(--spacer-3);
margin-bottom: var(--spacer-3);
}
.my-4{
margin-top: var(--spacer-4);
margin-bottom: var(--spacer-4);
}
.ms-1{
margin-left: var(--spacer-1);
}
.ms-2{
margin-left: var(--spacer-2);
}
.ms-3{
margin-left: var(--spacer-3);
}
.ms-4{
margin-left: var(--spacer-4);
}
.me-1{
margin-right: var(--spacer-1);
}
.me-2{
margin-right: var(--spacer-2);
}
.me-3{
margin-right: var(--spacer-3);
}
.me-4{
margin-right: var(--spacer-4);
}
.event-theme-active-0 {

193
frontend/web/js/customer.js
View File

@@ -11,15 +11,15 @@ function Customer(o){
defaults = $.extend(defaults,o);
var url = location.href;
var initCamera;
// var initCamera;
console.info(url);
if ( url.indexOf("https") >= 0){
initCamera = true;
}else if ( url.indexOf("localhost") >= 0 ){
initCamera = true;
}
if ( initCamera ){
Webcam.set({
// if ( url.indexOf("https") >= 0){
// initCamera = true;
// }else if ( url.indexOf("localhost") >= 0 ){
// initCamera = true;
// }
// if ( initCamera ){
/* Webcam.set({
width: 160,
height: 120,
dest_width: 320,
@@ -28,10 +28,10 @@ function Customer(o){
jpeg_quality: 90
});
Webcam.attach( '#my_camera' );
$("#snap").click(snap);
}else{
$("#snap").hide();
}
$("#snap").click(snap);*/
// }else{
//$("#snap").hide();
// }
@@ -69,15 +69,164 @@ function Customer(o){
});
}
function snap(){
Webcam.snap( function(data_uri) {
document.getElementById('my_result').innerHTML = '<img width="160" height="120" src="'+data_uri+'"/>';
var raw_image_data = data_uri.replace(/^data\:image\/\w+\;base64\,/, '');
// function snap(){
// Webcam.snap( function(data_uri) {
// document.getElementById('my_result').innerHTML = '<img width="160" height="120" src="'+data_uri+'"/>';
//
// var raw_image_data = data_uri.replace(/^data\:image\/\w+\;base64\,/, '');
//
// document.getElementById(defaults.image_data ).value = raw_image_data;
//
// } );
// }
(() => {
// The width and height of the captured photo. We will set the
// width to the value defined here, but the height will be
// calculated based on the aspect ratio of the input stream.
const width = 320; // We will scale the photo width to this
let height = 0; // This will be computed based on the input stream
// |streaming| indicates whether or not we're currently streaming
// video from the camera. Obviously, we start at false.
let streaming = false;
// The various HTML elements we need to configure or control. These
// will be set by the startup() function.
let video = null;
let canvas = null;
let photo = null;
// let startbutton = null;
let snapButton = null;
function showViewLiveResultButton() {
if (window.self !== window.top) {
// Ensure that if our document is in a frame, we get the user
// to first open it in its own tab or window. Otherwise, it
// won't be able to request permission for camera access.
document.querySelector(".contentarea").remove();
const button = document.createElement("button");
button.textContent = "View live result of the example code above";
document.body.append(button);
button.addEventListener("click", () => window.open(location.href));
return true;
}
return false;
}
function startup() {
if (showViewLiveResultButton()) {
return;
}
video = document.getElementById("video");
canvas = document.getElementById("canvas");
photo = document.getElementById("photo");
// startbutton = document.getElementById("startbutton");
snapButton = document.getElementById("snap");
navigator.mediaDevices
.getUserMedia({ video: true, audio: false })
.then((stream) => {
video.srcObject = stream;
video.play();
})
.catch((err) => {
console.error(`An error occurred: ${err}`);
});
video.addEventListener(
"canplay",
(ev) => {
if (!streaming) {
height = video.videoHeight / (video.videoWidth / width);
// Firefox currently has a bug where the height can't be read from
// the video, so we will make assumptions if this happens.
if (isNaN(height)) {
height = width / (4 / 3);
}
video.setAttribute("width", width);
video.setAttribute("height", height);
canvas.setAttribute("width", width);
canvas.setAttribute("height", height);
streaming = true;
}
},
false
);
// startbutton.addEventListener(
// "click",
// (ev) => {
// takepicture();
// ev.preventDefault();
// },
// false
// );
snapButton.addEventListener(
"click",
(ev) => {
takepicture();
ev.preventDefault();
},
false
);
clearphoto();
}
// Fill the photo with an indication that none has been
// captured.
function clearphoto() {
const context = canvas.getContext("2d");
context.fillStyle = "#AAA";
context.fillRect(0, 0, canvas.width, canvas.height);
const data = canvas.toDataURL("image/png");
photo.setAttribute("src", data);
}
// Capture a photo by fetching the current contents of the video
// and drawing it into a canvas, then converting that to a PNG
// format data URL. By drawing it on an offscreen canvas and then
// drawing that to the screen, we can change its size and/or apply
// other changes before drawing it.
function takepicture() {
const context = canvas.getContext("2d");
if (width && height) {
canvas.width = width;
canvas.height = height;
context.drawImage(video, 0, 0, width, height);
const dataURL = canvas.toDataURL("image/jpg");
photo.setAttribute("src", dataURL);
// console.info("datauri",dataURL);
// document.getElementById('my_result').innerHTML = '<img width="160" height="120" src="'+data_uri+'"/>';
var raw_image_data = dataURL.replace(/^data\:image\/\w+\;base64\,/, '');
document.getElementById(defaults.image_data ).value = raw_image_data;
} else {
clearphoto();
}
}
// Set up our event listener to run the startup process
// once loading is complete.
window.addEventListener("load", startup, false);
})();
document.getElementById(defaults.image_data ).value = raw_image_data;
} );
}
}