Skip to content

Commit

Permalink
started working on speech to text widget (#250)
Browse files Browse the repository at this point in the history
* started working on speech to text widget

* port logic of speech2text

* fix return statement

* finished port of widget

* readme

* fix style

* cleanup

* fix jumping cursor
  • Loading branch information
foxriver76 authored Dec 14, 2023
1 parent 5fc193c commit 1ab88e2
Show file tree
Hide file tree
Showing 23 changed files with 1,144 additions and 664 deletions.
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -233,6 +233,7 @@ E.g., if it was used in a menu and the menu is red, the circle would be red.
* (foxriver76) fixed issues with the BulkEditor
* (foxriver76) scripts in HTML are now added to the DOM, instead of being executed in eval
* (foxriver76) fixed issues with Bulb widget if min/max was once filled
* (foxriver76) migrated "speech2text" widget to react

### 2.9.5 (2023-12-10)
* (foxriver76) open new views at the beginning
Expand Down
3 changes: 2 additions & 1 deletion src/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@
"@reduxjs/toolkit": "^2.0.1",
"@sentry/browser": "^7.85.0",
"@sentry/integrations": "^7.85.0",
"@types/dom-speech-recognition": "^0.0.4",
"ace-builds": "^1.32.0",
"craco-module-federation": "^1.1.0",
"dayjs": "^1.11.10",
Expand Down Expand Up @@ -71,4 +72,4 @@
"not ie <= 11",
"not op_mini all"
]
}
}
329 changes: 0 additions & 329 deletions src/public/widgets/basic.html

Large diffs are not rendered by default.

59 changes: 11 additions & 48 deletions src/src/Attributes/Widget/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ import { getWidgetTypes, parseAttributes } from '../../Vis/visWidgetsCatalog';
import WidgetCSS from './WidgetCSS';
import WidgetJS from './WidgetJS';
import WidgetBindingField from './WidgetBindingField';
import { deepClone } from '../../Utils/utils';

