segunda-feira, 30 de outubro de 2017

Rank

No rank e visualizado as vinte melhores pontuações de cada dificuldade, na dificuldade fácil será visualizado os usuários que realizarão o modo competição na dificuldade fácil, assim será realizado nas outras dificuldades, cada dificuldade o usuário poderá ter apenas um registro e cada vez que ele realizar o modo competição na dificuldade já realizada a sua pontuação será atualizada.

postado por jose leandro n° 12

segunda-feira, 16 de outubro de 2017

Back-end #6: Upload de imagem

Olá, seja bem-vindo ao nosso blog! Aqui é o Pedro e TEM POST ATRASADO, TEM PROJETO ATRASADO, TEM ATRASO ATRASADO, TÁ TUDO ATRASADO NESSSA P#RR@


***


gambiarraaaaaaaaaaaaa


Olá pessoas, essa semana eu fiquei responsável pela parte de upload da capa dos conteúdos que eu não sabia que ia ter e atrasou ainda mais o meu progresso.

Para realizar essa tarefa eu tentei de TUDO, MAS DE TUDO MESMO e sempre tinha algum problema, porque eu não podia simplesmente fazer o upload, converter e salvar no banco, o que eu tinha que fazer era:

Upload da foto -> redimensionar para o corte -> enviar para o corte do usuário -> mandar as coordenada -> recuperar a imagem -> cortar a imagem -> salvar

E em meio a tantos passos ocorreram os mais váriados bugs, como falha no upload, corte no lugar errado, imagem voltando preta, ajax não conseguindo trazer string base64 inteira...
Deu uma bela raiva terminar isso.

Enfim, depois de um dia inteiro consegui fazer funcionar do seguinte método:
  • Upload da imagem para o script PHP;
  • Redimensionamento usando a classe WideImage (ao invés da tradicional GD)
  • Conversão para base64 e criar cópia no banco de dados;
  • Retornar a imagem redimensionada e chamar API Jcrop para corte;
  • Enviar as coordenadas geradas pelo JCrop para o PHP;
  • Recuperar a imagem salva anteriormente no banco;
  • Cortar ainda usando a WideImage;
  • Gerar base64 e enviar via CURL para a API do imgur;
  • Recuperar a URL da imagem recortada e salvar no lugar da imagem salva anteriormente
  • Exibir o resultado.
Segue os prints da nova funcionalidade (layout ainda em fase de polimento).








É isso pessoinhas, semana que vem eu venho torrar a paciência de vocês novamente! :^)  




//Pedro Luiz, N° 17



Layout do 'Modo Competição' está pronto

Depois de muitas mudanças durante o ano, o layout final e oficial do 'Modo Competição' finalmente está definido! Como estamos na reta final de desenvolvimento do TCC está tela não tera mais modificações estéticas, apenas correções de bugs.

*Questão e alternativas presentes nesta imagem são apenas para fins de teste do sistema e obviamente não estará na versão final do projeto. ou estará, sei lá. 
**Detalhe pra minha foto de perfil de uma paródia zoada do 21 Savage kkkkkkk


terça-feira, 3 de outubro de 2017

Mais um assunto dos conteúdos previstos no curso...

*******************************************

ATOMÍSTICA - MODELOS ATÔMICOS:

slide 1:
A ideia de átomo surgiu na antiguidade e foi proposta por Demócrito. O termo átomo significa indivisível e é utilizado em química para representar a menor partícula que guarda característica de um determinado elemento.
O primeiro modelo atômico foi proposto por Dalton.

<átomo de Dalton>

O modelo de Dalton também é conhecido como modelo de bola de bilhar; para Dalton o átomo era uma esfera maciça que mudava de tamanho de acordo com o elemento.

Slide 2:
O segundo modelo foi proposto por Thomson, esse modelo foi proposto depois da descoberta do elétron, esse modelo ficou conhecido como pudim de passas, pois para Thomson o átomo era uma esfera maciça com os elétrons incrustados em sua superfície.

<átomo de Thomson>

