Обсуждение: Custom layers in PgAdmin IV Mapview

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
thePreferences)
 

Then again, given that I know both Js, Leaflet, Backbone, and Python/Flask I guess I should contribute the changes
myselfrather then waiting for someone else to do this.
 

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?
2. How do I register a task on https://redmine.postgresql.org/projects/pgadmin4/issues 
3. Is it ok to clone the GitHub mirror and submit a PR there?

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
thatthe PreferencesModule python class is responsible for managing preferences. But where are the default preferences
listed?
2. Does the preferences code currently handle editing a list of elements? I'm thinking that the preferences pane for
maplayers should be something like this.
 


name    | url                                                                                             | 
----------|-----------------------------------------------------------------| ------
streets | https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.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?

Thanks in advance for your answers!

-a


-- 
  Atle Frenvik Sveen
  atle@frenviksveen.net
  45278689
  atlefren.net

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
theprocess 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?
 

-a



-- 
  Atle Frenvik Sveen
  atle@frenviksveen.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@pgadmin.org> wrote:
> 
> > Hi
> >
> > On Thu, Sep 13, 2018 at 2:50 PM, Atle Frenvik Sveen <atle@frenviksveen.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
> >

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@frenviksveen.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@frenviksveen.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@frenviksveen.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@pgadmin.org> wrote:
> > >
> > > > Hi
> > > >
> > > > On Thu, Sep 13, 2018 at 2:50 PM, Atle Frenvik Sveen <
> > atle@frenviksveen.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

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_3646for code), but I still have some questions.
Pleaselet me know if this list isn't the appropriate place.
 

0. Sorry for breaking the build by introducing a new node version

