Received: from malur.postgresql.org ([217.196.149.56]) by arkaria.postgresql.org with esmtp (Exim 4.84_2) (envelope-from ) id 1as7yf-0006aY-BM for pgadmin-hackers@arkaria.postgresql.org; Mon, 18 Apr 2016 12:08:29 +0000 Received: from localhost ([127.0.0.1] helo=postgresql.org) by malur.postgresql.org with smtp (Exim 4.84_2) (envelope-from ) id 1as7ye-0002WO-3K for pgadmin-hackers@arkaria.postgresql.org; Mon, 18 Apr 2016 12:08:28 +0000 Received: from magus.postgresql.org ([2a02:c0:301:0:ffff::29]) by malur.postgresql.org with esmtps (TLS1.2:ECDHE_RSA_AES_256_CBC_SHA384:256) (Exim 4.84_2) (envelope-from ) id 1as7yd-0002WH-Bw for pgadmin-hackers@postgresql.org; Mon, 18 Apr 2016 12:08:27 +0000 Received: from mail-ig0-x231.google.com ([2607:f8b0:4001:c05::231]) by magus.postgresql.org with esmtps (TLS1.2:ECDHE_RSA_AES_256_CBC_SHA1:256) (Exim 4.84_2) (envelope-from ) id 1as7yY-0003Hq-AZ for pgadmin-hackers@postgresql.org; Mon, 18 Apr 2016 12:08:26 +0000 Received: by mail-ig0-x231.google.com with SMTP id g8so77657360igr.0 for ; Mon, 18 Apr 2016 05:08:21 -0700 (PDT) DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/relaxed; d=pgadmin-org.20150623.gappssmtp.com; s=20150623; h=mime-version:in-reply-to:references:date:message-id:subject:from:to :cc; bh=LXnO/FNnv12P9koqj1NhpOocH3A737BEGw2oCQFQrWk=; b=Zn5/PNzB9kB3PVhb9am+3ySkubleOCUbKkK+JtFweCeLW0JdwZzq+mbIkLWZ/FXx/S X5y5YaLlhITwX6U9LmcjwbUu8CmK3/othoEzpMmyFtX6VnguEu13F43pZJO1l1xiyymV NASsV4TSNfmDk82KHfThRxpqVqwMyGR/G6GEnIEey8rmKgCPxJaitij4F8NYjOSmg5lL RPhYHgWrv+XfUT+pOpN5szL1e/3G2uCOrBSBS4WUbO+oKEACz4PH+vhgKFS7o3gQzM+0 NzgT+x6SqknMjnI3TIsHZCem06IPdekyFc2DHIDyt2RHVMsExM6CVTKoWjzLwM7iGhil GLJg== X-Google-DKIM-Signature: v=1; a=rsa-sha256; c=relaxed/relaxed; d=1e100.net; s=20130820; h=x-gm-message-state:mime-version:in-reply-to:references:date :message-id:subject:from:to:cc; bh=LXnO/FNnv12P9koqj1NhpOocH3A737BEGw2oCQFQrWk=; b=agK9vknwOu8ppDaGKhO6yMO99LDGzpou1OFJlpw57upyNUUOEp+1Kfp4dD0s/v20Vh kE/JTErVRZ5jRdhcBVXk5pNWT1N/Os4uyIqYZ290exegXUwZCt0Bfx/q4cea5yHrY1Zf pmbOc1f9FOVLgRSZxu3iERLiUaP67JK/8CWqjDZyAmCH/AASxy0mHeEFec2IZO+PgTNU Ked4heFATOD/23qf0t/BhAQwpLA+exBPlHFCC1oTa1SF/jtVloVjrmcTmrX49nyJDaje 3HHsMfvbpOjmxGVFzcTiU2KS4dx8e/u5MfmhlpBd8ENJePEXBEH8ngupqOXEjp+3/HUM zEfg== X-Gm-Message-State: AOPr4FWgr3DIcY8G8ufbNoz2Hax/EIMzK7tn7D8pBUMuuZe3YhLec5mH9L+LQB8QX8RR2jyQcr7UgrsYt8Uc0g== MIME-Version: 1.0 X-Received: by 10.50.59.210 with SMTP id b18mr18785832igr.11.1460981300225; Mon, 18 Apr 2016 05:08:20 -0700 (PDT) Received: by 10.64.105.131 with HTTP; Mon, 18 Apr 2016 05:08:20 -0700 (PDT) In-Reply-To: References: Date: Mon, 18 Apr 2016 13:08:20 +0100 Message-ID: Subject: Re: PATCH: graphical explain From: Dave Page To: Sanket Mehta Cc: pgadmin-hackers Content-Type: multipart/alternative; boundary=047d7bea3bac6c84100530c13733 X-Pg-Spam-Score: -2.6 (--) List-Archive: List-Help: List-ID: List-Owner: List-Post: List-Subscribe: List-Unsubscribe: X-Mailing-List: pgadmin-hackers Precedence: bulk Sender: pgadmin-hackers-owner@postgresql.org --047d7bea3bac6c84100530c13733 Content-Type: text/plain; charset=UTF-8 On Monday, April 18, 2016, Sanket Mehta wrote: > Hi Dave, > > Regarding your second comment, > Almost all the libraries that I have checked uses Jquery UI which is quite > heavy. > Please share your comments about using these libraries. > What have you found? > > > Meanwhile currently I have implemented zoom in/out functionality in > graphical explain. > I have added two buttons on left top corner of panel (see the attached > screen shot), > which you can use to zoom in/out the graph. > > Please do review it and let me know your comments about them. > I have tested the code, so no screenshots necessary :-). The problem with the zoom is that it doesn't give you any visual indicators that there is something on the canvas. With a big plan, it'll just look blank, unless the user starts scrolling/zooming. The viewport will give instant hints to the user that there's a big plan there, albeit out of view, and allow them to very easily navigate it. > > Regards, > Sanket Mehta > Sr Software engineer > Enterprisedb > > On Wed, Apr 13, 2016 at 2:23 PM, Dave Page > wrote: > >> Hi, >> >> A couple of comments following a quick test: >> >> 1) Some of the horizontal lines are not actually horizontal - they >> noticeably drop down. Please see the attached screenshot. >> >> 2) I thought we were going to use a "viewport" to allow the user to >> navigate through the diagram? I was thinking of displaying a thumbnail >> with viewport in the top-left, with the main view being synchronised >> to the viewport position/zoom level - for example, look at the 2D Zoom >> example on http://www.ajax-zoom.com/. Something like Croppie might >> help: http://foliotek.github.io/Croppie/ (as ajax-zoom is not free). >> >> On Tue, Apr 12, 2016 at 11:36 AM, Sanket Mehta >> > > wrote: >> > Hi, >> > >> > Please do ignore previous patch as it contains trailing whitespaces. >> > PFA the revised patch after resolving this issue. >> > >> > >> > >> > Regards, >> > Sanket Mehta >> > Sr Software engineer >> > Enterprisedb >> > >> > On Mon, Apr 11, 2016 at 10:04 PM, Sanket Mehta >> > > > wrote: >> >> >> >> Hi, >> >> >> >> PFA the patch for graphical explain feature. >> >> >> >> It consists of explain.js, __init__.py and demo_explain.html, >> snap_svg.js >> >> and snap_svg-min.js file. >> >> >> >> Currently I have placed hard coded JSON data in demo_explain.html file >> to >> >> display graphical output; which will be replace by actual output user >> get >> >> from server in JSON format. >> >> >> >> Use below URL to access graphical output: >> >> >> >> http://localhost:5050/misc/explain where 5050 is the port your web >> server >> >> is running on >> >> >> >> To test the patch, user can replace plan data (stored in 'data' >> variable) >> >> in demo_explain.html with other valid plan data in JSON format and run >> the >> >> above URL. >> >> >> >> Please review the patch and provide comments for the same. >> >> >> >> TODO: Integration of graphical explain into sql editor >> >> >> >> >> >> Regards, >> >> Sanket Mehta >> >> Sr Software engineer >> >> Enterprisedb >> > >> > >> > >> > >> > -- >> > Sent via pgadmin-hackers mailing list (pgadmin-hackers@postgresql.org >> ) >> > To make changes to your subscription: >> > http://www.postgresql.org/mailpref/pgadmin-hackers >> > >> >> >> >> -- >> 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 --047d7bea3bac6c84100530c13733 Content-Type: text/html; charset=UTF-8 Content-Transfer-Encoding: quoted-printable

