Security News
How Threat Actors are Abusing GitHub’s File Upload Feature to Host Malware
GitHub is susceptible to a CDN flaw that allows attackers to host malware on any public repository.
state-speech-synth
Advanced tools
Readme
state-speech-synth
is a lightweight wrapper around the native speech-to-text API speechSynthesis
+SpeechSynthesisUtterance
. It provides a succinct API and the guarantee of consistent data.
Tracking the playing state of speechSynthesis
+ SpeechSynthesisUtterance
can be a headache. There are essentially two paths to take. One is untrustworthy, and the other is cumbersome.
Inconsistent:
speechSynthesis
has 3 read-only boolean values speaking
, paused
, pending
. In an idea world only one of these is true at a time, unless they are all false in which case the system is idle. It doesn’t take much finagling from the use to cause 2 of these values to be true at the same time leading you to representing impossible states.
Example: SpeechSynth Native Example - CodeSandbox
Cumbersome:
A solution to the inconsistency issues is use the event handlers on each SpeechSynthesisUtterance
instance. There is a handler for almost every situation onend , onerror, onpause , onresume , onstart. It’s missing an event for the onqueued
and onprocessing
, but that’s more of a nitpick. Which I suppose is the crux of the issue. There’s a lot of little things to write. I should know. That’s how this module is written.
This module wraps speechSynthesis
+ SpeechSynthesisUtterance
as a single API. It uses the event listeners to accurately track state changes (aren’t you glad you won’t have to write those 😁). Those listeners fire off to a single handler that will validate the state change and pass the result ( a single value ) to a state change handling function you’ve specified via the onStateChange
subscriber function.
Here are a few examples of the code in action
Native JS: state-speech-synth Vanilla Example - CodeSandbox - compare it to the example above. Not only it is safer, it’s shorter!
React JS: state-speech-synth React Example - CodeSandbox - works so well with React Hooks
Chrome Extension: read-to-me/background.js at master · easilyBaffled/read-to-me · GitHub - A Chrome Extension I use to help with my dyslexia
onStateChange( stateChangeHandler )
Adds stateChangeHandler
to the subscription list. stateChangeHandler
will then be called every time there is a change in the SpeechSynthesis state. You can add as many handlers as you like. They will be called in the order there were added. `
When called stateChangeHandlers
are passed
currentState (IDLE| PROCESSING|PLAYING|PAUSED)
: - One of the state Symbols exported by the state-speech-synth
module
typeString (string)
- the type property from the original SpeechSynthesisUtterance
event
event (object)
- the original SpeechSynthesisUtterance
event
validTransition (boolean)
- a value indicating of the change from SpeechSynthsis
was valid. If false
the currentValue
will not change, but the event will be the new invalid event.
stateChangeHandler (Function)
- A function that will be called whenever state changes
(Function)
- A function that, when called, will unsubscribe the associated handler.
synth.onStateChange( ( currentState, type, event, validTransition ) => {
if ( ! validTransition ) return;
const displayStates = synthStateMap[currentState];
speechControls.map(
(controlElement, i) =>
(controlElement.style.display = getDisplayStyle(displayStates[i]))
);
});
speak( text, utteranceConfigObj )
This function is a combination speechSynthesis.speak
and new SpeechSynthesisUtterance(text)
. It will handle setting up the utterance instance and firing it off to be processed.
text (string)
- A string that will be added to the queue for processing and speaking
utteranceConfigObj
- and object that will be used to set the properties of the utterance instance. Currently only rate (string|number)
, voice (string)
and volume (string|number)
are handled.
synth.speak(textInput.value, { voice: 'Alex', rate: 1.7 });
pause
, resume
, cancel
These three functions directly use the SpeechSynthesis
functions of the same name.
These are all documented on MDN far better than I could here.
pause
resume
cancel
queued
statetoAudio
conversionspeak
take an utteranceFAQs
`state-speech-synth` is a lightweight wrapper around the native speech-to-text API [`speechSynthesis`](https://developer.mozilla.org/en-US/docs/Web/API/SpeechSynthesis)+[`SpeechSynthesisUtterance`](https://developer.mozilla.org/en-US/docs/Web/API/SpeechSy
The npm package state-speech-synth receives a total of 49 weekly downloads. As such, state-speech-synth popularity was classified as not popular.
We found that state-speech-synth demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
GitHub is susceptible to a CDN flaw that allows attackers to host malware on any public repository.
Security News
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
Research
Security News
The Socket Research team found this npm package includes code for collecting sensitive developer information, including your operating system username, Git username, and Git email.