eessppeelllloo/hydra
1
0
Fork 0
mirror of https://github.com/hydra-synth/hydra.git synced 2025-12-21 06:09:59 +01:00
Code Issues Packages Projects Releases Wiki Activity

added language toolbar

Browse Source
This commit is contained in:
ojack
2022-03-05 21:21:49 -05:00
parent 818199fc3d
commit db24126b34
5 changed files with 123 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

94
frontend/web-editor/public/bundle.js
View File

@@ -47115,7 +47115,7 @@ module.exports = PatchBay
module.exports = {
en: {
translation: {
'language-name': 'English',
'language-name': 'english',
toolbar: {
run: "Run all code (ctrl+shift+enter)",
upload: "upload to gallery",
@@ -47151,44 +47151,44 @@ module.exports = {
}
}
},
es: {
translation: {
'language-name': 'asfafd',
toolbar: {
run: "Run all code (ctrl+shift+enter)",
upload: "upload to gallery",
clear: "clear all",
shuffle: "show random sketch",
random: "make random change",
"show-info": "show info window",
"hide-info": "hide info window"
},
info: {
title: 'sdadddsad',
subtitle: 'live coding networked visuals',
description: 'Hydra is a platform for live coding visuals, in which each connected browser window can be used as a node of a modular and distributed video synthesizer.',
'get-started-title': 'To get started:',
'get-started-list': [
'Close this window',
'Change some numbers',
'Type Ctrl + Shift + Enter'
],
'description-detailed': 'Built using WebRTC (peer-to-peer web streaming) and WebGL, hydra allows each connected browser/device/person to output a video signal or stream, and receive and modify streams from other browsers/devices/people. The API is inspired by analog modular synthesis, in which multiple visual sources (oscillators, cameras, application windows, other connected windows) can be transformed, modulated, and composited via combining sequences of functions.',
'features': 'Features:',
'features-list': [
'Written in javascript and compatible with other javascript libraries',
'Available as a platform as well as a set of standalone modules',
'Cross-platform and requires no installation (runs in the browser)',
'Also available as a package for live coding from within atom text editor',
'Experimental and forever evolving !!'
],
'author': 'Created by <a {{author}}>olivia.</a>',
'more-info': 'For more information and instructions, see: <a {{docs}}>the online documentation</a>, <a {{functions}}>a list of hydra functions</a>, <a {{repo}}>the source code on github</a>, <a {{gallery}}>a gallery of user-generated sketches</a>, <a {{pixeljam}}>PIXELJAM collaborative editor</a>, <a {{hydra-book}}>Hydra Book</a>, and more <a {{tutorials}}>tutorials and examples.</a>',
'more-info-forums': 'There is also an active <a {{discord}}>Discord server</a> and <a {{facebook}}>facebook group</a> for hydra users+contributors.',
'support': 'If you enjoy using Hydra, please consider <a {{open-collective}} >supporting continued development <3 </a>.'
}
}
}
// es: {
// translation: {
// 'language-name': 'asfafd',
// toolbar: {
// run: "Run all code (ctrl+shift+enter)",
// upload: "upload to gallery",
// clear: "clear all",
// shuffle: "show random sketch",
// random: "make random change",
// "show-info": "show info window",
// "hide-info": "hide info window"
// },
// info: {
// title: 'sdadddsad',
// subtitle: 'live coding networked visuals',
// description: 'Hydra is a platform for live coding visuals, in which each connected browser window can be used as a node of a modular and distributed video synthesizer.',
// 'get-started-title': 'To get started:',
// 'get-started-list': [
// 'Close this window',
// 'Change some numbers',
// 'Type Ctrl + Shift + Enter'
// ],
// 'description-detailed': 'Built using WebRTC (peer-to-peer web streaming) and WebGL, hydra allows each connected browser/device/person to output a video signal or stream, and receive and modify streams from other browsers/devices/people. The API is inspired by analog modular synthesis, in which multiple visual sources (oscillators, cameras, application windows, other connected windows) can be transformed, modulated, and composited via combining sequences of functions.',
// 'features': 'Features:',
// 'features-list': [
// 'Written in javascript and compatible with other javascript libraries',
// 'Available as a platform as well as a set of standalone modules',
// 'Cross-platform and requires no installation (runs in the browser)',
// 'Also available as a package for live coding from within atom text editor',
// 'Experimental and forever evolving !!'
// ],
// 'author': 'Created by <a {{author}}>olivia.</a>',
// 'more-info': 'For more information and instructions, see: <a {{docs}}>the online documentation</a>, <a {{functions}}>a list of hydra functions</a>, <a {{repo}}>the source code on github</a>, <a {{gallery}}>a gallery of user-generated sketches</a>, <a {{pixeljam}}>PIXELJAM collaborative editor</a>, <a {{hydra-book}}>Hydra Book</a>, and more <a {{tutorials}}>tutorials and examples.</a>',
// 'more-info-forums': 'There is also an active <a {{discord}}>Discord server</a> and <a {{facebook}}>facebook group</a> for hydra users+contributors.',
// 'support': 'If you enjoy using Hydra, please consider <a {{open-collective}} >supporting continued development <3 </a>.'
// }
// }
// }
}
},{}],248:[function(require,module,exports){
const Gallery = require('./gallery.js')
@@ -47217,6 +47217,15 @@ module.exports = function store(state, emitter) {
selectedLanguage: i18next.language
}
emitter.on('set language', (lang) => {
console.log('setting language to', lang)
i18next.changeLanguage(lang, (err, t) => {
console.log(err, t)
selectedLanguage = lang
emitter.emit('render')
})
})
let sketches
emitter.on('DOMContentLoaded', function () {
@@ -47994,12 +48003,15 @@ const toolbar = require('./toolbar.js')
const link = (url) => `href=${url} target=_blank`
module.exports = function mainView(state, emit) {
const { t } = state.translation
const { t, languages } = state.translation
const langArray = Object.entries(languages)
return html`
<div id="info-container" class="${state.showInfo ? "" : "hidden"}">
<div id="modal">
<div id="modal-header" style="opacity:${state.showUI === true? 1: 0}">
<div><!--<i class="fas fa-bars icon"></i>--></div>
${state.showInfo && langArray.length > 1 ? html`<div style="display:flex">${langArray.map(([key, val]) => html`
<div class="language-select" onclick=${() => emit('set language', key)}>${val}</div>
`)}</div>` : html`<div></div>` }
${toolbar(state, emit)}
</div>
<div id="modal-body">