I am using A-Frame's orbit-controls to increase the rotation speed on my 360 degree video.
Here's the codepen:
https://codepen.io/anon/pen/ZJNrMY
The problem here is when I right click on the video/image, the right click menu does not appear. All I see is a hand on the video/image that looks like some kind of a-grabbing class acting as an overlay on the video.
How can I have the click functionality intact when I am using orbit-controls? Or is there a better/simpler way to manipulate the rotation of a video? Please help.
The orbit-controls components contains these lines:
onContextMenu: function (event) {
event.preventDefault();
},
You'll need to override that or fork the component and remove it or ask to add a property to disable that piece in order to re-enable right click context menu.
Related
I have a problem. If I click on one button then it shows a little window where I need to click on another button. But it is hidden because that window is too small and needs to move with scrollbar. How should I click or move with that scrollbar and then click on the button?
If I try playground on that it takes full window.
Thank you for your answers.
Is that modal related to the width of the screen? If it is you can solve it by adding a new configuration for the viewport to cypress.json:
{
"viewportWidth": 1920,
"viewportHeight": 1280
}
And then of course to a width that is enough to solve your problem.
If that doesn't work, I believe this page can help you: https://docs.cypress.io/api/commands/scrollto.html#Scopes . The result will be something like this:
cy.get('modal_name')
.scrollTo('right')
Besides that I expected a cy.get() to still get the button you were looking for.
This is a very natural way of thinking whilst getting your element. However, imagine you are manually testing the screen above, you will have scroll in order to see and take action to the hidden element. Why should cypress be different?
It is important to transcript to your test, exactly the same actions you would do if manually executing the test. As a result, you should have a scrollIntoView action.
I'm using Vuetify's toolbar scrolling techniques feature on a SPA that needs to scroll to the top of a container between each page transition. When I trigger this via javascript using scrollTop, the scroll works fine, but it doesn't seem to let Vuetify know that a scroll up has occurred and as a result the primary toolbar is missing. If a particular page isn't long enough to require a scroll, it becomes impossible to regain the primary toolbar.
Any suggestions on how I can scroll the user to the top of the container from javascript AND have Vuetify move the primary toolbar back into place would be much appreciated.
<v-toolbar :scroll-off-screen="true" :scroll-target="'#scrolling-techniques'">
https://codepen.io/developerplus/pen/mBbjBq
I've attached a codepen link demonstrating the issue. Once scrolled down to the bottom of the container, if the "Scroll to Top" button is clicked, i'd expect it to both take me to the top of the container, and reveal the primary menu.
I found a solution to my question. If you refer to the codepen in the question, you'll notice the example is now working. What was required was the following:
let event = new CustomEvent('scroll')
container.pageYOffset = 0
setTimeout(() => {
container.scrollTop = 0
})
container.dispatchEvent(event)
First of all, thanks to everything of codenameone.
I would like to customize camera view, simply overlaying PNG image on the full camera view screen.
Any way how to do it?
Here is code snippet.
Form mainForm = new Form();
ImageViewer iv = new ImageViewer();
mainForm.getToolbar().addMaterialCommandToRightBar("",
FontImage.MATERIAL_CAMERA_ALT, 4, (ev) -> {
filePath = Capture.capturePhoto();
setImage(filePath, iv);
});
I couldn't any view component of camera view, because Capture.capturePhoto() works automatically.
Or is there any way to build custom camera component in codename one?
I googled and got about PeerComponents, however don't know how to use it.
Just please provide some small sample code for me.
Best regards.
Currently Capture.capturePhoto() opens its own "window" over the app so you can't customize it. In the future we will likely add a more flexible API to embed the camera into your UI, especially now that we have Z-layering (we can draw over top of native widgets).
If you need this functionality right now, you would need to write a native interface and make your own capture component.
Does anyone can open Tinder.app?
Well, the app implements a simple-but-slick animation effect when the user taps on the top-left menu icon button. The focal points of this animation are:
Status bar fades out/in based on when the left menu sidebar is opening or closing;
When the left menu sidebar is opened there's a little bounce effect of the main view controller just slide to right;
When the left menu is opened, if you try to close it you can see there's a little bounce of the main view controller that shows the right sidebar (the "All Matches" view controller).
I've just cloned ECSlidingViewController repo and played a little with it but unfortunately it seems that (out-of-the-box) it have only classic animations and not those bounce animations I said before I'm trying to achieve.
Does anyone knows how to implement something like that? Thanks.
You can find many ways to do this, you can wirte your own code to do this. But there are many free work available, which may helpful. And you will not try to reinvent the wheel.
IIViewDeckController
AppCoda
JTRevealSlidebar
SASlideMenu
JA Slide Panel
BenHall
SlideNavigationController
There are plenty more available, but above mentioned are easy to use and having demo project also.
Task: I wanted to create a simple share button which extends to a share section (F,T,G,P) when clicked.
I failed to let the section slide out of the share button - what I really, really wanted - but managed to let a separate ul element slide out on the right side.
The animation worked… until I set the ul to hide initially via $('.networks').hide();
The sections is intended to only show up after a click, but now after the first click it just "pops open" ignoring the configured slide-out. Sliding only works in both directions (open and close) after clicking on it at least once .
I've uploaded an Example here at Codepen.io and as a jsFiddle.
Side note: the demos are behaving a little bit strange since they appear to only show a slide-in fx. The slide-out fx, with which we start, always looks like it pops open - that's not the case, it works after the second click, so you got to focus your eyes to see it (on a normal browser it visibly works better).
PS: Bonus points if you help me make this slide out of the "share" button. Be aware that I only have rudimentary knowledge of Javascript ( * duck and run * ).
Take a look at this fiddle link.
I changed the display property of the buttons to be inline-block instead of inline.
Elements with display inline can not have a width and i think it was the reason why jQuery was not able to animates the Elements width. I also animated the wrap around the ul instead of the ul.
EDIT: made a fast mockup of the thing sliding out of the button. Changed some css to be on the list elements itself instead of on the a elements, just work through the css and I think it will look ok.
edit forgot the link: link