-
-
Notifications
You must be signed in to change notification settings - Fork 4
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(button): add button implementation #29
Conversation
Okay this fix works and seems almost too-simple. Let me know if there is a reason why it shouldn't be done this way. I tested it with up to 10 buttons and the layout works. It also adjusts with the re-sizing of the window. What I couldn't figure out was how to have the buttons anywhere other than the top-left. It's not that important, now that the buttons are working. (thanks so much for getting the buttons working, this is awesome!). button.setAttribute('style', 'display:inline-block;'); r3dmol() %>%
m_add_model(data = pdb_1j72, format = "pdb") %>%
m_zoom_to() %>%
m_button(
name = "cartoon",
label = "Cartoon",
func = "
function(){
viewer.setStyle({cartoon:{}});
viewer.render();
}
"
) %>%
m_button(
name = "stick",
label = "Stick",
func = "
function(){
viewer.setStyle({stick:{}});
viewer.render();
}
"
) I also don't know why the checks are failing - the |
Thanks! Using inline-block it's a good idea for automatic layout.
Maybe it could be done by adding
In my experience, some CRAN dependencies may not be immediately available in Github Action if they have been recently updated. Or something cause it failed. You could re-run all action job by click the re-run button in action tab. |
Not good enough, but now the buttons are able to align in top, center, bottom on the left. I want to use You could edit this PR for more friendly for user. r3dmol() %>%
m_add_model(data = pdb_1j72, format = "pdb") %>%
m_zoom_to() %>%
m_button(
name = "cartoon",
label = "Cartoon",
style = "flex-end",
func = "
function(){
viewer.setStyle({cartoon:{}});
viewer.render();
}
"
) %>%
m_button(
name = "stick",
label = "Stick",
func = "
function(){
viewer.setStyle({stick:{}});
viewer.render();
}
"
)
Some useful references: |
@BradyAJohnston I figure out how to fix the layout problem, please wait a moment. |
Now your are able to layout all the button by css style. Ready for review. r3dmol() %>%
m_add_model(data = pdb_1j72, format = "pdb") %>%
m_zoom_to() %>%
m_button(
name = "cartoon",
label = "Cartoon",
align_items = "flex-end",
justify_content = "center",
func = "
function(){
viewer.setStyle({cartoon:{}});
viewer.render();
}
"
) %>%
m_button(
name = "stick",
label = "Stick",
func = "
function(){
viewer.setStyle({stick:{}});
viewer.render();
}
"
) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
All looks really good! Thanks for putting so much effort into this and getting it working so well.
I've got some ideas about default buttons etc that I will play around with and might put together a new PR soon.
Close #23 .
A draft implementation of add button to the view.
Initiation
After Click the
Cartoon
ButtonThere is only one problem about this feature.
If you add multiple buttons in the view, the css style of the button position needs to be automatically adjusted according to the number of button, or expose the position argments to the user.
r3dmol/inst/htmlwidgets/r3dmol.js
Line 191 in ed45b5e
@BradyAJohnston Could you mind helping to finish this implement?