const ICONS = {
'group.fixed': <FilterAltIcon fontSize="small" />,
Expand Down Expand Up @@ -250,7 +251,6 @@ class Widget extends Component {
widgetsLoaded: props.widgetsLoaded,
widgetTypes: null,
fields: null,
// dataImage: Widget.buildDataImage(store.getState().visProject, props.selectedView, props.selectedWidgets),
transitionTime: 0,
};

Expand Down Expand Up @@ -430,33 +430,6 @@ class Widget extends Component {
{ name: 'margin-right' },
{ name: 'margin-bottom' }],
},
// {
// name: 'gestures',
// fields: [
// {
// name: 'gestures-indicator',
// type: 'auto',
// options: Object.keys(widgets).filter(wid => widgets[wid].tpl === 'tplValueGesture'),
// },
// { name: 'gestures-offsetX', default: 0, type: 'number' },
// { name: 'gestures-offsetY', default: 0, type: 'number' },
// { type: 'delimiter' },
// ...(['swiping', 'rotating', 'pinching'].flatMap(gesture => [
// { name: `gestures-${gesture}-oid`, type: 'id' },
// { name: `gestures-${gesture}-value`, default: '' },
// { name: `gestures-${gesture}-minimum`, type: 'number' },
// { name: `gestures-${gesture}-maximum`, type: 'number' },
// { name: `gestures-${gesture}-delta`, type: 'number' },
// { type: 'delimiter' },
// ])),
// ...(['swipeRight', 'swipeLeft', 'swipeUp', 'swipeDown', 'rotateLeft', 'rotateRight', 'pinchIn', 'pinchOut'].flatMap(gesture => [
// { name: `gestures-${gesture}-oid`, type: 'id' },
// { name: `gestures-${gesture}-value`, default: '' },
// { name: `gestures-${gesture}-limit`, type: 'number' },
// { type: 'delimiter' },
// ])),
// ],
// },
{
name: 'last_change',
fields: [
Expand Down Expand Up @@ -552,12 +525,6 @@ class Widget extends Component {
this.setAccordionState();
}

// static buildDataImage(project, selectedView, selectedWidgets) {
// const result = {};
// [...(selectedWidgets || [])].sort().forEach(wid => result[wid] = project[selectedView].widgets[wid]);
// return JSON.stringify(result);
// }

static getDerivedStateFromProps(props, state) {
let newState = null;
if (props.widgetsLoaded && !state.widgetsLoaded) {
Expand Down Expand Up @@ -1088,9 +1055,9 @@ class Widget extends Component {
const type = group.isStyle ? 'style' : 'data';
// check is any attribute from this group is used
let found = false;
for (let w = 0; w < this.props.selectedWidgets.length; w++) {
for (let f = 0; f < group.fields.length; f++) {
const value = store.getState().visProject[this.props.selectedView].widgets[this.props.selectedWidgets[w]][type][group.fields[f].name];
for (const selectedWidget of this.props.selectedWidgets) {
for (const groupField of group.fields) {
const value = store.getState().visProject[this.props.selectedView].widgets[selectedWidget][type][groupField.name];
if (value !== null && value !== undefined) {
found = true;
break;
Expand Down Expand Up @@ -1141,13 +1108,9 @@ class Widget extends Component {
}
}

this.changeProject(project);
}

changeProject = (project, ignoreHistory) => {
this.props.changeProject(project, ignoreHistory);
this.props.changeProject(project);
store.dispatch(recalculateFields(true));
};
}

renderFieldRow(group, field, fieldIndex) {
if (!field) {
Expand Down Expand Up @@ -1259,7 +1222,7 @@ class Widget extends Component {
className={this.props.classes.colorize}
onClick={() => this.props.cssClone(field.name, newValue => {
if (newValue !== null && newValue !== undefined) {
const project = JSON.parse(JSON.stringify(store.getState().visProject));
const project = deepClone(store.getState().visProject);
this.props.selectedWidgets.forEach(wid => {
if (project[this.props.selectedView].widgets[wid]) {
project[this.props.selectedView].widgets[wid].style = project[this.props.selectedView].widgets[wid].style || {};
Expand Down Expand Up @@ -1289,7 +1252,7 @@ class Widget extends Component {
isDifferent={this.state.isDifferent[field.name]}
project={store.getState().visProject}
socket={this.props.socket}
changeProject={this.changeProject}
changeProject={this.props.changeProject}
/>
: <WidgetField
widgetType={this.state.widgetType}
Expand All @@ -1303,7 +1266,6 @@ class Widget extends Component {
index={group.index}
isDifferent={this.state.isDifferent[field.name]}
{...this.props}
changeProject={this.changeProject}
/>}
</div>
</td>
Expand Down Expand Up @@ -1356,7 +1318,8 @@ class Widget extends Component {
delete project[this.props.selectedView].widgets[wid].data[`g_${group.name}`];
});

this.changeProject(project);
this.props.changeProject(project);
store.dispatch(recalculateFields(true));
}

render() {
Expand Down Expand Up @@ -1446,7 +1409,7 @@ class Widget extends Component {
</Button>

{this.state.showWidgetCode ? <pre>
{JSON.stringify(this.state.widget, null, 2)}
{JSON.stringify(store.getState().visProject[this.props.selectedView].widgets[this.props.selectedWidgets[0]], null, 2)}
{jsonCustomFields}
</pre> : null}
</div> : null,
Expand Down
2 changes: 1 addition & 1 deletion src/src/Vis/Widgets/Basic/BasicBulb.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -222,7 +222,7 @@ export default class BasicBulb extends VisRxWidget<RxData> {
*
* @param props props passed to the parent classes render method
*/
renderWidgetBody(props: RxRenderWidgetProps) {
renderWidgetBody(props: RxRenderWidgetProps): React.JSX.Element {
super.renderWidgetBody(props);

const val = this.state.values[`${this.state.rxData.oid}.val`];
Expand Down
2 changes: 1 addition & 1 deletion src/src/Vis/Widgets/Basic/BasicIFrame.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -139,7 +139,7 @@ export default class BasicIFrame extends VisRxWidget<RxData> {

onPropertyUpdate() {
const src = this.state.rxData.src || '';
const refreshInterval = parseFloat(this.state.rxData.refreshInterval) || 0;
const refreshInterval = Number(this.state.rxData.refreshInterval) || 0;
const refreshOnViewChange = this.state.rxData.refreshOnViewChange === true;
const refreshOnWakeUp = this.state.rxData.refreshOnWakeUp === true;

Expand Down
2 changes: 1 addition & 1 deletion src/src/Vis/Widgets/Basic/BasicImage.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -132,7 +132,7 @@ export default class BasicImage extends VisRxWidget<RxData> {

onPropertyUpdate() {
const src = this.state.rxData.src || '';
const refreshInterval = parseFloat(this.state.rxData.refreshInterval) || 0;
const refreshInterval = Number(this.state.rxData.refreshInterval) || 0;
const refreshOnViewChange = this.state.rxData.refreshOnViewChange === true;
const refreshOnWakeUp = this.state.rxData.refreshOnWakeUp === true;

Expand Down
Loading

0 comments on commit 1ab88e2

Please sign in to comment.