Slide 3:
O terceiro modelo atômico foi proposto por Rutherford. Em seu experimento clássico, Rutherford aplicou um feixe de radiação sobre uma fina folha de ouro; como resultado ele observou que a luz adquiriu diversos comportamentos incomuns. Parte da luz atravessou a folha, parte ricocheteou, ambas espalharam o feixe luminoso em diversas direções. Ao fim de seu experimento, Rutherford propôs o modelo que ficou conhecido como modelo planetário. Segundo Rutherford a matéria era um grande vazio. O átomo proposto apresenta um núcleo positivo e a eletrosfera com os elétrons negativos orbitando.

<átomo de Rhuterford>

Slide 4:
O quarto modelo é mais um aprimoramento do que um modelo propriamente dito. Bohr, ao estudar o modelo de Rutherford percebeu que pela física clássica aceita na época, não seria possível um átomo se manter em termos energéticos; para explicar os átomos Bohr se baseou na teoria quântica elaborada por Max Planck e a partir desta elaborou três postulados para sustentar seu modelo:
  1. Os elétrons não se movem aleatoriamente ao redor do núcleo, mas sim em órbitas circulares, sendo que cada órbita apresenta uma energia bem definida e constante para cada elétron de um átomo. Quanto mais próximo do núcleo, menor a energia do elétron e vice-versa;
  2. Os níveis de energia são quantizados, ou seja, só são permitidas certas quantidaddes de energia para o elétron cujos valores são mútiplos inteiros do fóton (quantum de energia);
  3. Para passar de um nível de menor energia para um de maior energia, o elétron precisa absorver uma quantidade apropriada de energia. Quando isso ocorre, dizemos que o elétron realizou um salto quântico e atingiu um estado excitado. Esse estado é instável e quando o elétron volta para o seu nível de energia original (estado fundamental), ele libera a energia que havia absorvido na forma de onda elétromagnética (luz).

Slide 5:
O último modelo, adotado atualmente, foi proposto por Schrödinger com o suporte de várias contribuições de diversos cientistas. Neste modelo, os elétrons “giram” ao redor do núcleo não em órbitas mas em orbitais; os orbitais são definidos como a região ao redor do núcleo de maior probabilidade de se encontrar o elétron. Basicamente, o átomo atual apresenta um núcleo e uma “nuvem” eletrônica que se torna menos densa conforme se afasta do núcleo.



ATOMÍSTICA – NÚMEROS QUÂNTICOS E CONCEITOS FUNDAMENTAIS

Slide 1:

Conceitos fundamentais:
Os átomos são compostos de partículas menores denominadas: Próton, Nêutron e elétron. O que difere os elementos entre si são as quantidades dessas partículas. Alguns conceitos são importantes e indispensáveis:
  • Número atômico (Z): O número atômico é representado pela quantidade de prótons (p) existentes no núcleo; em outras palavras, o número atômico é o mesmo que a carga nuclear, ou ainda, Z = p.
  • Número de massa (A): A massa dos elétrons são infinitamente pequenas e a massa dos átomos são representadas pela soma das massas dos Prótons com os Nêutrons existentes no núcleo, assim: A = Z + n.
Com base nesses conceitos, podemos definir os isótopos, que são átomos de um mesmo elemento químico que apresentam o mesmo número de prótons mas diferem na massa.

Ex: 1H1 – Hidrogênio prótio, 1H2 – Hidrogênio deutério, 1H3 – Hidrogênio trítio.

Isóbaros são átomos que apresentam a mesma massa porém, pertencem a diferentes elementos químicos. Isótonos, são átomos que apresentam números atômicos diferentes, massas diferentes, porém apresentam o mesmo número de nêutrons.

Da mesma forma que as pessoas são diferenciadas pelo número do cpf, os átomos possuem um código que representa cada um de seus elétrons. Com esse código, é possível determinar qual é o elemento em questão, quantas camadas este elemento tem, em qual orbital se encontra o elétron e qual o sentido do giro deste elétron. Esse “código” é representado pelos números quânticos.
O primeiro número quântico (número quântico principal n) é a representação da camada; K, L, M, N, O, P, Q… passam a ser representados por 1, 2, 3, 4, 5, 6, 7. Assim, se o átomo possui 3 camadas o número quântico principal será representado por n = 3.

