Hi,
in the last few months I’ve tried, very much on and off (hack 2 hours, rest 2 months), to improve the style editor page, in order to get
more space for the editor itself.
I’ve come to a point were I can probably commit what I have, and getting close a significant improvement that I have troubles finishing myself.
Going in order, the first set of changes I’ve made is to reduce need-less vertical space usage, here is a side by side comparison of
the style editor before the change, on a server that has the latest nightly, along with some extra plugins, so excuse the different menu entries,
and after the change, on my local machine:
Small improvement, but enough to make the whole thing fill the screen in its default state. However, if you check the UI, you’ll see there is a new “height” drop down on top of the style
editor, and a tempting “arrows-out” icon on the top right. What happens if one clicks that icon, and then increases the height of the editor? This, “full screen” editing with less distractions,
aka “zen mode” (this is all you see in the browser, I did not cut away anything):
As you can see, the editor has been pumped up from 300px to 550px, or almost twice as big.
The “arrows-out” becomes “arrows-in”, clicking it you can return to the previous state.
These changes can be found in this pull request, I invite you to comment, review, improve it:
https://github.com/geoserver/geoserver/pull/2867
Now, the above form factor helps with a side by side comparison, but screens nowadays are large and
doing the same on a large one results in wasted space, it’s not a mistake that common style editors
done by HTML/CSS/JS pros have a different layout, a “side by side” one.
Can we do the same? Turns out, with a modern browser one can get there using the “flex” layout
mode, however, I’m not good enough with HTML/CSS/JS to get from prototype to something actually useful.
Here is what I have so far:
and the branch:
https://github.com/aaime/geoserver/tree/style_editor_side_by_side
To make it usable, imho, some more responsive design would be needed, where the editor and the map
automatically resize to fill the available space. A sub-par solution that would still be acceptable, imho,
could be to add a height dropdown to the map editor… having to click on two dropdowns to adapt
the page to the screen would be clunky but… better than nothing?
Bonus points for a draggable vertical separator allowing to adjust the relative width of editor and map.
However, as said, I’m having difficulties making that happen. Sorry, I’m an almost pure server side dev,
getting no occasions to work on the client side, even if I’d like to.
So… wondering, is there any good soul with the right client side skills that could bring this second part of
the work to completion? 
Cheers
Andrea
···
==
GeoServer Professional Services from the experts! Visit http://goo.gl/it488V for more information.
Ing. Andrea Aime
@geowolf
Technical Lead
GeoSolutions S.A.S.
Via di Montramito 3/A
55054 Massarosa (LU)
phone: +39 0584 962313
fax: +39 0584 1660272
mob: +39 339 8844549
http://www.geo-solutions.it
http://twitter.com/geosolutions_it
AVVERTENZE AI SENSI DEL D.Lgs. 196/2003
Le informazioni contenute in questo messaggio di posta elettronica e/o nel/i file/s allegato/i sono da considerarsi strettamente riservate. Il loro utilizzo è consentito esclusivamente al destinatario del messaggio, per le finalità indicate nel messaggio stesso. Qualora riceviate questo messaggio senza esserne il destinatario, Vi preghiamo cortesemente di darcene notizia via e-mail e di procedere alla distruzione del messaggio stesso, cancellandolo dal Vostro sistema. Conservare il messaggio stesso, divulgarlo anche in parte, distribuirlo ad altri soggetti, copiarlo, od utilizzarlo per finalità diverse, costituisce comportamento contrario ai principi dettati dal D.Lgs. 196/2003.
The information in this message and/or attachments, is intended solely for the attention and use of the named addressee(s) and may be confidential or proprietary in nature or covered by the provisions of privacy act (Legislative Decree June, 30 2003, no.196 - Italy’s New Data Protection Code).Any use not in accord with its purpose, any disclosure, reproduction, copying, distribution, or either dissemination, either whole or partial, is strictly forbidden except previous formal approval of the named addressee(s). If you are not the intended recipient, please contact immediately the sender by telephone, fax or e-mail and delete the information in this message that has been received in error. The sender does not give any warranty or accept liability as the content, accuracy or completeness of sent messages and accepts no responsibility for changes made after they were sent or for other risks which arise as a result of e-mail transmission, viruses, etc.
