ol.control.FullScreen label conflict - openlayers-3

I have recently ported my app from 3.1.1 to 3.20.0 and noticed a conflict in the label of the FullScreen control. The controls on my ol.Map look like this:
this.map = new ol.Map({
controls: ol.control.defaults().extend([
new ol.control.FullScreen(),
new ol.control.ScaleLine({minWidth:100, target:$('#scale-line')[0]})
])
When I load my map, this is what the fullScreen control looks like when not yet in full screen and here what it looks like after fullscreen view is enabled.
Even if I try to force ol.control.FullScreen to support a customised label, such as a span containing the icon fa fa-expand, I still get the WEST-EAST overlapping arrows.
Any ideas?

Ok I figured this out. I had left the old ol 3.1.1 css file instead of replacing it with the new ol.css. Once I did it, the Full screen icon changed as expected.
Very lame of me indeed.

Related

Latest Vaadin Start generated app - bug in main-layout theme with Flow/Hybrid views?

I used the latest Vaadin Start page to generate an app skeleton (Vaadin 21 / Java 11)
It works so far, I used hybrid mode with various views.
When clicking view links in the menu only TS+HTML based views will register in the GUI as selected and get a colored "selected/active" styling.
When I generate an app which only has Flow views, the first view will be stuck with the selected styling, but other views will register properly when clicked.
Only when I generate an app which only has Fusion views, all view selects will properly register.
I guess this is a bug?
Edit: video of the behavior when in hybrid mode. The menu item names correspond to the type of view which is being selected. As you can see only fusion views show the "select" in the menu:
Edit2: I think the problem is caused here:
?highlight=${viewRoute.path == appStore.location
Seems like the appStore.location is not being set from non-Fusion views. I put a console.log in the index.ts eventListener and non-Fusion views all just pass "(.*)" as the view name/location, which is the reasion why this fails.
So the #Route(value = "view-name") declaration in the java-class seems not to be passed properly at the moment.
BR
Daniel
This seems to be a bug in the Start project templates. I added an issue in our internal issue tracker.
Thanks a lot for reporting.
Edit: the issue is already fixed.
The question is not very clear to me, but if the problem is the fact that "the first view will be stuck with the selected styling", have you tried to add setAutoselect(false) to the tabbed menu in your MainLayout?
Here it is:
private Tabs createMenu() {
final Tabs tabs = new Tabs();
tabs.setOrientation(Tabs.Orientation.VERTICAL);
tabs.addThemeVariants(TabsVariant.LUMO_MINIMAL);
tabs.setId("tabs");
tabs.setAutoselect(false); //Needed not to select first tab by default
tabs.add(createMenuItems());
return tabs;
}

How do i change react-native theme to transaperent on ios

how can i change the theme or default background color for ios.. it's conflicting with my background image. I'd like to set it to transparent.. Thanks
First let's understand how scenes in react-native-router-flux works. When you define them in your navigator, like below,
<Scene sceneStyle={{marginTop: 64}} title="Home" key="home" component={Home} />
You simply say that, my content should render below the pre defined navbar. Which can be 54 or 64 depending on your OS. So when you use Router,
<Router navigationBarStyle={{backgroundColor: 'transparent'}}>
and add navigationBarStyle to every Scene you have by introducing that line, you almost forgot what you've done above, setting your Scene to align itself some margin below the navigationBar. Therefore you see nothing (white space) in your simulator.
In order to have what you need, do this where you want your image to appear full screen with navigation controls:
Actions.refresh({
key: 'home',
navigationBarStyle: {backgroundColor: 'transparent'},
sceneStyle: {marginTop: 0},
});
Or you can introduce this settings in your Scene component where you define it.
I tested this solution and it works on iOS, can't tell the same for Android, so please back up your code before making changes. You can further customize it to remove borderBottom line.

Xcode 7.1: UILabel added to sizeclass regular/regular shown anywhere

In Xcode 7, I was able to add a UILabel only to the Regular/Regular size-class. I simply selected w: Regular h:Regular below the storyboard and added it to my controller using drag 'n' drop. Once I switched to another size-class, the element was shown as inactive in the document outline on the left. Everything fine.
Now the same approach doesn't seem to work. When I switch to another size-class after the label was added to regular/regular, the UILabel is still active in the document outline and shown when the app is running (on an iPhone for example).
Any pointers or hints more than appreciated! Release notes don't offer any clue. Doesn't look like a wanted behaviour that was mentioned anywhere.

Is there a way to specify an order of toolbars using Mozilla add-on sdk?

Our app is using 1+ toolbars written using add-on sdk. The problem is, right now the toolbars seems to decide for themselves in which order they will get displayed. In the first window I have toolbar A below toolbar B. However, if I open a new window, toolbar B will be on top.
Anybody else encountered this issue? Do you guys have any tips on how to deal with it?
Thanks!
Luka
EDIT: attaching a code that shows how I create toolbars:
this.myframe = new ui.Frame({
url: self.data.url(this.LABELS.TRANSLATION_FRAME)
});
this.mytoolbar = ui.Toolbar({
title: this.NAME,
items: [this.myframe],
hidden: true
});
The second toolbar has the same three arguments (title, items, hidden) and both frames contain a properly structured, very minimal html files.
These toolbars reside in two separate extensions. If both are enabled, as I mentioned above, the ordering seems to be pretty random.

Grails UI Menu flakey behavior in IE

I'm using a GRAILS UI (1.2-SNAPSHOT) an it's implementation of the YUI menubar (YUI 2.7.0.1). I am seeing flakey mouseover behavior in IE (Firefox is ok). When I mouse over the menu item with a submenu, it will show. As I try to mouse over the sub-menu, the submenu disappears before I can click. This happends in a pattern I haven't fully figured out. Usually the first time I select a menu it's fine but if I move around the menu back to a menu item, the submenu begins to display this behavior. By clicking and holding the mouse button I can usually get the sub-menu to stick around.
I've palyed with various configurations like keepopen and automenudisplay but they don't seem to change the behavior. I have not seen much posted about this. But I also don't see menu's documented in the UI plugin either. I could really use some feedback if UI menu is not ready for primetime yet or I'm missing something else. I've not worked with much AJAX before.
Below is the code with the added options I played with that did not have a positive impact.
<gui:menubar id='menubar' renderTo='mainmenu' autosubmenudisplay="false" shadow="true" keepopen="true">
<gui:menuitem url="/esmzone">Home</gui:menuitem>
<gui:submenu label='Profile'>
<gui:menuitem url="${createLink(controller:'memberProfile', action:'view')}">View</gui:menuitem>
<gui:menuitem url="${createLink(controller:'memberProfile', action:'profile')}">Edit</gui:menuitem>
<gui:menuitem url="${createLink(controller:'user', action:'account')}">Settings</gui:menuitem>
<gui:menuitem url="#">Subscription</gui:menuitem>
</gui:submenu>
Here is the code generated by the plugin:
<script>
YAHOO.util.Event.onDOMReady(function() {
GRAILSUI.menubar = new YAHOO.widget.MenuBar("menubar_div", {'autosubmenudisplay': false,
'shadow': true,
'keepopen': true});
GRAILSUI.menubar.render('mainmenu');
});
</script>
I made some progress on this by researching the YUI library. There is a documented bug with IE7. Apparently the grails-ui plugin does not address the fix. I'm testing with IE8 but I assume it's still there.
http://developer.yahoo.com/yui/menu/#knownissues
It appears that you should set the zoom property to 1 (zoom:1) for the bd class.
I added the following code to my style sheet
div.yuimenubar .bd {
zoom: 1;
}
and it seems to help. I see no side effect in Firefox but I didn't dynamically check for the version of browser as I would need to hack the code that generates the YUI javascript and put in
if (YAHOO.env.ua.ie === 7) {
YAHOO.util.Dom.addClass(document.body, "ie7");
}
after the render() call. Then instead of the style I added you could do an IE7 (probably >=7) style.
This is what the Yahoo site had to say about it:
The following application of
"zoom:1" sets the "hasLayout"
property to "true" and prevents
first tier submenus of a MenuBar
from hiding when the mouse is moving
from an item in a MenuBar to a
submenu in IE 7.
For more on the "hasLayout" property:
http://msdn.microsoft.com/en-us/library/ms533776(VS.85).aspx

Resources