<img número quantico principal>

O segundo número quântico representa os subníveis de energia, em outras palavras, os orbitais. Um orbital é a região do espaço de maior probabilidade de se encontrar um elétron. Os orbitais podem ser de quatro tipos: s, p, d, f. Esses orbitais são representados por l = {0, 1, 2, 3}.

<img número quantico secundário>

O terceiro número quântico, também chamado de número quântico magnético (m ou ml), esse número representa a orientação dos subníveis no espaço. O subnível s suporta apenas um orbital, assim seu número quântico magnético é representado por m = {0}. O subnível p suporta três orbitais e sua representação é m = {-1, 0, +1}. O subnível d suporta cinco orbitais, assim m = {-2, -1, 0, +1, +2}. O subnível f suporta sete orbitais e sua representação é m = {-3, -2, -1, 0, +1, +2, +3}.

<img número quantico magnético>
O quarto número quântico é a representação do spin do elétron. O spin nada mais é que o sentido do giro do elétron (horário, anti-horário ou ainda para a esquerda ou para a direita). O número quântico spin é representado por ms ou simplesmente por s. O valor pode ser +1/2 ou -1/2.

<img número quantico spin>

Os átomos em seu estado natural, apresentam uma configuração de números quânticos única o que permite identificá-lo apenas por estes números.



ATOMÍSTICA – DISTRIBUIÇÃO ELETRÔNICA

Além de conhecer os números quânticos é necessário saber distribuir os elétrons corretamente. Linus Pauling propôs um diagrama que mostra a distribuição eletrônica de acordo com o aumento energético dos elétons.

<diagrama de Linus Pauling>

Neste diagrama é possível perceber que um elétron que se encontra na camada 3, no orbital d, possui energia maior que um orbital que se encontra na camada 4, no orbital s. Essa diferença energética se deve ao tamanho do orbital, em outras palavras, a distância que o elétron se encontra do núcleo.

Exemplos de distribuição eletrônica:

H – 1s1;
He – 1s2;
Li – 1s2, 2s1;
Be – 1s2, 2s2;
B – 1s2, 2s2, 2p1;
C – 1s2, 2s2, 2p2;
N – 1s2, 2s2, 2p3;
O – 1s2, 2s2, 2p4;
F – 1s2, 2s2, 2p5;

Exemplos de aplicação:
→ Determine o conjunto de números quânticos que caracterizam o elétron mais energético do Sc (Z = 21).
Resposta:
n = 3;
l = 2;
m = -2;
s = -1/2;

→ A distribuição eletrônica do Alumínio é = 1s2, 2s2, 2p6, 3s2, 3p1. Quais são os números quânticos referentes ao elétron da posição 3p1?
Resposta:
n = 3 (terceira camada);
l = 2 (sub-nível p);
m = -1 (primeiro orbital p);

s = -1/2 (rotação);



Willian, 22.

Pasta - TCC

Olá galerinha, tudo bem com  vocês?! Essa semana foi trabalhado o layout das tabelas para serem adicionadas a pasta do TCC. Essa pasta faz parte de uma das disciplinas trabalhadas no curso. Esse processo foi bem simples, mas demorado, pois nosso banco tem 20 tabelas. Eu apenas criei um documento no LibreOffice Writer e fui criando as tabelas e preenchi com os dados dos campos do nosso banco. Segue abaixo um exemplo onde transfiro os dados do banco para uma forma mais legível.
tabela no banco

layout da tabela para a pasta

domingo, 1 de outubro de 2017

Back-end #5: Adicionar Conteúdos - O DEBUG CONTRA-ATACA!

Olá, seja bem-vindo ao nosso blog! Aqui é o Pedro e AEEEEOOOOOW CARAMBA, FINALMENTE!


***


