Changing Jitsi UI and removing 3 dots button on hosted server - flutter

I am new to server side of coding. Somehow looking at tutorials I was able to host Jitsi server on my hosting.
I am using jitsi_meet plugin with flutter. Till now Jitsi works as expected in app. What I need is remove text
You are the only one in meeting
and also remove 3 dots menu icon. Instead of menu icon I would love to have camera swap icon there.
What I have done is in /etc/jitsi/meet/my-domain.com-config.js is below
// - if `toolbarButtons` is undefined, we fallback to enabling all buttons on the UI
toolbarButtons: [
'camera',
//'chat',
//'closedcaptions',
//'desktop',
//'download',
//'embedmeeting',
//'etherpad',
//'feedback',
//'filmstrip',
//'fullscreen',
'hangup',
//'help',
//'invite',
//'livestreaming',
'microphone',
//'mute-everyone',
//'mute-video-everyone',
//'participants-pane',
//'profile',
//'raisehand',
//'recording',
//'security',
//'select-background',
//'settings',
//'shareaudio',
//'sharedvideo',
//'shortcuts',
//'stats',
//'tileview',
'toggle-camera',
//'videoquality',
//'__end'
],
But it only made changes to website version not on mobile app (I am using flutter pluging jitsi_meet).
Is there anything else I need to do as well? Please help, how to go about it.

As far as I remember there should be separate code for web and mobile apps. So you should look more into the codes and understand the separation and you will definitely be able to tweak the UI you are wanting. You can also follow threads like this.
For more responses, you can post in jitsi community where there are lots of jitsi enthusiasts who can guide/help you along your journey related to jitsi. Thanks.

Related

Material UI Tabs not rendering properly on server

I am having a problem using the "Tabs" component: https://material-ui.com/components/tabs/ In fact, when developing locally, the rendering of the component is fine. But pushing to the server, it looks weird (with differences in the borders on each side of the bar).
Moreover: when refreshing the page in which it has been embedded or browsing manually to this page, the whole template is broken all of a sudden!
I tried generating a build folder locally and launching the page from that build, and fell back on the same problem.
Thank you in advance for your help
From your description, I saw that your "build" is not work even in local development. That's mean it should not work on the production, of course.
The thing is, what is your actual "build" action? Depends on what library/framework you use, but basically with Material-UI, most popular problem comes from not load some CSS before using it's components.
Please read here first: https://material-ui.com/guides/server-rendering/#server-rendering
Just in case you use Gatsby, read here: https://www.gatsbyjs.org/packages/gatsby-plugin-material-ui/.
I'm using Gatsby and use this following config to fix some CSS issues.
stylesProvider: {
injectFirst: true,
}
Hope this help.

How would you go about downloading a file from a Flutter website?

I'm working on my personal website over at dlblack.dev (all the text is placeholder for now, I'm learning Flutter through a tutorial then I'm going to go back and make it my own). Eventually, I want there to be an option in the navigation bar called "Resume" such that when you click it, it downloads a pdf of my resume to the user's device, from the location project/assets/resume.pdf.
My web development experience is pretty limited, this is my first time really throwing together a full site, but I like how Flutter/Dart feels like a lot of backend-focused languages I've learned, especially Java (essentially what that means is if you tell me to "just integrate how it's done from HTML/JS" or something like that, I'm gonna need more explanation).
Thanks.
You can do something like this..
import 'dart:html' as html;
And..when you want to download something..
onPressed: (){
html.window.open("<link of the file>", "text");
},
This is mostly suitable when you are having the file remotely.. even for the asset file it is Ok..!

Testing Flutter apps with Cypress

