
/* Reset e Estilos Globais */
body {
background: linear-gradient(to bottom, #1a1a1a, #000000);
color: #ffffff;
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}
.post-thumbnail {
display: block;
margin-left: auto;
margin-right: auto;
text-align: center;
}
/* Tipografia */
h1 {
text-align: center;
font-size: 32px;
margin-top: 20px;
}
h2 {
text-align: left;
margin-top: 20px;
margin-left: 60px;
color: green;
}
a {
text-decoration: none;
color: lightgreen;
}
a:hover {
color: #90EE90;
}
/* Container da Tabela */
.table-container {
width: 98%;
margin: 0px 3px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
margin-top: 1px; /* Espaçamento aumentado após o botão */
background: linear-gradient(to right, #282828 30%, rgba(40, 40, 40, 0)),
linear-gradient(to left, #282828 30%, rgba(40, 40, 40, 0)) 100% 0;
background-size: 50px 100%, 50px 100%;
background-repeat: no-repeat;
background-attachment: local, local;
}
/* Estilos da Tabela */
table {
background-color: #282828;
box-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
border-collapse: collapse;
width: 100%;
white-space: nowrap;
visibility: visible;
opacity: 1;
will-change: transform;
transform: translateZ(0);
}
table th,
table td {
padding: 15px 5px;
text-align: center;
border-bottom: 1px solid #4a4a4a;
min-width: 40px;
transition: all 0s ease;
}
table th {
background-color: #1a1a1a;
color: #ffffff;
position: sticky;
top: 0;
z-index: 10;
}
tbody tr {
backface-visibility: hidden;
}
tbody tr:nth-child(even) {
background-color: #333333;
}
tbody tr:hover {
background-color: #4a4a4a;
}
/* Formulário de Pesquisa */
#search-form {
background-color: #282828;
border-radius: 10px;
box-shadow: 0 0 20px rgba(255, 255, 255, 0.1);
padding: 20px;
margin: 20px auto;
width: 80%;
max-width: 620px;
}
form label {
display: block;
margin-bottom: 5px;
}
form input[type=”text”],
form input[type=”number”],
form select {
width: 100%;
padding: 10px;
margin-bottom: 20px;
background-color: #1a1a1a;
color: #ffffff;
border: none;
border-bottom: 2px solid #4a90e2;
border-radius: 5px;
font-size: 16px;
}
form input[type=”submit”],
form input[type=”button”] {
background-color: #4a90e2;
color: #ffffff;
border: none;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
border-radius: 5px;
transition: background-color 0s;
}
form input[type=”submit”]:hover,
form input[type=”button”]:hover {
background-color: #357abd;
}
/* Paginação Responsiva */
.pagination {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap; /* Permite que os botões quebrem linha */
gap: 5px; /* Espaçamento uniforme entre os elementos */
margin: 20px 0;
padding: 10px;
background-color: #282828;
border-radius: 8px;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
max-width: 100%; /* Garante que não ultrapasse a largura da tela */
overflow: hidden; /* Previne overflow horizontal */
}
.page-numbers {
display: flex;
align-items: center;
flex-wrap: wrap; /* Permite que os números quebrem linha */
gap: 5px;
margin: 0 5px;
}
.pagination button {
background-color: #4a90e2;
color: #ffffff;
border: none;
padding: 8px 12px;
margin: 2px;
cursor: pointer;
border-radius: 4px;
transition: all 0s ease;
min-width: 35px;
font-size: 14px;
white-space: nowrap; /* Previne quebra do texto dentro do botão */
}
.pagination button.active {
background-color: #0D47A1 !important; /* Azul mais escuro */
color: #ffffff;
box-shadow: 0 2px 5px rgba(0,0,0,0.3);
transform: scale(1.15); /* Leve ampliação */
transition: all 0.2s ease;
}
.pagination button:hover {
background-color: #0D47A1 !important; /* Tom ainda mais escuro no hover */
transform: scale(1.15); /* Leve ampliação */
}
.ellipsis {
color: #ffffff !important; /* Força a cor branca */
margin: 0 4px;
font-weight: bold;
min-width: 20px;
text-align: center;
}
.device-menu {
white-space: nowrap;
}
/* Media Queries atualizadas */
@media (max-width: 768px) {
.pagination {
padding: 8px 4px;
}
.pagination button {
padding: 6px 10px;
font-size: 12px;
min-width: 30px;
}
.page-numbers {
gap: 3px;
}
.ellipsis {
margin: 0 2px;
}
/* Oculta alguns botões de página em telas muito pequenas */
.pagination button.hide-mobile {
display: none;
}
}
@media (max-width: 480px) {
.pagination {
padding: 6px 2px;
}
.pagination button {
padding: 5px 8px;
font-size: 11px;
min-width: 25px;
}
/* Ajusta o espaçamento dos três pontinhos em telas muito pequenas */
.ellipsis {
margin: 0 1px;
min-width: 15px;
}
}
/* Botão Tech */
.tech-button {
position: relative;
padding: 15px 30px;
margin: 3px 10px;
background: linear-gradient(135deg, #2196F3, #0D47A1);
border: none;
border-radius: 8px;
color: #ffffff;
font-family: ‘Arial’, sans-serif;
font-size: 16px;
font-weight: 600;
letter-spacing: 0.5px;
cursor: pointer;
transition: all 0s ease;
box-shadow: 0 4px 15px rgba(33, 150, 243, 0.3);
overflow: hidden;
}
.tech-button::before {
content: ”;
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(
120deg,
transparent,
rgba(255, 255, 255, 0.2),
transparent
);
transition: all 0s ease;
}
.tech-button:hover {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(33, 150, 243, 0.4);
animation: glowing 2s infinite;
}
.tech-button:hover::before {
left: 100%;
}
.tech-button:active {
transform: translateY(1px);
box-shadow: 0 2px 10px rgba(33, 150, 243, 0.3);
}
/* Menu Superior */
.device-menu {
display: flex;
justify-content: center;
gap: 15px;
padding: 20px;
background: linear-gradient(to bottom, #1a1a1a, #000000);
box-shadow: 0 4px 20px rgba(0, 140, 255, 0.3);
position: sticky;
top: 0;
z-index: 10;
}
.device-button {
padding: 12px 24px;
font-size: 16px;
font-weight: bold;
color: #ffffff;
background: linear-gradient(145deg, #2a2a2a, #1a1a1a);
border: 1px solid rgba(0, 140, 255, 0.3);
border-radius: 8px;
cursor: pointer;
transition: all 0s ease;
position: relative;
overflow: hidden;
box-shadow:
0 4px 12px rgba(0, 140, 255, 0.3),
inset 0 2px 4px rgba(0, 140, 255, 0.1),
0 0 10px rgba(0, 140, 255, 0.2);
}
.device-button::before {
content: ”;
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(
120deg,
transparent,
rgba(0, 140, 255, 0.4),
transparent
);
transition: 0s;
}
.device-button:hover::before {
left: 100%;
}
.device-button:hover {
transform: translateY(-2px);
background: linear-gradient(145deg, #004d99, #0066cc);
box-shadow:
0 6px 15px rgba(0, 140, 255, 0.4),
inset 0 2px 4px rgba(0, 140, 255, 0.3),
0 0 20px rgba(0, 140, 255, 0.4);
border: 1px solid rgba(0, 140, 255, 0.5);
}
.device-button.active {
background: linear-gradient(145deg, #0066cc, #004d99);
box-shadow:
0 2px 8px rgba(0, 140, 255, 0.5),
inset 0 2px 4px rgba(0, 140, 255, 0.3),
0 0 25px rgba(0, 140, 255, 0.5);
transform: translateY(1px);
border: 1px solid rgba(0, 140, 255, 0.6);
animation: pulseBorder 2s infinite;
}
/* Loading Indicator */
#loading-indicator {
animation: fadeIn 0.3s ease-in-out;
}
/* Animações */
@keyframes glowing {
0% { box-shadow: 0 0 5px #2196F3; }
50% { box-shadow: 0 0 20px #2196F3; }
100% { box-shadow: 0 0 5px #2196F3; }
}
@keyframes pulseBorder {
0% {
box-shadow:
0 2px 8px rgba(0, 140, 255, 0.5),
inset 0 2px 4px rgba(0, 140, 255, 0.3),
0 0 25px rgba(0, 140, 255, 0.5);
}
50% {
box-shadow:
0 2px 12px rgba(0, 140, 255, 0.7),
inset 0 2px 4px rgba(0, 140, 255, 0.4),
0 0 35px rgba(0, 140, 255, 0.7);
}
100% {
box-shadow:
0 2px 8px rgba(0, 140, 255, 0.5),
inset 0 2px 4px rgba(0, 140, 255, 0.3),
0 0 25px rgba(0, 140, 255, 0.5);
}
}
@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}
/* Media Queries */
@media (max-width: 768px) {
.table-container {
margin: 10px 3px;
}
table th,
table td {
padding: 20px 0px;
font-size: 16px;
}
#search-form {
width: 90%;
padding: 15px;
}
.device-menu {
padding: 10px;
gap: 8px;
}
.pagination button {
padding: 6px 1px;
font-size: 12px;
min-width: 30px;
}
.pagination span {
font-size: 12px;
margin: 0 4px;
}
h2 {
margin-left: 20px;
}
}
@media (max-width: 640px) {
.device-menu {
flex-wrap: wrap;
gap: 10px;
}
.device-button {
padding: 10px 20px;
font-size: 14px;
}
.tech-button {
padding: 15px 20px;
font-size: 14px;
}
table th,
table td {
padding: 20px 0px;
font-size: 14px;
}
}
/* Scrollbar personalizada */
::-webkit-scrollbar {
width: 10px;
height: 10px;
}
::-webkit-scrollbar-track {
background: #1a1a1a;
}
::-webkit-scrollbar-thumb {
background: #4a90e2;
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: #357abd;
}
Transistor Mosfet
Todos
Canal-N
Canal-P
mA
A
mW
W
| Transistor | Canal Tipo |
Vds |
Vgs |
Rds(on) | Id | Qg | Pd | Invólucro |
|---|
// Constantes globais
const TABLE = document.getElementById(“tabela”);
const TBODY = TABLE.getElementsByTagName(“tbody”)[0];
const LOADING_INDICATOR = document.getElementById(‘loading-indicator’);
const ROWS_PER_PAGE = 16;
// Variáveis globais
let formVisible = false;
let originalData = [];
let currentPage = 1;
let totalPages = 1;
// URLs base para cada tipo de dispositivo
const baseUrls = {
bjt: ‘https://www.fvml.com.br/p/transistor-bjt-equivalente-por.html’,
darlington: ‘https://www.fvml.com.br/p/transistor-darlington-equivalente-por.html’,
mosfet: ‘https://www.fvml.com.br/p/transistor-mosfet-equivalente-por.html’,
regulator: ‘#’,
triac: ‘#’
};
// Mapeamento de encapsulamentos similares
const similarPackages = {
‘TO-3’: [‘TO-3’, ‘TO-204’],
‘TO-3P’: [‘TO-3P’, ‘TO-3PN’],
‘TO-3PL’: [‘TO-3PL’, ‘TO-3PB’, ‘TO-264A’, ‘TO-264’, ‘TO-3PBL’],
‘TO-3PF’: [‘TO-3PF’, ‘TO3PF’],
‘TO-5’: [‘TO-5’, ‘TO5’],
‘TO-18’: [‘TO-18’, ‘TO18’],
‘TO-39’: [‘TO-39’, ‘TO39’],
‘TO-92’: [‘TO-92’, ‘TO-92A’, ‘TO-92S’, ‘TO-92B’, ‘TO-92F’],
‘TO-92MOD’: [‘TO-92MOD’, ‘TO-92L’, ‘TO-92LS’],
‘TO-126’: [‘TO-126’, ‘TO-126A’, ‘TO-126C’],
‘TO-218’: [‘TO-218’, ‘SOT-93’],
‘TO-220’: [‘TO-220’, ‘TO-220C’, ‘TO-220AB’, ‘TO-220FB’],
‘TO-220F’: [‘TO-220F’, ‘TO-220F1’, ‘TO-220Fa’, ‘TO-220E’, ‘TO-220J’, ‘TO-220CFM’, ‘ISOWATT220’, ‘ITO-220’, ‘TO-220FP’, ‘TO-220D’, ‘TO-220NIS’],
‘TO-236’: [‘TO-236’, ‘SMT3’, ‘SOT-23’],
‘TO-247’: [‘TO-247’, ‘TO-247AC’, ‘TO-247AD’, ‘TO-247AB’, ‘TO-247C’],
‘TO-251’: [‘TO-251’, ‘IPAK’,’SOT-533′],
‘TO-252’: [‘TO-252’, ‘DPAK’, ‘SOT-428’],
‘TO-262’: [‘TO-262’, ‘I2PAK’, ‘SOT-226’],
‘TO-263’: [‘TO-263’, ‘D2PAK’, ‘SOT-404’],
‘SOT-223’: [‘SOT-223’, ‘SOT223’]
};
// Funções auxiliares
function normalizeDecimalNumber(value) {
if (typeof value === ‘string’) {
return value.replace(‘,’, ‘.’);
}
return value;
}
function compareValues(a, b) {
if (isNaN(a) && isNaN(b)) return 0;
if (isNaN(a)) return 1;
if (isNaN(b)) return -1;
return a – b;
}
function arePackagesSimilar(package1, package2) {
package1 = package1.replace(/s+/g, ”).toUpperCase();
package2 = package2.replace(/s+/g, ”).toUpperCase();
if (package1 === package2) return true;
for (const basePackage in similarPackages) {
const group = similarPackages[basePackage];
const normalizedGroup = group.map(pkg => pkg.replace(/s+/g, ”).toUpperCase());
if (normalizedGroup.includes(package1) && normalizedGroup.includes(package2)) {
return true;
}
}
return false;
}
function debounce(func, wait) {
let timeout;
return function executedFunction(…args) {
const later = () => {
clearTimeout(timeout);
func(…args);
};
clearTimeout(timeout);
timeout = setTimeout(later, wait);
};
}
function showLoading() {
if (LOADING_INDICATOR) {
LOADING_INDICATOR.style.display = ‘block’;
}
}
function hideLoading() {
if (LOADING_INDICATOR) {
LOADING_INDICATOR.style.display = ‘none’;
}
}
function loadTransistorData() {
fetchTransistorData()
.catch(error => {
console.warn(‘Fetch falhou, tentando JSONP:’, error);
loadTransistorDataJSONP();
});
}
function fetchTransistorData() {
return fetch(‘https://fvml.group/transistor_mosfet.php’, {
method: ‘GET’,
headers: {
‘Content-Type’: ‘application/json’
}
})
.then(response => {
if (!response.ok) {
throw new Error(‘Erro na requisição’);
}
return response.json();
})
.then(processTransistorData);
}
function loadTransistorDataJSONP() {
const script = document.createElement(‘script’);
script.src = ‘https://fvml.group/transistor_mosfet.php?callback=processTransistorData’;
script.onerror = function() {
console.error(‘Erro no carregamento do script JSON’);
showErrorMessage();
};
const timeout = setTimeout(() => {
console.error(‘Timeout no carregamento JSON’);
showErrorMessage();
script.remove();
}, 10000);
script.onload = function() {
clearTimeout(timeout);
};
script.async = true;
document.body.appendChild(script);
}
window.processTransistorData = function(data) {
try {
if (!Array.isArray(data) || data.length === 0) {
throw new Error(‘Dados inválidos’);
}
originalData = data.map(transistor => ({
transistor: transistor.transistor || ”,
transistorUrl: transistor.transistorUrl || ”,
channelType: transistor.channelType || ‘–‘,
vds: parseFloat(normalizeDecimalNumber(transistor.vds)) || ‘–‘,
vgs: parseFloat(normalizeDecimalNumber(transistor.vgs)) || ‘–‘,
rdsOn: parseFloat(normalizeDecimalNumber(transistor.rdsOn)) || ‘–‘,
id: parseFloat(normalizeDecimalNumber(transistor.id)) || ‘–‘,
qg: parseFloat(normalizeDecimalNumber(transistor.qg)) || ‘–‘,
pd: parseFloat(normalizeDecimalNumber(transistor.pd)) || ‘–‘,
caps: transistor.caps || ‘–‘
}));
// Popular datalist
const datalist = document.getElementById(“transistor-list”);
datalist.innerHTML = ”;
originalData.forEach(data => {
const option = document.createElement(“option”);
option.value = data.transistor;
datalist.appendChild(option);
});
// Atualizar tabela
updateTableWithResults(originalData);
} catch (error) {
console.error(‘Erro no processamento dos dados:’, error);
showErrorMessage();
}
}
function showErrorMessage() {
const tableContainer = document.querySelector(‘.table-container’);
tableContainer.innerHTML = `
Erro ao carregar dados
Não foi possível carregar a lista de transistores.
Por favor, verifique sua conexão ou tente novamente mais tarde.
`;
}
function populateTransistorList() {
const datalist = document.getElementById(“transistor-list”);
const fragment = document.createDocumentFragment();
originalData.forEach(data => {
const option = document.createElement(“option”);
option.value = data.transistor;
fragment.appendChild(option);
});
datalist.appendChild(fragment);
}
function updateFormWithTransistorData(transistorData) {
if (transistorData) {
// Atualiza o tipo de canal (Canal-N ou Canal-P)
document.getElementById(“polarization”).value = transistorData.channelType;
// Vds (Tensão Dreno-Source)
if (!isNaN(transistorData.vds)) {
document.getElementById(“vds”).value = normalizeDecimalNumber(transistorData.vds.toString());
}
// Vgs (Tensão Gate-Source)
if (!isNaN(transistorData.vgs)) {
document.getElementById(“vgs”).value = normalizeDecimalNumber(transistorData.vgs.toString());
}
// Rds(on) (Resistência Dreno-Source em condução)
if (!isNaN(transistorData.rdsOn)) {
document.getElementById(“rdsOn”).value = normalizeDecimalNumber(transistorData.rdsOn.toString());
}
// Id (Corrente de Dreno)
if (!isNaN(transistorData.id)) {
if (transistorData.id < 1) {
document.getElementById("id").value = normalizeDecimalNumber((transistorData.id * 1000).toFixed(2));
document.getElementById("id_unit").value = "mA";
} else {
document.getElementById("id").value = normalizeDecimalNumber(transistorData.id.toString());
document.getElementById("id_unit").value = "A";
}
}
// Qg (Carga de Gate)
if (!isNaN(transistorData.qg)) {
document.getElementById("qg").value = normalizeDecimalNumber(transistorData.qg.toString());
}
// Potência de dissipação
if (!isNaN(transistorData.pd)) {
if (transistorData.pd
t.transistor.toLowerCase() === description.toLowerCase()
);
let filteredRows = [];
let isSubstitutesSearch = false;
if (searchedTransistor) {
isSubstitutesSearch = true;
filteredRows = originalData.filter(row => {
// Exclui o próprio transistor
if (row.transistor.toLowerCase() === description.toLowerCase()) {
return false;
}
// Verifica tipo de canal
if (row.channelType !== searchedTransistor.channelType) {
return false;
}
// Função para verificar se o substituto tem características MAIORES ou IGUAIS
const isCharacteristicSufficient = (rowValue, baseValue, tolerance = 0.1) => {
// Se baseValue não for definido, considera como atendido
if (isNaN(baseValue)) return true;
// Se rowValue não for definido, não atende
if (isNaN(rowValue)) return false;
// Verifica se o valor do substituto é maior ou igual, com tolerância
return rowValue >= baseValue * (1 – tolerance);
};
// Verifica características principais
const hasEnoughVds = isCharacteristicSufficient(row.vds, searchedTransistor.vds);
const hasEnoughVgs = isCharacteristicSufficient(row.vgs, searchedTransistor.vgs);
const hasLowEnoughRdsOn = isCharacteristicSufficient(searchedTransistor.rdsOn, row.rdsOn);
const hasEnoughId = isCharacteristicSufficient(row.id, searchedTransistor.id);
const hasEnoughQg = isCharacteristicSufficient(row.qg, searchedTransistor.qg);
const hasEnoughPd = isCharacteristicSufficient(row.pd, searchedTransistor.pd);
// Requer que pelo menos 5 características sejam suficientes
const sufficientCharacteristics = [
hasEnoughVds,
hasEnoughVgs,
hasLowEnoughRdsOn,
hasEnoughId,
hasEnoughQg,
hasEnoughPd
].filter(Boolean).length;
if (sufficientCharacteristics {
const calculateSimilarity = (row) => {
const differences = [
Math.abs((row.vds – searchedTransistor.vds) / searchedTransistor.vds),
Math.abs((row.vgs – searchedTransistor.vgs) / searchedTransistor.vgs),
Math.abs((row.rdsOn – searchedTransistor.rdsOn) / searchedTransistor.rdsOn),
Math.abs((row.id – searchedTransistor.id) / searchedTransistor.id),
Math.abs((row.qg – searchedTransistor.qg) / searchedTransistor.qg),
Math.abs((row.pd – searchedTransistor.pd) / searchedTransistor.pd)
].filter(diff => !isNaN(diff));
// Soma das diferenças percentuais (menor é melhor)
return differences.reduce((a, b) => a + b, 0);
};
return calculateSimilarity(a) – calculateSimilarity(b);
});
// Adiciona o transistor original no início da lista
filteredRows.unshift(searchedTransistor);
} else {
// Mantém a lógica original de filtro quando nenhum transistor específico é encontrado
filteredRows = originalData.filter(row => {
// Filtros originais do formulário
if (channelType !== “” && channelType !== row.channelType) {
return false;
}
if (!isNaN(vds) && (isNaN(row.vds) || row.vds < vds)) {
return false;
}
if (!isNaN(vgs) && (isNaN(row.vgs) || row.vgs rdsOn)) {
return false;
}
if (!isNaN(id) && (isNaN(row.id) || row.id < id)) {
return false;
}
if (!isNaN(qg) && (isNaN(row.qg) || row.qg < qg)) {
return false;
}
if (!isNaN(pd) && (isNaN(row.pd) || row.pd pkg.includes(normalizedCaps))) {
if (group.some(pkg => row.caps.replace(/s+/g, ”).toUpperCase().includes(pkg))) {
isSimilarPackageFound = true;
break;
}
}
}
if (!isSimilarPackageFound && !row.caps.toLowerCase().includes(caps.toLowerCase())) {
return false;
}
}
return true;
});
}
// Atualiza a tabela com os resultados
updateTableWithResults(filteredRows, isSubstitutesSearch, searchedTransistor);
}
function updateTableWithResults(filteredRows, isSubstitutesSearch = false) {
showLoading();
TBODY.style.display = ‘none’;
TBODY.innerHTML = “”;
const fragment = document.createDocumentFragment();
filteredRows.forEach((row, index) => {
const tr = createTableRow(row, index === 0, isSubstitutesSearch);
fragment.appendChild(tr);
});
TBODY.appendChild(fragment);
TBODY.style.display = ”;
currentPage = 1;
totalPages = Math.ceil(filteredRows.length / ROWS_PER_PAGE);
updatePagination();
hideLoading();
}
function createTableRow(rowData, isFirst, isSubstitutesSearch = false) {
const row = document.createElement(“tr”);
// Destaque só aparece em busca de substitutos
if (isFirst && isSubstitutesSearch) {
row.style.fontWeight = ‘bold’;
row.style.backgroundColor = ‘rgba(255, 255, 0, 0.2)’;
}
const transistorCell = document.createElement(“td”);
if (rowData.transistorUrl) {
const link = document.createElement(“a”);
link.href = rowData.transistorUrl;
link.target = “_blank”;
link.textContent = rowData.transistor;
transistorCell.appendChild(link);
} else {
transistorCell.textContent = rowData.transistor;
}
row.appendChild(transistorCell);
[
rowData.channelType,
rowData.vds,
rowData.vgs,
rowData.rdsOn,
rowData.id,
rowData.qg,
rowData.pd,
rowData.caps
].forEach(cellData => {
const cell = document.createElement(“td”);
cell.textContent = (cellData === ‘NaN’ || Number.isNaN(cellData)) ? ‘–‘ : cellData;
row.appendChild(cell);
});
return row;
}
function updatePagination() {
const pageNumbers = document.getElementById(“pageNumbers”);
pageNumbers.innerHTML = ”;
const screenWidth = window.innerWidth;
let maxButtons = screenWidth <= 480 ? 3 : (screenWidth <= 768 ? 5 : 7);
let start = Math.max(1, currentPage – Math.floor(maxButtons/2));
let end = Math.min(totalPages, start + maxButtons – 1);
if (end – start + 1 1) {
pageNumbers.innerHTML += ``;
if (start > 2) {
pageNumbers.innerHTML += ‘•••‘;
}
}
for (let i = start; i <= end; i++) {
pageNumbers.innerHTML += `
`;
}
if (end < totalPages) {
if (end < totalPages – 1) {
pageNumbers.innerHTML += '•••‘;
}
pageNumbers.innerHTML += ``;
}
document.getElementById(“firstPage”).disabled = currentPage === 1;
document.getElementById(“prevPage”).disabled = currentPage === 1;
document.getElementById(“nextPage”).disabled = currentPage === totalPages;
document.getElementById(“lastPage”).disabled = currentPage === totalPages;
updateTableRows();
}
function updateTableRows() {
const rows = TBODY.getElementsByTagName(“tr”);
const start = (currentPage – 1) * ROWS_PER_PAGE;
const end = start + ROWS_PER_PAGE;
Array.from(rows).forEach((row, index) => {
row.style.display = (index >= start && index = 1 && page = 1 && newPage {
loadTransistorData();
initializeEventListeners();
hideLoading();
}, 0);
});
function initializeEventListeners() {
const descriptionInput = document.getElementById(“description”);
descriptionInput.addEventListener(“input”, debounce(function(e) {
const searchTerm = e.target.value.replace(/s+/g, ”).trim().toLowerCase();
if (searchTerm) {
const matchingTransistor = originalData.find(data =>
data.transistor.toLowerCase() === searchTerm
);
if (matchingTransistor) {
updateFormWithTransistorData(matchingTransistor);
}
}
}, 300));
descriptionInput.addEventListener(“blur”, function() {
this.value = this.value.replace(/s+/g, ”).trim();
});
descriptionInput.addEventListener(“change”, function(e) {
if (!e.target.value.trim()) {
resetForm();
}
});
document.getElementById(“search-form”).addEventListener(“submit”, function(event) {
event.preventDefault();
searchTransistors();
});
}
English
Español