 |
|
Você está aqui: JavaScript ::: Web Audio API ::: OscillatorNode |
Como criar um oscilador de onda de dente de serra em JavaScript usando a Web Audio API e um OscillatorNodeQuantidade de visualizações: 232 vezes |
|
Nesta dica mostrarei como podemos usar a Web Audio API, em particular um nó OscillatorNode, para criar um oscilador de onda de dente de serra em HTML e JavaScript. Um oscilador de onda de dente de serra é uma espécie de forma de onda não-senoidal básica. Ela recebeu o nome dente de serra baseado em sua semelhança com a lâmina de uma serra. O som desta onda é desarmonioso e limpo, e seu espectro contém ambas as harmônicas normais e estranhas da frequência fundamental. Devido ao fato de ela conter todas as harmônicas inteiras, ela é considerada uma das melhores formas de onda para a construção de outros sons, particularmente cordas, utilizando a síntese subtrativa. Veja na imagem abaixo a representação de um som no formato dente de serra:  Quando criamos um OscillatorNode nós temos que informar o contexto de áudio (um objeto AudioContext), o formato da onda e a frequência em Hz. Em nosso exemplo eu coloquei a frequência em 440 Hz, representando a nota Lá na quarta oitava do piano. Depois do código há uma explicação mais detalhada sobre a frequência, comprimento e amplitude de uma onda de dente de serra. Veja o código JavaScript completo para exemplo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>Como criar um oscilador em JavaScript</title>
</head>
<body>
<h3>Clique o botão Iniciar para iniciar a execução
do Oscilador</h3>
<button id="iniciar_btn"
onclick="iniciar()">Iniciar</button>
<button id="parar_btn" disabled="disabled"
onclick="parar()">Parar</button>
<script language="javascript">
'use strict';
// obtemos referências para os botões de iniciar
// e parar o oscilador
var btn_iniciar = document.getElementById("iniciar_btn");
var btn_parar = document.getElementById("parar_btn");
// vamos declarar o contexto de áudio
var contexto;
// para representar o oscilador
var oscilador;
// função usada para iniciar o oscilador de onda
// dente de serra
function iniciar(){
// vamos criar um objeto AudioContext
var AudioContext = window.AudioContext
|| window.webkitAudioContext;
// e obtemos o contexto de áudio
contexto = new AudioContext();
// vamos criar o oscilador na frequência
// de 440Hz
oscilador = new OscillatorNode(contexto, {
type: 'sawtooth',
frequency: 440
});
// conectamos o oscilador à saída
oscilador.connect(contexto.destination);
// e começamos a fazer barulho
oscilador.start();
// vamos desabilitar o botão de iniciar
btn_iniciar.disabled = true;
// vamos habilitar o botão de parar
btn_parar.disabled = false;
}
// função usada para interromper o oscilador
function parar(){
// vamos interromper o oscilador
oscilador.stop();
// vamos desabilitar o botão de parar
btn_parar.disabled = true;
// vamos habilitar o botão de iniciar
btn_iniciar.disabled = false;
}
</script>
</body>
</html>
A frequência descreve o número de vibrações por unidade de tempo, ou seja, quantos ciclos completos a onda percorre em uma unidade de tempo, que pode ser o segundo, o minuto ou qualquer outra unidade que você achar conveniente. A unidade que usaremos para descrever as frequências é o Hertz (Hz). 1 Hz corresponde a um ciclo de vibração por segundo. Por exemplo, quando colocamos um diapasão na forma de garfo em vibração, suas hastes vibrarão a uma frequência de 440 Hz, ou 440 ciclos por segundo, correspondentes à nota musical Lá. Essa nota pode ser perfeitamente descrita pela sua frequência (440 Hz), comprimento de onda (0,77 m) e uma amplitude que vai depender da energia utilizada para colocá-lo em vibração e que descreve a intensidade da variação da pressão do ar. |
 Link para compartilhar na Internet ou com seus amigos: |
