Skip to content

Commit

Permalink
release 0.1.3
Browse files Browse the repository at this point in the history 
melhorado localização dos <script>
  • Loading branch information
@medeirosinacio
medeirosinacio committed Nov 19, 2024
1 parent 4ffc696 commit b10282f
Show file tree
Hide file tree
Showing 3 changed files with 164 additions and 162 deletions.
159 changes: 0 additions & 159 deletions _layouts/blog-post.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -93,162 +93,3 @@ <h6 class="text-muted mb-3">
</script>
</div>
</article>

<script>
document.addEventListener('DOMContentLoaded', function () {

// Add style to images based on URL parameters
const images = document.querySelectorAll('.post-content img');
images.forEach(function (img) {
const imgUrl = img.src;
if (imgUrl.includes('/assets/images/posts/')) {
const urlParams = new URLSearchParams(new URL(imgUrl).search);
const classParams = urlParams.get('class');
if (classParams) {
for (const className of classParams.split(' ')) {
img.classList.add(className);
}
}
}
});
// Função para alternar entre abrir e fechar a imagem em tela cheia
images.forEach(function (img) {
img.addEventListener('click', function () {
let fullscreenDiv = document.querySelector('.fullscreen-image-container');

if (fullscreenDiv) {
fullscreenDiv.remove();
enableScroll();
} else {
// Cria a div que vai conter a imagem em tela cheia
fullscreenDiv = document.createElement('div');
fullscreenDiv.classList.add('fullscreen-image-container');
fullscreenDiv.style.position = 'fixed';
fullscreenDiv.style.top = '0';
fullscreenDiv.style.left = '0';
fullscreenDiv.style.width = '100vw';
fullscreenDiv.style.height = '100vh';
fullscreenDiv.style.backgroundColor = 'rgba(0, 0, 0, 0.8)';
fullscreenDiv.style.display = 'flex';
fullscreenDiv.style.justifyContent = 'center';
fullscreenDiv.style.alignItems = 'center';
fullscreenDiv.style.zIndex = '1000';

// Cria a imagem
const fullscreenImg = document.createElement('img');
fullscreenImg.src = img.src;
fullscreenImg.style.maxWidth = '90%';
fullscreenImg.style.maxHeight = '80vh';
fullscreenImg.style.objectFit = 'contain';
fullscreenDiv.appendChild(fullscreenImg);
document.body.appendChild(fullscreenDiv);

disableScroll();

fullscreenDiv.addEventListener('click', function () {
fullscreenDiv.remove();
enableScroll();
});
}
});
});

// Add copy button to code blocks
const codeElements = document.querySelectorAll('.highlighter-rouge');
codeElements.forEach(function (codeElement) {
const newDiv = document.createElement('span');
newDiv.className = 'copy';
newDiv.setAttribute('data-bs-toggle', 'tooltip');
newDiv.setAttribute('title', 'Código copiado!');
newDiv.innerHTML = '<i class="bi bi-copy"></i>';
codeElement.insertAdjacentElement('afterbegin', newDiv);
});

// Initialize code block tooltips
[].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')).map(function (tooltipTriggerEl) {
const tooltip = new bootstrap.Tooltip(tooltipTriggerEl, {
trigger: 'click',
placement: 'top',
animation: true
});
tooltipTriggerEl.addEventListener('shown.bs.tooltip', function () {
setTimeout(function () {
tooltip.hide();
}, 1000);
});
return tooltip;
});

// Script to Copy code block to clipboard from click event in icon
document.querySelectorAll('.copy').forEach(function (codeBlock) {
codeBlock.addEventListener('click', function () {
const code = codeBlock.parentNode.lastElementChild;
const textToCopy = code.textContent || code.innerText;
navigator.clipboard.writeText(textToCopy).then(function () {
console.log('Código copiado com sucesso!');
console.log(textToCopy);
}).catch(function (err) {
console.log(err);
});
});
});

// Customize/add class to blockquote based on type
document.querySelectorAll('blockquote').forEach(blockquote => {
const p = blockquote.querySelector('p');
if (p) {
const text = p.textContent.trim();
const type = text.match(/^\[!(\w+)\]/);
if (type) {
const typeName = type[1].toLowerCase();
p.textContent = text.replace(/^\[!\w+\]/, '').trim();
blockquote.classList.add("blockquote-alert");
blockquote.classList.add("blockquote-" + typeName);
}
}
});
});

