Re: Custom layers in PgAdmin IV Mapview

From: Atle Frenvik Sveen <atle(at)frenviksveen(dot)net>
To: Dave Page <dpage(at)pgadmin(dot)org>
Cc: "pgadmin-hackers" <pgadmin-hackers(at)lists(dot)postgresql(dot)org>, Kanchan Mohitey <kanchan(dot)mohitey(at)enterprisedb(dot)com>, Aditya Toshniwal <aditya(dot)toshniwal(at)enterprisedb(dot)com>
Subject: Re: Custom layers in PgAdmin IV Mapview
Date: 2018-09-17 14:12:55
Message-ID: 1537193575.197750.1510826520.4BACD67B@webmail.messagingengine.com
Views: Raw Message | Whole Thread | Download mbox | Resend email
Thread:
Lists: pgadmin-hackers

On Mon, Sep 17, 2018, at 16:05, Dave Page wrote:
> Hi
>
> On Mon, Sep 17, 2018 at 2:52 PM, Atle Frenvik Sveen <atle(at)frenviksveen(dot)net>
> wrote:
>
> > Hello again!
> >
> > I've managed to get closer to resolving this task (see attached image for
> > the current state of the work and https://github.com/atlefren/
> > pgadmin4/tree/mapviewer_custom_layers_3646 for code), but I still have
> > some questions. Please let me know if this list isn't the appropriate place.
> >
> > 0. Sorry for breaking the build by introducing a new node version
> >
>
> Hahaha. No problem. It's all good now.
>
>
> >
> > 1. The GeometryViewer now uses browser.get_preferences_for_module to get
> > the available layers at initialization. A bit of testing suggests that this
> > initialization is perfromed each time the map window is re-opened. Is this
> > correct? Or should I listen to some kind of "preferences updated"-event?
> >
> > 2. I've made a new backform-component called "OrderedListControl", which
> > builds a table based on the fields-attribute, in the same manner as the
> > KeyCodeControl. The control now supports:
> >
> > - editing existing elements
> > - Deleting elements
> > - add a new element
> > - moving existing elements up or down in the list
> >
> > However, I have some challenges:
> >
> > 1. Each time I type in a new value, the render-cycle triggers and the
> > Input looses focus. Any ideas here? My Backbone-skills was last used 4
> > years ago, and React has kinda made me forget this stuff.
> > 2. I consider some of the fields optional and some required, but could not
> > find a setting to set the required fields required. Any suggestions?
> >
>
> I'll leave those for Kanchan/Aditya to comment on, as they know that code
> far better than I do.
>
>
> >
> > In addition, Design and CSS is not my strong areas, and there are a couple
> > of things I struggle with:
> >
> > 1. I've used buttons for delete and move. This is not pretty, but it
> > works.
> >
>
> Yeah, that'll need some work.
>
>
> > 2. The last row of the table is always empty and is used for adding a new
> > row. Does this make sense?
>
>
> Yes, but it doesn't really follow our normal design. I'd suggest using a
> grid - for example, the same as we use for adding listing/adding/removing
> columns on the Table dialogue. That's a standard design pattern that we've
> used in many places. The Action buttons can then just be FontAwesome icons
> for up/down/remove.

Ah, this makes sense. This will (hopefully) resolve some of the issues related to required fields (and hopefully focus as well). I'll give this a try (if I can manage to find the relevant code, any pointers appreciated!).

-a

