MediaWiki:Common.js: Perbedaan antara revisi
Tidak ada ringkasan suntingan Tanda: Suntingan perangkat seluler Suntingan peramban seluler |
Tidak ada ringkasan suntingan Tanda: Suntingan perangkat seluler Suntingan peramban seluler |
||
| Baris 165: | Baris 165: | ||
/* 2. Tombol Dengar Artikel - | /* 2. Tombol Dengar Artikel - Ikon Cepat di Samping Titik Tiga */ | ||
$(document).ready(function() { | $(document).ready(function() { | ||
if (mw.config.get('wgIsArticle') && mw.config.get('wgNamespaceNumber') === 0) { | if (mw.config.get('wgIsArticle') && mw.config.get('wgNamespaceNumber') === 0) { | ||
| Baris 171: | Baris 171: | ||
var synth = window.speechSynthesis; | var synth = window.speechSynthesis; | ||
// Fungsi | // Fungsi Suara | ||
function toggleSpeech($ | function toggleSpeech($iconEl) { | ||
if (!isSpeaking) { | if (!isSpeaking) { | ||
var textToSpeak = $('#mw-content-text p').text().substring(0, 2000); | var textToSpeak = $('#mw-content-text p').text().substring(0, 2000); | ||
| Baris 179: | Baris 179: | ||
utterThis.onend = function() { | utterThis.onend = function() { | ||
isSpeaking = false; | isSpeaking = false; | ||
$ | $iconEl.find('span').text('🔊'); | ||
$iconEl.css('background-color', 'transparent'); | |||
}; | }; | ||
synth.speak(utterThis); | synth.speak(utterThis); | ||
isSpeaking = true; | isSpeaking = true; | ||
$ | $iconEl.find('span').text('🛑'); | ||
$iconEl.css('background-color', '#fee7e6'); // Merah muda pas stop | |||
} else { | } else { | ||
synth.cancel(); | synth.cancel(); | ||
isSpeaking = false; | isSpeaking = false; | ||
$ | $iconEl.find('span').text('🔊'); | ||
$iconEl.css('background-color', 'transparent'); | |||
} | } | ||
} | } | ||
// Bikin | // Bikin Ikon Baru | ||
var $btnDengar = $('<a href="javascript:void(0);" id="ca-speak-icon" class="mw-ui-icon mw-ui-icon-element" style="margin-left: 5px; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%;">' + | |||
var | '<span style="font-size: 20px;">🔊</span>' + | ||
'</a>'); | |||
'<span> | |||
'</a | |||
// | function injectIconButton() { | ||
// Kita cari kontainer "Page Actions" (Bahasa, Bintang, Titik Tiga) | |||
var $ | var $actionGroup = $('.page-actions-menu'); | ||
if ($ | |||
$ | if ($actionGroup.length) { | ||
// Tempel di SETELAH (after) kontainer menu utama | |||
$actionGroup.append($btnDengar); | |||
$btnDengar.click(function(e) { | |||
e.preventDefault(); | e.preventDefault(); | ||
toggleSpeech($(this)); | toggleSpeech($(this)); | ||
}); | }); | ||
} else { | } else { | ||
setTimeout(injectIconButton, 500); | |||
setTimeout( | |||
} | } | ||
} | } | ||
injectIconButton(); | |||
} | } | ||
}); | }); | ||