O que mais aconteceu nas últimas três semanas.
Olá meu povo! Hoje é um dia de alegria, de dar update sem where no banco de produção, de abusar da XGH, fazer while(true)... Bem, vocês entenderam ou não.

Enfim, essa semana, mais precisamente hoje eu consegui terminar de debugar a minha página de adição de conteúdo.

Para isso, precisei refatorar o código todo, e reescrever umas funções "burras" que eu fiz.

Um das maiores alterações que fiz eram de como eu tratava os arrays que entravam e saiam do JavaScript e do PHP.

Antes um array que ia pro JS assim (que dava um um trabalhão pra tratar depois):

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
<?php
 Array(
  [0] => "Enunciado_1",
  [1] => "resp_1",
  [2] => "resp_2",
  [3] => "resp_3",
  [4] => "resp_4",
  [5] => "resp_5",
  [6] => "Enunciado_2",
  [7] => "resp_1",
  [8] => "resp_2",
  [9] => "resp_3",
  [10] => "resp_4",
  [11] => "resp_5"
 )
?>

Agora vai assim:
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
<?php
Array(
  [0] => array(
    [0] => "Enunciado_1",
    [1] => "resp_1",
    [2] => "resp_2",
    [3] => "resp_3",
    [4] => "resp_4",
    [5] => "resp_5",
  )
  [1] => array(
    [0] => "Enunciado_2",
    [1] => "resp_1",
    [2] => "resp_2",
    [3] => "resp_3",
    [4] => "resp_4",
    [5] => "resp_5",
  )
 )
?>


Desse modo, posso fazer laços de repetição mais eficientes e que não vão bugar, além de não ter que ficar fazendo contas malucas para adivinhar em quais índices acabam uma pergunta e começam outra. 

Uma função que também se me mostrou uma mão na roda no JavaScript foi a "indexOf()", que retorna a posição de um array onde se encontra determinado valor.


1
2
3
var array = ['banana', 'maçã', 'pera', 'uva'];
console.log(array.indexOf('pera');
//o resultado será 2

Essa função me ajudou na hora de alterar ou excluir o conteúdo de algum slide, indo direto a o ponto, sem ter que fazer um for() percorrendo cada um dos índices. Isso também corrigiu vários bugs que existiam ao salvar o conteúdo.

Outra coisa que foi melhorada foram as queries, agora em vez de ter que ficar concatenando expressões " OR campo = ?" e afins, consegui fazer trabalharem de forma mais dinâmica e mais rápida.

Enfim, toda a criação, exclusão, alteração e leitura de questões e perguntas, tanto oficiais quanto da comunidade estão funcionando quase perfeitamente.

O que falta agora é implementar alguns testes para evitar dados inconsistentes dentro do banco de dados, como slides vazios e afins. Uma parte disso já foi implementada, que é a que bloqueia a inserção de slides com menos de 10 caracteres DE TEXTO, ou seja, o código já e capaz de separa as tags HTML e contar apenas os caracteres de texto.

Para isso usei a função replace() com uma expressão regular no JavaScript, e a função strip_tags() no PHP, que já faz o processo sem a necessidade de RegEx.

Estou implementando alerts para os erros e mensagens de confirmação, e também pretendo inserir telas de loading enquanto o conteúdo é carregado do banco de dados.

Creio que nessa semana essa tela fique pronta pro completo, e finalmente posso passar para outras telas e terminar a minha parte nesse projeto que parece não ter fim. Olha o drama

É isso pessoinhas, semana que vem eu venho torrar a paciência de vocês novamente! :^)  



//Pedro Luiz, N° 17

domingo, 24 de setembro de 2017

Back-end #4: Adicionar Conteúdos - Parte 2

Olá, seja bem-vindo ao nosso blog! Aqui é o Pedro e eu ainda não terminei de debugar essa porcaria de tela!

***

Quanto mais se usa meu código, mais ele buga ¬¬

Olá pessoas! Essa semana não fiz nada de muito excepcional além de continuar corrigindo a página de adição de conteúdo. O bug da vez foi o de excluir perguntas.

