Skip to content
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

Fixes #24419: Persistant tooltip on info icon in methods #5514

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -589,7 +589,7 @@ update msg model =
ui = model.methodsUI
newDocs = if List.member methodId ui.docsOpen then ui.docsOpen else methodId :: ui.docsOpen
in
( { model | methodsUI = { ui | docsOpen = newDocs }, genericMethodsOpen = True } , scrollMethod ((not model.genericMethodsOpen) , methodId.value))
( { model | methodsUI = { ui | docsOpen = newDocs }, genericMethodsOpen = True } , Cmd.batch [clearTooltips "", scrollMethod ((not model.genericMethodsOpen) , methodId.value)])

AddMethod method newId ->
if model.hasWriteRights then
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -342,23 +342,25 @@ blockBody : Model -> Maybe CallId -> MethodBlock -> MethodBlockUiInfo -> Techniq
blockBody model parentId block ui techniqueUi =
let
(textClass, tooltipContent) = case ui.validation of
InvalidState _ -> ("text-danger", "This block is invalid")
InvalidState _ -> ("text-danger", "<div class='tooltip-inner-content'>This block is invalid</div>")
Unchanged -> ("","")
ValidState -> ("text-primary","This method was modified")
ValidState -> ("text-primary","<div class='tooltip-inner-content'>This method was modified</div>")
dragElem = element "div"
|> addClass "cursorMove"
|> Dom.appendChild
( element "i"
|> addClass "popover-bs fa"
|> addClass "fa"
|> addClassConditional "fa-cubes" (ui.mode == Closed)
|> addClassConditional "fa-check" (ui.mode == Opened)
|> addClass textClass
|> addStyleConditional ("font-style", "20px") (ui.mode == Opened)
|> addAttributeList
[ type_ "button", attribute "data-bs-content" ((if (ui.mode == Opened) then "Close details<br/>" else "") ++ tooltipContent) , attribute "data-bs-toggle" "popover"
, attribute "data-bs-trigger" "hover", attribute "data-bs-container" "body", attribute "data-bs-placement" "auto"
, attribute "data-bs-html" "true"
]
[ type_ "button"
, attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "top"
, attribute "data-bs-html" "true"
, title tooltipContent
]
)
|> addAction ("click", UIBlockAction block.id {ui | mode = if(ui.mode == Opened) then Closed else Opened})