// Enable/Disable scroll
// left: 37, up: 38, right: 39, down: 40,
// spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36
var keys = {37: 1, 38: 1, 39: 1, 40: 1};

function preventDefault(e) {
e.preventDefault();
}

function preventDefaultForScrollKeys(e) {
if (keys[e.keyCode]) {
preventDefault(e);
return false;
}
}

// modern Chrome requires { passive: false } when adding event
var supportsPassive = false;
try {
window.addEventListener("test", null, Object.defineProperty({}, 'passive', {
get: function () { supportsPassive = true; }
}));
} catch(e) {}

var wheelOpt = supportsPassive ? { passive: false } : false;
var wheelEvent = 'onwheel' in document.createElement('div') ? 'wheel' : 'mousewheel';

// call this to Disable
function disableScroll() {
window.addEventListener('DOMMouseScroll', preventDefault, false); // older FF
window.addEventListener(wheelEvent, preventDefault, wheelOpt); // modern desktop
window.addEventListener('touchmove', preventDefault, wheelOpt); // mobile
window.addEventListener('keydown', preventDefaultForScrollKeys, false);
}

// call this to Enable
function enableScroll() {
window.removeEventListener('DOMMouseScroll', preventDefault, false);
window.removeEventListener(wheelEvent, preventDefault, wheelOpt);
window.removeEventListener('touchmove', preventDefault, wheelOpt);
window.removeEventListener('keydown', preventDefaultForScrollKeys, false);
}
</script>
4 changes: 2 additions & 2 deletions _layouts/default.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
<main class="flex-shrink-0">{{ content }}</main>
{% include footer.html %}
</div>
<script src="{{ site.srcurl }}{{ site.js_path }}bootstrap/bootstrap.bundle.min.js?v={{ site.time | date: '%Y%m%d%H%M%S' }}"></script>
<script src="{{ site.srcurl }}{{ site.js_path }}bundle.js?v={{ site.time | date: '%Y%m%d%H%M%S' }}"></script>
<script async src="{{ site.srcurl }}{{ site.js_path }}bootstrap/bootstrap.bundle.min.js?v={{ site.time | date: '%Y%m%d%H%M%S' }}"></script>
<script async src="{{ site.srcurl }}{{ site.js_path }}bundle.js?v={{ site.time | date: '%Y%m%d%H%M%S' }}"></script>
</body>
</html>
163 changes: 162 additions & 1 deletion index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@ <h2 style="font-size: 0">Paginação</h2>
<!-- {% include aside.html %}-->
<!-- </div>-->
</div>
<script>
<script type="text/javascript" async>
const button = document.querySelector(".pagination");

