@@ -24,12 +24,12 @@ $(function () {
24
24
var tocMenuElement = tocElement . querySelector ( '.toc__menu' ) ;
25
25
if ( null == tocMenuElement || false == tocMenuElement . hasChildNodes )
26
26
shouldHide = true ;
27
- }
28
- if ( shouldHide ) {
29
- // TOC is autogenerated via 'include toc.html' so its size is not known prior the call of toc.html
30
- // Signal emptiness, css will hide if needed based on it and config settings
31
- // NOTE: Not hiding directly here to behave the same way like the left sidebar does
32
- tocElement . classList . add ( 'empty' ) ;
27
+ if ( shouldHide ) {
28
+ // TOC is autogenerated via 'include toc.html' so its size is not known prior the call of toc.html
29
+ // Signal emptiness, css will hide if needed based on it and config settings
30
+ // NOTE: Not hiding directly here to behave the same way like the left sidebar does
31
+ tocElement . classList . add ( 'empty' ) ;
32
+ }
33
33
}
34
34
}
35
35
@@ -298,7 +298,7 @@ $(function () {
298
298
// Add anchors for headings
299
299
// -------------
300
300
function addPageAnchors ( ) {
301
- // FIXME: This magic 6 must be maintained together now with generate_links.rb (and other places ?!)
301
+ // FIXME: This magic 6 must be maintained together now with generate_links.rb (and other places ?!), eliminate it!
302
302
$ ( '.page__content' ) . find ( 'h1, h2, h3, h4, h5, h6' ) . each ( function ( ) {
303
303
var id = $ ( this ) . attr ( 'id' ) ;
304
304
if ( id ) {
@@ -312,21 +312,37 @@ $(function () {
312
312
} ) ;
313
313
}
314
314
315
- function alterPageForTooltip ( content , fullPageContent ) {
315
+ // To support page links even better if possible in case the page has no description / subtitle, but has some text
316
+ // right after the title and before the first heading is presented, it will be treated as the description and will be handled here.
317
+ // This part should also handle the case when only the title presented. (a.k.a. not showing the tooltip in that case),
318
+ // also responsible to create a uniform look and fell both for page title tooltips and other link tooltips.
319
+ //
320
+ function alterContentForTooltip ( content , url , isFullPageContent ) {
316
321
let tempContainer = document . createElement ( 'div' ) ;
317
322
tempContainer . innerHTML = content ;
318
323
319
- if ( fullPageContent )
320
- hideTocIfNotNeeded ( tempContainer , true ) ;
324
+ hideTocIfNotNeeded ( tempContainer , true ) ;
321
325
322
326
// Remove/Override some default title style formatting to look better in the tooltip
323
- const pageTitle = tempContainer . querySelector ( '#page-title' ) ;
324
- if ( pageTitle )
325
- pageTitle . style . marginTop = '1em' ;
326
-
327
- const pageSubtitle = tempContainer . querySelector ( '#page-subtitle' ) ;
328
- if ( pageSubtitle )
329
- pageSubtitle . style . borderBottom = '0px' ;
327
+ var pageTitle = tempContainer . querySelector ( '#page-title' ) ;
328
+ if ( pageTitle == null ) {
329
+ // If there is no page title, replace the first heading with an item looks and behaves like the page title
330
+ // to have similar result both for page title tooltips and other link item tooltips
331
+ // FIXME: This magic 6 must be maintained together now with generate_links.rb (and other places ?!), eliminate it!
332
+ var firstHeading = tempContainer . querySelector ( "h2, h3, h4, h5, h6" ) ;
333
+ if ( firstHeading ) {
334
+ // Everything bellow must exist, so intentionally there's no error handling, let it rise
335
+ pageTitle = document . querySelector ( '#page-title' ) . cloneNode ( true ) ;
336
+ pageTitle . id = firstHeading . id ;
337
+
338
+ const anchorElement = pageTitle . querySelector ( "a" ) ;
339
+ anchorElement . textContent = firstHeading . textContent ;
340
+ anchorElement . href = url ;
341
+
342
+ tempContainer . replaceChild ( pageTitle , firstHeading ) ;
343
+ }
344
+ }
345
+ pageTitle . style . marginTop = '1em' ;
330
346
331
347
var newContent = tempContainer . innerHTML
332
348
// remove unnecessary, reqursive inner content tooltips
@@ -350,22 +366,37 @@ $(function () {
350
366
newContent => {
351
367
var startHeading = newContent . querySelector ( '#' + startHeadingId ) ;
352
368
if ( startHeading ) {
353
- var content = startHeading . outerHTML ; // Include the starting <h> element itself
369
+ var content = '' ;
370
+ var heading = startHeading . outerHTML ; // Include the starting <h> element itself
354
371
var nextSibling = startHeading . nextElementSibling ;
355
372
356
- // Collect all siblings until the next heading or the end of the document
357
- // FIXME: This magic 6 must be maintained together now with generate_links.rb (and other places ?!)
373
+ // If handling a page title it will not have next sibling normally at all (we are removed and handling differently the description from the generated page)
374
+ // In that case the description is all the normal texts parts in the content, from the top (right bellow the title) to the first heading <h1-6>, try to get, it if there's any.
375
+ // If not presented, drop the whole content, return an empty one (a.k.a. do not show title only tooltips)
376
+ if ( nextSibling == null && false == hasAnchor ) {
377
+ startHeading = newContent . querySelector ( '.page__content' ) ;
378
+ nextSibling = startHeading . firstElementChild ;
379
+ // First element is the TOC, skip it to be able to produce an empty content
380
+ if ( nextSibling && nextSibling . classList . contains ( 'sidebar__right' ) )
381
+ nextSibling = nextSibling . nextElementSibling ;
382
+ }
383
+ // Collect all siblings until the next heading or the end of the initial content
384
+ // FIXME: This magic 6 must be maintained together now with generate_links.rb (and other places ?!), eliminate it!
358
385
while ( nextSibling && nextSibling . tagName !== 'H1' && nextSibling . tagName !== 'H2' && nextSibling . tagName !== 'H3' && nextSibling . tagName !== 'H4' && nextSibling . tagName !== 'H5' && nextSibling . tagName !== 'H6' ) {
359
386
content += nextSibling . outerHTML ;
360
387
nextSibling = nextSibling . nextElementSibling ;
361
388
}
389
+
390
+ if ( content . length != 0 || hasAnchor )
391
+ content = heading + content ;
392
+
362
393
onSuccess ( content ) ;
363
394
}
364
395
else
365
- console . error ( 'Start heading not found by ID: ' + startHeadingId ) ;
396
+ onError ( 'Start heading not found by ID: ' + startHeadingId ) ;
366
397
} ,
367
398
error => {
368
- error ( error ) ;
399
+ onError ( error ) ;
369
400
}
370
401
) ;
371
402
}
@@ -402,10 +433,10 @@ $(function () {
402
433
tooltip . style . setProperty ( posName , newPosition ) ;
403
434
}
404
435
405
- function showTooltip ( event , tooltipText , fullPageContent ) {
436
+ function showTooltip ( event , tooltipText , isFullPageContent ) {
406
437
tooltip . innerHTML = tooltipText . innerHTML ;
407
438
408
- if ( fullPageContent )
439
+ if ( isFullPageContent )
409
440
tooltip . classList . add ( "full-content-tooltip" ) ;
410
441
else
411
442
tooltip . classList . remove ( "full-content-tooltip" ) ;
@@ -470,7 +501,7 @@ $(function () {
470
501
element . appendChild ( tooltipText ) ;
471
502
472
503
element . addEventListener ( 'mouseover' , function ( event ) {
473
- var fullPageContent = element . classList . contains ( 'full-content-tooltip' ) ;
504
+ var isFullPageContent = element . classList . contains ( 'full-content-tooltip' ) ;
474
505
475
506
tooltipTarget = element ;
476
507
@@ -481,26 +512,36 @@ $(function () {
481
512
function onSuccess ( newContent ) {
482
513
if ( typeof ( newContent ) === 'object' && 'innerHTML' in newContent )
483
514
newContent = newContent . innerHTML ;
484
- newContent = alterPageForTooltip ( newContent , fullPageContent ) ;
485
-
486
- // cache for reuse
487
- tooltipText . innerHTML = newContent ;
488
- showTooltip ( event , tooltipText , fullPageContent ) ;
515
+ newContent = alterContentForTooltip ( newContent , url . isFullPageContent ) ;
516
+
517
+ if ( newContent . length > 0 ) {
518
+ // cache for reuse
519
+ tooltipText . innerHTML = newContent ;
520
+ showTooltip ( event , tooltipText , isFullPageContent ) ;
521
+ }
522
+ else {
523
+ // Quick navigation from another link with tooltip to this link would keep alive the previous tooltip
524
+ // force close it, as we don't have tooltip for the current and this is the live hovered one.
525
+ hideTooltip ( false ) ;
526
+ }
489
527
}
490
528
491
529
function onError ( error ) {
530
+ // Quick navigation from another link with tooltip to this failing link would keep alive the previous tooltip
531
+ // force close it, as we don't have tooltip for the current and this is the live hovered one.
532
+ hideTooltip ( false ) ;
492
533
console . error ( 'Error loading the tooltip content!' + error ) ;
493
534
}
494
535
495
- if ( fullPageContent ) {
536
+ if ( isFullPageContent ) {
496
537
loadContentFromUrl ( url , newContent => onSuccess ( newContent ) , error => onError ( error ) ) ;
497
538
}
498
539
else {
499
540
loadContentPartFrom ( url , newContent => onSuccess ( newContent ) , error => onError ( error ) ) ;
500
541
}
501
542
}
502
543
else
503
- showTooltip ( event , tooltipText , fullPageContent ) ;
544
+ showTooltip ( event , tooltipText , isFullPageContent ) ;
504
545
} ) ;
505
546
} ) ;
506
547
0 commit comments