Atualmente o sistema não permite a alteração de uma questão, o que deve ser adicionado em breve, assim que o que estiver pronto ser corrigido.

Então, o que resta é excluir a pergunta e adicioná-la novamente. Até aí tudo ok.

Mas para evitar registros inúteis que poderão deixar o banco (mais) lento, criei um sistema que reaproveita as IDs excluídas, reativando-as famigerado renascer da Fênix como novas questões. E aí começa o problema.

Por fatores que incluiam o array vindo do Javascript (que vem com todos os dados que o usuário manipulou) e falhas no PHP devido a minha mania de programar com sono o sistema não conseguia reativar as IDs inutilizadas.

Porém, depois de muito matutar e procrastinar descobri que o erro era não ter definido o campo excluído como "N" nas questões excluídas, logo elas eram atualizadas, mas invisíveis pro sistema.

Fora essa, foram feitas várias outras correções, mas ficaria impossível de mostrar aqui. Porque ninguém iria entender as minhas gambiarras.



É isso pessoinhas, semana que vem eu venho torrar a paciência de vocês novamente! :^)  


//Pedro Luiz, N° 17



Conteúdo adicional da pasta

Sobre os sistemas que nos baseamos para a construção do QUIMICAMENTE:

Figura 1: Tela inicial do sistema Duolingo.



DUOLINGO – O Duolingo é um sistema online que permite que o usuário aprenda vários idiomas. Basicamente o sistema trabalha com traduções e repetições de conteúdos. O sistema tem acesso gratuito e a quantidade de idiomas que o usuário pode aprender depende dos idiomas que o usuário já domina, isto é, falando apenas português um usuário terá uma pequena lista de idiomas que poderá aprender; em contrapartida se um usuário já domina o inglês, a quantidade de idiomas que o usuário poderá aprender será bem maior.
Durante os estudos no sistema, o usuário irá desbloqueando conteúdos para estudar, isto significa que o sistema é dividido em níveis que garantem ao usuário um desenvolvimento gradual e em níveis.
O sistema foi lançado oficialmente em 19 de junho de 2012 e está disponível para iOS, Android e Windows Phone, bem como na Web.

