Ir ao conteúdo
  • Cadastre-se

Pesquisar na Comunidade

Mostrando resultados para as tags ''Javascript''.



Mais opções de pesquisa

  • Pesquisar por Tags

    Digite tags separadas por vírgulas
  • Pesquisar por Autor

Tipo de Conteúdo


Categorias

  • Armazenamento
  • Áudio
  • Energia
  • Entrada
  • Feiras e Eventos
  • Gabinetes
  • Memória
  • Museu
  • Placas-mãe
  • Portáteis
  • Processadores
  • Programas
  • Rádio CdH
  • Redes
  • Refrigeração
  • Smartphones
  • Tablets
  • Vídeo
  • Outros

Categorias

  • Armazenamento
  • Áudio
  • Câmeras
  • Computadores
  • Consoles
  • Eletrônicos
  • Energia
  • Entrada
  • Gabinetes
  • Impressão
  • Jogos
  • Memória
  • Placas-mãe
  • Portáteis
  • Processadores
  • Programas
  • Redes
  • Refrigeração
  • Smartphones
  • Tablets
  • Vídeo
  • Outros

Categorias

  • Livros disponíveis
  • Livros esgotados

Fóruns

  • Mensagens do Clube do Hardware
    • Regras gerais
    • Boletins do Clube do Hardware
    • Notícias da administração
  • Hardware
    • Recomendações de computadores
    • Placas de vídeo
    • Placas-mãe e chipsets
    • Processadores
    • Problemas de gargalo e desempenho
    • Memórias
    • Armazenamento
    • Refrigeração e superaquecimento
    • Fontes e energia
    • Gabinetes e casemods
    • Placas de som e áudio on-board
    • Periféricos
    • Mac
    • Overclock
    • Hardware - outros
  • Computação móvel
    • Notebooks
    • Tablets
    • Smartphones e apps
  • Redes e Internet
    • Redes e Internet
    • Hospedagem de sites e registro de domínios
  • Segurança da informação
    • Remoção de malware
    • Dúvidas sobre invasões e infecções
    • Programas de proteção
  • Programação e desenvolvimento
    • Java
    • C/C#/C++
    • Pascal/Delphi
    • .NET
    • Bancos de dados
    • Programação web
    • Programação - iniciantes
    • Programação de microcontroladores
    • Programação - outros
  • Software
    • Jogos
    • Pacotes de escritório
    • Computação distribuída (Folding@Home, Bitcoin etc.)
    • Virtualização
    • Design, animação e tratamento de imagens
    • Edição de áudio e vídeo
    • Programas
  • Sistemas Operacionais
    • Recomendação de sistemas operacionais
    • Windows
    • GNU/Linux, BSD, Unix-like e software livre
  • Eletrônicos
    • Equipamentos de som, home theaters e gravadores de mesa
    • Televisores e projetores
    • Câmeras e filmadoras
    • Players portáteis
    • Consoles (videogames)
    • GPS
    • Telefonia fixa
    • Eletrônica
    • Retrocomputação
  • Outros
    • Recomendações de serviços e lojas
    • Preços e promoções
    • Notícias
    • Bolsa de empregos, certificações e mercado de trabalho
    • "Causos"
    • Encontros de usuários
    • Feira do Rolo
  • Clube do Hardware
    • Comentários, elogios, críticas, sugestões e questões sobre o Clube do Hardware
    • Comentários de artigos
    • Fórum para testes de funcionalidades

Categorias

  • Hardware
  • Redes
  • Eletrônica
  • Sistemas operacionais

Encontrar resultados em...

Encontrar resultados que...


Data de criação

  • Iniciar

    FIM


Última atualização

  • Iniciar

    FIM


Filtrar pelo número de...

Data de registro

  • Iniciar

    FIM


Grupo


Caixas de som

