Check if everything looks good !
32 |├── .npmrc ├── src ├── resources │ ├── icons │ │ ├── app.ico │ │ ├── app.png │ │ ├── app.icns │ │ ├── icon.ico │ │ ├── icon.png │ │ ├── icon@2x.png │ │ └── icon@3x.png │ └── json │ │ └── config.json ├── render │ ├── src │ │ ├── assets │ │ │ ├── icons │ │ │ │ └── icon.ico │ │ │ ├── pictures │ │ │ │ ├── deco.png │ │ │ │ ├── gabin.png │ │ │ │ ├── noise.png │ │ │ │ ├── loading.gif │ │ │ │ ├── boot-200.gif │ │ │ │ ├── boot-500.gif │ │ │ │ ├── obs │ │ │ │ │ ├── obs-scenes.png │ │ │ │ │ ├── obs-add-scene.png │ │ │ │ │ ├── obs-container.png │ │ │ │ │ ├── obs-new-scene.png │ │ │ │ │ └── obs-containers.png │ │ │ │ └── vmix │ │ │ │ │ ├── vmix-add-container.png │ │ │ │ │ ├── vmix-overlay-sources.png │ │ │ │ │ └── vmix-create-container.png │ │ │ └── fonts │ │ │ │ ├── SpaceGrotesk-Bold.ttf │ │ │ │ ├── SpaceGrotesk-Light.ttf │ │ │ │ ├── SpaceGrotesk-Medium.ttf │ │ │ │ ├── SpaceGrotesk-Regular.ttf │ │ │ │ └── SpaceGrotesk-SemiBold.ttf │ │ ├── components │ │ │ ├── basics │ │ │ │ ├── PopUp │ │ │ │ │ ├── PopUp.vue │ │ │ │ │ ├── PopUpContainer.vue │ │ │ │ │ └── PopUpBackground.vue │ │ │ │ ├── ButtonUi.vue │ │ │ │ ├── TooltipUi.vue │ │ │ │ ├── ButtonContainerUi.vue │ │ │ │ ├── ModalUi.vue │ │ │ │ ├── TagUi.vue │ │ │ │ ├── ToggleUi.vue │ │ │ │ ├── ToastUi.vue │ │ │ │ ├── GabinFace.vue │ │ │ │ └── InputUi.vue │ │ │ ├── icons │ │ │ │ ├── PlayIcon.vue │ │ │ │ ├── ChevronLeftIcon.vue │ │ │ │ ├── ChevronRightIcon.vue │ │ │ │ ├── PlusIcon.vue │ │ │ │ ├── StopIcon.vue │ │ │ │ ├── ChevronBottomIcon.vue │ │ │ │ ├── ArrowRightIcon.vue │ │ │ │ ├── ArrowLeftIcon.vue │ │ │ │ ├── PlayCircleIcon.vue │ │ │ │ ├── CheckIcon.vue │ │ │ │ ├── ReturnIcon.vue │ │ │ │ ├── PenIcon.vue │ │ │ │ ├── MinCircleIcon.vue │ │ │ │ ├── ProfileIcons.vue │ │ │ │ ├── CrossIcon.vue │ │ │ │ ├── BurgerMenuIcon.vue │ │ │ │ ├── DotsIcon.vue │ │ │ │ ├── FolderIcon.vue │ │ │ │ ├── UserIcon.vue │ │ │ │ ├── PlusCircleIcon.vue │ │ │ │ ├── BinIcon.vue │ │ │ │ ├── PauseCircleIcon.vue │ │ │ │ ├── EyeIcon.vue │ │ │ │ ├── InfoIcon.vue │ │ │ │ ├── SmileIcon.vue │ │ │ │ ├── QuestionMarkIcon.vue │ │ │ │ ├── CamIcon.vue │ │ │ │ ├── PaperClipIcon.vue │ │ │ │ ├── PizzaIcon.vue │ │ │ │ ├── DownloadIcon.vue │ │ │ │ ├── RocketIcon.vue │ │ │ │ ├── UploadIcon.vue │ │ │ │ ├── SandwichIcon.vue │ │ │ │ └── SettingsIcon.vue │ │ │ ├── home │ │ │ │ ├── MainProfile.vue │ │ │ │ ├── Audio.vue │ │ │ │ ├── EditIcon.vue │ │ │ │ └── Connections.vue │ │ │ ├── setup │ │ │ │ ├── FetchProfile.vue │ │ │ │ ├── TimelineSteps.vue │ │ │ │ ├── SourcesTree.vue │ │ │ │ ├── OscTuto.vue │ │ │ │ └── VmixTuto.vue │ │ │ ├── loading │ │ │ │ └── LoadingGabin.vue │ │ │ ├── settings │ │ │ │ └── EditConnection.vue │ │ │ └── utils │ │ │ │ ├── KeyPress.vue │ │ │ │ └── UtilsTools.vue │ │ ├── env.d.ts │ │ ├── views │ │ │ ├── SplashView.vue │ │ │ ├── DisconnectView.vue │ │ │ ├── setup │ │ │ │ ├── SummaryView.vue │ │ │ │ ├── SettingsView.vue │ │ │ │ ├── IndexView.vue │ │ │ │ ├── VideoMixerView.vue │ │ │ │ ├── ProfileView.vue │ │ │ │ ├── LandingView.vue │ │ │ │ ├── ObsView.vue │ │ │ │ ├── VmixView.vue │ │ │ │ └── OscView.vue │ │ │ ├── LoadingView.vue │ │ │ └── RunningView.vue │ │ ├── layout │ │ │ ├── BackgroundLayout.vue │ │ │ ├── FooterLayout.vue │ │ │ ├── TimelineLayout.vue │ │ │ ├── HeaderLayout.vue │ │ │ └── GlobalLayout.vue │ │ └── App.vue │ ├── index.html │ ├── vite.config.ts │ ├── .gitignore │ ├── tsconfig.json │ ├── package.json │ ├── uno.config.ts │ └── README.md └── main │ ├── servers │ ├── Connections.ts │ └── Server.ts │ ├── clients │ ├── Client.ts │ ├── OBSClient.ts │ └── OSCClient.ts │ ├── index.ts │ ├── modules │ ├── setup.ts │ └── profiles.ts │ └── utils │ ├── db.ts │ └── logger.ts ├── nodemon.json ├── .vscode ├── extensions.json ├── settings.json └── launch.json ├── .gitignore ├── patches └── node-osc+9.1.4.patch ├── LICENSE ├── forge.config.js ├── tsconfig.json ├── .github └── workflows │ └── release.yml └── package.json /.npmrc: -------------------------------------------------------------------------------- 1 | auto-install-peers=false -------------------------------------------------------------------------------- /src/resources/icons/app.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/resources/icons/app.ico -------------------------------------------------------------------------------- /src/resources/icons/app.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/resources/icons/app.png -------------------------------------------------------------------------------- /src/resources/icons/app.icns: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/resources/icons/app.icns -------------------------------------------------------------------------------- /src/resources/icons/icon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/resources/icons/icon.ico -------------------------------------------------------------------------------- /src/resources/icons/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/resources/icons/icon.png -------------------------------------------------------------------------------- /src/resources/icons/icon@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/resources/icons/icon@2x.png -------------------------------------------------------------------------------- /src/resources/icons/icon@3x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/resources/icons/icon@3x.png -------------------------------------------------------------------------------- /src/render/src/assets/icons/icon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/icons/icon.ico -------------------------------------------------------------------------------- /src/render/src/assets/pictures/deco.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/deco.png -------------------------------------------------------------------------------- /src/render/src/assets/pictures/gabin.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/gabin.png -------------------------------------------------------------------------------- /src/render/src/assets/pictures/noise.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/noise.png -------------------------------------------------------------------------------- /src/render/src/assets/pictures/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/loading.gif -------------------------------------------------------------------------------- /src/render/src/assets/pictures/boot-200.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/boot-200.gif -------------------------------------------------------------------------------- /src/render/src/assets/pictures/boot-500.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/boot-500.gif -------------------------------------------------------------------------------- /src/resources/json/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "HOST": "localhost", 3 | "HTTP_PORT": 1510, 4 | "OSC_PORT": 32123, 5 | "BASE_URL": "/" 6 | } -------------------------------------------------------------------------------- /src/render/src/assets/fonts/SpaceGrotesk-Bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/fonts/SpaceGrotesk-Bold.ttf -------------------------------------------------------------------------------- /src/render/src/assets/fonts/SpaceGrotesk-Light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/fonts/SpaceGrotesk-Light.ttf -------------------------------------------------------------------------------- /src/render/src/assets/pictures/obs/obs-scenes.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/obs/obs-scenes.png -------------------------------------------------------------------------------- /src/render/src/assets/fonts/SpaceGrotesk-Medium.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/fonts/SpaceGrotesk-Medium.ttf -------------------------------------------------------------------------------- /src/render/src/assets/fonts/SpaceGrotesk-Regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/fonts/SpaceGrotesk-Regular.ttf -------------------------------------------------------------------------------- /src/render/src/assets/pictures/obs/obs-add-scene.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/obs/obs-add-scene.png -------------------------------------------------------------------------------- /src/render/src/assets/pictures/obs/obs-container.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/obs/obs-container.png -------------------------------------------------------------------------------- /src/render/src/assets/pictures/obs/obs-new-scene.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/obs/obs-new-scene.png -------------------------------------------------------------------------------- /src/render/src/assets/fonts/SpaceGrotesk-SemiBold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/fonts/SpaceGrotesk-SemiBold.ttf -------------------------------------------------------------------------------- /src/render/src/assets/pictures/obs/obs-containers.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/obs/obs-containers.png -------------------------------------------------------------------------------- /src/render/src/assets/pictures/vmix/vmix-add-container.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/vmix/vmix-add-container.png -------------------------------------------------------------------------------- /src/render/src/assets/pictures/vmix/vmix-overlay-sources.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/vmix/vmix-overlay-sources.png -------------------------------------------------------------------------------- /nodemon.json: -------------------------------------------------------------------------------- 1 | { 2 | "watch": ["src"], 3 | "ext": ".ts,.js", 4 | "ignore": ["src/render/dist"], 5 | "exec": "DEBUG=true npm run preview -- -- -- --no-auto-open" 6 | } -------------------------------------------------------------------------------- /src/render/src/assets/pictures/vmix/vmix-create-container.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/one-click-studio/gabin/HEAD/src/render/src/assets/pictures/vmix/vmix-create-container.png -------------------------------------------------------------------------------- /.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | "recommendations": [ 3 | "dbaeumer.vscode-eslint", 4 | "vue.volar", 5 | "vue.vscode-typescript-vue-plugin", 6 | "ms-vscode.vscode-typescript-next" 7 | ] 8 | } -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "[typescript]": { 3 | "editor.defaultFormatter": "esbenp.prettier-vscode" 4 | }, 5 | "[javascript]": { 6 | "editor.defaultFormatter": "esbenp.prettier-vscode" 7 | }, 8 | "[json]": { 9 | "editor.defaultFormatter": "esbenp.prettier-vscode" 10 | } 11 | } -------------------------------------------------------------------------------- /src/render/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 |
4 | 5 |Check if everything looks good !
32 || Audio source | 13 |Mic name | 14 |Mic channel | 15 |
|---|---|---|
| {{ device.name }} | 28 |{{ mic }} | 29 |Channel {{ device.micsName.indexOf(mic) + 1 }} | 30 |
Now let's setup Gabin ! For each scene, enable cameras each microphone can trigger.
39 |{{ label }}
29 |{{ message?.description }}
47 || Connection type | 37 |Host | 38 |Port | 39 |Password | 40 |
|---|---|---|---|
| {{ type }} | 46 |{{ connection.ip.split(':')[0] }} | 47 |{{ connection.ip.split(':')[1] }} | 48 |
52 | {{ showPassword === type? connection.password : connection.password?.replace(/./g, '*') }}
53 | |
61 |
15 | You have to think in terms of containers.
16 | You have your main scenes (fullscreen, splitscreen, etc.) and they will have a nested block called a container.
17 | The container will be the one that contains all your camera sources.
18 | Gabin will automatically trigger the osc path you provide.
19 |
37 | If you need a split view with several simultaneous camera views you can create several containers. 38 |
39 | 40 |
69 | If you have multiple scenes, you have to tell Gabin when you switch between them.
70 | In order to do that call this route /scene/$NAME_OF_YOUR_SCENE.
71 |
73 | {{ subtitle }} 74 |
75 | 76 |
20 | Go to Vmix and create add a transparent color input in which you will overlay all your camera inputs on top of each other.
21 | Gabin will automatically toggle their visibility.
22 | If you need a split view with several simultaneous camera views you can create several Containers.
23 |
80 | You can now embed and place your Container scene in your main scenes.
81 | Create at least one main scene before next step.
82 |