1. The GeometryViewer now uses browser.get_preferences_for_module to get the available layers at initialization. A bit
oftesting suggests that this initialization is perfromed each time the map window is re-opened. Is this correct? Or
shouldI 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,
inthe 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-skillswas 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?
 

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. 
2. The last row of the table is always empty and is used for adding a new row. Does this make sense?`
3. Since several of the fields are large the table looks really cramped (and unreadable). In my view, the empty space
belowthe label could be used, but I am not sure how I can  fix this.
 

Thanks for your replies.

-a

-- 
  Atle Frenvik Sveen
  atle@frenviksveen.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@frenviksveen.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@frenviksveen.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@frenviksveen.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@pgadmin.org> wrote:
> > > >
> > > > > Hi
> > > > >
> > > > > On Thu, Sep 13, 2018 at 2:50 PM, Atle Frenvik Sveen <
> > > atle@frenviksveen.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
>

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@frenviksveen.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
aswell). 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@frenviksveen.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@frenviksveen.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@frenviksveen.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@frenviksveen.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@pgadmin.org>
> > wrote:
> > > > > >
> > > > > > > Hi
> > > > > > >
> > > > > > > On Thu, Sep 13, 2018 at 2:50 PM, Atle Frenvik Sveen <
> > > > > atle@frenviksveen.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

Hi again!

I started digging around in the code used to display the Grid in the table dialogue, this worked a lot better. Now most
thingsworks as expected, although I decided to re-write the Grid-using code rather than re-use the existing code, as
thatseems rather tightly coupled with the table use-case.
 

This implementation fixed the focus-issues (as the change is triggered onBlur, not onChange.

However, I seem to have hit some more css-wizardry-issues:

1. The header isn't exactly pretty
2. I would like to align the down button on the first row with the other down-buttons, but I am not able to use any
customcss? Is there some command I have to run in order to transpile the scss?
 

The issue regarding validation still stands, but I think I have some ideas regarding this.

And, still waiting for feedback on refreshing the preferences in the mapViewer-code.

-a

-- 
  Atle Frenvik Sveen
  atle@frenviksveen.net
  45278689
  atlefren.net

On Mon, Sep 17, 2018, at 16:12, Atle Frenvik Sveen wrote:
> 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@frenviksveen.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@frenviksveen.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@frenviksveen.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@frenviksveen.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@frenviksveen.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@pgadmin.org>
> > > wrote:
> > > > > > >
> > > > > > > > Hi
> > > > > > > >
> > > > > > > > On Thu, Sep 13, 2018 at 2:50 PM, Atle Frenvik Sveen <
> > > > > > atle@frenviksveen.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
>

Thanks for the suggestion! It seems that the style was indeed loaded, it just did not do what I expected it to do :/

But, when using the module/static/css/module.css file-approach, I guess
web\pgadmin\preferences\static\css\preferences.cssis the right path for css related to the preferences-tab then?
 

Or is there anywhere css related to code in  pgadmin4\web\pgadmin\static\js\backform.pgadmin.js should go?

Running make bundle does run yarn webpacker under the covers, doesn't it? I have yarn webpacker:watch running in the
backgroundhere, so that should accomplish the same thing I guess.
 

-a

-- 
  Atle Frenvik Sveen
  atle@frenviksveen.net
  45278689
  atlefren.net

On Tue, Sep 18, 2018, at 10:31, Dave Page wrote:
> On Tue, Sep 18, 2018 at 9:06 AM, Aditya Toshniwal <
> aditya.toshniwal@enterprisedb.com> wrote:
> 
> > Hi,
> >
> > On Tue, Sep 18, 2018 at 1:32 PM Aditya Toshniwal <aditya.toshniwal@
> > enterprisedb.com> wrote:
> >
> >> Hi,
> >>
> >>
> >> On Tue, Sep 18, 2018 at 12:43 AM Atle Frenvik Sveen <
> >> atle@frenviksveen.net> wrote:
> >>
> >>> Hi again!
> >>>
> >>> I started digging around in the code used to display the Grid in the
> >>> table dialogue, this worked a lot better. Now most things works as
> >>> expected, although I decided to re-write the Grid-using code rather than
> >>> re-use the existing code, as that seems rather tightly coupled with the
> >>> table use-case.
> >>>
> >>> This implementation fixed the focus-issues (as the change is triggered
> >>> onBlur, not onChange.
> >>>
> >>> However, I seem to have hit some more css-wizardry-issues:
> >>>
> >>> 1. The header isn't exactly pretty
> >>> 2. I would like to align the down button on the first row with the other
> >>> down-buttons, but I am not able to use any custom css? Is there some
> >>> command I have to run in order to transpile the scss?
> >>>
> >> Where are you putting your CSS classes ? Put your CSS classes in
> > module/static/css/module.css file. If you are using  scss then
> > module/static/scss/_module.scss. Webpacker will pick your code to
> > transpile and bundle.
> >
> 
> Running "make bundle" might also be helpful.
> 
> 
> >
> >>> The issue regarding validation still stands, but I think I have some
> >>> ideas regarding this.
> >>>
> >>> And, still waiting for feedback on refreshing the preferences in the
> >>> mapViewer-code.
> >>>
> >>> -a
> >>>
> >>> --
> >>>   Atle Frenvik Sveen
> >>>   atle@frenviksveen.net
> >>>   45278689
> >>>   atlefren.net
> >>>
> >>> On Mon, Sep 17, 2018, at 16:12, Atle Frenvik Sveen wrote:
> >>> > 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@frenviksveen.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?
> >>> > > >
> >>>
> >> The  browser.get_preferences_for_module functions will give you
> >> preferences from the cache. So it is totally fine if you call this function
> >> every time. The cache is updated on preferences update.
> >>
> >>> > > > 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@frenviksveen.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@frenviksveen.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@frenviksveen.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@frenviksveen.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@pgadmin.org>
> >>> > > > wrote:
> >>> > > > > > > >
> >>> > > > > > > > > Hi
> >>> > > > > > > > >
> >>> > > > > > > > > On Thu, Sep 13, 2018 at 2:50 PM, Atle Frenvik Sveen <
> >>> > > > > > > atle@frenviksveen.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>
> >>> > > > > > > > >> <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
> >>> >
> >>>
> >>
> >>
> >> --
> >> Thanks and Regards,
> >> Aditya Toshniwal
> >> Software Engineer | EnterpriseDB Software Solutions | Pune
> >> "Don't Complain about Heat, Plant a tree"
> >>
> >
> >
> > --
> > Thanks and Regards,
> > Aditya Toshniwal
> > Software Engineer | EnterpriseDB Software Solutions | Pune
> > "Don't Complain about Heat, Plant a tree"
> >
> 
> 
> 
> -- 
> Dave Page
> Blog: http://pgsnake.blogspot.com
> Twitter: @pgsnake
> 
> EnterpriseDB UK: http://www.enterprisedb.com
> The Enterprise PostgreSQL Company

Hello again!

I think I've accomplished this task now, see last screenshot and attached patch.

I hope I did this patch right?
git checkout master 
git fetch upstream
git merge upstream/master
git checkout mapviewer_custom_layers_3646
git merge master
mapviewer_custom_layers_3646
git format-patch master --stdout > RM3645.patch


The OrderedList preferences type seems to work fine, and the layout works okay by my standards. 
- You are able to edit existing entries (but elements that are marked required but not filled in are reverted)
- You are able to add a new entry (but all required elements must be filled before it's saved)
- Elements can be deleted (I was thinking about disallowing the "default" entries, but not sure if this makes sense)
- Elements can be re-ordered (first in list is default)

The maviewer seems to pick up the preferences just fine, and the default preferences are entered as best as I could
(mainlyreplicating the hard-coded layers).
 

Some improvement-points I guess:
- You can add several new elements without filling them in (though they won't be saved)
- No validation of wether the TileUrl is valid (but this is a difficult task, not worth it?)
- Possibly better explaination (but for me, who knows this, it's difficult to improve on)
- I was not able to re-use code everywhere I wanted, so some duplication
- I was not quite sure about code-style, so feel free to comment on that.
- This seemes pretty hard to write sane tests for, so I skipped that part.




-- 
  Atle Frenvik Sveen
  atle@frenviksveen.net
  45278689
  atlefren.net

On Tue, Sep 18, 2018, at 11:03, Aditya Toshniwal wrote:
> Hi,
> 
> On Tue, Sep 18, 2018 at 2:25 PM Atle Frenvik Sveen <atle@frenviksveen.net>
> wrote:
> 
> > Thanks for the suggestion! It seems that the style was indeed loaded, it
> > just did not do what I expected it to do :/
> >
> > But, when using the module/static/css/module.css file-approach, I guess
> > web\pgadmin\preferences\static\css\preferences.css is the right path for
> > css related to the preferences-tab then?
> >
> Specific to preferences, yes.
> 
> >
> > Or is there anywhere css related to code in
> > pgadmin4\web\pgadmin\static\js\backform.pgadmin.js should go?
> >
> If it is related to backform, you can put it in
> pgadmin/static/scss/_backform.overrides.scss.
> 
> >
> > Running make bundle does run yarn webpacker under the covers, doesn't it?
> > I have yarn webpacker:watch running in the background here, so that should
> > accomplish the same thing I guess.
> >
> yarn run webpacker:watch will do.
> 
> >
> > -a
> >
> > --
> >   Atle Frenvik Sveen
> >   atle@frenviksveen.net
> >   45278689
> >   atlefren.net
> >
> > On Tue, Sep 18, 2018, at 10:31, Dave Page wrote:
> > > On Tue, Sep 18, 2018 at 9:06 AM, Aditya Toshniwal <
> > > aditya.toshniwal@enterprisedb.com> wrote:
> > >
> > > > Hi,
> > > >
> > > > On Tue, Sep 18, 2018 at 1:32 PM Aditya Toshniwal <aditya.toshniwal@
> > > > enterprisedb.com> wrote:
> > > >
> > > >> Hi,
> > > >>
> > > >>
> > > >> On Tue, Sep 18, 2018 at 12:43 AM Atle Frenvik Sveen <
> > > >> atle@frenviksveen.net> wrote:
> > > >>
> > > >>> Hi again!
> > > >>>
> > > >>> I started digging around in the code used to display the Grid in the
> > > >>> table dialogue, this worked a lot better. Now most things works as
> > > >>> expected, although I decided to re-write the Grid-using code rather
> > than
> > > >>> re-use the existing code, as that seems rather tightly coupled with
> > the
> > > >>> table use-case.
> > > >>>
> > > >>> This implementation fixed the focus-issues (as the change is
> > triggered
> > > >>> onBlur, not onChange.
> > > >>>
> > > >>> However, I seem to have hit some more css-wizardry-issues:
> > > >>>
> > > >>> 1. The header isn't exactly pretty
> > > >>> 2. I would like to align the down button on the first row with the
> > other
> > > >>> down-buttons, but I am not able to use any custom css? Is there some
> > > >>> command I have to run in order to transpile the scss?
> > > >>>
> > > >> Where are you putting your CSS classes ? Put your CSS classes in
> > > > module/static/css/module.css file. If you are using  scss then
> > > > module/static/scss/_module.scss. Webpacker will pick your code to
> > > > transpile and bundle.
> > > >
> > >
> > > Running "make bundle" might also be helpful.
> > >
> > >
> > > >
> > > >>> The issue regarding validation still stands, but I think I have some
> > > >>> ideas regarding this.
> > > >>>
> > > >>> And, still waiting for feedback on refreshing the preferences in the
> > > >>> mapViewer-code.
> > > >>>
> > > >>> -a
> > > >>>
> > > >>> --
> > > >>>   Atle Frenvik Sveen
> > > >>>   atle@frenviksveen.net
> > > >>>   45278689
> > > >>>   atlefren.net
> > > >>>
> > > >>> On Mon, Sep 17, 2018, at 16:12, Atle Frenvik Sveen wrote:
> > > >>> > 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@frenviksveen.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?
> > > >>> > > >
> > > >>>
> > > >> The  browser.get_preferences_for_module functions will give you
> > > >> preferences from the cache. So it is totally fine if you call this
> > function
> > > >> every time. The cache is updated on preferences update.
> > > >>
> > > >>> > > > 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@frenviksveen.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@frenviksveen.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@frenviksveen.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@frenviksveen.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@pgadmin.org>
> > > >>> > > > wrote:
> > > >>> > > > > > > >
> > > >>> > > > > > > > > Hi
> > > >>> > > > > > > > >
> > > >>> > > > > > > > > On Thu, Sep 13, 2018 at 2:50 PM, Atle Frenvik Sveen <
> > > >>> > > > > > > atle@frenviksveen.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://openstreetmap.org/%7Bz%7D/%7Bx%7D/%7By%7D.png>
> > > >>> <http://tile.openstreetmap.org/%7Bz%7D/%7Bx%7D/%7By%7D.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
> > > >>> >
> > > >>>
> > > >>
> > > >>
> > > >> --
> > > >> Thanks and Regards,
> > > >> Aditya Toshniwal
> > > >> Software Engineer | EnterpriseDB Software Solutions | Pune
> > > >> "Don't Complain about Heat, Plant a tree"
> > > >>
> > > >
> > > >
> > > > --
> > > > Thanks and Regards,
> > > > Aditya Toshniwal
> > > > Software Engineer | EnterpriseDB Software Solutions | Pune
> > > > "Don't Complain about Heat, Plant a tree"
> > > >
> > >
> > >
> > >
> > > --
> > > Dave Page
> > > Blog: http://pgsnake.blogspot.com
> > > Twitter: @pgsnake
> > >
> > > EnterpriseDB UK: http://www.enterprisedb.com
> > > The Enterprise PostgreSQL Company
> >
> 
> 
> -- 
> Thanks and Regards,
> Aditya Toshniwal
> Software Engineer | EnterpriseDB Software Solutions | Pune
> "Don't Complain about Heat, Plant a tree"

On Tue, Sep 18, 2018, at 17:39, Dave Page wrote:
> Hi
> 
> On Tue, Sep 18, 2018 at 11:09 AM, Atle Frenvik Sveen <atle@frenviksveen.net>
> wrote:
> 
> > Hello again!
> >
> > I think I've accomplished this task now, see last screenshot and attached
> > patch.
> >
> > I hope I did this patch right?
> > git checkout master
> > git fetch upstream
> > git merge upstream/master
> > git checkout mapviewer_custom_layers_3646
> > git merge master
> > mapviewer_custom_layers_3646
> > git format-patch master --stdout > RM3645.patch
> >
> 
> Looks right I think - though something got missed as the resulting patch
> doesn't actually apply:
> 
> dpage@hal:*~/git/pgadmin4*$ git apply ~/Downloads/RM3645.patch
> 
> /Users/dpage/Downloads/RM3645.patch:1919: trailing whitespace.
> 
> .fa-clickable {
> 
> /Users/dpage/Downloads/RM3645.patch:1920: trailing whitespace.
> 
>   cursor: pointer;
> 
> /Users/dpage/Downloads/RM3645.patch:2062: trailing whitespace.
> 
> .fa-clickable {
> 
> /Users/dpage/Downloads/RM3645.patch:2063: trailing whitespace.
> 
>   cursor: pointer;
> 
> error: patch failed: web/package.json:69
> 
> error: web/package.json: patch does not apply
> 
> error: patch failed: web/yarn.lock:31
> 
> error: web/yarn.lock: patch does not apply
> 
Oh. I honestly have no idea what happened here, but I'll see what I can do. 


> 
> >
> > The OrderedList preferences type seems to work fine, and the layout works
> > okay by my standards.
> > - You are able to edit existing entries (but elements that are marked
> > required but not filled in are reverted)
> > - You are able to add a new entry (but all required elements must be
> > filled before it's saved)
> > - Elements can be deleted (I was thinking about disallowing the "default"
> > entries, but not sure if this makes sense)
> > - Elements can be re-ordered (first in list is default)
> >
> 
> Couple of fixes we really need for UI consistency:
> 
> - The up/down buttons should be FontAwesome icons, following the same
> formatting as the delete icon.

These buttons are fontawesome, but I guess there are multiple styles? 


> - The Add button should be at the right hand end of the (missing) table
> header, with just the + icon in it (see the Privileges or Security Labels
> tables on the Security tab of the Database properties dialogue for an
> example).
> 
 Got you. I moved it to the left, as the right hand of the table is hidden behind a horizontal scrollbar on smaller
window-sizes.But the app is probably meant to be used in full size? Also had some issues with using the style used for
the"top header" in the other tables. But I'll give it another try! 
 


> >
> > The maviewer seems to pick up the preferences just fine, and the default
> > preferences are entered as best as I could (mainly replicating the
> > hard-coded layers).
> >
> > Some improvement-points I guess:
> > - You can add several new elements without filling them in (though they
> > won't be saved)
> >
> 
> Some of the existing tables allow that, so I don't think that's the end of
> the world.
> 
> 
> > - No validation of wether the TileUrl is valid (but this is a difficult
> > task, not worth it?)
> >
> 
> I think that's fine - but we should have good documentation in
> preferences.rst to help the user get it right.
> 
> 
> > - Possibly better explaination (but for me, who knows this, it's difficult
> > to improve on)
> >
> 
> I'll review and tweak any strings as part of the the review/commit. As long
> as you put something there that I can understand, I can massage the wording.
> 
 Great! 


> > - I was not able to re-use code everywhere I wanted, so some duplication
> >
> 
> To what degree? If it's entire functions, then we should look at factoring
> them out into shared modules somewhere.
> 

I guess i mostly glanced at existing code and borrowed parts. Did not feel comfortable trying to refractor code I did
notcompletely understood. So I guess it's okay. But given my lack of familiarity with the code I'll accept a second
opinionhere. 
 



> > - I was not quite sure about code-style, so feel free to comment on that.
> >
> 
> Nothing stands out as being wrong. The main thing is to make it look like
> the rest of the code, so it doesn't appear out of place. There are also
> some basic notes at
> https://www.pgadmin.org/docs/pgadmin4/dev/coding_standards.html
> 

Ah, the es-comment makes sense. I guess I've violated the practice of declaring all variables at the to of a
function,otherthan that I tried my best to align with existing code. 
 


> > - This seemes pretty hard to write sane tests for, so I skipped that part.
> 
> 
> I agree for the actual maps. However, I would like to see tests for the
> preference storage/retrieval as you've added a new type. Aditya and
> Khushboo can give guidance on how to do that if needed (as well as the
> layout).

So tests for the Python-code? As long as there are tests for the other types I think I can figure that out. If not
you'llhear from me ;) 
 


> Thanks!

Thanks for the comments! 

-a


-- 
  Atle Frenvik Sveen
  atle@frenviksveen.net
  45278689
  atlefren.net