Encontrado 135 registros

  1. Olá gostaria de saber se existe alguma função que faz esta conversão ou se alguem pode me ajudar pelo menos me dando uma noção de como fazer. Pois já criei uma função que CONVERTE positvos em binarios e vice versa, porém com numeros negativos estou perdido.
  2. Estou desenvolvendo um jogo em html, preciso fazer a colisão do personagem, como faço isso? Codigo: <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>JOGO</title> <style> canvas { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; margin: auto; } </style> </head> <body> <script> var canvas, ctx, ALTURA, LARGURA, frames = 0, maxTiros = 5, _obsimg = new Image(), velocidade = 6, estadoAtual, pontos = 0, estados = { jogar: 0, jogando: 1, perdeu: 6, }, bloco = { x: 275, y: 500, altura: 50, largura: 50, cor: "#ff4e4e", gravidade: 0.25, velocidade: 0, qntTiros: 0, desenha: function() { ctx.fillStyle = this.cor; ctx.fillRect(this.x, this.y, this.largura, this.altura); }, atira: function() { if(this.qntTiros < maxTiros){ this.qntTiros++; }; } }; obstaculos = { _obs: [], tempo: 0, largura: 43, altura: 35, insere: function(){ this._obs.push({ y: 0, x: Math.floor(Math.random() * 550), }); this.tempo = 30 + Math.floor(10 * Math.random()); }, atualiza: function(){ if(this.tempo == 0){ this.insere(); }else this.tempo--; for(var i = 0, tam = this._obs.length; i < tam; i++){ var obs = this._obs[i]; obs.y += velocidade; if(bloco.x < obs.x - obs.largura){ estados.jogando++; pontos++; alert('bateu'); if(estados.jogando == 6){ estadoAtual = estados.perdeu; } }else if(obs.y >= 600 ){ this._obs.splice(i, 1); tam--; i--; } } }, limpa: function(){ this._obs = []; }, desenha: function(){ for(var i = 0, tam = this._obs.length; i < tam; i++){ var obs = this._obs[i]; _obsimg.src = "obstaculo.png"; ctx.drawImage(_obsimg, obs.x, obs.y); } }, }; function clique(event) { if(estadoAtual == estados.jogando){ } else if(estadoAtual == estados.jogar){ estadoAtual = estados.jogando; } else if(estadoAtual == estados.perdeu){ estadoAtual = estados.jogar; } } function main() { ALTURA = window.innerHeight; LARGURA = window.innerWidth; if (LARGURA >= 500) { LARGURA = 600; ALTURA = 600; } canvas = document.createElement("canvas"); canvas.width = LARGURA; canvas.height = ALTURA; canvas.style.border = "1px solid #000"; ctx = canvas.getContext("2d"); document.body.appendChild(canvas); document.addEventListener("mousedown", clique); estadoAtual = estados.jogar; roda(); } function roda() { atualiza(); desenha(); window.requestAnimationFrame(roda); } function atualiza() { frames++; if(estadoAtual == estados.jogando){ obstaculos.atualiza(); }else if(estadoAtual == estados.perdeu){ obstaculos.limpa(); } } function desenha() { ctx.fillStyle = "#50beff"; ctx.fillRect(0, 0, LARGURA, ALTURA); if(estadoAtual == estados.jogar){ ctx.fillStyle = "green"; ctx.fillRect(LARGURA / 2 - 50, ALTURA / 2 - 50, 100, 100); } else if(estadoAtual == estados.perdeu){ ctx.fillStyle = "red"; ctx.fillRect(LARGURA / 2 - 50, ALTURA / 2 - 50, 100, 100); } else if(estadoAtual == estados.jogando){ obstaculos.desenha(); } if(bloco.x >= -5 && bloco.x <= 555 && bloco.y >= 0 && bloco.y <= 550){ bloco.desenha(); }else alert('aqui'); } window.onkeydown = pressionaTecla; function pressionaTecla(tecla){ if(tecla.keyCode == 39 ) { bloco.x = bloco.x + 10; } if(tecla.keyCode == 37 ) { bloco.x = bloco.x - 10; } if(tecla.keyCode == 40 ) { bloco.y = bloco.y + 10; } if(tecla.keyCode == 38 ) { bloco.y = bloco.y - 10; } if(tecla.keyCode == 32 ) { bloco.atira(); } } main(); </script> </body> </html>
  3. Olá, Tenho bastantes formulas e folhas de calculo em excel. Pretendo transportar essas formulas e folhas para um ambiente multiplataforma. Preciso de algo não me obrigue a ter grandes programas instalados e que a curva de aprendizagem seja mais ou menos rápida. Pensei no Javascript. Possuo noções de html e CSS (já fiz alguns webistes, nada de muito profissional, mas também nada de muito básico). O JS corre do lado do cliente (minha máquina) logo não preciso de ter grandes coisas instaladas, apenas o browser O que me falta para validar a 100% esta opção é se o JS é a melhor opção. As vantagens, para além de ser client-side, é que é permite criar várias páginas e adicionar imagens e efeitos na página (caracteristica do html+css). Em termos de calculos não conheço as suas limitações ou vantagens. É nesta parte que peço a ajuda da comunidade. O que vocês acham? Obrigado
  4. Boa Tarde, estou com um problema em uma estrutura onde tenho um select e o mesmo com um input relacionado sendo assim eu posso mudar o value do meu option. o problema e que quando eu mudo o input o label do meu option Some. Para carregar o valor estou usando o Angular, segue o trecho de codigo. <div class="col-sm-8"> <div class="row"> <div class="col-xs-6 col-sm-7 no-right-padding"> <div class="input-group"> <select ng-model="newStream.type" name="type" class="form-control" required ng-disabled="{{::auth.isGuest()}}" > <option ng-repeat="item in streamsTypesOptions" value="{{::item.value}}">{{::item.name}}</option> </select> <span class="input-group-addon"> <button type="button" class="btn btn-box-tool" tooltip="Undo" ng-click="newStream.type = currentEditStream.type" ng-show="isEdit && newStream.type != currentEditStream.type "> <i class="fa fa-undo fa-2x"> </i> </button> </span> </div> </div> <div class="col-xs-6 col-sm-5 no-left-padding"> <div class="input-group"> <!-- Input TYPE --> <input ng-if="isEdit || (newStream.type != 6 && newStream.type != 17 && newStream.type != 27)" type="text" ng-change="editType()" class="form-control col-sm-3" required name="$otherType" ng-disabled="{{::auth.isGuest()}}" ng-model="newStream.type" maxlength="4" value="12" min="0" max="9999" ui-number-mask="0" ui-hide-group-sep/> <span class="input-group-addon"> <button type="button" class="btn btn-box-tool" tooltip="Undo" ng-click="newStream.$otherType = currentEditStream.$otherType" ng-show="isEdit && newStream.type == 0 && newStream.$otherType != currentEditStream.$otherType"> <i class="fa fa-undo fa-2x"> </i> </button> </span> </div> <div ng-messages="forms.newStreamForm.$otherType.$error" class="help-block has-error error-msg" role="alert"> <div ng-message="required">Required </div> </div> </div> </div> </div> minha estrutura no ng-model e a seguinte. $scope.newStream = [{ name: "Audio", type: STREAM_TYPES.AUDIO, checked: 17 }, { name: "Video", type: STREAM_TYPES.VIDEO, checked: 27 }, { name: "Closed Caption", type: STREAM_TYPES.CLOSED_CAPTION, checked:6 }, { name: "Others", type: STREAM_TYPES.OTHERS, checked: 0 }];
  5. OI, estou tentando fazer um player html5, porém não estou consigo fazer a barra de duração ficar "bom". o que está acontecendo, é que eu estou chamando a função para trocar o value do input a cada 1s (com setinterval), e se o usuario manter pressionado o input e arrastar para algum lugar, o setinterval vai levar o value para onde o video parou. Aqui está um exemplo: http://jsfiddle.net/9ex8k3vp/7/ alguma solução?
  6. <!DOCTYPE html> <html> <head> <style> caixa { width: 300px; border: 2px solid black; padding: 25px; margin: 25px; box-sizing: border-box; display: inline-block; } alinhador { text-align: center; margin-right: auto; margin-left: auto; } entrada[type=number] { width: 100%; padding: 12px 20px; margin: 8px 0; box-sizing: border-box; display: inline-block; } </style> </head> <body> <alinhador> <h1> <caixa>calculador</caixa> </h1> <form> <input type="number" id="p1" name="p1" /> <select id="operador" name="operador"> <option value= "+">+</option> <option value="-">-</option> <option value="*">*</option> <option value="/">/</option> </select> <input type="number" id="p2" name="p2"> <p id="resultado"></p> <button id="button" onclick="mais()">calcular!</button> </form> </alinhador> <script> function mais (){ var p1 = document.getElementById("p1").value; var p2 = document.getElementById("p2").value; var resultado1 = document.getElementById("resultado"); resultado1.innerhtml = p1 + p2; } </script> </body> </html> bom dia/tarde/noite. sou muito novato em programação web, e estava tentando fazer esse calculador, porém mesmo seguindo os tutoriais ele não calcula! com certeza devo estar fazendo algo errado muito obvio. só quero que o resultado apareça, o resto do código eu termino depois.
  7. Olá consegui fazer este código, mas não ficou do jeito que eu quero. <form id="formulario" method="post"> <div> <label for="numero">COLOQUE A QUANTIDADE DE NÚMEROS QUE DESEJA SORTEAR: <br> </label> <input type="text" id="numero" /> </div> <br> <input type="button" value="GERAR NÚMEROS"/> </form> <script> var form = document.getElementById('formulario').addEventListener('click', exibeAleatorios); function exibeAleatorios(numero){ var numero = document.getElementById('numero').value; for (i = 1; i <= numero; i++){ var valor = Math.round(Math.random()*100); document.write (valor + " "); } } </script> o numero sorteado abre em uma nova guia saindo do blog. E a pessoa tem q colocar o numero 20 e clicar em gerar, eu queria só com a opção gerar e sortar os 20 numeros automaticamente dentro do meu blog mesmo
  8. Meu erro no console quando clico na aba Parâmetros da _nav: ERROR Error: "[object Object]" resolvePromisewebpack-internal:///../../../../zone.js/dist/zone.js:824:31 resolvePromisewebpack-internal:///../../../../zone.js/dist/zone.js:795:17 scheduleResolveOrRejectwebpack-internal:///../../../../zone.js/dist/zone.js:873:17 invokeTaskwebpack-internal:///../../../../zone.js/dist/zone.js:425:17 onInvokeTaskwebpack-internal:///../../../core/esm5/core.js:4816:24 invokeTaskwebpack-internal:///../../../../zone.js/dist/zone.js:424:17 runTaskwebpack-internal:///../../../../zone.js/dist/zone.js:192:28 drainMicroTaskQueuewebpack-internal:///../../../../zone.js/dist/zone.js:602:25 invokeTaskwebpack-internal:///../../../../zone.js/dist/zone.js:503:21 invokeTaskwebpack-internal:///../../../../zone.js/dist/zone.js:1540:9 globalZoneAwareCallbackwebpack-internal:///../../../../zone.js/dist/zone.js:1566:17 core.js:1350 defaultErrorLogger core.js:1350 ErrorHandler.prototype.handleError core.js:1411 next core.js:5376:134 EventEmitter.prototype.subscribe/schedulerFn< core.js:4223:34 SafeSubscriber.prototype.__tryOrUnsub Subscriber.js:239 SafeSubscriber.prototype.next Subscriber.js:186 Subscriber.prototype._next Subscriber.js:127 Subscriber.prototype.next Subscriber.js:91 Subject.prototype.next Subject.js:56 EventEmitter.prototype.emit core.js:4203:22 onHandleError/< core.js:4651:48 ZoneDelegate.prototype.invoke zone.js:392 Zone.prototype.run zone.js:142 NgZone.prototype.runOutsideAngular core.js:4577:47 onHandleError core.js:4651 ZoneDelegate.prototype.handleError zone.js:396 Zone.prototype.runGuarded zone.js:158 _loop_1 zone.js:702 api.microtaskDrainDone zone.js:711 drainMicroTaskQueue zone.js:610 ZoneTask.invokeTask zone.js:503 invokeTask zone.js:1540 globalZoneAwareCallback zone.js:1566 /home/eduardomqs/estagio/scl/src/app/app.settings.ts: export class AppSettings { public static BASE_URL= 'http://crs.unochapeco.edu.br/crs-api/public'; public static BASE_API= 'http://crs.unochapeco.edu.br/crs-api/public'; public static BASE_URL_SERVER = '/zend/scl'; } /home/eduardomqs/estagio/scl/src/app/app.routing.ts: import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; // Import Containers import { FullLayoutComponent, SimpleLayoutComponent } from './containers'; export const routes: Routes = [ { path: '', redirectTo: 'dashboard', pathMatch: 'full', }, { path: '', component: FullLayoutComponent, data: { title: 'Home' }, children: [ { path: 'dashboard', loadChildren: './views/dashboard/dashboard.module#DashboardModule' }, { path: 'components', loadChildren: './views/components/components.module#ComponentsModule' }, { path: 'icons', loadChildren: './views/icons/icons.module#IconsModule' }, { path: 'widgets', loadChildren: './views/widgets/widgets.module#WidgetsModule' }, { path: 'charts', loadChildren: './views/chartjs/chartjs.module#ChartJSModule' }, { path: 'itens-por-laboratorio', loadChildren: './views/itens-por-laboratorio/itens-por-laboratorio.module#ItensPorLaboratorioModule' }, { path: 'parametros', loadChildren: './views/parametros/parametros.module#ParametrosModule' }, { path: 'requisicao', loadChildren: './views/requisicao/requisicao.module#RequisicaoModule' }, ] }, { path: 'pages', component: SimpleLayoutComponent, data: { title: 'Pages' }, children: [ { path: '', loadChildren: './views/pages/pages.module#PagesModule', } ] } ]; @NgModule({ imports: [ RouterModule.forRoot(routes) ], exports: [ RouterModule ] }) export class AppRoutingModule {} /home/eduardomqs/estagio/scl/src/app/app.module.ts: import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; import { LocationStrategy, HashLocationStrategy } from '@angular/common'; import { AppComponent } from './app.component'; // Import containers import { FullLayoutComponent, SimpleLayoutComponent } from './containers'; const APP_CONTAINERS = [ FullLayoutComponent, SimpleLayoutComponent ] // Import components import { AppAsideComponent, AppBreadcrumbsComponent, AppFooterComponent, AppHeaderComponent, AppSidebarComponent, AppSidebarFooterComponent, AppSidebarFormComponent, AppSidebarHeaderComponent, AppSidebarMinimizerComponent, APP_SIDEBAR_NAV } from './components'; const APP_COMPONENTS = [ AppAsideComponent, AppBreadcrumbsComponent, AppFooterComponent, AppHeaderComponent, AppSidebarComponent, AppSidebarFooterComponent, AppSidebarFormComponent, AppSidebarHeaderComponent, AppSidebarMinimizerComponent, APP_SIDEBAR_NAV ] // Import directives import { AsideToggleDirective, NAV_DROPDOWN_DIRECTIVES, ReplaceDirective, SIDEBAR_TOGGLE_DIRECTIVES } from './directives'; const APP_DIRECTIVES = [ AsideToggleDirective, NAV_DROPDOWN_DIRECTIVES, ReplaceDirective, SIDEBAR_TOGGLE_DIRECTIVES ] // Import routing module import { AppRoutingModule } from './app.routing'; // Import 3rd party components import { BsDropdownModule } from 'ngx-bootstrap/dropdown'; import { TabsModule } from 'ngx-bootstrap/tabs'; import { ChartsModule } from 'ng2-charts/ng2-charts'; import { ModalModule } from "ngx-bootstrap"; import { ToastModule } from 'ng2-toastr/ng2-toastr'; import { BrowserAnimationsModule } from "@angular/platform-browser/animations"; import { DataTablesModule } from "angular-datatables"; import { Ng2TableModule } from "ngx-datatable"; @NgModule({ imports: [ ToastModule.forRoot(), BrowserModule, AppRoutingModule, BsDropdownModule.forRoot(), TabsModule.forRoot(), ChartsModule, ModalModule, BrowserAnimationsModule, DataTablesModule, Ng2TableModule, ModalModule.forRoot() ], declarations: [ AppComponent, ...APP_CONTAINERS, ...APP_COMPONENTS, ...APP_DIRECTIVES ], providers: [{ provide: LocationStrategy, useClass: HashLocationStrategy }], bootstrap: [ AppComponent ] }) export class AppModule { } /home/eduardomqs/estagio/scl/src/app/_nav.ts: export const navigation = [ { name: 'Dashboard', url: '/dashboard', icon: 'icon-speedometer', badge: { variant: 'info', text: 'Novo' } }, { title: true, name: 'Laboratórios' }, { name: 'Itens Por Laboratório', url: '/itens-por-laboratorio', icon: 'icon-puzzle', }, { title: true, name: 'Acesso' }, { name: 'Parâmetros', url: '/parametros', icon: 'icon-puzzle' }, { name: 'Requisição', url: '/requisicao', icon: 'icon-puzzle' }, { name: 'CRS', url: 'http://crs.unochapeco.edu.br/site', icon: 'icon-cloud-download', class: 'mt-auto', variant: 'primary' } ]; /home/eduardomqs/estagio/scl/src/app/views/parametros/parametros-routing.module.ts: import { NgModule } from '@angular/core'; import { Routes, RouterModule } from '@angular/router'; import {ParametrosComponent} from "./parametros.component"; const routes: Routes = [ { path: '', data: {title: 'Parâmetros'}, children: [ { path: '', component: ParametrosComponent, data: {title: 'Parâmetros'} } ] } ]; @NgModule({ imports: [RouterModule.forChild(routes)], exports: [RouterModule] }) export class ParametrosRoutingModule { } /home/eduardomqs/estagio/scl/src/app/views/parametros/parametros.module.ts: import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { ParametrosRoutingModule } from './parametros-routing.module'; import { ParametrosComponent } from './parametros.component'; import {ModalModule} from "ngx-bootstrap"; import {FormsModule} from "@angular/forms"; @NgModule({ imports: [ CommonModule, ParametrosRoutingModule, ModalModule.forRoot(), FormsModule ], declarations: [ParametrosComponent] }) export class ParametrosModule { } /home/eduardomqs/estagio/scl/src/app/views/parametros/parametros.component.ts: import {Component, OnInit, ViewChild, ViewContainerRef} from '@angular/core'; import {ModalDirective} from 'ngx-bootstrap'; import {Parametros} from '../../model/parametros'; import {ParametrosService} from '../../services/parametros.service'; import { ToastsManager } from 'ng2-toastr'; import {DataTableDirective} from 'angular-datatables'; import {Subject} from 'rxjs/Subject'; @Component({ selector: 'app-parametro', templateUrl: './parametros.component.html', styleUrls: ['./parametros.component.scss'], providers: [ParametrosService] }) export class ParametrosComponent implements OnInit { @ViewChild('novoParametroModal') novoParametroModal: ModalDirective; @ViewChild('deleteParametroModal') deleteParametroModal: ModalDirective; @ViewChild('editarParametroModal') editarParametroModal: ModalDirective; @ViewChild(DataTableDirective) dtElement: DataTableDirective; dtOptions: DataTables.Settings = {}; dtTrigger: Subject<any> = new Subject(); public parametro = new Parametros(); constructor(private parametroService: ParametrosService, public toastr: ToastsManager, vcr: ViewContainerRef) { this.toastr.setRootViewContainerRef(vcr); } public validation_messages = { id: [], desc_parametro: [] }; rerender(): void { this.dtElement.dtInstance.then((dtInstance: DataTables.Api) => { dtInstance.destroy(); this.getParametro(); }); } onSubmit() { if (this.parametro.id === null) { this.parametroService.create(this.parametro).subscribe( data => { const response = (data as Parametros); this.rerender(); this.toastr.success('Dados Salvos com Sucesso!', 'Sucesso!'); }, error => { if (error.parametro === 422) { this.toastr.error('Estão faltando dados, verfique os campos e tente novamente!', 'Oops!'); this.validation_messages = error.error.validation_messages; this.validation_messages.id = (<any>Object).values(this.validation_messages.id); this.validation_messages.desc_parametro = (<any>Object).values(this.validation_messages.desc_parametro); return; } else { this.toastr.error('Um erro ocorreu, contate o Administrador!', 'Oops!'); } } ); } else { this.parametroService.update(this.parametro).subscribe( data => { const response = (data as Parametros); for (const i in this.parametro) { if (this.parametro[i].id === response.id) { this.parametro[i] = response; } } this.rerender(); this.toastr.success('Dados Salvos com Sucesso!', 'Sucesso!'); this.cleanParametro(); }, error => { if (error.parametro === 422) { console.log(error); return; } else { this.toastr.error('Um erro ocorreu, contate o Administrador!', 'Oops!'); } } ); } } // solicitação de confirmação para a exclusão deleteConfirm(parametro) { this.parametro = parametro; this.deleteParametroModal.show(); } // exclusão de registro delete() { for (const i in this.parametro) { if (this.parametro[i] === this.parametro) { this.parametroService.delete(this.parametro).subscribe( data => { this.toastr.success('Registro Excluído com Sucesso!', 'Sucesso!'); this.rerender(); }, error => { this.toastr.error('Esse parametro está vinculado a uma requisição, e não pode ser deletado!', 'Oops!'); console.log(error); } ); break; } } this.deleteParametroModal.hide(); } // atualizar dado update(parametro) { this.parametro = parametro; this.editarParametroModal.show(); } // limpar objeto selecionado cleanParametro(): void { this.parametro = { id: null, desc_parametro: null, ativo: false, ano_vigente: 2018, semestre_vigente: 2 }; }; // pegar os registros getParametro(): void { this.parametroService.getParametro().subscribe(data => { const response = (data as any); this.parametro = response; this.dtTrigger.next(); }, error => { this.toastr.error('Um erro ocorreu, contate o Administrador!', 'Oops!'); console.log(error); } ); } ngOnInit() { this.getParametro(); this.dtOptions = <DataTables.Settings>{ pagingType: 'full_numbers', pageLength: 10, order: [0, 'desc'], language: { url: 'assets/language/pt-br.json' } }; } } /home/eduardomqs/estagio/scl/src/app/views/parametros/parametros.component.spec.ts: import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { ParametrosComponent } from './parametros.component'; describe('ParametrosComponent', () => { let component: ParametrosComponent; let fixture: ComponentFixture<ParametrosComponent>; beforeEach(async(() => { TestBed.configureTestingModule({ declarations: [ ParametrosComponent ] }) .compileComponents(); })); beforeEach(() => { fixture = TestBed.createComponent(ParametrosComponent); component = fixture.componentInstance; fixture.detectChanges(); }); it('should create', () => { expect(component).toBeTruthy(); }); }); /home/eduardomqs/estagio/scl/src/app/views/parametros/parametros.component.scss: .no-padding{ padding-left: 0px; } th,td { text-align: center; } tr { width: 100%; } .celula { width: 10%; } .celulaA { width: 30%; } #op { font-size: 18px; margin-left: 10px; margin-right: 10px; } #placeholderDiv{ margin-top: 20px; margin-bottom: 20px; } .ng-valid[required], .ng-valid.required { border-left: 5px solid #42A948; /* green */ } .ng-invalid:not(form) { border-left: 5px solid #a94442; /* red */ } /home/eduardomqs/estagio/scl/src/app/views/parametros/parametros.component.html: <div class="card"> <div class="card-header"> <h1>Parametro da Requisição</h1> </div> <div class="card-body"> <div class="btn group no-padding"> <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal" (click)="novoParametroModal.show(); cleanParametro();"> Novo Parâmetro </button> </div> <table datatable[dtOptions]="dtOptions" datatable[dtTrigger]="dtTrigger" class="table table-bordered table-striped"> <thead> <tr> <th class="celula">Ações</th> <th class="celulaA">ID</th> <th class="celulaA">Ativo</th> <th class="celulaA">Descrição do Parâmetro</th> </tr> </thead> <tbody> <tr *ngFor="let parametro of Parametro; let i = index"> <td class="celula"> <i class="fa fa-pencil" id="op" style="cursor: pointer; color: green" title="Editar" (click)="update(parametro)"></i> <i class="fa fa-trash" id="op" style="cursor: pointer; color: red" title="Excluir" (click)="deleteConfirm(parametro)"></i> </td> <td class="celulaA"> {{parametro.desc_Parametro}} </td> </tr> <!--<tr *ngIf="Parametro?.length == 0">--> <!--<td colspan="3" class="no-data-available">No data!</td>--> <!--</tr>--> </tbody> </table> </div> </div> <!--MODAL criar parametro--> <div bsModal #novoParametroModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog modal-primary" role="document"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title">Cadastrar novo Parâmetro:</h4> <button type="button" class="close" (click)="novoParametroModal.hide()" aria-label="Fechar"> <span aria-hidden="true">&times;</span> </button> </div> <form (ngSubmit)="onSubmit()"> <div id="placeholderDiv" class="col-sm-12"> <input id="formCriar" class="form-control" type="text" style="width: 100%" placeholder="Novo Parametro" [(ngModel)]="parametro.desc_parametro" ([ngModelOptions])="{standalone: true}" required #desc_parametro="ngModel" name="desc_parametro"> <div *ngIf="desc_parametro.errors && desc_parametro.touched" class="alert alert-danger"> <div *ngIf="desc_parametro.errors.required"> Um Parâmetro é necessário. </div> </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-secundary" (click)="novoParametroModal.hide();"> Cancelar </button> <button type="submit" class="btn btn-primary" (click)="novoParametroModal.hide();"> Salvar </button> </div> </form> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal --> <!--MODAL editar parametro--> <div bsModal #editarParametroModal="bs-modal" class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" [config]="{backdrop: 'static', keyboard: false}"> <div class="modal-dialog modal-primary" role="document"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title">Editar Parâmetro:</h4> <button type="button" class="close" (click)="editarParametroModal.hide(); rerender();" aria-label="Fechar"> <span aria-hidden="true">&times;</span> </button> </div> <form (ngSubmit)="onSubmit()"> <div id="placeholderDiv" class="col-sm-12"> <input [(ngModel)]="parametro.desc_Parametro" class="form-control" name="desc_Parametro" id="desc_Parametro" type="text" value="{{parametro.desc_Parametro}}" required #desc_Parametro="ngModel" name="ngModel"> <div *ngIf="desc_Parametro.errors && desc_Parametro.touched" class="alert alert-danger"> <div *ngIf="desc_Parametro.errors.required"> Um Parâmetro é necessário. </div> </div> </div> <div class="modal-footer"> <button type="button" class="btn btn-secundary" (click)="editarParametroModal.hide(); rerender();"> Cancelar </button> <button type="submit" class="btn btn-primary" (click)="editarParametroModal.hide()"> Salvar </button> </div> </form> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal --> <!--MODAL deletar parametro--> <div bsModal #deleteParametroModal="bs-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog modal-danger" role="document"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title">Excluir registro</h4> <button type="button" class="close" (click)="deleteParametroModal.hide()" aria-label="Fechar"> <span aria-hidden="true">&times;</span> </button> </div> <form> <div id="placeholderDiv" class="col-sm-12"> <p>Tem certeza que deseja excluir o Parâmetro {{parametro.desc_Parametro}}?</p> </div> <div class="modal-footer"> <button type="button" class="btn btn-secundary" (click)="deleteParametroModal.hide()"> Cancelar </button> <button type="button" class="btn btn-danger" (click)="delete()">Excluir </button> </div> </form> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal --> Nesse HTML também nos modais criar e editar é pra definir a descrição do parâmetro e se está ativo. /home/eduardomqs/estagio/scl/src/app/services/service.ts: import { HttpHeaders } from '@angular/common/http'; export class Service { protected headers = {headers: new HttpHeaders({ 'Content-Type': 'application/json', 'Accept': 'application/json', 'Authorization': 'Bearer 93b254ef3932952d11f8987c57f94caa28615b2d' })}; } /home/eduardomqs/estagio/scl/src/app/services/parametros.service.ts: import { Injectable } from "@angular/core"; import { HttpClient } from "@angular/common/http"; import { Parametros } from "../model/parametros"; import { Service } from "./service"; @Injectable() export class ParametrosService extends Service { constructor(private http: HttpClient ) { super(); } private baseUrl = 'http://localhost:3000/scl-parametros'; getParametro() { return this.http.get(this.baseUrl, this.headers); } create(parametro: Parametros) { return this.http.post(this.baseUrl, parametro, this.headers); } update(parametro: Parametros) { return this.http.put(this.baseUrl + '/' + parametro.id, parametro, this.headers); } delete(parametro: Parametros) { return this.http.delete(this.baseUrl + '/' + parametro.id, this.headers); } } /home/eduardomqs/estagio/scl/src/app/services/parametros.service.spec.ts: import { TestBed, inject } from '@angular/core/testing'; import { ParametrosService } from './parametros.service'; describe('ParametrosService', () => { beforeEach(() => { TestBed.configureTestingModule({ providers: [ParametrosService] }); }); it('should be created', inject([ParametrosService], (service: ParametrosService) => { expect(service).toBeTruthy(); })); }); /home/eduardomqs/estagio/scl/src/app/model/parametros.ts: export class Parametros{ id: number; desc_parametro: string; ativo: boolean; ano_vigente: number; semestre_vigente: number; } É minha atividade de estágio.
  9. Eu to aprendendo a usar JS, mas eu não consigo escrever aspas simples como um texto, ele so reconhece que estou fazendo uma string e da erro e não funciona o codigo: <!DOCTYPE html> <html> <head> <title>My page</title> </head> <body> <h1 id="title" style="font-size: 32px">This is my web page test</h1> <button onclick='document.getElementById("title").innerHTML = "Im testing"'>Click me</button> <button onclick="document.getElementById('title').style='font-size: 15px'">Small Text</button> <button onclick="document.getElementById('title').style='font-size: 50px'">Big Text</button> <button onclick="document.getElementById('title').innerHTML='This is my web page test'; document.getElementById('title').style='font-size: 32px'">Return</button> </body> </html> Na linha 8 eu quero escrever I'm testing, mas quando eu coloco a aspas no I'm ele não reconhece como texto e não funciona, como eu posso resolver isso?
  10. Boa tarde! Tenho a seguinte input date time, o que acontece que essa input chama sua id, porém não funciona com o meu script porque o script chama name e quando mudo para id não funciona o date time. É um script de replaceAll, ou seja ao selecionar a data e a hora no date time em teoria deveria substituir (NOME DO CLIENTE) pela data e hora.  Bom, eu gostaria de saber se tem como modificar o script para chamar a id em vez do name ou ajustar a input para ser chamada por name. Quando insiro a data através do date time ele não esta reemplaçando, porém quando eu digito a data na input ele reemplaça. <input id="demo3" type="text" size="25"><a href="javascript:NewCal('demo3','ddmmmyyyy',true,24)"><img src="images/cal.gif" width="16" height="16" border="0" alt="Pick a date"></a> $('input[name="demo3"]').change(function(){ var nome = $(this).val(); var text = $('textarea[name="nome pessoal"]').val(); $('textarea[name="nome pessoal"]').val(text.replaceAll('(NOME DO CLIENTE)',nome)); });
  11. Olá ! Mais uma vez venho pedir ajuda de vocês. É o seguinte: tenho um jogo tipo quis feito em HTML e JavaScript, e preciso salvar quantas perguntas o cara acertou no Banco de Dados, para ficar registrado. Tem a variável que armazena o resultado (score), mas eu não sei como enviar ela para o banco de dados (estou usando PostgreSQL e Java Web para programação). Alguma ideia? Segue o código: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>quis</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> var quiztitle = "quis de Primeiros Socorros"; var quis = [ { "question" : "1: Como socorrer uma vítima de crise convulsiva?", "image" : "https://nevrology-md.ru/files/source/Novostie/Nevrologie/chto-takoe-epilepsi43848834.jpg", "choices" : [ "Lateralizando a vítima, preferencialmente para o lado esquerdo", "Dando água para a vítima", "Segurando firme os braços da vítima, para evitar lesões pelos espasmos", "Puxando a língua da vítima com os dedos, para evitar sufocamento" ], "correct" : "Lateralizando a vítima, preferencialmente para o lado esquerdo", "explanation" : "A lateralização da vítima para o lado esquerdo serve para desobstruir as vias aéreas e evitar que a vítima sufoque, caso vomite. Não se deve movimentar a vítima ou tentar segurá-la, para evitar lesões na vítima e no próprio socorrista.", }, { "question" : "2: O que NÃO fazer em uma vítima de picada de cobra Jararaca?", "image" : "https://upload.wikimedia.org/wikipedia/commons/0/09/Jararaca_-_Bothrops_jararaca_-_Sibilando.jpg", "choices" : [ "Lavar o local com água e sabão", "Fazer torniquete", "Colocar pano limpo, sem pressionar a área", "Evitar que a vítima faça movimentos bruscos" ], "correct" : "Fazer torniquete", "explanation" : "Os torniquetes deverão ser utilizados como um último recurso e, somente, para controlar os sangramentos provocados por ferimentos graves nas extremidades, quando todos os outros métodos de controle falharem.", }, { "question" : "3: O que significa DNV?", "image" : "", "choices" : [ "Distúrbio Neuro-Vascular", "Doença Neurovegetativa", "Doença do Nervo Vagu", "Disúrbio Neurovegetativo" ], "correct" : "Disúrbio Neurovegetativo", "explanation" : "Distúrbio neurovegetativo é um transtorno psicológico no qual o paciente atribui seus sintomas a um mau funcionamento de um sistema ou de órgão inervado e controlado pelo sistema neurovegetativo (autônomo) porém exames exaustivos não indicam nenhum problema significativo nesse sistema.", }, ]; var currentquestion = 0, score = 0, submt=true, picked; jQuery(document).ready(function($){ function htmlEncode(value){ return $(document.createElement('div')).text(value).html(); } function addChoices(choices){ if(typeof choices !== "undefined" && $.type(choices) == "array"){ $('#choice-block').empty(); for(var i=0;i<choices.length; i++){ $(document.createElement('li')).addClass('choice choice-box').attr('data-index', i).text(choices[i]).appendTo('#choice-block'); } } } function nextQuestion(){ submt = true; $('#explanation').empty(); $('#question').text(quis[currentquestion]['question']); $('#pager').text('Pergunta ' + Number(currentquestion + 1) + ' de ' + quis.length); if(quis[currentquestion].hasOwnProperty('image') && quis[currentquestion]['image'] != ""){ if($('#question-image').length == 0){ $(document.createElement('img')).addClass('question-image').attr('id', 'question-image').attr('src', quis[currentquestion]['image']).attr('alt', htmlEncode(quis[currentquestion]['question'])).insertAfter('#question'); } else { $('#question-image').attr('src', quis[currentquestion]['image']).attr('alt', htmlEncode(quis[currentquestion]['question'])); } } else { $('#question-image').remove(); } addChoices(quis[currentquestion]['choices']); setupButtons(); } function processQuestion(choice){ if(quis[currentquestion]['choices'][choice] == quis[currentquestion]['correct']){ $('.choice').eq(choice).css({'background-color':'#228B22'}); $('#explanation').html('<strong>Correto!</strong> ' + htmlEncode(quis[currentquestion]['explanation'])); score++; } else { $('.choice').eq(choice).css({'background-color':'#D92623'}); $('#explanation').html('<strong>Incorreto.</strong> ' + htmlEncode(quis[currentquestion]['explanation'])); } currentquestion++; $('#submitbutton').html('Próxima Pergunta »').on('click', function(){ if(currentquestion == quis.length){ endQuiz(); } else { $(this).text('Verificar Resposta').css({'color':'#222'}).off('click'); nextQuestion(); } }) } function setupButtons(){ $('.choice').on('mouseover', function(){ $(this).css({'background-color':'#e1e1e1'}); }); $('.choice').on('mouseout', function(){ $(this).css({'background-color':'#fff'}); }) $('.choice').on('click', function(){ picked = $(this).attr('data-index'); $('.choice').removeAttr('style').off('mouseout mouseover'); $(this).css({'border-color':'#222','font-weight':700,'background-color':'#c1c1c1'}); if(submt){ submt=false; $('#submitbutton').css({'color':'#000'}).on('click', function(){ $('.choice').off('click'); $(this).off('click'); processQuestion(picked); }); } }) } function endQuiz(){ $('#explanation').empty(); $('#question').empty(); $('#choice-block').empty(); $('#submitbutton').remove(); $('#question').text("Você acertou " + score + " de " + quis.length + " perguntas."); $(document.createElement('h2')).css({'text-align':'center', 'font-size':'4em'}).text(Math.round(score/quis.length * 100) + '%').insertAfter('#question'); } function init(){ if(typeof quiztitle !== "undefined" && $.type(quiztitle) === "string"){ $(document.createElement('h1')).text(quiztitle).appendTo('#frame'); } else { $(document.createElement('h1')).text("quis").appendTo('#frame'); } if(typeof quis !== "undefined" && $.type(quis) === "array"){ $(document.createElement('p')).addClass('pager').attr('id','pager').text('Questão 1 de ' + quis.length).appendTo('#frame'); //add first question $(document.createElement('h2')).addClass('question').attr('id', 'question').text(quis[0]['question']).appendTo('#frame'); //add image if present if(quis[0].hasOwnProperty('image') && quis[0]['image'] != ""){ $(document.createElement('img')).addClass('question-image').attr('id', 'question-image').attr('src', quis[0]['image']).attr('alt', htmlEncode(quis[0]['question'])).appendTo('#frame'); } $(document.createElement('p')).addClass('explanation').attr('id','explanation').html(' ').appendTo('#frame'); //questions holder $(document.createElement('ul')).attr('id', 'choice-block').appendTo('#frame'); //add choices addChoices(quis[0]['choices']); //add submit button $(document.createElement('div')).addClass('choice-box').attr('id', 'submitbutton').text('Verificar Resposta').css({'font-weight':700,'color':'#222','padding':'30px 0'}).appendTo('#frame'); setupButtons(); } } init(); }); </script> <style type="text/css" media="all"> /*css reset */ html,body,div,span,h1,h2,h3,h4,h5,h6,p,code,small,strike,strong,sub,sup,b,u,i{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0;} article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;} body{line-height:1; font:normal 0.9em/1em "Helvetica Neue", Helvetica, Arial, sans-serif;} ol,ul{list-style:none;} strong{font-weight:700;} #frame{max-width:620px;width:auto;border:1px solid #ccc;background:#fff;padding:10px;margin:3px;} h1{font:normal bold 2em/1.8em "Helvetica Neue", Helvetica, Arial, sans-serif;text-align:left;border-bottom:1px solid #999;padding:0;width:auto} h2{font:italic bold 1.3em/1.2em "Helvetica Neue", Helvetica, Arial, sans-serif;padding:0;text-align:center;margin:20px 0;} p.pager{margin:5px 0 5px; font:bold 1em/1em "Helvetica Neue", Helvetica, Arial, sans-serif;color:#999;} img.question-image{display:block;max-width:250px;margin:10px auto;border:1px solid #ccc;width:100%;height:auto;} #choice-block{display:block;list-style:none;margin:0;padding:0;} #submitbutton{background:#5a6b8c;} #submitbutton:hover{background:#7b8da6;} #explanation{margin:0 auto;padding:20px;width:75%;} .choice-box{display:block;text-align:center;margin:8px auto;padding:10px 0;border:1px solid #666;cursor:pointer;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;} </style> </head> <body> <div id="frame" role="content"> </div> </body> </html> Deixei o código completo, caso vocês queiram testar também ou precisem usar. É um quis bem legal. Mas a função importante mesmo daí é a function endQuiz() (eu acho). (não sei bem o motivo, mas o "quis" foi corrigido para "quis" eu muitos lugares. Desculpem). Muitíssimo obrigada!
  12. Tenho o seguinte código: <script type="text/javascript"> $(document).ready(function(){ var SPMaskBehavior = function (val) { return val.replace(/\D/g, '').length === 11 ? '(00) 00000-0000' : '(00) 0000-00009'; }, spOptions = { onKeyPress: function(val, e, field, options) { field.mask(SPMaskBehavior.apply({}, arguments), options); } }; $("#pai_telefone").mask(SPMaskBehavior, spOptions); $("#mae_telefone").mask(SPMaskBehavior, spOptions); }) </script> Este código faz com que eu digitando o telefone ele identifica se é fixo ou celular... Preciso transformar esta função em duas, uma para formatar somente telefone fixo (19) 9999-9999 e outra somente para celular (19) 98888-8888. NO CASO O FIXO COLOCA O () E O TRAÇO - NO CASO DO CELULAR COLOCA O () O TRAÇO - E O 9 NA FRENTE. Estou tentando criar editando o código acima e está dando erro deve ser algo que eu esteja fazendo errado. Caso alguém tenha de data de nascimento já ajuda também. __/__/____ 11/11/1111 Obrigado e desculpa se o tópico for repetido.
  13. Olá! Estou tentando fazer um cadastro que funcionaria da seguinte forma: Vou fazer a página de cadastro de uma determinada função; Dentro desse cadastro, quero colocar um botão de "+" para que o usuário possa adicionar EPIs relacionados à função; Esses EPIs já estão cadastrados no sistema, daí a ideia era que aparecesse uma lista dos EPIs cadastrados e o usuário selecionasse o que ele quiser; Quando ele clicasse no "+" apareceria uma outra lista, e etc; É JavaWeb, então é página em .jsp. O código que tenho é para adicionar um campo de texto simples, sem ser do tipo "select". <script type="text/javascript"> var qtdeCampos = 0; function addCampos() { var objPai = document.getElementById("campoPai"); //Criando o elemento DIV; var objFilho = document.createElement("div"); //var objData = document.createElement("div"); //Definindo atributos ao objFilho: objFilho.setAttribute("id","epi"+qtdeCampos); //objData.setAttribute("id","data"+qtdeCampos); //Inserindo o elemento no pai: objPai.appendChild(objFilho); //objPai.appendChild(objData); //Escrevendo algo no filho recém-criado: document.getElementById("epi"+qtdeCampos).innerHTML = "<input type='text' id='epi"+qtdeCampos+"' name='epi[]' value='EPI: "+qtdeCampos+"'><input type='button' onClick='removerCampo("+qtdeCampos+")' value='Apagar EPI'>"; //document.getElementById("data"+qtdeCampos).innerHTML = "<input type='text' id='data"+qtdeCampos+"' name='data[]' value='Data de Recebimento: "+qtdeCampos+"'> \n\\n\ qtdeCampos++; } function removerCampo(id) { var objPai = document.getElementById("campoPai"); var objFilho = document.getElementById("epi"+id); //Removendo o DIV com id específico do nó-pai: var removido = objPai.removeChild(objFilho); } </script> No formulário fica assim: <div> <label for="epiFunc">EPIs: </label> <div id="campoPai"></div> <input type="button" value="Adicionar EPIs" onclick="addCampos()"> </div> Aí não estou conseguindo transformar esse "text" em um select. Espero que alguém possa me ajudar! Obrigada !!
  14. galera to querendo fazer um navegador feito em html e js, tentei com um iframe pra fazer o window, mas ele não permite abrir certos sites, então pesei no seguinte carregar numa div, mas por enquanto só funciona com paginas locais, ele carrega a documentação em html dentro de uma div, mas o que eu quero é carregar uma url, uma paguna online, mas não vejo nada sobre isso, pensei que talvez se capturasse o codigo através da url e carregando ele na div poderia ser possível, mas também acho que não daria certo pois assim acho que o site ficaria incompleto, acho que eu teria que usar uma linguagem server side, mas ainda não tenho conhecimento, estou tentando somente com html e js se alguem pudeer me esclarecer se, ou como pode ser possível, porque to tendo essa dificuldade...
  15. Oi gente, eu estou tentando inverter um código de COMENTÁRIOS no meu BLOG, eu quero inverter e por os do FACEBOOK primeiro, porém, já modifiquei tudo nesse código e não consegui consertar, ele fica bugado. Sei que é besteira mas eu não to conseguindo "trocar as ordens" Print do código anexado
  16. Estou com dificuldade de passar os scripts feito no scratch para as linguagem de programação.
  17. Dale galera! Recentemente eu recebi uma proposta de estágio pra front-end , utilizando react native + Redux , bem massa a proposta , estou fazendo ciência da computação mas iria se encaixar no meu horário. A dúvida é o seguinte ... eu preciso criar um app o qual o usuário irá desenhar caixas de texto na tela.. porém eu ainda não tenho conhecimento em React native , e precisaria estudar e tal , dai eu já até pensei em fazer um curso na udemy.. Mas eu preciso responder em quanto tempo eu demoraria pra fazer esse app.. O que vocês acham ? 2 semanas seria um tempo bom pra aprender essa nova linguagem e fazer o app ? Eu acho que o app é até bem simples... eu tenho conhecimento em C e Java , um pouco de html , css , e C++. , então não iria iniciar do " Completo Zero " kkkkk. O que vocês acham ? me deem sugestões please!
  18. como faço com que a último dado lido apareça no topo da página, como acontece com o gmail? Cada mensagem nova que chega fica, por padrão, no topo da página. É por ordem de chegada. Como faço isso com o JavaScript?
  19. OI, como faço para ao clicar em uma div, mostrar um conteúdo , porém, se já tiver uma div ativa, desativa-la? Link no W3S: https://www.w3schools.com/howto/howto_js_collapsible.asp var coll = document.getElementsByClassName("collapsible"); var i; for (i = 0; i < coll.length; i++) { coll[i].addEventListener("click", function() { this.classList.toggle("active"); var content = this.nextElementSibling; if (content.style.display === "block") { content.style.display = "none"; } else { content.style.display = "block"; } }); }
  20. Boa noite, estou usando um framework chamado phaser para o desenvolvimento de games em javascript, porém apesar de ter baixado o arquivo e linkado quando dou um console.log(Phaser) era para aparecer as bibliotecas carregadas mas não aparecem, se alguém já lidou com isso e sabe qual o problema, o porque do arquivos não carregarem eu agradeço, e o arquivo está linkado corretamente, tenho certeza. Desde já agradeço.
  21. Oi, tenho um código de procura em tabela em tempo real, basicamente ele cria tr, e depois no input é filtrado. Podem ver o código aqui: http://jsfiddle.net/19scgzox porém, o que eu quero fazer é um tipo de de "catalogo" de uma loja virtual. Logo no começo do script tem: var tbody = document.getElementById("tbody"); var dados = [ ["Tênis"], ["Mochila"], ["Blusa"], ["Bolsa"] ]; Se eu coloco, no lugar de um texto, por exemplo, eu coloco um ["<a href=#>Tênis</a>], todo o codigo para de funcionar (podem ver o erro no console). Como eu resolvo este problema?
  22. Olá, Estou apanhando do Javascript mas sigo em frente. Porém estou precisando de ajuda. Estou seguindo este tutorial pra criar um mapa renderizado na tela que carrega as imagens baseado em uma matriz: https://www.creativebloq.com/html5/build-tile-based-html5-game-31410992 A demo em funcionamento pode ser vista aqui: http://dan.nea.me/tile-based-games-demo/ E neste link pode ser baixado o source completo: http://dan.nea.me/tile-based-games/ O problema é que mesmo seguindo o tutorial, eu não estou conseguindo entender como usar as classes e funções do Javascript. Por enquanto pra mim ta meio obscuro a sintaxe complexa do Javascript. Eu consegui renderizar o mapa. Até aí tudo bem. Eu então adicionei um código simples que gerencia os cliques e posições do mouse. Até aqui tudo bem. Agora a questão fica em como chamar as funções do framework "Agent.js", "Joystix.js" e "KeyboardController.js" no Javascript pra passar as coordenadas do mouse pro sprite. É isso que quero fazer até o momento. Alguém pode me ajudar? Vou passar aqui o que tenho. Código que renderiza o mapa: <html> <head> <title>Site</title> <link rel="stylesheet" media="screen" href="css/normalise.css"></link> <link rel="stylesheet" media="screen" href="css/canvases.css"></link> <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script> <script type="text/javascript" src="js/lib/underscore-min-1.4.3.js"></script> <script type="text/javascript" src="js/lib/toolbox.js"></script> <script data-main="js/main" src="js/lib/require.js"></script> <script type="text/javascript" src="js/track.js"></script> <script type="text/javascript" src="js/KeyboardController.js"></script> <script type="text/javascript" src="js/Joystix.js"></script> <script src="js/jquery-3.3.1.min.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function(){ $('html').mousemove(function(event){ console.log("mouse move X:"+event.pageX+" Y:"+event.pageY); }); // AQUI NO EVENTO DE CLICK DO MOUSE NA TELA ESTOU TENTANDO MOVIMENTAR O PERSONAGEM $('html').click(function(event){ require(['js/Joystix'], function(Joystix){ joystix.onMove(function(movement){ player.doMove(movement.x1 * 0.01, movement.y1 * 0.01); }); console.log("mouse click X:"+event.pageX+" Y:"+event.pageY); }); }); $('html').keyup(function(event){ console.log("keyboard event: key pressed "+event.keyCode); }); }); </script> </head> <body> </body> </html> E as demais classes que não estou sabendo como instanciar as classes e usar os métodos das classes. Ainda não me acostumei com a sintaxe do Javascript. main.js /* main.js file */ require(['lib/DependencyLoader', 'BackgroundRenderer', 'CharacterRenderer', 'CollisionMap', 'Agent', 'Mob', 'Tileset', 'Joystix'], function(DependencyLoader, BackgroundRenderer, CharacterRenderer, CollisionMap, Agent, Mob, Tileset, Joystix){ 'use strict'; var map = [ [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1], [3,0,0,0,0,2,1,3,0,0,0,0,0,0,0,0,0,2,3,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2], [3,0,0,0,2,1,3,0,0,0,0,0,0,0,0,0,0,0,2,3,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2], [3,0,0,0,2,3,0,0,2,1,3,0,0,0,0,0,0,0,0,0,0,0,0,0,2,3,0,0,2,3,0,0,0,0,0,2], [3,0,0,0,2,3,0,0,2,1,1,1,3,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2], [3,0,0,0,2,3,0,0,0,0,2,1,1,1,1,3,0,0,0,0,0,0,0,0,0,0,2,3,0,0,0,0,0,0,0,2], [3,0,0,0,0,0,0,0,0,0,0,2,1,3,0,0,0,0,0,0,0,0,2,3,0,0,0,0,0,0,0,0,0,0,0,2], [3,0,0,0,0,0,0,0,0,0,2,1,3,0,0,0,2,3,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2], [3,0,0,0,0,0,0,0,0,0,2,3,0,0,0,2,1,1,3,0,0,0,0,0,0,0,0,0,0,0,0,0,2,1,1,1], [3,0,0,0,2,3,0,0,0,0,2,1,3,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,2,1,1,1,1,1], [3,0,0,0,0,0,0,0,0,0,2,3,0,0,2,1,1,1,3,0,0,0,0,0,0,0,0,0,0,0,0,0,2,1,1,1], [3,0,0,0,0,0,0,0,0,2,1,3,0,0,0,0,0,0,0,0,0,0,0,0,0,2,3,0,0,0,2,1,1,1,1,1], [3,0,0,0,0,0,0,0,0,0,2,3,0,0,0,0,0,0,2,1,1,1,3,0,0,0,0,0,2,1,1,1,1,1,1,1], [3,0,0,0,0,0,0,0,0,0,0,0,0,2,3,0,0,0,0,0,0,0,0,0,0,0,2,1,1,1,1,1,1,1,1,1], [1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1] ], tileSize = 24, $body = $('body'), $window = $(window), $canvas, canvases = [], bgRenderer, characterRenderer, joystick = new Joystix({ //assumeTouch: true, $window: $(window), keyboardSpeed: 10 }), spritesToLoad = 2, bgTileset = new Tileset({ spritePath: 'img/sf2-map.png', specPath: 'spec/sf2-map.json', onReady: loadCb }), player = new Agent({ position: {x:1,y:1}, collision: new CollisionMap({ map: map }), tileset: new Tileset({ spritePath: 'img/sf2-characters.png', specPath: 'spec/sf2-characters.json', onReady: loadCb }) }), monster = new Mob({ position: {x:20,y:10}, collision: new CollisionMap({ map: map }), tileset: new Tileset({ spritePath: 'img/sf2-characters.png', specPath: 'spec/sf2-goblin.json', onReady: loadCb }), targetAgent: player }), monster2 = new Mob({ position: {x:24,y:7}, collision: new CollisionMap({ map: map }), tileset: new Tileset({ spritePath: 'img/sf2-characters.png', specPath: 'spec/sf2-goblin.json', onReady: loadCb }), targetAgent: player }), monster3 = new Mob({ position: {x:20,y:4}, collision: new CollisionMap({ map: map }), tileset: new Tileset({ spritePath: 'img/sf2-characters.png', specPath: 'spec/sf2-goblin.json', onReady: loadCb }), targetAgent: player }); function loadCb(){ spritesToLoad--; if(!spritesToLoad){ run(); } } function run(){ // build layers _(4).times(function(i){ $canvas = $('<canvas width="'+(map[0].length * tileSize)+'" height="'+(map.length * tileSize)+'" data-index="'+i+'" class="gamecanvas canvas'+i+'"/>'); $body.append($canvas); canvases.push($canvas); }); // start renderers bgRenderer = new BackgroundRenderer({ $el: canvases[1], map: map, tileSet: bgTileset, tileSize: tileSize }); characterRenderer = new CharacterRenderer({ $el: canvases[2], tileSize: tileSize, agents: [ player, monster, monster2, monster3 ] }); // input joystick.onMove(function(movement){ player.doMove(movement.x1 * 0.01, movement.y1 * 0.01); }); // run game function gameLoop(){ characterRenderer.draw(); monster.chooseAction(); monster2.chooseAction(); monster3.chooseAction(); window.requestAnimationFrame(gameLoop); } gameLoop(); centerCanvases(); } // resize function centerCanvases(){ _(canvases).each(function($canvas){ $canvas.css({ top: ($window.height() - $canvas.height())/2 }); }); } $window.resize(_.throttle(centerCanvases,250)); }); Joystix.js define(['lib/Modernizr.2.6.2-touch', 'gamepadSupport', 'MultiTouchJoystick', 'KeyboardController', 'lib/requestAnimationFrame'], function(Modernizr, gamepadSupport, MultiTouchJoystick, KeyboardController){ 'use strict'; function Joystix(opts){ this.$window = opts.$window; this.moveCb = function(){}; this.buttonCb = function(){}; this.numButtons = 15; this.keyboardSpeed = opts.keyboardSpeed || 5; this.assumeTouch = !!opts.assumeTouch; gamepadSupport.init(); gamepadSupport.startPolling(); MultiTouchJoystick.init(this.$window.width(), this.$window.height()); KeyboardController.init(this.$window); this.poll(); } Joystix.prototype.onMove = function(cb){ this.moveCb = cb; }; Joystix.prototype.onButtonPress = function(cb){ this.buttonCb = cb; }; Joystix.prototype.getMovementForGamepad = function(axesStatus){ return { x1: axesStatus[0], y1: axesStatus[1], x2: axesStatus[2], y2: axesStatus[3] }; }; Joystix.prototype.getMovementForMultiTouch = function(xy){ return { x1: xy.x, y1: xy.y, x2: 0, y2: 0 }; }; Joystix.prototype.getMovementForKeyboard = function(movementStatus){ var x = movementStatus.RIGHT ? this.keyboardSpeed : (movementStatus.LEFT ? -this.keyboardSpeed : 0), y = movementStatus.DOWN ? this.keyboardSpeed : (movementStatus.UP ? -this.keyboardSpeed : 0); return { x1: x, y1: y, x2: 0, y2: 0 }; }; Joystix.prototype.getButtonPressForMultiTouch = function(isPressed){ var buttonArray = []; _(this.numButtons).times(function(){ buttonArray.push(false); }); buttonArray[0] = isPressed; return buttonArray; }; Joystix.prototype.getButtonsForKeyboard = function(isPressed){ var buttonArray = []; _(this.numButtons).times(function(){ buttonArray.push(false); }); buttonArray[0] = isPressed; return buttonArray; }; Joystix.prototype.poll = function(){ var self = this; function loop(){ var status; if(gamepadSupport.gamepads.length){ status = gamepadSupport.getStatus(); self.moveCb(self.getMovementForGamepad(status.movedAxes)); self.buttonCb(status.buttonPresses); }else if((Modernizr && Modernizr.touch) || self.assumeTouch){ self.moveCb(self.getMovementForMultiTouch(MultiTouchJoystick.getMovementIntent())); self.buttonCb(self.getButtonPressForMultiTouch(MultiTouchJoystick.getButtonPress())); }else{ self.moveCb(self.getMovementForKeyboard(KeyboardController.getMovement())); self.buttonCb(self.getButtonsForKeyboard(KeyboardController.getButtonPress())); } window.requestAnimationFrame(loop); } loop(); }; return Joystix; }); Agent.js define(function(){ return Toolbox.Base.extend({ constructor: function(options){ this.position = options.position || {x:0,y:0}; this.collision = options.collision; this.tileset = options.tileset; }, doMove: function(moveX,moveY){ this.position.x = this.collision.getPosition(0, this.position.x, this.position.y, moveX); this.position.y = this.collision.getPosition(1, this.position.x, this.position.y, moveY); }, setPosition: function(pos){ pos = pos || {}; this.position.x = pos.x || 0; this.position.y = pos.y || 0; }, getSprite: function(){ return this.tileset.sprite; }, getTileId: function(){ return (Math.floor(new Date().getTime()/500)%2) ? 'standing' : 'standing_alt'; }, getTileSpec: function(){ return this.tileset.tileSpec; } }); }); A classe main.js renrediza o mapa e inicializa variáveis. A classe Joystix.js gerencia os eventos de teclas. A classe Agent.js gerencia a criação e posição do personagem. Estou pegando a posição x e y do mouse e quero a princípio que o personagem principal mova-se para a posição do clique do mouse ao invés de usar as setas do teclado que é o padrão do framework. Estou pedindo ajuda em foruns de desenvolvimento de jogos mas no Brasil a maioria está jogada as traças infelizmente, muito abandonados. Então resolvi pedir ajuda aqui pois esse framework muito me interessa a aprender e programá-lo. Muito obrigado por qualquer ajuda.
  23. como desenvolver um sistema web para manter os registros dos livros, agilizar a consulta e facilitar a localização dos livros da bibliotaca
  24. Qual a diferença de criar ou alterar propriedades de um objeto utilizando a sintaxe antiga e a atual padronizada pela ES5? Eles quiseram dizer o que criando novos métodos de Object? Para alterar uma propriedade eles complicaram mais ainda, mas com qual intuito? Configurando ou adicionando propriedade com os padrões antigos: var dias = {quarta : 344, quinta : 232, sexta : 132} dias.sábado = 34234; Configurando ou adicionando propriedade com os padrões introduzidos pelo ES5: var dias = {quarda : 343, quinta : 3123, sexta : 433}; Object.defineProperty(dias, "sábado", {value : 2213);

Sobre o Clube do Hardware

No ar desde 1996, o Clube do Hardware é uma das maiores, mais antigas e mais respeitadas publicações sobre tecnologia do Brasil. Leia mais

Direitos autorais

Não permitimos a cópia ou reprodução do conteúdo do nosso site, fórum, newsletters e redes sociais, mesmo citando-se a fonte. Leia mais

×