>
> > `
> > 3. Since several of the fields are large the table looks really cramped
> > (and unreadable). In my view, the empty space below the label could be
> > used, but I am not sure how I can fix this.
> >
>
> CSS magic, but I'm not sure either (ancient C++ guy here!)
>
>
> >
> > Thanks for your replies.
> >
> > -a
> >
> > --
> > Atle Frenvik Sveen
> > atle(at)frenviksveen(dot)net
> > 45278689
> > atlefren.net
> >
> > On Fri, Sep 14, 2018, at 11:43, Atle Frenvik Sveen wrote:
> > > Thanks!
> > >
> > >
> > > Another question:
> > >
> > > I had issues running make install-node using node 10.x. The issue was
> > > related to an old version of the leveldown package
> > > (https://github.com/Level/leveldown/issues/455).
> > >
> > > The dependency on leveldown was introduced by the hard-source-webpack-
> > > plugin, which was required at version 0.4.9. Upgrading hard-source-
> > > webpack-plugin to latest (0.12.0) seems to have solved this problem.
> > >
> > > Are these kinds of fixes something that should be submitted separately,
> > > or can they be included in the final patch?
> > >
> > > -a
> > >
> > > --
> > > Atle Frenvik Sveen
> > > atle(at)frenviksveen(dot)net
> > > 45278689
> > > atlefren.net
> > >
> > > On Fri, Sep 14, 2018, at 09:48, Dave Page wrote:
> > > > Hi
> > > >
> > > > On Fri, Sep 14, 2018 at 8:44 AM, Atle Frenvik Sveen <
> > atle(at)frenviksveen(dot)net>
> > > > wrote:
> > > >
> > > > > Dave, Khushboo:
> > > > >
> > > > > Thanks for your replies. I've created an issue here:
> > > > > https://redmine.postgresql.org/issues/3646
> > > > >
> > > > > Please feel free to comment and suggest changes.
> > > > >
> > > > > Thank you both for your input!
> > > > >
> > > > > I guess I will spend some time getting to know this code-base, and
> > when
> > > > > time comes I think I will need some guidance on the process of
> > sending
> > > > > patches etc (as this is not something I am familiar with).
> > > > >
> > > > > I see that there is an .editorconfig and and .eslintrc.js in the
> > repo,
> > > > > along with a .pycodestyle. I've never heard of .pycodestyle, but I am
> > > > > familiar with PEP8. Any pointers on this?
> > > > >
> > > >
> > > > You can run "make check-pep8" and it will check that all the Python
> > code
> > > > conforms.
> > > >
> > > >
> > > > >
> > > > > -a
> > > > >
> > > > >
> > > > >
> > > > > --
> > > > > Atle Frenvik Sveen
> > > > > atle(at)frenviksveen(dot)net
> > > > > 45278689
> > > > > atlefren.net
> > > > >
> > > > > On Fri, Sep 14, 2018, at 05:24, Khushboo Vashi wrote:
> > > > > > On Thu, Sep 13, 2018 at 8:10 PM, Dave Page <dpage(at)pgadmin(dot)org>
> > wrote:
> > > > > >
> > > > > > > Hi
> > > > > > >
> > > > > > > On Thu, Sep 13, 2018 at 2:50 PM, Atle Frenvik Sveen <
> > > > > atle(at)frenviksveen(dot)net
> > > > > > > > wrote:
> > > > > > >
> > > > > > >> Hi list!
> > > > > > >>
> > > > > > >> The new Mapview is great, but when you give people something
> > they
> > > > > always
> > > > > > >> want more, and so do I.
> > > > > > >>
> > > > > > >> I want to be able to add custom background layers to the
> > existing
> > > > > list of
> > > > > > >> layers.
> > > > > > >>
> > > > > > >> I'm thinking that the list of layers should be configurable
> > from the
> > > > > > >> Preferences -> Sql editor menu (or somewhere in the Preferences)
> > > > > > >>
> > > > > > >> Then again, given that I know both Js, Leaflet, Backbone, and
> > > > > > >> Python/Flask I guess I should contribute the changes myself
> > rather
> > > > > then
> > > > > > >> waiting for someone else to do this.
> > > > > > >>
> > > > > > >
> > > > > > > Cool :-)
> > > > > > >
> > > > > > >
> > > > > > >>
> > > > > > >> However, I have some questions before I jump right on this task:
> > > > > > >>
> > > > > > >> First some organizational:
> > > > > > >> 1. If I add this, is this something that is welcomed by the
> > project?
> > > > > > >>
> > > > > > >
> > > > > > > Yes!
> > > > > > >
> > > > > > >
> > > > > > >> 2. How do I register a task on https://redmine.postgresql.org
> > > > > > >> /projects/pgadmin4/issues
> > > > > > >>
> > > > > > >
> > > > > > > Assuming you have a user account on there, there's a "New Issue"
> > button
> > > > > > > towards the top right.
> > > > > > >
> > > > > > >
> > > > > > >> 3. Is it ok to clone the GitHub mirror and submit a PR there?
> > > > > > >>
> > > > > > >
> > > > > > > You're welcome to work in a GitHub mirror of course, but please
> > send
> > > > > > > patches here - we won't see GitHub PRs as our primary repo is
> > > > > > > git.postgresql.org.
> > > > > > >
> > > > > > >
> > > > > > >>
> > > > > > >> Then some tech-related questions:
> > > > > > >>
> > > > > > >> 1. It seems like window.top.pgAdmin.Browser.
> > > > > get_preferences_for_module
> > > > > > >> is used for getting preferences from js, and that the
> > > > > PreferencesModule
> > > > > > >> python class is responsible for managing preferences. But where
> > are
> > > > > the
> > > > > > >> default preferences listed?
> > > > > > >>
> > > > > > >
> > > > > > > You'll find register_preferences functions in some of the Python
> > > > > modules
> > > > > > > (e.g. web/pgadmin/dashboard/__init__.py). They tend to have a
> > bunch of
> > > > > > > calls in them that look like this:
> > > > > > >
> > > > > > > self.session_stats_refresh = self.dashboard_preference.register(
> > > > > > > 'dashboards', 'session_stats_refresh',
> > > > > > > gettext("Session statistics refresh rate"), 'integer',
> > > > > > > 1, min_val=1, max_val=999999,
> > > > > > > category_label=gettext('Graphs'),
> > > > > > > help_str=gettext('The number of seconds between graph
> > samples.')
> > > > > > > )
> > > > > > >
> > > > > > > In this case, the 1 on the beginning of the fourth line is the
> > default
> > > > > > > value.
> > > > > > >
> > > > > > >
> > > > > > >> 2. Does the preferences code currently handle editing a list of
> > > > > elements?
> > > > > > >> I'm thinking that the preferences pane for map layers should be
> > > > > something
> > > > > > >> like this.
> > > > > > >>
> > > > > > >>
> > > > > > >> name | url
> > > > > > >> |
> > > > > > >> ----------|-------------------------------------------------
> > > > > ----------------|
> > > > > > >> ------
> > > > > > >> streets | https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png
> > > > > > >> <http://tile.openstreetmap.org/%7Bz%7D/%7Bx%7D/%7By%7D.png> |
> > > > > [remove]
> > > > > > >> [] | []
> > > > > > >> | [add]
> > > > > > >>
> > > > > > >> 2.1 If it does, where in the code can I find it?
> > > > > > >> 2.2 It it doesn't, where in the code can I add it and
> > > > > > >> 3. In either case of 2: how do I specify how a preference
> > object for a
> > > > > > >> module look like?
> > > > > > >>
> > > > > > >
> > > > > > > I don't believe it does at the moment. Khushboo, am I missing
> > > > > something?
> > > > > > >
> > > > > > > Yes, right, currently we don't have it.
> > > > > >
> > > > > > You can register the module wise preferences with the
> > > > > register_preferences
> > > > > > function mentioned by Dave above.
> > > > > > At the client side, we create the preferences cache and use the
> > cache in
> > > > > > the other JS modules as and when required. Please refer
> > > > > > pgadmin/browser/static/js/preferences.js file which is being used
> > to get
> > > > > > the cached preferences. You will find the different functions to
> > get the
> > > > > > specific preference here.
> > > > > >
> > > > > > The Preferences class is in web/pgadmin/utils/preferences.py.
> > > > > > >
> > > > > > > --
> > > > > > > Dave Page
> > > > > > > Blog: http://pgsnake.blogspot.com
> > > > > > > Twitter: @pgsnake
> > > > > > >
> > > > > > > EnterpriseDB UK: http://www.enterprisedb.com
> > > > > > > The Enterprise PostgreSQL Company
> > > > > > >
> > > > >
> > > >
> > > >
> > > >
> > > > --
> > > > Dave Page
> > > > Blog: http://pgsnake.blogspot.com
> > > > Twitter: @pgsnake
> > > >
> > > > EnterpriseDB UK: http://www.enterprisedb.com
> > > > The Enterprise PostgreSQL Company
> > >
> >
>
>
>
> --
> Dave Page
> Blog: http://pgsnake.blogspot.com
> Twitter: @pgsnake
>
> EnterpriseDB UK: http://www.enterprisedb.com
> The Enterprise PostgreSQL Company

In response to

Responses

Browse pgadmin-hackers by date

  From Date Subject
Next Message Atle Frenvik Sveen 2018-09-17 19:12:59 Re: Custom layers in PgAdmin IV Mapview
Previous Message Dave Page 2018-09-17 14:05:50 Re: Custom layers in PgAdmin IV Mapview