mindboost-rnbo-test-project/components/AcusticCheck.vue

444 lines
13 KiB
Vue

<!-- eslint-disable no-console
THIS FILE IS NOT WORKING
-->
<script>
import { mapActions, mapState } from 'pinia'
import { useAudioStore } from '@/stores/audio'
export default {
name: 'AdaptiveSoundscape',
components: {},
props: {},
data () {
return {
title: 'Adaptive Soundscape'
}
},
computed: {
...mapState(useAudioStore, ['microphone', 'acusticCheckResult']),
audioStore () {
return useAudioStore()
}
},
watch: {},
mounted () {
this.StartButtonPressed()
},
methods: {
...mapActions(useAudioStore, ['initializeAudioContext', 'resetAudioContext']),
data: () => ({
// This object holds all state of the app
// meineReaktiveVariable: "Leon",
AlteSeite: 0,
NeueSeite: 0,
pdf: 0,
valid: true,
Vorname: '',
Nachname: '',
nameRules: [
v => !!v || 'Feld muss ausgefüllt sein'
],
Anrede: '',
Mail: '',
emailRules: [
v => !!v || 'Feld muss ausgefüllt sein',
v => /.+@.+\..+/.test(v) || 'Eingabe ungültig'
],
Firma: '',
Raum: '',
Zusatzinfos: '',
date: {},
time: {},
Timeframe: 250,
UpperPercentile: 0.9,
LowerPercentile: 0.1,
LimitA: 2.5,
LimitB: 10.0,
audioCtx: {},
source: {},
audiodevices: {},
Gain: {},
HPF: {},
LPF: {},
analyser: {},
LevelAnalyser: {},
LevelBuffer: {},
AnimationID: {},
id: {},
bufferLength: {},
dataArray: {},
RecentRMS: 0,
ByteToDecimal: 0,
RecentLevelValue: 0,
ArrayCounter: 0,
LevelValues: [],
CummulatedLevelValues: 0,
SortedArray: [],
IndexMax: {},
IndexMin: {},
PercentileValue: {},
height: 0,
value: 1,
secondsDown: 25,
Result: {},
ResultABC: {},
MicError: 0
}),
computed: {
// Computed properties (state derived from data properties)
},
methods: {
// Write your own functions that mutate data via `this.`
goto (refName) {
const element = this.$refs[refName]
const top = element.offsetTop
window.scrollTo(0, top)
},
nextPage () {
// this.seite = (this.seite + 1) % 3;
this.AlteSeite = this.NeueSeite
this.NeueSeite = (this.NeueSeite + 1)
},
firstPage () {
this.AlteSeite = this.NeueSeite
this.NeueSeite = 0
},
previousPage () {
this.NeueSeite = this.AlteSeite
this.AlteSeite = (this.AlteSeite - 1)
this.pdf = 0
},
pdfForm () {
this.pdf = 1
},
about () {
this.AlteSeite = this.NeueSeite
this.NeueSeite = 10
},
hyperImprint () {
// window.open("https://dsi.informationssicherheit.fraunhofer.de/de/impressum/www.akustik-check.de/full","_blank");
this.AlteSeite = this.NeueSeite
this.NeueSeite = 11
},
hyperDataprotection () {
// window.open("https://dsi.informationssicherheit.fraunhofer.de/de/dsi/www.akustik-check.de/full","_blank");
this.AlteSeite = this.NeueSeite
this.NeueSeite = 12
},
hyperBueroinfos () {
window.open('https://www.youtube.com/watch?v=yAY1Gr5tcpw', '_blank')
},
hyperBI () {
window.open('http://www.buero-initiative.de/', '_blank')
},
ResetLevelValues () {
this.ArrayCounter = 0
this.LevelValues = []
},
RMStoDBFS (InputArray) {
for (let i = 0; i < InputArray.length; i++) {
InputArray[i] = 20 * Math.log10(InputArray[i])
}
},
numSort (a, b) {
return (a - b)
},
Percentile (InputArray) {
this.SortedArray = InputArray.sort(vm.numSort)
vm.RMStoDBFS(this.SortedArray)
// useNuxtApp().$logger.log('Sortiertes Array DBFS: ' + SortedArray);
this.IndexMax = Math.round(this.SortedArray.length * this.UpperPercentile)
this.IndexMin = Math.round(this.SortedArray.length * this.LowerPercentile)
this.PercentileValue = this.SortedArray[this.IndexMax] - this.SortedArray[this.IndexMin]
this.PercentileValue = this.PercentileValue.toFixed(2) // nach zwei Dazimalstellen abbrechen
// useNuxtApp().$logger.log('percentile Value = ' + this.PercentileValue)
if (this.PercentileValue < this.LimitA) {
this.Result = 1
this.ResultABC = 'A'
this.acusticCheckResult = 1
} else if (this.PercentileValue < this.LimitB) {
this.Result = 2
this.ResultABC = 'B'
this.acusticCheckResult = 2
} else {
this.Result = 3
this.ResultABC = 'C'
this.acusticCheckResult = 3
}
// useNuxtApp().$logger.log('seite = ' + this.seite);
this.NeueSeite = 4
vm.ResetLevelValues()
},
stopAudioStream () {
audiotracks.forEach((track) => {
track.stop()
})
// useNuxtApp().$logger.log('Audiostream stopped.')
},
stopmeasurement () {
window.cancelAnimationFrame(this.AnimationID)
clearInterval(this.id)
// useNuxtApp().$logger.log('Measurement stopped.')
// stream.getTracks().forEach(function(track) {
// rack.stop();
// });
this.height = 0
this.secondsDown = 25
this.CummulatedLevelValues = 0
if (this.MicError === 0) {
vm.stopAudioStream()
}
},
frame () {
if (this.height === 100) {
vm.stopmeasurement()
vm.Percentile(this.LevelValues)
} else {
this.height++
this.value = this.height + 2
// useNuxtApp().$logger.log(this.height);
if (this.height % 4 === 0) {
this.secondsDown = 25 - (this.height / 4)
}
}
},
startmeasurement () {
// vm.visualize();
vm.ResetLevelValues()
const today = new Date()
this.date = today.getDate() + '.' + (today.getMonth() + 1) + '.' + today.getFullYear()
this.time = today.getHours() + ':' + (today.getMinutes() < 10 ? '0' : '') + today.getMinutes()
// requestAnimationFrame(vm.RecentLevel);
this.height = 0
requestAnimationFrame(vm.RecentLevel)
this.id = setInterval(vm.frame, this.Timeframe)
// vm.frame();
},
CancleMeasurement () {
vm.previousPage()
this.MicError = 0
},
// RMS Value
RecentLevel () {
self.LevelAnalyser.getByteTimeDomainData(self.LevelBuffer)
for (let i = 0; i < 512; i++) {
this.ByteToDecimal = (self.LevelBuffer[i] - 128) / 128
// useNuxtApp().$logger.log("LevelBuffer i = "+ self.LevelBuffer[i]);
this.RecentRMS += this.ByteToDecimal * this.ByteToDecimal
};
this.RecentRMS /= 512
this.RecentLevelValue = Math.sqrt(this.RecentRMS)
this.LevelValues[this.ArrayCounter] = this.RecentLevelValue
this.CummulatedLevelValues = this.CummulatedLevelValues + this.RecentLevelValue * 1000
if (this.ArrayCounter > 200 && this.CummulatedLevelValues < 50) {
this.MicError = 1
// clearInterval(this.id);
vm.stopmeasurement()
} else if (Object.isNaN(this.RecentLevelValue)) {
this.MicError = 1
// clearInterval(this.id);
vm.stopmeasurement()
} else if (this.RecentLevelValue > 0.7) {
this.MicError = 2
// clearInterval(this.id);
vm.stopmeasurement()
} else {
++this.ArrayCounter
this.AnimationID = requestAnimationFrame(vm.RecentLevel)
}
},
savePDF () {
// eslint-disable-next-line new-cap
const doc = new jspdf.jsPDF()
let Perzentil = '0'
if (this.PercentileValue > 3) {
Perzentil = ((this.PercentileValue - 3).toFixed(2)).toString()
};
const img1 = new Image()
img1.src = 'img/ibp.925e79d4.png'
doc.addImage(img1, 'png', 20, 10, 50, 15)
doc.setFontSize(24)
doc.setTextColor('#1f82c0')
doc.textWithLink('Büro-Akustik Check', 20, 45, { url: 'https://www.youtube.com/watch?v=yAY1Gr5tcpw' })
doc.setFontSize(16)
doc.setTextColor('gray')
doc.text('Auswertung der Messung am ' + this.date + ' um ' + this.time + ' Uhr:', 20, 60)
const img2 = new Image()
img2.src = 'img/Result_' + this.ResultABC + '.png'
doc.addImage(img2, 'png', 20, 70, 170, 80)
doc.setLineWidth(0.5)
doc.setDrawColor('gray')
doc.line(20, 170, 190, 170)
doc.setFontSize(11)
doc.text('Gemessene akustische Qualität (kontaktieren Sie uns für weitere Informationen über diesen Wert):', 20, 180)
doc.text('Messung durchgeführt von:', 20, 195)
doc.text('Mailadresse:', 20, 210)
doc.text('Firma:', 20, 225)
doc.text('Raumbezeichnung:', 20, 240)
doc.text('Zusatzinfos:', 20, 255)
doc.setTextColor('black')
doc.text(Perzentil, 20, 185)
doc.text(this.Anrede + this.Vorname + ' ' + this.Nachname, 20, 200)
doc.text(this.Mail, 20, 215)
doc.text(this.Firma, 20, 230)
doc.text(this.Raum, 20, 245)
if (this.Zusatzinfos === '') {
doc.text('-', 20, 260)
} else { doc.text(this.Zusatzinfos, 20, 260) };
doc.text('Sie sind unzufrieden mit der Akustik an Ihrem Arbeitsplatz? Wir optimieren Ihr Büro menschzentriert.', 20, 275)
doc.setTextColor('#1f82c0')
doc.textWithLink('Kontaktieren Sie uns unter kognitive-ergonomie@ibp.fraunhofer.de', 20, 280, { url: 'mailto:kognitive-ergonomie@ibp.fraunhofer.de' })
// Speicherung lokal für User
doc.save('Auswertung_Bueroumgebung.pdf')
// PDF an Server
const blob = doc.output('blob')
const formData = new FormData()
formData.append('pdf', blob)
$.ajax('/upload.php',
{
method: 'POST',
data: formData,
processData: false,
contentType: false,
success: function (data) { useNuxtApp().$logger.log(data) },
error: function (data) { useNuxtApp().$logger.log(data) }
})
//
// location.reload();
},
audioSettings () {
navigator.mediaDevices.enumerateDevices().then((devices) => {
this.audiodevices = new Set()
devices.forEach((device) => {
// useNuxtApp().$logger.log(`${device.kind}: ${device.label} id = ${device.deviceId}`);
if (device.kind === 'audioinput') {
this.audiodevices.add(device)
};
})
// this.audiodevices.forEach((value) => {
// useNuxtApp().$logger.log(value);
// })
// useNuxtApp().$logger.log('Verfügbare Audiodevices: ', this.audiodevices)
})
this.settings = 1
},
StartButtonPressed () {
function getMedia () {
let stream = null
try {
stream = this.microphone.microphoneStream
// useNuxtApp().$logger.log('Audiostream started.')
audiotracks = stream.getTracks()
// this.audioCtx = new (window.AudioContext || window.webkitAudioContext)()
this.audioCtx = this.getContext()
// this.stream = navigator.mediaDevices.getUserMedia(constraints);
this.Gain = this.audioCtx.createGain()
this.Gain.gain.setValueAtTime(2.0, this.audioCtx.currentTime)
this.HPF = this.audioCtx.createBiquadFilter()
this.HPF.type = 'highpass'
this.HPF.frequency.value = 450
this.LPF = this.audioCtx.createBiquadFilter()
this.LPF.type = 'lowpass'
this.LPF.frequency.value = 10000
this.analyser = this.audioCtx.createAnalyser()
this.analyser.fftSize = 256
this.analyser.minDecibels = -90
this.analyser.maxDecibels = -10
this.analyser.smoothingTimeConstant = 0.9
this.LevelAnalyser = this.audioCtx.createAnalyser()
this.LevelAnalyser.fftSize = 512
this.LevelAnalyser.minDecibels = -100
this.LevelAnalyser.maxDecibels = -1
this.LevelAnalyser.smoothingTimeConstant = 0.95
this.LevelBuffer = new Uint8Array(512)
this.source = this.audioCtx.createMediaStreamSource(stream)
this.source.connect(this.Gain)
this.Gain.connect(this.HPF)
this.HPF.connect(this.LPF)
this.LPF.connect(this.analyser)
this.LPF.connect(this.LevelAnalyser)
this.FirstStart = false
setTimeout(vm.startmeasurement, 800) // short break to avoid zeros at beginning of measurement
} catch (err) {
// useNuxtApp().$logger.log('The following gUM error occured: ' + err)
}
}
getMedia(constraints)
}
}
}
}
</script>
~/stores/audio