On Monday, April 18, 2016, Sanket Mehta <sanket.mehta@enterprisedb.com> wrote:
<= blockquote class=3D"gmail_quote" style=3D"margin:0 0 0 .8ex;border-left:1px= #ccc solid;padding-left:1ex">
Hi Dave,

= Regarding your second comment,=C2=A0
Almost all the libraries tha= t I have checked uses Jquery UI which is quite heavy.
Please shar= e your comments about using these libraries.
<= br>
What have you found?
=C2=A0


Meanwhile= currently I have implemented zoom in/out functionality in graphical explai= n.
I have added two buttons on left top corner of panel (see the = attached screen shot),
which you can use to zoom in/out the graph= .

Please do review it and let me know your comment= s about them.

I have tested the= code, so no screenshots necessary :-).

The proble= m with the zoom is that it doesn't give you any visual indicators that = there is something on the canvas. With a big plan, it'll just look blan= k, unless the user starts scrolling/zooming. The viewport will give instant= hints to the user that there's a big plan there, albeit out of view, a= nd allow them to very easily navigate it.
=C2=A0

=
Regards,
Sanket Mehta
Sr Software engineer
Enterprisedb

On Wed, Apr 13, 2016 at 2:23 PM, Dave Page <= span dir=3D"ltr"><dpage@pgadmin.org> = wrote:
Hi,

