This repository has been archived on 2023-08-16. You can view files and clone it, but cannot push or open issues or pull requests.
footnotes/templates/public/js-reference-container.html

116 lines
5 KiB
HTML
Raw Normal View History

<!--<?php//for docblock, @see MCI_Footnotes_Template::process_template()
/**
* Plain JavaScript reference container start and end without scroll script.
*
* @since 2.5.6
* @type object
* @lastmodified 2021-02-20T0252+0100
*
* - Bugfix: Reference container: optional alternative expanding and collapsing without jQuery for use with hard links, thanks to @hopper87it @pkverma99 issue reports.
*
* @since 2.5.6
*
* @reporter @hopper87it
* @link https://wordpress.org/support/topic/footnotes-wp-rocket/
*
* @reporter @pkverma99
* @link https://wordpress.org/support/topic/footnotes-wp-rocket/#post-14076188
*
* The heavy jQuery Core library from WordPress must not be deferred for
* the jQuery reference container to work, and is detrimental to page speed.
* This alternative works with plain JS but does not support scroll animation.
* The plugin is set to enable hard links when this option is enabled.
*
* - Bugfix: Reference container: apply web semantics to improve readability for assistive technologies, thanks to @derivationfr issue report and code contribution.
*
* @since 2.5.11
*
* @contributor @derivationfr
* @link https://wordpress.org/support/topic/enhance-accesibility-by-using-instead-of/
* @link https://a11y-101.com/development/tables
*
* For assistive technologies to improve accessibility by reading tables in a meaningful manner,
* the tables must be marked up properly using table header elements for header rows and header
* columns as applicable.
* The table caption must also be present for screen readers but may be hidden to sighted users.
*/?>
-->
<div
class="speaker-mute footnotes_reference_container"
>
<div
class="footnote_container_prepare"
><[[element]]
><span
role="button"
tabindex="0"
id="footnotes_container_label_expand_[[post_id]]_[[container_id]]"
class="footnote_reference_container_label pointer"
onclick="footnote_expand_reference_container_[[post_id]]_[[container_id]]();"
onkeydown="footnote_expand_reference_container_[[post_id]]_[[container_id]]();"
s >[[name]]</span
><span
role="button"
tabindex="0"
id="footnotes_container_button_plus_[[post_id]]_[[container_id]]"
class="footnote_reference_container_collapse_button"
style="[[button-style]]"
onclick="footnote_expand_reference_container_[[post_id]]_[[container_id]]();"
onkeydown="footnote_expand_reference_container_[[post_id]]_[[container_id]]();"
>[+]</span
><span
role="button"
tabindex="0"
id="footnotes_container_label_collapse_[[post_id]]_[[container_id]]"
class="footnote_reference_container_label pointer"
style="display: none;"
onclick="footnote_collapse_reference_container_[[post_id]]_[[container_id]]();"
onkeydown="footnote_collapse_reference_container_[[post_id]]_[[container_id]]();"
>[[name]]</span
><span
role="button"
tabindex="0"
id="footnotes_container_button_minus_[[post_id]]_[[container_id]]"
class="footnote_reference_container_collapse_button"
style="display: none;"
onclick="footnote_collapse_reference_container_[[post_id]]_[[container_id]]();"
onkeydown="footnote_collapse_reference_container_[[post_id]]_[[container_id]]();"
>[]</span
></[[element]]
></div
>
<div
id="footnote_references_container_[[post_id]]_[[container_id]]"
style="[[style]]"
><table
class="footnotes_table footnote-reference-container"
><caption
class="accessibility"
>[[caption]]</caption
>
<tbody>
[[content]]
</tbody>
</table>
</div>
</div>
<script type="text/javascript">
function footnote_expand_reference_container_[[post_id]]_[[container_id]]() {
document.getElementById('footnote_references_container_[[post_id]]_[[container_id]]').style.display = "inline";
document.getElementById('footnotes_container_label_expand_[[post_id]]_[[container_id]]').style.display = "none";
document.getElementById('footnotes_container_label_collapse_[[post_id]]_[[container_id]]').style.display = "inline";
document.getElementById('footnotes_container_button_plus_[[post_id]]_[[container_id]]').style.display = "none";
document.getElementById('footnotes_container_button_minus_[[post_id]]_[[container_id]]').style.display = "inline";
}
function footnote_collapse_reference_container_[[post_id]]_[[container_id]]() {
document.getElementById('footnote_references_container_[[post_id]]_[[container_id]]').style.display = "none";
document.getElementById('footnotes_container_label_collapse_[[post_id]]_[[container_id]]').style.display = "none";
document.getElementById('footnotes_container_label_expand_[[post_id]]_[[container_id]]').style.display = "inline";
document.getElementById('footnotes_container_button_minus_[[post_id]]_[[container_id]]').style.display = "none";
document.getElementById('footnotes_container_button_plus_[[post_id]]_[[container_id]]').style.display = "inline";
}
function footnote_moveToAnchor_[[post_id]]_[[container_id]](p_str_TargetID) {
footnote_expand_reference_container_[[post_id]]_[[container_id]]();
}
</script>