(https://pt.wikipedia.org/wiki/Duolingo)

Figura 2: Tela de conteúdos do sistema Geekie.


GEEKIE – A plataforma geekie é um sistema de EaD para o ensino médio, todas as matérias do ensino médio estão contempladas no sistema. A plataforma é gratuita e o aluno/usuário pode escolher o que quer aprender, o curso se baseia em vídeos e resolução de exercícios. O Geekie pode ser utilizado nas escolas como uma ferramenta online para complemento da sala de aula.
O sistema foi lançado em 2011 e atualmente mais de 5 milhões de alunos já utilizaram o sistema.

(http://www.geekie.com.br/)

Figura 3: Tela de conteúdos do sistema Khan Academy.


KHAN ACADEMY – A Khan Academy é uma plataforma que permite que o aluno estude dentro e fora das escolas. Um professor pode adotar os conteúdos disponíveis no site e trabalhar de forma diferenciada dentro da sala de aula pois a Khan Academy está disponível na web e para Androide e iOS, permitindo que qualquer pessoa com um smartfone conectado à internet tenha acesso a todos os conteúdos da plataforma.
Enquanto o Duolingo trabalha com tradução de textos para a aprendizagem de idiomas e o GEEKIE apresenta um formato EaD para todo o conteúdo do ensino médio a Khan Academy tem um conteúdo mais específico. Os conteúdos abordados na plataforma são: Matemática, Ciências, Engenharia, Economia, Finanças, Computação, Artes e Humanidades. Em outras palavras, a Khan Academy, por ser um sistema Global trabalha com disciplinas de cunho geral que independente do idioma serão sempre as mesmas coisas.
O sistema foi lançado em setembro de 2006, e é totalmente gratuito, seu conteúdo pode ser acessado sem a necessidade de um cadastro no site.

(https://pt.khanacademy.org/about)


Postado por Willian, nº 22.

sábado, 23 de setembro de 2017

O contador finalmente funciona!

Depois de algum tempo quebrando a cabeça pra fazer o contador funcionar de maneira correta, finalmente ele funciona! Fiquei um tempo com um problema chato  por causa do cookie que usava no contador, onde, quando o tempo acabava e você atualizava a página, em vez do contador começar dos 30 minutos, ele somava mais trinta no cookie salvo anteriormente, e começava dos 60 minutos. A solução pra minha sorte era mais fácil do que eu pensava, só bastando eu criar uma condição onde, quando o tempo chegasse a zero, o cookie era apagado. Sim, só isso. E eu fiquei mó tempão tentando descobrir o que era, e era só isso. AAAAAAAAAAAAAAAA

quinta-feira, 21 de setembro de 2017

Prévia

Olllááááááááá, galerinha do youtubeeee, tudo bem com vocês?? Na quinta-feira rolou a temida, por mim, prévia do projeto, onde nós do grupo apresentamos tudo que temos pronto e aquilo que queremos acrescentar para os professores da banca, (banca - conjunto de professores do curso que são responsáveis por auxiliar e depois avaliar os trabalhos apresentados). Diferente do que eu estava imaginando foi tudo bem, nós todos conversamos e encontramos alguns erros que precisavam - precisam - ser corrigidos para que o nosso sistema funcione melhor, eles também nos auxiliaram a tirar e acrescentar partes no nosso sistema que nós tínhamos deixado passar despercebido, como por exemplo dois botoes de sair na navbar, também uma possível troca de cor do sistema, entre outros tópicos a serem resolvidos, mas não se preocupem, pois tudo que for alterado será repassado para vocês!! Bom esse foi mais um post semanal, semana que vem eu estou de volta com vocês.
 FALOU  e Fuiii. Beijos <3  

domingo, 17 de setembro de 2017

Futuras melhorias

Olá, seja bem-vindo ao nosso blog! Aqui é o Pedro E EU TO VENDO ESSE POVO KIBANDO O MEU FORMATO DE POST! Recuse cópias, só aceite o original =D


***


Eu "tentando" corrigir os bugs descobertos durante a apresentação prévia

Bom, depois da sessão de esculacho prévia, descobrimos várias melhorias e correções que precisamos fazer em nosso projeto, minhas páginas, por exemplo, não tem todas as funcionalidades prontas, e as que tem estão com vários bugs.

GERENCIAMENTO DE SALA
Verde = Pronto

Amarelo = Não iniciado ou em progresso

Vermelho = Pronto, porém com bugs


Essa é a tela que tenho mais trabalho pra fazer, já que foi iniciada depois da "conclusão" da tela de Adição de Conteúdo. O que falta fazer:
  • Corrigir liberação do botão para remoção do aluno (problema no evento checked);
  • Fazer Model e control: Elaborar prova, liberar módulo e detalhes (visual pronto);
  • Montar cálculos para rendimento;


ADIÇÃO DE CONTEÚDO




Essa foi a primeira tela a ficar "pronta", e tem os códigos mais bugados complexos. Nessa página falta:
  • Corrigir exclusão de pergunta do banco de dados
  • Corrigir layout
  • Corrigir salvamento do texto depois de aplicar alguma formatação (só salva no evento de tecla pressionada)
  • Adicionar atalhos via teclado
  • Mostrar descrição do conteúdo na tela de seleção
  • Corrigir numeração dos slides
  • Colocar alertas após salvamento
  • Opção para voltar a tela de seleção de módulos
  • Tirar limitação de slides
Embora essa página tenha bem mais "tasks", a maioria são coisas simples, que fácilmente podem ser arrumadas assim que eu parar de procrastinar

So much bugs!

Bom, ainda há muito a ser feito para deixarmos o sistema redondinho como queremos, tomara que até o fim do ano tudo dê certo!



É isso pessoinhas, semana que vem eu venho torrar a paciência de vocês novamente! :^)  


//Pedro Luiz, N° 17