intiface / buttplug-playground Goto Github PK
View Code? Open in Web Editor NEWVue.js application for testing Buttplug Websocket Connectivity and Devices
Home Page: https://buttplug.world/playground
License: Other
Vue.js application for testing Buttplug Websocket Connectivity and Devices
Home Page: https://buttplug.world/playground
License: Other
If a device had 2 vibes, you used to be able to control the devices separately, but now you can only control them all-or-nothing
We don't support rotate/vibrate/linearcmd. Come on. We run the fucking project. Get with it already.
Regardless of any overrides you configure, playground will only connect to ws://localhost:12345
This is more likely an issue with the connection component than playground itself.
STR:
Expected:
Rotation
Actual:
No Rotation
STR:
Expected:
Device selections are cleared, device controls are cleared
Actual:
Device controls stay on screen.
Hi,
Great project but I can't get it working out of the box, it's frustrating
The documentation should state which version of Nodejs is required and how to launch it from scratch.
My env :
Buttplug Playground Version 20170925
Node : 8.9.0 (nvm) x64
Env : Windows 10x64
I am using the c# websocket server and it's working with other haptic projects
I did :
npm install
npm run start
The browser is launched and the GUI is displayed. When i hit the connect button, nothing happen.
I've joined the logs.
My guess is it's working for your env. Again please let us know what this env is in the doc.
Best Regards
[tsl] ERROR in ***********\buttplug-playground-master\src\components\VibrationComponent\VibrationComponent.ts(6,2)
TS2345: Argument of type 'typeof VibrationComponent' is not assignable to parameter of type 'VueClass'.
Type 'typeof VibrationComponent' is not assignable to type 'new (...args: any[]) => Vue'.
Type 'VibrationComponent' is not assignable to type 'Vue'.
Types of property '$options' are incompatible.
Type 'ComponentOptions<VibrationComponent, DefaultData, DefaultMethods<VibrationCom...' is not assignable to type 'ComponentOptions<Vue, DefaultData, DefaultMethods, DefaultComputed, PropsDefinition<Rec...'.
Type 'VibrationComponent' is not assignable to type 'Vue'.
[tsl] ERROR in **************\buttplug-playground-master\src\components\RotationComponent\RotationComponent.ts(6,2)
TS2345: Argument of type 'typeof RotationComponent' is not assignable to parameter of type 'VueClass'.
Type 'typeof RotationComponent' is not assignable to type 'new (...args: any[]) => Vue'.
Type 'RotationComponent' is not assignable to type 'Vue'.
Types of property '$options' are incompatible.
Type 'ComponentOptions<RotationComponent, DefaultData, DefaultMethods<RotationCompon...' is not assignable to type 'ComponentOptions<Vue, DefaultData, DefaultMethods, DefaultComputed, PropsDefinition<Rec...'.
Type 'RotationComponent' is not assignable to type 'Vue'.
ERROR in ./node_modules/ts-loader!./src/components/PositionComponent/PositionComponent.ts
[tsl] ERROR in **********\buttplug-playground-master\src\components\PositionComponent\PositionComponent.ts(6,2)
TS2345: Argument of type 'typeof PositionComponent' is not assignable to parameter of type 'VueClass'.
Type 'typeof PositionComponent' is not assignable to type 'new (...args: any[]) => Vue'.
Type 'PositionComponent' is not assignable to type 'Vue'.
Types of property '$options' are incompatible.
Type 'ComponentOptions<PositionComponent, DefaultData, DefaultMethods<PositionCompon...' is not assignable to type 'ComponentOptions<Vue, DefaultData, DefaultMethods, DefaultComputed, PropsDefinition<Rec...'.
Type 'PositionComponent' is not assignable to type 'Vue'.
ERROR in ./node_modules/ts-loader!./src/App.ts
[tsl] ERROR in **********\buttplug-playground-master\src\App.ts(10,2)
TS2345: Argument of type 'typeof App' is not assignable to parameter of type 'VueClass'.
Type 'typeof App' is not assignable to type 'new (...args: any[]) => Vue'.
Type 'App' is not assignable to type 'Vue'.
Types of property '$options' are incompatible.
Type 'ComponentOptions<App, DefaultData, DefaultMethods, DefaultComputed, PropsDefinition<Rec...' is not assignable to type 'ComponentOptions<Vue, DefaultData, DefaultMethods, DefaultComputed, PropsDefinition<Rec...'.
Type 'App' is not assignable to type 'Vue'.
Due to the JS examples currently being broken I wanted to spin this up locally so I could understand how to run buttplug.io in a browser (and debug why something wasn't working for me in an app I'm working on) but I was unable to install this due to errors.
After running npm install
I tried running npm run start
and go this error:
> [email protected] start
> yarn build:config && webpack-dev-server --hot --config build/webpack.base.js
yarn run v1.22.10
$ node build/generate_config.js
Done in 0.72s.
/private/tmp/buttplug-playground/build/webpack.base.js:120
throw new Error('No matching configuration was found!');
^
Error: No matching configuration was found!
at module.exports (/private/tmp/buttplug-playground/build/webpack.base.js:120:13)
at handleFunction (/private/tmp/buttplug-playground/node_modules/webpack-cli/bin/utils/prepareOptions.js:21:13)
at prepareOptions (/private/tmp/buttplug-playground/node_modules/webpack-cli/bin/utils/prepareOptions.js:9:5)
at requireConfig (/private/tmp/buttplug-playground/node_modules/webpack-cli/bin/utils/convert-argv.js:117:14)
at /private/tmp/buttplug-playground/node_modules/webpack-cli/bin/utils/convert-argv.js:123:17
at Array.forEach (<anonymous>)
at module.exports (/private/tmp/buttplug-playground/node_modules/webpack-cli/bin/utils/convert-argv.js:121:15)
at Object.<anonymous> (/private/tmp/buttplug-playground/node_modules/webpack-dev-server/bin/webpack-dev-server.js:84:40)
at Module._compile (node:internal/modules/cjs/loader:1097:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1149:10)
at Module.load (node:internal/modules/cjs/loader:975:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
at node:internal/main/run_main_module:17:47
Node.js v17.2.0
Playing around a bit I added --env development
to the end of the package.json start script which progressing things but then I ran into this:
> [email protected] start
> yarn build:config && webpack-dev-server --hot --config build/webpack.base.js --env development
yarn run v1.22.10
$ node build/generate_config.js
Done in 0.60s.
✖ 「wdm」: Hash: fb661648ec64f6a8fa0f
Time: 8331ms
Built at: 08/01/2022 10:05:30 am
Entrypoint main [big] = build.js (prefetch: 0.build.js ce4359e427158deb609d.module.wasm)
[0] multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./src/main.ts 52 bytes {main} [built]
[./node_modules/buttplug/dist/module/index.js] 506 bytes {main} [built]
[./node_modules/matomo-tracker/index.js] 3.87 KiB {main} [built]
[./node_modules/strip-ansi/index.js] 161 bytes {main} [built]
[./node_modules/viewport-units-buggyfill/viewport-units-buggyfill.js] 15.2 KiB {main} [built]
[./node_modules/vue-awesome/components/Icon.vue] 905 bytes {main} [built]
[./node_modules/vue/dist/vue.runtime.esm.js] 222 KiB {main} [built]
[./node_modules/vuetify/lib/index.js] 236 bytes {main} [built]
[./node_modules/webpack-dev-server/client/index.js?http://localhost:8080] (webpack)-dev-server/client?http://localhost:8080 4.29 KiB {main} [built]
[./node_modules/webpack-dev-server/client/overlay.js] (webpack)-dev-server/client/overlay.js 3.51 KiB {main} [built]
[./node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 1.53 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/createSocketUrl.js] (webpack)-dev-server/client/utils/createSocketUrl.js 2.91 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/log.js] (webpack)-dev-server/client/utils/log.js 964 bytes {main} [built]
[./node_modules/webpack/hot/dev-server.js] (webpack)/hot/dev-server.js 1.59 KiB {main} [built]
[./src/main.ts] 1.46 KiB {main} [built]
+ 567 hidden modules
ERROR in ./src/App.vue?vue&type=style&index=0&lang=css& (./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=style&index=0&lang=css&)
Module build failed (from ./node_modules/css-loader/dist/cjs.js):
Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './package.json' is not defined by "exports" in /private/tmp/buttplug-playground/node_modules/postcss/package.json
at new NodeError (node:internal/errors:371:5)
at throwExportsNotFound (node:internal/modules/esm/resolve:429:9)
at packageExportsResolve (node:internal/modules/esm/resolve:683:3)
at resolveExports (node:internal/modules/cjs/loader:482:36)
at Function.Module._findPath (node:internal/modules/cjs/loader:522:31)
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:919:27)
at Function.Module._load (node:internal/modules/cjs/loader:778:27)
at Module.require (node:internal/modules/cjs/loader:999:19)
at require (node:internal/modules/cjs/helpers:102:18)
at Object.<anonymous> (/private/tmp/buttplug-playground/node_modules/css-loader/dist/index.js:12:39)
at Module._compile (node:internal/modules/cjs/loader:1097:14)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1149:10)
at Module.load (node:internal/modules/cjs/loader:975:32)
at Function.Module._load (node:internal/modules/cjs/loader:822:12)
at Module.require (node:internal/modules/cjs/loader:999:19)
at require (node:internal/modules/cjs/helpers:102:18)
@ ./src/App.vue?vue&type=style&index=0&lang=css& (./node_modules/style-loader/dist/cjs.js!./node_modules/css-loader/dist/cjs.js!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=style&index=0&lang=css&) 2:12-236 9:17-24 13:7-14 45:20-27 47:4-60:5 49:6-59:7 50:38-45 56:26-33 58:21-28 68:15-22
@ ./src/App.vue?vue&type=style&index=0&lang=css&
@ ./src/App.vue
@ ./src/main.ts
No idea if I'm doing the right thing to get the app up and running so some installation instructions would be very helpful to do if it's a PEBKAC issue or a bug. For reference I'm running on macOS 10.15.7 with node v17.2.0.
I'm sure this used to work, but on https://playground.buttplug.world/ at https://github.com/metafetish/buttplug-playground/tree/6fc7455 per-vibe sliders are sending commands to all vibes.
I don't have any event logging at the Vue level, but this is a snippet of the websocket traffic whilst moving per-vibe sliders only.
[{"RequestServerInfo":{"Id":1,"ClientName":"Generic Buttplug Client","MessageVersion":1}}] | 90 | 13:25:31.638 | -- | -- | -- | --
[{"ServerInfo":{"MajorVersion":1,"MinorVersion":0,"BuildVersion":0,"MessageVersion":1,"MaxPingTime":0,"ServerName":"Test Server","Id":1}}] | 138 | 13:25:31.681 |
[{"RequestDeviceList":{"Id":2}}] | 32 | 13:25:31.683 |
[{"DeviceList":{"Devices":[{"DeviceName":"LiBo LaLa","DeviceIndex":1,"DeviceMessages":{"StopDeviceCmd":{},"SingleMotorVibrateCmd":{},"VibrateCmd":{"FeatureCount":2}}}],"Id":2}}] | 177 | 13:25:31.687 |
[{"VibrateCmd":{"Id":3,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.13},{"Index":1,"Speed":0.13}]}}] | 102 | 13:25:47.452 |
[{"Ok":{"Id":3}}] | 17 | 13:25:47.470 |
[{"VibrateCmd":{"Id":4,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.12},{"Index":1,"Speed":0.12}]}}] | 102 | 13:26:06.686 |
[{"Ok":{"Id":4}}] | 17 | 13:26:06.690 |
[{"VibrateCmd":{"Id":5,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.11},{"Index":1,"Speed":0.11}]}}] | 102 | 13:26:06.694 |
[{"Ok":{"Id":5}}] | 17 | 13:26:06.700 |
[{"VibrateCmd":{"Id":6,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.09},{"Index":1,"Speed":0.09}]}}] | 102 | 13:26:06.702 |
[{"Ok":{"Id":6}}] | 17 | 13:26:06.708 |
[{"VibrateCmd":{"Id":7,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.07},{"Index":1,"Speed":0.07}]}}] | 102 | 13:26:06.711 |
[{"Ok":{"Id":7}}] | 17 | 13:26:06.716 |
[{"VibrateCmd":{"Id":8,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.05},{"Index":1,"Speed":0.05}]}}] | 102 | 13:26:06.721 |
[{"Ok":{"Id":72}}] | 18 | 13:26:17.419 | -- | -- | -- | --
[{"VibrateCmd":{"Id":73,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.08},{"Index":1,"Speed":0.08}]}}] | 103 | 13:26:17.423 |
[{"Ok":{"Id":73}}] | 18 | 13:26:17.428 |
[{"VibrateCmd":{"Id":74,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.06},{"Index":1,"Speed":0.06}]}}] | 103 | 13:26:17.432 |
[{"Ok":{"Id":74}}] | 18 | 13:26:17.437 |
[{"VibrateCmd":{"Id":75,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.04},{"Index":1,"Speed":0.04}]}}] | 103 | 13:26:17.448 |
[{"Ok":{"Id":75}}] | 18 | 13:26:17.453 |
[{"VibrateCmd":{"Id":76,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.03},{"Index":1,"Speed":0.03}]}}] | 103 | 13:26:17.457 |
[{"Ok":{"Id":76}}] | 18 | 13:26:17.463 |
[{"VibrateCmd":{"Id":77,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.02},{"Index":1,"Speed":0.02}]}}] | 103 | 13:26:17.464 |
[{"Ok":{"Id":77}}] | 18 | 13:26:17.471 |
[{"VibrateCmd":{"Id":78,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0.01},{"Index":1,"Speed":0.01}]}}] | 103 | 13:26:17.480 |
[{"Ok":{"Id":78}}] | 18 | 13:26:17.485 |
[{"VibrateCmd":{"Id":79,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0},{"Index":1,"Speed":0}]}}] | 97 | 13:26:17.505 |
[{"Ok":{"Id":79}}] | 18 | 13:26:17.509 |
[{"VibrateCmd":{"Id":80,"DeviceIndex":1,"Speeds":[{"Index":0,"Speed":0},{"Index":1,"Speed":0}]}}] | 97 | 13:26:18.172 |
[{"Ok":{"Id":80}}]
Reproduction:
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.