JavaScript ::: Dicas & Truques ::: Data e Hora |
Como somar dias a uma data em JavaScript usando uma função personalizada adicionar_dias() que retorna um objeto DateQuantidade de visualizações: 13438 vezes |
|
Nesta dica mostrarei como podemos escrever uma função JavaScript que permite adicionar dias a uma data recebida como argumento e retorna um novo objeto Date. Como pequenas modificações esta função pode ser usada também para subtrair dias da data. Veja a página HTML completa para o exemplo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>Data e hora em JavaScript</title>
</head>
<body>
<script type="text/javascript">
// função que recebe um objeto Date e uma quantidade
// de dias e soma esses dias ao Date recebido e
// e retorna um novo objeto Date
function adicionar_dias(data, dias){
return new Date(data.getTime() + (dias * 24 * 60
* 60 * 1000));
}
// testa a função
var hoje = new Date();
document.write("Hoje é " + hoje.toLocaleDateString() + "<br>");
// vamos adicionar 5 dias ao objeto Date
var data_futura = adicionar_dias(hoje, 5);
document.write("Daqui 5 dias será: " +
data_futura.toLocaleDateString());
</script>
</body>
</html>
Ao executar este código JavaScript nós teremos o seguinte resultado: Hoje é 06/02/2023 Daqui 5 dias será: 11/02/2023 |
JavaScript ::: Dicas & Truques ::: Data e Hora |
Como calcular a quantidade de dias restantes para uma determinada data em JavaScriptQuantidade de visualizações: 8879 vezes |
|
Em algumas situações nós precisamos calcular quantos dias faltam para uma determinada data em JavaScript. Por exemplo, você gostaria de saber quantos dias ainda falta para o Natal, ou para o seu aniversário? Veja a página HTML completa para o exemplo: ----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<!doctype html>
<html>
<head>
<title>Data e hora em JavaScript</title>
</head>
<body>
<script type="text/javascript">
// vamos obter a data de hoje
var hoje = new Date();
// vamos construir a data do Natal
var data_natal = new Date(hoje.getFullYear(), 11, 25);
// quantidade de milisegundos em um dia
var dia = 1000 * 60 * 60 * 24;
// calculamos os dias restantes para a data escolhida
var restantes = Math.ceil((data_natal.getTime() -
hoje.getTime()) / dia);
// e mostramos o resultado
document.write("Hoje é: " + hoje.toLocaleDateString() + "<br>");
document.write("Faltam " + restantes + " dias para o natal.");
</script>
</body>
</html>
Ao executar este código JavaScript nós teremos o seguinte resultado: Hoje é: 06/02/2023 Faltam 322 dias para o natal. |
JavaScript ::: Dicas & Truques ::: Strings e Caracteres |
Como retornar o tamanho de uma string em JavaScript usando a propriedade length do objeto StringQuantidade de visualizações: 10358 vezes |
Em algumas situações precisamos saber a quantidade de caracteres contidos em uma frase ou texto. Para isso podemos usar a propriedade length do objeto String. Esta propriedade retorna o tamanho da string, ou seja, a quantidade de caracteres contidos na mesma. Veja um exemplo:----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------
<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>
<script type="text/javascript">
// vamos declarar uma string
var nome = "Osmar";
// vamos obter a quantidade de caracteres nesta string
var tam = nome.length;
// vamos exibir o resultado
window.alert("A string contém " + tam + " caracteres.");
</script>
</body>
</html>
Esta dica foi escrita e testada no Internet Explorer 8 e Firefox 3.6. |
Vamos testar seus conhecimentos em Engenharia Civil - Instalações Hidráulicas Prediais |
| Perda de Carga Localizada, Acessórios de Tubulação Considerando a questão: "Qual a perda de carga singular em um conduto de 100 m, diâmetro de 100 mm, com um fluido escoando a 2 m/s, apresentando as seguintes singularidades rosqueadas na tubulação: válvula globo totalmente aberta e cotovelo de 45º com raio normal?". Qual o comprimento equivalente das perdas de cargas singulares da tubulação anteriormente citada, considerando que o tubo perde linearmente 0,135 m de carga por metros de tubulação? Selecione a resposta: A) 9 m. B) 14 m. C) 10 m. D) 12 m. E) 8 m. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Engenharia Civil - Estruturas de Aço e Madeira |
| Perfil em aço As conexões dos perfis de aço contribuem para a projetação das estruturas de uma edificação, sendo responsáveis pela ligação entre pilares e vigas ou entre outros elementos. Elas podem variar, dependendo do tipo de esforço que se pretende resistir com o elemento estrutural. Considerando a figura apresentada a seguir, assinale a alternativa que indica corretamente o tipo de conexão que está sendo utilizado para unir essas peças.  A) Conexão de cisalhamento. B) Conexão de momento com pinos. C) Conexão de cisalhamento com solda. D) Conexão de momento com solda. E) Conexão de tensão com solda. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Fenômeno de Transportes e Hidráulica |
| Tipos de Escoamentos Para um conduto cilíndrico de raio R, calcular a área molhada, o perímetro molhado e o raio hidráulico em duas situações: (1) conduto completamente cheio de água e (2) conduto 50% preenchido. Identificar o escoamento que ocorre em cada uma das situações e qual escoamento é mais influenciado pelas paredes do contorno sólido. A) A1 = πR2; PM1 = 2πR, RH1 = R, escoamento em conduto forçado A2 = (πR2)/2; PM2 = πR, RH2 = R/2, escoamento à superfície livre. O escoamento em 2 é o mais influenciado pelas paredes, pois o RH é menor. B) A1 = πR2; PM1 = 2πR, RH1 = R/2, escoamento em conduto forçado A2 = (πR2)/2; PM2 = πR, RH2 = R/2, escoamento à superfície lívre. Ambos os escoamentos possuem a mesma influência, pois o valor de RH é igual nos dois casos. C) A1 = πR2; PM1 = 2πR, RH1 = R, escoamento em conduto forçado A2 = (πR2)/2; PM2 = πR, RH2 = R/2, escoamento à superfície livre. O escoamento em 1 é o mais influenciado pelas paredes, pois o RH é maior. D) A1 = πR2; PM1 = 2πR, RH1 = R/2, escoamento em conduto forçado A2 = (πR2)/2; PM2 = πR, RH2 = R/2, escoamento à superfície livre. O escoamento em 2 é o mais influenciado pelas paredes, pois a A2 é menor. E) A1 = πR2; PM1 = 2πR, RH1 = R/2, escoamento à superfície livre A2 = (πR2)/2; PM2 = πR, RH2 = R/2, escoamento em conduto forçado. Ambos os escoamentos possuem a mesma influência, pois o valor de RH é igual nos dois casos. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em Hidrologia |
| São exemplos de objetos do espaço físico que compreendem o estudo da hidrografia, com exceção de A) nascentes. B) lagos. C) rios. D) matas. E) aquíferos. Verificar Resposta Estudar Cards Todas as Questões |
Vamos testar seus conhecimentos em |
| Dimensionamento de lajes maciças à flexão As lajes de concreto armado são elementos planos e horizontais, submetidos a carregamentos perpendiculares ao plano. Esses carregamentos promovem o desenvolvimento de esforços internos de flexão. Analise as afirmativas a seguir referentes aos tipos de flexão: I. A flexão normal ocorre em uma seção transversal em que atuam apenas momento fletor e esforço normal de tração ou compressão. II. A flexão reta ocorre quando os momentos fletores atuam em planos ortogonais aos eixos principais de inércia da seção transversal. III. Diz-se que a seção transversal de uma laje está submetida à flexão pura quando sobre ela atuam somente momentos fletores. IV. A seção transversal de uma laje está submetida à flexão composta quando, sobre esta, atuam momentos de flexão e forças normais. Assinale a alternativa correta: A) Apenas a afirmativa I está correta. B) Apenas a afirmativa III está correta. C) As afirmativas I, II e IV estão corretas. D) As afirmativas II, III e IV estão corretas. E) As afirmativas I, II, III e IV estão corretas. Verificar Resposta Estudar Cards Todas as Questões |
Desafios, Exercícios e Algoritmos Resolvidos de JavaScript |
Veja mais Dicas e truques de JavaScript |
Dicas e truques de outras linguagens |
Códigos Fonte |
 Software de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimentoDiga adeus às planilhas do Excel e tenha 100% de controle sobre suas contas a pagar e a receber, gestão de receitas e despesas, cadastro de clientes e fornecedores com fotos e histórico de atendimentos. Código fonte completo e funcional, com instruções para instalação e configuração do banco de dados MySQL. Fácil de modificar e adicionar novas funcionalidades. Clique aqui e saiba mais |
 Controle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidadesTenha o seu próprio sistema de controle de estoque web. com cadastro de produtos, categorias, fornecedores, entradas e saídas de produtos, com relatórios por data, margem de lucro e muito mais. Código simples e fácil de modificar. Acompanha instruções para instalação e criação do banco de dados MySQL. Clique aqui e saiba mais |
Linguagens Mais Populares |
|
1º lugar: Java |
