[GitHub] [camel-website] AemieJ opened a new pull request #378: CAMEL-14904: Nav pane does not show current page

classic Classic list List threaded Threaded
9 messages Options
Reply | Threaded
Open this post in threaded view
|

[GitHub] [camel-website] AemieJ opened a new pull request #378: CAMEL-14904: Nav pane does not show current page

GitBox

AemieJ opened a new pull request #378:
URL: https://github.com/apache/camel-website/pull/378


   ### Issue Observed
   * The Antora default UI highlights and makes sure the nav list item for the current page remains visible.  The Camel components list does not do this, always scrolling to the top when you click on an item.  This makes it very hard to use.
   
   ### Solution Offered
   * As the `panel.scrollTop` has been used to calculate the mid-point for the `current-page-item` on the nav menu panel, I have written code such that when the navigation happens, it find the midpoint distance for that page item in the menu panel, and scrolls to that immediately.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[hidden email]


Reply | Threaded
Open this post in threaded view
|

[GitHub] [camel-website] djencks commented on pull request #378: CAMEL-14904: Nav pane does not show current page

GitBox

djencks commented on pull request #378:
URL: https://github.com/apache/camel-website/pull/378#issuecomment-636364276


   Is this the same technique that the Antora default UI uses?  I think keeping the camel UI as close as possible to the Antora default is extremely important.  Other people may have other ideas.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[hidden email]


Reply | Threaded
Open this post in threaded view
|

[GitHub] [camel-website] AemieJ commented on pull request #378: CAMEL-14904: Nav pane does not show current page

GitBox
In reply to this post by GitBox

AemieJ commented on pull request #378:
URL: https://github.com/apache/camel-website/pull/378#issuecomment-636371689


   @djencks No using the panel.scrollTop calculates the pixels however inspite the similar code on each navigation it doesn't scroll to midpoint. Hence, I just added the function to do the following. It uses the same functions and resolves the issue.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[hidden email]


Reply | Threaded
Open this post in threaded view
|

[GitHub] [camel-website] AemieJ edited a comment on pull request #378: CAMEL-14904: Nav pane does not show current page

GitBox
In reply to this post by GitBox

AemieJ edited a comment on pull request #378:
URL: https://github.com/apache/camel-website/pull/378#issuecomment-636371689


   @djencks the panel.scrollTop calculates the pixels however in spite of the similar code, on each navigation it doesn't scroll to the midpoint. Hence, I just added the function to do the following. It uses the same functions and resolves the issue.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[hidden email]


Reply | Threaded
Open this post in threaded view
|

[GitHub] [camel-website] AemieJ commented on pull request #378: CAMEL-14904: Nav pane does not show current page

GitBox
In reply to this post by GitBox

AemieJ commented on pull request #378:
URL: https://github.com/apache/camel-website/pull/378#issuecomment-638942176


   @zregvart yes, within the scroll to midpoint function, it calculates the midpoint using the parent element similar to the antora ui builder and just using the scrollBy function can be used to use the actual pixel values calculated, if we want to avoid rebasing.
   
   It is the same manner done for the antora docs website. The selected page item moves to the midpoint.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[hidden email]


Reply | Threaded
Open this post in threaded view
|

[GitHub] [camel-website] AemieJ edited a comment on pull request #378: CAMEL-14904: Nav pane does not show current page

GitBox
In reply to this post by GitBox

AemieJ edited a comment on pull request #378:
URL: https://github.com/apache/camel-website/pull/378#issuecomment-638942176


   @zregvart yes, within the scroll to midpoint function, it calculates the midpoint using the parent element similar to the antora ui builder and just using the scrollBy function can be used to use the actual pixel values calculated, if we want to keep the quick lookup from not scrolling, in my opinion.
   
   It is the same manner done for the antora docs website. The selected page item moves to the midpoint.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[hidden email]


Reply | Threaded
Open this post in threaded view
|

[GitHub] [camel-website] zregvart commented on pull request #378: CAMEL-14904: Nav pane does not show current page

GitBox
In reply to this post by GitBox

zregvart commented on pull request #378:
URL: https://github.com/apache/camel-website/pull/378#issuecomment-639744271


   @AemieJ perhaps I wasn't too clear, sorry about that, I think that the `panel` passed into `scrollItemToMidpoint` doesn't need to be the `div` with `data-panel="menu"` it could be the `nav` that we do scroll. That is, make the same change we made in CSS in the JavaScript, we don't scroll that `div`, we scroll the `nav`, keeping the quick search fixed at the top. What I think can be done is to move `data-panel="menu"` to the `nav`, I think that then we might not need any JavaScript changes.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[hidden email]


Reply | Threaded
Open this post in threaded view
|

[GitHub] [camel-website] AemieJ commented on pull request #378: CAMEL-14904: Nav pane does not show current page

GitBox
In reply to this post by GitBox

AemieJ commented on pull request #378:
URL: https://github.com/apache/camel-website/pull/378#issuecomment-640045047


   @zregvart I tried out those changes it works perfectly without any change in javascript, just a change in the handlebar.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[hidden email]


Reply | Threaded
Open this post in threaded view
|

[GitHub] [camel-website] zregvart merged pull request #378: CAMEL-14904: Nav pane does not show current page

GitBox
In reply to this post by GitBox

zregvart merged pull request #378:
URL: https://github.com/apache/camel-website/pull/378


   


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[hidden email]