mirror of
https://github.com/twbs/bootstrap.git
synced 2024-12-10 22:24:19 +01:00
121 lines
3.6 KiB
JavaScript
121 lines
3.6 KiB
JavaScript
// NOTICE!! DO NOT USE ANY OF THIS JAVASCRIPT
|
|
// IT'S ALL JUST JUNK FOR OUR DOCS!
|
|
// ++++++++++++++++++++++++++++++++++++++++++
|
|
|
|
/*!
|
|
* JavaScript for Bootstrap's docs (https://getbootstrap.com/)
|
|
* Copyright 2011-2022 The Bootstrap Authors
|
|
* Copyright 2011-2022 Twitter, Inc.
|
|
* Licensed under the Creative Commons Attribution 3.0 Unported License.
|
|
* For details, see https://creativecommons.org/licenses/by/3.0/.
|
|
*/
|
|
|
|
/* global bootstrap: false */
|
|
|
|
(() => {
|
|
'use strict'
|
|
|
|
// Tooltip and popover demos
|
|
// Tooltip and popover demos
|
|
document.querySelectorAll('[data-bs-toggle="tooltip"]')
|
|
.forEach(tooltip => {
|
|
new bootstrap.Tooltip(tooltip)
|
|
})
|
|
|
|
document.querySelectorAll('[data-bs-toggle="popover"]')
|
|
.forEach(popover => {
|
|
new bootstrap.Popover(popover)
|
|
})
|
|
|
|
const toastPlacement = document.getElementById('toastPlacement')
|
|
if (toastPlacement) {
|
|
document.getElementById('selectToastPlacement').addEventListener('change', function () {
|
|
if (!toastPlacement.dataset.originalClass) {
|
|
toastPlacement.dataset.originalClass = toastPlacement.className
|
|
}
|
|
|
|
toastPlacement.className = `${toastPlacement.dataset.originalClass} ${this.value}`
|
|
})
|
|
}
|
|
|
|
document.querySelectorAll('.bd-example .toast')
|
|
.forEach(toastNode => {
|
|
const toast = new bootstrap.Toast(toastNode, {
|
|
autohide: false
|
|
})
|
|
|
|
toast.show()
|
|
})
|
|
|
|
const toastTrigger = document.getElementById('liveToastBtn')
|
|
const toastLiveExample = document.getElementById('liveToast')
|
|
if (toastTrigger) {
|
|
toastTrigger.addEventListener('click', () => {
|
|
const toast = new bootstrap.Toast(toastLiveExample)
|
|
|
|
toast.show()
|
|
})
|
|
}
|
|
|
|
const alertPlaceholder = document.getElementById('liveAlertPlaceholder')
|
|
const alertTrigger = document.getElementById('liveAlertBtn')
|
|
|
|
const appendAlert = (message, type) => {
|
|
const wrapper = document.createElement('div')
|
|
wrapper.innerHTML = [
|
|
`<div class="alert alert-${type} alert-dismissible" role="alert">`,
|
|
` <div>${message}</div>`,
|
|
' <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>',
|
|
'</div>'
|
|
].join('')
|
|
|
|
alertPlaceholder.append(wrapper)
|
|
}
|
|
|
|
if (alertTrigger) {
|
|
alertTrigger.addEventListener('click', () => {
|
|
appendAlert('Nice, you triggered this alert message!', 'success')
|
|
})
|
|
}
|
|
|
|
// Indeterminate checkbox example
|
|
document.querySelectorAll('.bd-example-indeterminate [type="checkbox"]')
|
|
.forEach(checkbox => {
|
|
checkbox.indeterminate = true
|
|
})
|
|
|
|
// Disable empty links in docs examples
|
|
document.querySelectorAll('.bd-content [href="#"]')
|
|
.forEach(link => {
|
|
link.addEventListener('click', event => {
|
|
event.preventDefault()
|
|
})
|
|
})
|
|
|
|
// Modal relatedTarget demo
|
|
const exampleModal = document.getElementById('exampleModal')
|
|
if (exampleModal) {
|
|
exampleModal.addEventListener('show.bs.modal', event => {
|
|
// Button that triggered the modal
|
|
const button = event.relatedTarget
|
|
// Extract info from data-bs-* attributes
|
|
const recipient = button.getAttribute('data-bs-whatever')
|
|
|
|
// Update the modal's content.
|
|
const modalTitle = exampleModal.querySelector('.modal-title')
|
|
const modalBodyInput = exampleModal.querySelector('.modal-body input')
|
|
|
|
modalTitle.textContent = `New message to ${recipient}`
|
|
modalBodyInput.value = recipient
|
|
})
|
|
}
|
|
|
|
// Offcanvas demo
|
|
const myOffcanvas = document.querySelector('.bd-example-offcanvas #offcanvas')
|
|
if (myOffcanvas) {
|
|
myOffcanvas.addEventListener('show.bs.offcanvas', event => {
|
|
event.preventDefault()
|
|
}, false)
|
|
}
|
|
})()
|