const readout = document.querySelector("p");
Expand All @@ -125,3 +125,164 @@ <h2 style="font-size: 0">Paginação</h2>
button.style.setProperty("--y", e.clientY - y);
});
</script>
<script type="text/javascript" async>
document.addEventListener('DOMContentLoaded', function () {

// Add style to images based on URL parameters
const images = document.querySelectorAll('.post-content img');
images.forEach(function (img) {
const imgUrl = img.src;
if (imgUrl.includes('/assets/images/posts/')) {
const urlParams = new URLSearchParams(new URL(imgUrl).search);
const classParams = urlParams.get('class');
if (classParams) {
for (const className of classParams.split(' ')) {
img.classList.add(className);
}
}
}
});
// Função para alternar entre abrir e fechar a imagem em tela cheia
images.forEach(function (img) {
img.addEventListener('click', function () {
let fullscreenDiv = document.querySelector('.fullscreen-image-container');

if (fullscreenDiv) {
fullscreenDiv.remove();
enableScroll();
} else {
// Cria a div que vai conter a imagem em tela cheia
fullscreenDiv = document.createElement('div');
fullscreenDiv.classList.add('fullscreen-image-container');
fullscreenDiv.style.position = 'fixed';
fullscreenDiv.style.top = '0';
fullscreenDiv.style.left = '0';
fullscreenDiv.style.width = '100vw';
fullscreenDiv.style.height = '100vh';
fullscreenDiv.style.backgroundColor = 'rgba(0, 0, 0, 0.8)';
fullscreenDiv.style.display = 'flex';
fullscreenDiv.style.justifyContent = 'center';
fullscreenDiv.style.alignItems = 'center';
fullscreenDiv.style.zIndex = '1000';

// Cria a imagem
const fullscreenImg = document.createElement('img');
fullscreenImg.src = img.src;
fullscreenImg.style.maxWidth = '90%';
fullscreenImg.style.maxHeight = '80vh';
fullscreenImg.style.objectFit = 'contain';
fullscreenDiv.appendChild(fullscreenImg);
document.body.appendChild(fullscreenDiv);

disableScroll();

fullscreenDiv.addEventListener('click', function () {
fullscreenDiv.remove();
enableScroll();
});
}
});
});

// Add copy button to code blocks
const codeElements = document.querySelectorAll('.highlighter-rouge');
codeElements.forEach(function (codeElement) {
const newDiv = document.createElement('span');
newDiv.className = 'copy';
newDiv.setAttribute('data-bs-toggle', 'tooltip');
newDiv.setAttribute('title', 'Código copiado!');
newDiv.innerHTML = '<i class="bi bi-copy"></i>';
codeElement.insertAdjacentElement('afterbegin', newDiv);
});

// Initialize code block tooltips
[].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')).map(function (tooltipTriggerEl) {
const tooltip = new bootstrap.Tooltip(tooltipTriggerEl, {
trigger: 'click',
placement: 'top',
animation: true
});
tooltipTriggerEl.addEventListener('shown.bs.tooltip', function () {
setTimeout(function () {
tooltip.hide();
}, 1000);
});
return tooltip;
});

// Script to Copy code block to clipboard from click event in icon
document.querySelectorAll('.copy').forEach(function (codeBlock) {
codeBlock.addEventListener('click', function () {
const code = codeBlock.parentNode.lastElementChild;
const textToCopy = code.textContent || code.innerText;
navigator.clipboard.writeText(textToCopy).then(function () {
console.log('Código copiado com sucesso!');
console.log(textToCopy);
}).catch(function (err) {
console.log(err);
});
});
});

// Customize/add class to blockquote based on type
document.querySelectorAll('blockquote').forEach(blockquote => {
const p = blockquote.querySelector('p');
if (p) {
const text = p.textContent.trim();
const type = text.match(/^\[!(\w+)\]/);
if (type) {
const typeName = type[1].toLowerCase();
p.textContent = text.replace(/^\[!\w+\]/, '').trim();
blockquote.classList.add("blockquote-alert");
blockquote.classList.add("blockquote-" + typeName);
}
}
});
});

// Enable/Disable scroll
// left: 37, up: 38, right: 39, down: 40,
// spacebar: 32, pageup: 33, pagedown: 34, end: 35, home: 36
var keys = {37: 1, 38: 1, 39: 1, 40: 1};

function preventDefault(e) {
e.preventDefault();
}

function preventDefaultForScrollKeys(e) {
if (keys[e.keyCode]) {
preventDefault(e);
return false;
}
}

// modern Chrome requires { passive: false } when adding event
var supportsPassive = false;
try {
window.addEventListener("test", null, Object.defineProperty({}, 'passive', {
get: function () {
supportsPassive = true;
}
}));
} catch (e) {
}

var wheelOpt = supportsPassive ? {passive: false} : false;
var wheelEvent = 'onwheel' in document.createElement('div') ? 'wheel' : 'mousewheel';

// call this to Disable
function disableScroll() {
window.addEventListener('DOMMouseScroll', preventDefault, false); // older FF
window.addEventListener(wheelEvent, preventDefault, wheelOpt); // modern desktop
window.addEventListener('touchmove', preventDefault, wheelOpt); // mobile
window.addEventListener('keydown', preventDefaultForScrollKeys, false);
}

// call this to Enable
function enableScroll() {
window.removeEventListener('DOMMouseScroll', preventDefault, false);
window.removeEventListener(wheelEvent, preventDefault, wheelOpt);
window.removeEventListener('touchmove', preventDefault, wheelOpt);
window.removeEventListener('keydown', preventDefaultForScrollKeys, false);
}
</script>

0 comments on commit b10282f

Please sign in to comment.