Expand All @@ -367,29 +369,26 @@ blockBody model parentId block ui techniqueUi =
|> addClass "text-success method-action"
|> addActionStopPropagation ("click", GenerateId (\s -> CloneElem (Block parentId block) (CallId s)))
|> addAttributeList
[ type_ "button", title "Clone this block", attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "left"

[ type_ "button"
, title "Clone this block"
]
|> appendChild cloneIcon
resetIcon = element "i" |> addClass "fa fa-rotate-right"
resetButton = element "button"
|> addClass "method-action"
|> addActionStopPropagation ("click", ResetMethodCall (Block parentId block))
|> addAttributeList
[ type_ "button", title "Reset this block", attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "left"

[ type_ "button"
, title "Reset this block"
]
|> appendChild resetIcon
removeIcon = element "i" |> addClass "fa fa-times-circle"
removeButton = element "button"
|> addClass "text-danger method-action"
|> addActionStopPropagation ("click", RemoveMethod block.id)
|> addAttributeList
[ type_ "button", title "Remove this block", attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "left"

[ type_ "button"
, title "Remove this block"
]
|> appendChild removeIcon
condition = element "div"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -405,7 +405,7 @@ callBody model ui techniqueUi call pid =
Just m -> m
Nothing -> Method call.methodName call.methodName.value "" "" (Maybe.withDefault (ParameterId "") (Maybe.map .id (List.head call.parameters))) [] [] Nothing Nothing Nothing

deprecatedClass = "fa fa-info-circle method-action text-info popover-bs" ++
deprecatedClass = "fa fa-info-circle method-action text-info" ++
case method.deprecated of
Just _ -> " deprecated-icon"
Nothing -> ""
Expand All @@ -425,57 +425,49 @@ callBody model ui techniqueUi call pid =

|> Dom.appendChild
( element "i"
|> addClass "popover-bs fas"
|> addClass "fa"
|> addClassConditional "fa-cog" (ui.mode == Closed && not isHovered)
|> addClassConditional "fa-edit" isHovered
|> addClassConditional "fa-check" (ui.mode == Opened)
|> addClass textClass
|> addStyleConditional ("font-style", "20px") (ui.mode == Opened)
|> addAttributeList
[ type_ "button", attribute "data-bs-content" ((if (ui.mode == Opened) then "Close method details<br/>" else "") ++ tooltipContent) , attribute "data-bs-toggle" "popover"
, attribute "data-bs-trigger" "hover", attribute "data-bs-container" "body", attribute "data-bs-placement" "auto"
, attribute "data-bs-html" "true"
]
|> addAttribute (type_ "button")
)
|> addAction ("click", UIMethodAction call.id {ui | mode = if(ui.mode == Opened) then Closed else Opened})
cloneIcon = element "i" |> addClass "fa fa-clone"
cloneButton = element "button"
|> addClass "text-success method-action popover-bs"
|> addClass "text-success method-action"
|> addActionStopAndPrevent ("click", GenerateId (\s -> CloneElem (Call pid call) (CallId s)))
|> addAttributeList
[ type_ "button", attribute "data-bs-content" "Clone this method", attribute "data-bs-toggle" "popover"
, attribute "data-bs-trigger" "hover", attribute "data-bs-container" "body", attribute "data-bs-placement" "auto"
, attribute "data-bs-html" "true"
[ type_ "button"
, title "Clone this method"
]
|> appendChild cloneIcon
removeIcon = element "i" |> addClass "fa fa-times-circle"
removeButton = element "button"
|> addClass "text-danger method-action popover-bs"
|> addClass "text-danger method-action"
|> addActionStopAndPrevent ("click", RemoveMethod call.id)
|> addAttributeList
[ type_ "button", attribute "data-bs-content" "Remove this method", attribute "data-bs-toggle" "popover"
, attribute "data-bs-trigger" "hover", attribute "data-bs-container" "body", attribute "data-bs-placement" "auto"
, attribute "data-bs-html" "true"
[ type_ "button"
, title "Remove this method"
]
|> appendChild removeIcon
resetIcon = element "i" |> addClass "fa fa-rotate-right"
resetButton = element "button"
|> addClass "method-action popover-bs"
|> addClass "method-action"
|> addActionStopAndPrevent ("click", ResetMethodCall (Call pid call))
|> addAttributeList
[ type_ "button", attribute "data-bs-content" "Reset this method", attribute "data-bs-toggle" "popover"
, attribute "data-bs-trigger" "hover", attribute "data-bs-container" "body", attribute "data-bs-placement" "auto"
, attribute "data-bs-html" "true"
[ type_ "button"
, title "Reset this method"
]
|> appendChild resetIcon
docIcon = element "i" |> addClass "fa fa-book"
docButton = element "button"
|> addClass "text-info method-action popover-bs"
|> addClass "text-info method-action"
|> addActionStopAndPrevent ("click", ShowDoc call.methodName)
|> addAttributeList
[ type_ "button", attribute "data-bs-content" "Show documentation", attribute "data-bs-toggle" "popover"
, attribute "data-bs-trigger" "hover", attribute "data-bs-container" "body", attribute "data-bs-placement" "auto"
, attribute "data-bs-html" "true"
[ type_ "button"
, title "Show documentation"
]
|> appendChild docIcon
{--
Expand Down Expand Up @@ -667,9 +659,10 @@ callBody model ui techniqueUi call pid =
)
, element "span" |> addAttributeList
[ class deprecatedClass
, attribute "data-bs-toggle" "popover", attribute "data-bs-trigger" "hover", attribute "data-bs-container" "body"
, attribute "data-bs-placement" "auto", attribute "data-bs-content" (getTooltipContent method)
, attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "top"
, attribute "data-bs-html" "true"
, title (getTooltipContent method)
]
]
)
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,8 @@ import String.Extra
import Dom exposing (..)
import Dom.DragDrop as DragDrop

import Compliance.Utils exposing (buildTooltipContent)

import Editor.DataTypes exposing (..)


Expand All @@ -29,7 +31,7 @@ getTooltipContent method =
Nothing -> ""
Just m -> "<div class='deprecated-info'><div>This generic method is <b>deprecated</b>.</div> <div class='deprecated-message'><b>↳</b>"++ htmlEscape m ++"</div></div>"
in
"<div>Method '<b style=\"color:#444;\">"++ htmlEscape method.name ++"</b>'.<br/>" ++ description ++ deprecation ++ "</div>"
buildTooltipContent ("Method '<b>"++ htmlEscape method.name ++"</b>'") (description ++ deprecation)

htmlEscape : String -> String
htmlEscape s =
Expand Down Expand Up @@ -183,12 +185,13 @@ showCategory category allDeprecated =
a [ onClick (ScrollCategory category) ]
( text category ::
if (allDeprecated) then
[ span [ class "cursor-help popover-bs", attribute "data-bs-toggle" "popover"
, attribute "data-bs-trigger" "hover", attribute "data-bs-container" "body"
, attribute "data-bs-placement" "bottom", attribute "data-title" category
, attribute "data-bs-content" "<div>All generic methods in this category are <b>deprecated</b>.</div>"
, attribute "data-bs-html" "true"
] [ i [ class "fa fa-info-circle deprecated-icon" ] []]
[ span
[ class "cursor-help"
, attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "top"
, attribute "data-bs-html" "true"
, title "<div>All generic methods in this category are <b>deprecated</b>.</div>"
] [ i [ class "fa fa-info-circle deprecated-icon" ] []]
]
else []
)
Expand Down Expand Up @@ -227,11 +230,11 @@ showMethod ui method mode dnd =
|> appendChild
( element "i"
|> addAttributeList
[ class "fa fa-info-circle tooltip-icon deprecated-icon popover-bs"
, attribute "data-bs-toggle" "popover", attribute "data-bs-trigger" "hover"
, attribute "data-bs-container" "body", attribute "data-bs-placement" "top"
, attribute "data-title" method.name, attribute "data-bs-content" (getTooltipContent method)
[ class "fa fa-info-circle tooltip-icon deprecated-icon"
, attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "top"
, attribute "data-bs-html" "true"
, title ((getTooltipContent method))
]
)
) (Maybe.Extra.isJust method.deprecated )
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -171,10 +171,12 @@ draftsItem model draft =
, span [class "treeGroupName"]
[ text (if String.isEmpty draft.technique.name then "<unamed draft>" else draft.technique.name) ]
, if hasDeprecatedMethod then
span [ class "cursor-help popover-bs", attribute "data-bs-toggle" "popover", attribute "data-bs-trigger" "hover"
, attribute "data-bs-container" "body", attribute "data-bs-placement" "right", attribute "data-title" draft.technique.name
, attribute "data-bs-content" "<div>This technique uses <b>deprecated</b> generic methods.</div>"
, attribute "data-bs-html" "true" ] [ i [ class "fa fa-info-circle deprecated-icon" ] [] ]
span [ class "cursor-help"
, attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "top"
, attribute "data-bs-html" "true"
, title "<div>This technique uses <b>deprecated</b> generic methods.</div>"
] [ i [ class "fa fa-info-circle deprecated-icon" ] [] ]
else
text ""
]
Expand Down Expand Up @@ -214,17 +216,23 @@ techniqueItem model technique =
span [class "badge" ] [ text "draft" ]
else text ""
, if hasDeprecatedMethod then
span [ class "cursor-help popover-bs", attribute "data-bs-toggle" "popover", attribute "data-bs-trigger" "hover"
, attribute "data-bs-container" "body", attribute "data-bs-placement" "right", attribute "data-title" technique.name
, attribute "data-bs-content" "<div>This technique uses <b>deprecated</b> generic methods.</div>"
, attribute "data-bs-html" "true" ] [ i [ class "fa fa-info-circle deprecated-icon" ] [] ]
span
[ class "cursor-help"
, attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "top"
, attribute "data-bs-html" "true"
, title "<div>This technique uses <b>deprecated</b> generic methods.</div>"
] [ i [ class "fa fa-info-circle deprecated-icon" ] [] ]
else
text ""
, if hasUnknownMethod then
span [ class "cursor-help popover-bs", attribute "data-bs-toggle" "popover", attribute "data-bs-trigger" "hover"
, attribute "data-bs-container" "body", attribute "data-bs-placement" "right", attribute "data-title" technique.name
, attribute "data-bs-content" ("<div>This technique uses <b>unknown</b> generic methods: " ++ (String.join ", " (List.map (\m -> m.methodName.value) (List.Extra.unique unknownMethods))) ++ ".</br>These methods do not exist in the library, you must provide them or it will break at run time</div>")
, attribute "data-bs-html" "true" ] [ i [ class "fa fa-warning text-warning-rudder min-size-icon unknown-gm-icon" ] [] ]
span
[ class "cursor-help"
, attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "top"
, attribute "data-bs-html" "true"
, title ("<div>This technique uses <b>unknown</b> generic methods: " ++ (String.join ", " (List.map (\m -> m.methodName.value) (List.Extra.unique unknownMethods))) ++ ".</br>These methods do not exist in the library, you must provide them or it will break at run time</div>")
] [ i [ class "fa fa-warning text-warning-rudder min-size-icon unknown-gm-icon" ] [] ]
else
text ""
]
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -91,11 +91,11 @@ techniqueParameter model technique param opened =
(TechniqueParameterModified param.id {param | mayBeEmpty = not c, constraints = newConstraint }))][]
, span [][text " Required "]
, span
[ class "cursor-help popover-bs", attribute "data-toggle" "popover"
, attribute "data-bs-trigger" "hover", attribute "data-container" "body"
, attribute "data-placement" "bottom"
, attribute "data-content" beEmptyTitle
, attribute "data-html" "true"
[ class "cursor-help"
, attribute "data-bs-toggle" "tooltip"
, attribute "data-bs-placement" "top"
, attribute "data-bs-html" "true"
, title beEmptyTitle
] [ i [ class "text-info fa fa-question-circle" ] []]
]
]
Expand Down Expand Up @@ -253,7 +253,7 @@ techniqueTab model technique creation ui =
, div [ class "row form-group" ] [
label [ for "techniqueDocumentation", class "col-xs-12 control-label" ] [
span [ class "text-fit" ] [ text "Documentation" ]
, img [ class "markdown-icon tooltip-icon popover-bs", src ( model.contextPath ++ "/images/markdown-mark-solid.svg" ) ] []
, img [ class "markdown-icon tooltip-icon", src ( model.contextPath ++ "/images/markdown-mark-solid.svg" ) ] []
]
, div [ class "col-sm-8" ] [
textarea [ readonly (not model.hasWriteRights), name "documentation", class "form-control technique-description", id "techniqueDocumentation", rows 4, value technique.documentation, placeholder "Documentation"
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -821,14 +821,6 @@ function initBsTooltips(){
}
function removeBsTooltips(){
document.querySelectorAll(".tooltip").forEach(e => e.remove());
document.querySelectorAll(".popover").forEach(e => e.remove());
}
function initBsPopovers(){
const popoverTriggerList = document.querySelectorAll('[data-bs-toggle="popover"]');
var options = {
delay : { "show": 400, "hide": 100 },
};
const popoverList = [...popoverTriggerList].map(popoverTriggerEl => new bootstrap.Popover(popoverTriggerEl, options))
}
function initBsModal(modalName){
var selector = document.querySelector('#' + modalName);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -522,7 +522,6 @@ label.text-fit{
.tooltip > .tooltip-inner {
background-color: #fff;
padding: 0px !important;
padding-bottom: 8px !important;
text-align: left !important;
width: 360px;
max-width: 360px;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -1602,7 +1602,7 @@ ul li.hide-method {
height: 25px;
z-index:10;
position: absolute;
right: 135px;
right: 180px;
}


Expand Down
Loading