Tooltip on Hover #25
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,116 @@ | ||
| package com.microsoft.azure.toolkit.intellij.azure.sdk.buildtool; | ||
|
|
||
| import com.intellij.codeInspection.LocalQuickFix; | ||
| import com.intellij.codeInspection.ProblemDescriptor; | ||
| import com.intellij.openapi.editor.Editor; | ||
| import com.intellij.openapi.project.Project; | ||
| import com.intellij.openapi.ui.popup.Balloon; | ||
| import com.intellij.openapi.ui.popup.JBPopupFactory; | ||
| import com.intellij.psi.PsiElement; | ||
| import com.intellij.psi.PsiFile; | ||
| import com.intellij.ui.Gray; | ||
| import com.intellij.ui.JBColor; | ||
| import com.intellij.ui.awt.RelativePoint; | ||
| import com.intellij.ui.components.JBPanel; | ||
| import com.intellij.openapi.editor.EditorFactory; | ||
| import org.jetbrains.annotations.NotNull; | ||
|
|
||
| import java.awt.Insets; | ||
|
|
||
| import static com.intellij.ui.ColorUtil.toHex; | ||
|
|
||
| /** | ||
| * This class is used to create a tooltip with a recommendation text and a link to the Azure SDK for Java documentation. | ||
| */ | ||
| class CustomTooltipOnHover implements LocalQuickFix { | ||
|
|
||
| private final String recommendationText; | ||
| private final String linkUrl; | ||
|
|
||
| /** | ||
| * Constructor for CustomTooltipOnHover. | ||
| * | ||
| * @param recommendationText - the recommendation text to be shown in the tooltip | ||
| * @param linkUrl - the URL to be opened when the user clicks on the link in the tooltip | ||
| */ | ||
| CustomTooltipOnHover(String recommendationText, String linkUrl) { | ||
| this.recommendationText = recommendationText; | ||
| this.linkUrl = linkUrl; | ||
| } | ||
|
|
||
| /** | ||
| * This method is used to get the name of the quick fix. | ||
| * | ||
| * @return The name of the quick fix. | ||
| */ | ||
| @Override | ||
| public @NotNull String getName() { | ||
|
Collaborator
There was a problem hiding this comment. Will this be updated in the future to get "the respective quick fix action" lookup?
Owner
Author
There was a problem hiding this comment. this is the "show details" you click on to bring up on the additional info. When I'm working on the action stretch goal I'll find an alternative so the hover popup isn't too busy |
||
| return "Show Details"; | ||
| } | ||
|
|
||
| /** | ||
| * This method is used to get the family name of the quick fix. | ||
| * The family name is used to group similar quick fixes together in the UI. | ||
| * | ||
| * @return The family name of the quick fix. | ||
| */ | ||
| @Override | ||
| public @NotNull String getFamilyName() { | ||
| return getName(); | ||
| } | ||
|
|
||
| /** | ||
| * This method is used to display the tooltip when the user clicks on the "Show Details" link in the tooltip. | ||
| * | ||
| * @param project The project in which the problem was found. | ||
| * @param descriptor The descriptor for the problem that was found. | ||
| */ | ||
| @Override | ||
| public void applyFix(@NotNull Project project, @NotNull ProblemDescriptor descriptor) { | ||
| PsiElement element = descriptor.getPsiElement(); | ||
| showDetailsTooltip(element, project); | ||
| } | ||
|
|
||
| /** | ||
| * This method is used to show a tooltip with the recommendation text and a link to the Azure SDK for Java documentation. | ||
| * | ||
| * @param element - the PsiElement where the tooltip should be shown | ||
| * @param project - the Project object | ||
| */ // separate class for UI configuration & separate styles.css file | ||
| private void showDetailsTooltip(@NotNull PsiElement element, @NotNull Project project) { | ||
|
|
||
| // Define dynamic text color based on theme | ||
| JBColor dynamicTextColor = new JBColor(Gray._50, Gray._176);// Black for light, white for dark theme | ||
|
|
||
| // Combine the recommendation text and the link on the same line | ||
| String htmlContent = "<html><body style='color: " + toHex(dynamicTextColor) + ";'>" + "<div class='tooltip' role='tooltip' aria-live='polite'>" + recommendationText + " <a href='" + linkUrl + "' class='inline-links' aria-label='Refer to Azure SDK for Java documentation for more information on this suggestion.'>" + "Refer to Azure SDK for Java documentation" + "</a> for more information on this suggestion." + "</div></body></html>"; | ||
|
|
||
| // Create a panel for the tooltip | ||
| JBPanel<JBPanel<?>> panel = QuickFixPanelConfigurations.createPanel(htmlContent); | ||
|
|
||
| PsiFile psiFile = element.getContainingFile(); | ||
| Editor editor = EditorFactory.getInstance().getEditors(psiFile.getViewProvider().getDocument(), project)[0]; | ||
|
|
||
| // Get the relative position of the element in the editor | ||
| RelativePoint relativePoint = new RelativePoint(editor.getContentComponent(), editor.visualPositionToXY(editor.getCaretModel().getVisualPosition())); | ||
|
|
||
| // Create a balloon tooltip with custom appearance | ||
| // This is specific to Java Swing/AWT components and IntelliJ's UI toolkit. This configuration is not directly related to CSS | ||
| // thus, it is not possible to directly store this code snippet in the CSS file. | ||
| JBPopupFactory.getInstance().createBalloonBuilder(panel).setFillColor(JBColor.background()) // Dynamic background color | ||
| .setBorderColor(JBColor.border()) // Dynamic border color | ||
| .setHideOnAction(true).setHideOnClickOutside(true).setHideOnFrameResize(true).setHideOnKeyOutside(true).setBorderInsets(new Insets(0, 0, 0, 0)) // Remove padding | ||
| .createBalloon().show(relativePoint, Balloon.Position.above); | ||
| } | ||
|
|
||
| /** | ||
| * This method is used to show a recommendation text with a link to the Azure SDK for Java documentation. | ||
| * | ||
| * @param recommendationText - the recommendation text to be shown in the tooltip | ||
| * @param linkUrl - the URL to be opened when the user clicks on the link in the tooltip | ||
| * @return CustomTooltipOnHover object | ||
| */ | ||
| static CustomTooltipOnHover showRecommendationText(String recommendationText, String linkUrl) { | ||
| return new CustomTooltipOnHover(recommendationText, linkUrl); | ||
| } | ||
| } | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,80 @@ | ||
| package com.microsoft.azure.toolkit.intellij.azure.sdk.buildtool; | ||
|
|
||
| import com.intellij.ide.BrowserUtil; | ||
| import com.intellij.ui.JBColor; | ||
| import com.intellij.ui.components.JBPanel; | ||
| import com.intellij.util.ui.JBUI; | ||
|
|
||
| import javax.swing.JEditorPane; | ||
| import javax.swing.event.HyperlinkEvent; | ||
| import javax.swing.text.html.HTMLEditorKit; | ||
| import javax.swing.text.html.StyleSheet; | ||
| import java.awt.BorderLayout; | ||
| import java.io.FileNotFoundException; | ||
| import java.io.IOException; | ||
| import java.io.InputStream; | ||
| import java.util.logging.Logger; | ||
|
|
||
| /** | ||
| * This class is used to create a panel with a specific HTML content. | ||
| * The HTML content is styled using the styles.css file. | ||
| * One of the uses of this class is to create a tooltip with a recommendation text and a link to the Azure SDK for Java documentation. | ||
| */ | ||
| class QuickFixPanelConfigurations { | ||
|
Collaborator
There was a problem hiding this comment. Should this be renamed inline with the CustomHoverTip. |
||
|
|
||
| private static final Logger LOGGER = Logger.getLogger(QuickFixPanelConfigurations.class.getName()); | ||
|
|
||
| /** | ||
| * This method is used to create a panel with a specific HTML content. | ||
| * The HTML content is styled using the styles.css file. | ||
| * | ||
| * @param htmlContent - the HTML content to be shown in the panel | ||
| * @return A panel with the specified HTML content | ||
| */ | ||
| public static JBPanel<JBPanel<?>> createPanel(String htmlContent) { | ||
| // Create a panel for the tooltip | ||
| JBPanel<JBPanel<?>> panel = new JBPanel<>(); | ||
| panel.setBorder(JBUI.Borders.empty(5)); // Add padding | ||
|
|
||
| // Create a JEditorPane for both the recommendation text and the link | ||
| JEditorPane editorPane = new JEditorPane(); | ||
| HTMLEditorKit editorKit = new HTMLEditorKit(); | ||
| editorPane.setEditorKit(editorKit); | ||
| StyleSheet styleSheet = editorKit.getStyleSheet(); | ||
|
|
||
| // Load the CSS from the styles.css file | ||
| try (InputStream cssStream = QuickFixPanelConfigurations.class.getResourceAsStream("/META-INF/styles/styles.css")) { | ||
|
|
||
| // Check if the CSS file is found | ||
| if (cssStream == null) { | ||
| throw new FileNotFoundException("CSS file not found."); | ||
| } | ||
| // Read the CSS file | ||
| String css = new String(cssStream.readAllBytes()); | ||
| styleSheet.addRule(css); | ||
| } catch (IOException e) { | ||
| LOGGER.warning("Failed to load CSS file: " + e); | ||
| } | ||
|
|
||
| // Apply a font stack that's likely to match IntelliJ's appearance | ||
| editorPane.setContentType("text/html"); | ||
|
|
||
| // Set the HTML content to the editorPane | ||
| editorPane.setText(htmlContent); | ||
| editorPane.setEditable(false); | ||
| editorPane.setBackground(panel.getBackground()); | ||
| editorPane.setForeground(JBColor.LIGHT_GRAY); | ||
|
Collaborator
There was a problem hiding this comment. could you add comments to where we made acccessibility improvements. |
||
|
|
||
| // Add hyperlink listener | ||
| editorPane.addHyperlinkListener(e -> { | ||
| if (e.getEventType() == HyperlinkEvent.EventType.ACTIVATED) { | ||
| BrowserUtil.browse(e.getURL()); | ||
| } | ||
| }); | ||
|
|
||
| // Add the linkLabel to the panel | ||
| panel.add(editorPane, BorderLayout.CENTER); | ||
|
|
||
| return panel; | ||
| } | ||
| } | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
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.
these strings are the exact same, including number of spaces so I'm not sure how it's in the diff
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.
figured out it comes from the line break so its not problematic