Is it possible to test Flutter applications using the Cypress framework instead of using the built-in testing components that Flutter provides? If so, what are the pros & cons of both for Flutter testing if I know Cypress well?
Yes, technically, it's possible.
Here's a spec that passes with the basic flutter counter app:
describe('Counter app', () => {
beforeEach(() => {
cy.visit('http://localhost:_example_port_/#/')
cy.get('flt-semantics-placeholder').click({force: true})
})
it('Increments on button press', ()=>{
cy.get(`[aria-label="0"]`)
cy.get(`[aria-label="Increment"]`).click()
cy.get(`[aria-label="1"]`)
})
})
To explain, if you enable semantics by clicking on the hidden 'flt-semantic-placeholder' element, flutter adds a semantics layer used by screen readers. Widgets with tooltips and text are automatically assigned aria-labels, which Cypress can use to find and click on elements. (You can get more control over these labels using a Semantics Widget.)
I found this worked for the canvas renderer, but it crashed when I tried to run multiple test cases in the same run. So, use the html renderer, ie run flutter for the test with something like:
flutter run -d chrome --web-renderer html --web-port 3443
Okay, so clicking a button is pretty straightforward. What about other interactions?
Inputing text into a field:
Pretty straightforward. See this example.
Simulating a scroll event:
In short, no solution yet. See this markdown.
Simulating drag and drop:
Not likely. See this markdown.
Now for the pros and cons...
Pros:
Cypress is more user friendly than the integration testing flutter provides. Being able to easily hot reload tests, and being able to click around and inspect a live state of a failing test are nice features.
Cons:
Can't (yet) simulate scroll or drag.
Flutter web isn't too performant, and in particular the first load takes a long time. Tests are slow running.
Nothing indicates either the Flutter team or the Cypress team have any plans to support testing Flutter with Cypress.
As of this posting, no online guides or articles for testing Flutter with Cypress.
See also:
What are the tags, <flt-*> generated by Flutter for Web?
https://www.didierboelens.com/2018/07/semantics/

How can I do Junit tests for Google Maps in Android?

I am using the Google Maps API in an Android project and now I need to test it using JUnit if possible. (I am somewhat new to both JUnit and Google Maps.) I have been scouring the internet but was unable to find anything.
The map view has dots/pins for stations and when I tap one I get a balloon popup with the name and other info. Then when I tap the balloon I get a new view with information about the location and actions to perform such as navigate.
What I want to know is, is it possible to write a JUnit test case that finds all these dots/pins, taps them, and verifies information on the new view that pops up? Additionally, I would like to change/mock the location that the GPS has and see what happens if I try to, say navigate overseas or something like that.
I do have a list view of the same locations which I will test as well, but I would like to know if there is a way to test the map view.
I would prefer an automated test script like what JUnit provides. If this is not possible with JUnit what is the best alternative?
I am working with Android 4.0 and using Eclipse.
Any help would be greatly appreciated.
In case anyone wants to know after much searching I finally found something that can test Google Maps. Things such as zoom level and I believe tap pin (method is called tapMapMarkerItem()) are supported. I have not tested the pin tap yet tho.
Apparently the awesome Robotium does not support map testing by itself. Nicholas Albion was nice enough to create an extension to provides testing support for maps on Android. Thank you so much Nicholas!
So here it is:
1. Download the Robotium jars from robotium.org (I found this helpful http://www.vogella.com/articles/AndroidTesting/article.html - by Lars Vogel)
2. Download the extension from https://github.com/nalbion/robotium-maps

WinJS.UI Metro Animation Library

I'm starting to port over my web app that I've built with Sencha Touch into the Windows 8 world. I'm seeing a lot of WinJS.UI documentation, basically telling me that there are more 'native' feeling animations and UI actions already build into this framework.
My app is already structured, but I'd like to mix in WinJS.UI if I can. How do I go about doing this? I haven't found a link to download the library or anything of the sort.
For example, this link:
http://blogs.msdn.com/b/windowsappdev/archive/2012/05/01/fast-and-fluid-animations-in-your-metro-style-app.aspx
I see that they are using:
<script>
function runAnimation(){
enterPage = WinJS.UI.Animation.enterPage(input);
}
</script>
But I find no documentation on where to include the library.
Little bit lost, any help is appreciated!
These animations are included in the UI.Js from the WinJS Package -- this is the same WinJS that is included in the default Visual Studio Templates. Just create a new HTML Windows Store application, and the details will be there.
Here's your library: http://code.msdn.microsoft.com/windowsapps/Using-the-Animation-787f3720
You can deploy this on your computer and play with the animations.