A couple of comments following a quick test:

1) Some of the horizontal lines are not actually horizontal - they
noticeably drop down. Please see the attached screenshot.

2) I thought we were going to use a "viewport" to allow the user = to
navigate through the diagram? I was thinking of displaying a thumbnail
with viewport in the top-left, with the main view being synchronised
to the viewport position/zoom level - for example, look at the 2D Zoom
example on http://www.ajax-zoom.com/. Something like Croppie might
help: http://foliotek.github.io/Croppie/ (as ajax-zoom is not = free).

On Tue, Apr 12, 2016 at 11:36 AM, Sanket Mehta
<sanket.mehta@enterprisedb.co= m> wrote:
> Hi,
>
> Please do ignore previous patch as it contains trailing whitespaces. > PFA the revised patch after resolving this issue.
>
>
>
> Regards,
> Sanket Mehta
> Sr Software engineer
> Enterprisedb
>
> On Mon, Apr 11, 2016 at 10:04 PM, Sanket Mehta
> <sanket.mehta@enterprisedb.com= > wrote:
>>
>> Hi,
>>
>> PFA the patch for graphical explain feature.
>>
>> It consists of explain.js, __init__.py and demo_explain.html, snap= _svg.js
>> and snap_svg-min.js file.
>>
>> Currently I have placed hard coded JSON data in demo_explain.html = file to
>> display graphical output; which will be replace by actual output u= ser get
>> from server in JSON format.
>>
>> Use below URL to access graphical output:
>>
>> http://localhost:5050/misc/explain where 5050 is the = port your web server
>> is running on
>>
>> To test the patch, user can replace plan data (stored in 'data= ' variable)
>> in demo_explain.html with other valid plan data in JSON format and= run the
>> above URL.
>>
>> Please review the patch and provide comments for the same.
>>
>> TODO: Integration of graphical explain into sql editor
>>
>>
>> Regards,
>> Sanket Mehta
>> Sr Software engineer
>> Enterprisedb
>
>
>
>
> --
> Sent via pgadmin-hackers mailing list (pgadmin-hackers@postgresql.org)
> To make changes to your subscription:
> http://www.postgresql.org/mailpref/pgadmin-ha= ckers
>



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

--047d7bea3bac6c84100530c13733--