quinta-feira, 27 de outubro de 2016

Como centralizar uma imagem dentro de uma div?

Nossa, pesquisei muito pra conseguir descobrir isso...

Tenho uma div e dentro dela uma imagem....

E essa imagem é maior que a div... então quero que o que seja maior que a div, desapareça...

Para isso é fácil, basta colocar na sua div via CSS:
overflow: hidden;
Isso eu copiei da capa (cover) das páginas do Facebook, dei um inspecionar elemento e vi como era feito.


Mas no meu caso só isso não era suficiente, pq eu queria que a imagem ficasse centralizada dentro da minha div...

Então é necessário dar um
top: -50px
ou um
margin-top: -50px
ou ainda com porcentagem: 10% por exemplo


Mas pra mim ainda não tinha dado certo... pq a imagem era dinâmica e podia ter vários tamanhos... então tive que adicionar esse CSS na imagem:
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);

E então funcionou :)


Se o seu caso for centralizar horizontalmente e não verticalmente, provavelmente vai ter q usar left ao invés de top e translateX ao invés de translateY... mas não testei isso...


Como cada caso é um caso, talvez você tenha que adicionar um
min-height: 200px;
na sua imagem, não necessariamente 200px mas o tamanho da sua div, isso faz com que imagens menores q o tamanho da div estiquem... mas tem que ver se é esse comportamento que você quer..


No meu caso ainda tive que usar media query pois queria alguns comportamentos diferentes no mobile/tablet/desktop... a div tinha tamanho diferente em cada device...


Bom, basicamente é isso.. Mais detalhes deem uma olhada no código do cover em qualquer perfil do Facebook e vejam esse artigo que foi onde achei a solução: http://jonrohan.codes/fieldnotes/vertically-center-clipped-image/


Abraço!
Adriano Schmidt

domingo, 25 de setembro de 2016

Como transferir um domínio de CPF para CNPJ no registro br?

Siga esses passos:

1) Preencher esse formulário: http://registro.br/cgi-bin/nicbr/transferencia_de_dominio
2) Validar se todos os dados no documento gerado no formulário estão corretos
3) Ir ao cartório para assinar o documento gerado no formulário reconhecendo firma.
4) Fazer cópia (xerox) de algum documento que tenha o CPF (Identidade ou Carteira de motorista) do titular atual
5) Fazer cópia (xerox) do cartão de CNPJ da empresa
6) Ir ao correio e enviar esse documento assinado e as cópias do CPF e CNPJ para "Av. das Nações Unidas, 11541, 7° andar - 04578-000 - São Paulo - SP" com o assunto "Transferência de Domínio" aos cuidados de Hostmaster.

Destinatário:
A/C Hostmaster - Registro.br
Assunto: Transferência de domínio
Av. das Nações Unidas, 11541, 7° andar
04578-000 São Paulo - SP

Depois é só esperar.

Att,
Adriano Schmidt

sábado, 17 de setembro de 2016

Como escrever termos de uso e política de privacidade?

Fala pessoal...

Hoje precisei escrever um termo de uso e uma política de privacidade... vou falar pra vocês como funciona isso...


Por quê?
É muito importante um e-commerce ou uma app ter um "termos de uso" e "politíca de privacidade" para evitar processos e outros problemas....

O que é?
Resumindo os conceitos:
Termos de uso são tudo que a empresa e o usuário, devem, podem, não podem fazer...
Política de privacidade fala dos dados que você coleta do usuário e o que você faz com eles.

Mais sobre os conceitos: http://www.startupblogbrazil.com/2013/05/a-importancia-dos-termos-de-uso-e-da_17.html

Como fazer?
Para gerar esses documentos tem alguns geradores na internet, por exemplo:

Gerar termos de uso:
https://pt.shopify.com/ferramentas/gerador-politica-de-privacidade/termos-condicoes

Gerar política de privacidade:
https://pt.shopify.com/ferramentas/gerador-politica-de-privacidade

Mas é muito importante você ler esses documentos gerados e alterar o que você achar necessário.

Depois disso veja esses documentos dos seus concorrentes ou empresas do mesmo setor para pegar mais ideias e complementar os seus documentos.

É de extrema importância que um advogado revise esses documentos!!!


É isso pessoal, abraço!!
Adriano Schmidt

terça-feira, 13 de setembro de 2016

Load balancer com WildFly 10

Esse passo a passo mostra como montar um ambiente com um Apache HTTP Server como loadbalancer e vários WildFly 10 atrás utilizando sempre o modo standalone.

Bom, trabalho com JBoss/WIldFly desde a versão 3 e já montei ambientes load balancer e cluster em mais de 20 ambientes... Esse mês montei novamente utilizando o WildFly 10 para um cliente que estou dando consultoria.

Antes de mais nada agradeço a todos do JBug Brasil. Sem a galera desse grupo eu não saberia nem iniciar o WildFly :) Entrem lá, recomendo!

O ambiente será assim:




Standalone ou domain?
Resolvi usar o modo standalone pois acredito que o modo domain adiciona um pouco mais de complexidade que não é necessária para ambientes com poucos servidores WildFly....

o domain serve apenas para centralizar as configurações em uma máquina só... caso queira fazer usando o modo domain, basta seguir esse tutorial e depois alterar para o modo domain....


Load balancer e/ou cluster

Aqui mostro apenas o como fazer um Load Balancer... não mostro como fazer um cluster... mas em muitos (talvez na maioria) dos ambientes, o cluster não é necessário....

O Load balancer serve para permitir escalabilidade... então atrás do Apache vai ter vários WildFly e você pode adicionar mais caso necessário (caso aumente o número de usuários por exemplo)

O Load balancer serve para redundância... se cair um WildFly, outro WildFly vai assumir....

"Tá Adriano, então pra que serve o cluster?"

O cluster serve para permitir o compartilhamento de dados de sessão.. por exemplo... no load balancer se vc estiver logado e de repente o WildFly cair, outro WildFly vai assumir, mas você voltará para a tela de login e terá q fazer login de novo... pois dados de sessão não são compartilhados no load balancer....

Para permitir que o usuário continue logado, você teria que ter um cluster...

Como os WildFly não vão cair o tempo inteiro... e se quando cair não for um problema tão grande o usuário ter q fazer login de novo... você não precisa de cluster....

Se você quiser fazer um cluster tudo bem.... não é muuuito dificil, é só seguir esse tutorial e depois alterar mais algumas coisinhas para implementar o cluster, mas não vou mostrar isso neste post...

Ahhh... E caso você esteja usando Amazon ou Digital Ocean... fazer um cluster vai ser um pouco mais difícil pois eles não permitem multicast (q é como as máquinas do cluster se comunicam) e você teria que fazer isso de outra forma... o q não é tããão simples...

Post passo-a-passo

Talvez (ou não) vc esteja se perguntando:
"Este passo-a-passo é completo e é só seguir que vai dar certo?"

Não! Esse passo-a-passo provavelmente não vai estar 100% claro e talvez falte algum detalhe... Foram anotações que fiz quando estava montando esse ambiente...

Não achei nenhum passo-a-passo mostrando como montar um load balancer com WildFly 10... por isso resolvi postar aqui mesmo que falte algum detalhe...

Até pq quando você for usar talvez vc use alguma versão diferente do que usei ou talvez seja diferente na sua infra ou no seu S.O.

Já montei load balancers e clusters em mais de 20 ambientes... e todas as vezes deu algum problema diferente...

"Tá Adriano, mas se não tá completo então esse post é inútil"

Acredito que é útil sim! talvez vc vai ter alguma dificuldade em algum ponto... aí vc abre um chamado no JBug Brasil e eu e outros caras que são bem legais vamos tentar te ajudar.


Vamos lá!


Você precisará de 3 máquinas:
- maq01: Apache HTTP Server
- maq02: WildFly Server1
- maq03: WildFly Server2

Sistema operacional
Sugiro o uso do sistema operacional RHEL (Red Hat Entrerprise Linux) ou CentOS (que é igual ao RHEL só que da comunidade).
Mas já implantei isso no Ubuntu também.
No Windows deve dar também... mas esse post vai ser todo focado em linux...


Em todas as máquinas faça esses passos:

- Configure a rede conforme desejado:
/etc/init.d/network stop
vi /etc/sysconfig/network-scripts/ifcfg-eth0
vi /etc/sysconfig/network
vi /etc/resolv.conf
/etc/init.d/network start

- Teste se a rede está OK
ping www.google.com
ifconfig


Maq01 - Apache HTTP Server

Documentação complementar:
https://docs.jboss.org/mod_cluster/1.1.0/html/native.config.html
https://httpd.apache.org/docs/2.4/howto/access.html

Apache 2.2
Aqui vou falar como implantar com o Apache 2.2... mais pra baixo comento como é com o Apache 2.4

yum install httpd httpd-devel apr-devel openssl-devel mod_ssl -y

sudo service httpd start


- Acesse no browser de sua máquina e verifique se o Apache HTTP Server está no ar, só acessar pelo ip: http://<ip da maquina>

- Baixe o mod_cluster (sempre utilize a versão mais atual ao invés de usar o comando abaixo, procure em http://mod-cluster.jboss.org/)
wget http://downloads.jboss.org/mod_cluster//1.3.1.Final/linux-x86_64/mod_cluster-1.3.1.Final-linux2-x64-so.tar.gz
tar -zxvf mod_cluster-1.3.1.Final-linux2-x64-so.tar.gz
cp mod_advertise.so /etc/httpd/modules/
cp mod_manager.so /etc/httpd/modules/
cp mod_proxy_cluster.so /etc/httpd/modules/
cp mod_cluster_slotmem.so /etc/httpd/modules/

- Comente a linha do mod_proxy_balancer pois será usado o mod_cluster
cd /etc/httpd/conf.modules.d
vi 00-proxy.conf

- A linha deve ficar assim:
#LoadModule proxy_balancer_module modules/mod_proxy_balancer.so


- Crie e adicione o conteúdo do arquivo mod_cluster.conf
cd /etc/httpd/conf.d/
touch mod_cluster.conf
vi mod_cluster.conf

LoadModule cluster_slotmem_module modules/mod_cluster_slotmem.so
LoadModule manager_module modules/mod_manager.so
LoadModule proxy_cluster_module modules/mod_proxy_cluster.so
LoadModule advertise_module modules/mod_advertise.so

MemManagerFile /var/cache/mod_cluster

Maxcontext 100
Maxnode 100
Maxhost 100

<VirtualHost *:80>

<Directory />
Order deny,allow
Allow from all
</Directory>

<Location /mod_cluster_manager>
SetHandler mod_cluster-manager
#Order deny,allow
#Deny from all
#Allow from all
AuthType Basic
AuthName "MCM"
AuthUserFile /etc/modclusterpassword
Require user admin
</Location>

KeepAliveTimeout 60
MaxKeepAliveRequests 0
ServerAdvertise Off
EnableMCPMReceive Off

</VirtualHost>



Apache 2.4
Essa semana instalei esse ambiente no Ubuntu e no Apache 2.4... teve algumas diferenças...

Para fazer isso (Apache 2.4 no Ubuntu) usei esse passo-a-passo:
https://symbiotics.co.za/configure-apache-with-mod_cluster-load-balancer-on-ubuntu/


Se acontecer o erro:

apache2: Syntax error on line 140 of /etc/apache2/apache2.conf:
Syntax error on line 3 of /etc/apache2/mods-enabled/proxy_cluster.load:
Cannot load /usr/lib/apache2/modules/mod_proxy_cluster.so into server:
/usr/lib/apache2/modules/mod_proxy_cluster.so: undefined symbol: ap_proxy_hashfunc



A solução é deixar o arquivo "proxy_cluster.load" dessa forma:

LoadModule proxy_module /usr/lib/apache2/modules/mod_proxy.so
LoadModule cluster_slotmem_module /usr/lib/apache2/modules/mod_cluster_slotmem.so
LoadModule manager_module /usr/lib/apache2/modules/mod_manager.so
LoadModule advertise_module /usr/lib/apache2/modules/mod_advertise.so
LoadModule proxy_cluster_module /usr/lib/apache2/modules/mod_proxy_cluster.so


Além disso, aconteceu o erro:

[Thu Aug 25 18:01:33.049309 2016] [proxy:warn] [pid 5911:tid [...] [client 177.101.142.200:58291] AH01144: No protocol handler was valid for the URL /systemprops. If you are using a DSO version of mod_proxy, make sure the proxy submodules are included in the configuration using LoadModule.

Ali onde estou carregando os módulos então tive que adicionar a seguinte linha:

LoadModule proxy_ajp_module /usr/lib/apache2/modules/mod_proxy_ajp.so

Mais detalhes em: https://developer.jboss.org/thread/272092. Agradeço ao Ingo e filippe.spolti do JBug Brasil pela ajuda nesse problema.


Além disso, deu o erro:

2016-08-23 19:38:20,417 ERROR [org.jboss.modcluster] (UndertowEventHandlerAdapter - 1) MODCLUSTER000042: Error null sending INFO command to ip-<IP INTERNO DO APACHE>.sa-east-1.compute.internal/<IP INTERNO DO APACHE>:80, configuration will be reset: null


A solução... meu conf do apache estava assim:

<Directory />
     Order deny,allow
     Allow from all
</Directory>

Mas na versão Apache 2.4 tem que ser assim:

<Directory />
    AllowOverride none
    Require all granted
</Directory>

Mais detalhes em: https://developer.jboss.org/thread/272023



- Crie um usuário e senha
htpasswd -c /etc/modclusterpassword admin

- Reinicie o Apache:
sudo service httpd stop
sudo service httpd start

- Teste novamente no browser: http://<ip_da_maquina>

- Teste no browser o mod_cluster: http://<ip_da_maquina>/mod_cluster_manager




Maq02, Maq03

- Instale e configure o Java (Sempre use a versão mais atual)

Aqui está um exemplo de como instalar (no caso Java 7, mas use o 8), mas pode fazer como achar melhor.
wget --no-check-certificate --no-cookies --header "Cookie: oraclelicense=accept-securebackup-cookie" http://download.oracle.com/otn-pub/java/jdk/7u79-b15/jdk-7u79-linux-x64.rpm

rpm -Uvh jdk-7u79-linux-x64.rpm

alternatives --install /usr/bin/java java /usr/java/latest/jre/bin/java 200000
alternatives --install /usr/bin/javaws javaws /usr/java/latest/jre/bin/javaws 200000
alternatives --install /usr/bin/javac javac /usr/java/latest/bin/javac 200000
alternatives --install /usr/bin/jar jar /usr/java/latest/bin/jar 200000


- Instale o WildFly (Sempre baixe a versão mais atual):
Aqui está o 8, mas use o 10 ou superior:

wget http://download.jboss.org/wildfly/8.2.0.Final/wildfly-8.2.0.Final.zip

yum install unzip

unzip wildfly-8.2.0.Final.zip  -d /opt/
ln -s /opt/wildfly-8.2.0.Final /opt/wildfly


- Configure um usuário no linux:
groupadd wildfly
useradd -s /bin/bash -d /home/wildfly -m -g wildfly wildfly
chown -R wildfly:wildfly /opt/wildfly-8.2.0.Final
chown -h wildfly:wildfly /opt/wildfly

sudo vi /etc/sudoers
wildfly ALL=(ALL) NOPASSWD:ALL

passwd wildfly
su wildfly


- Inicie o WildFly rodando o standalone.sh da pasta bin passando como parâmetro o profile full-ha
./standalone.sh -server-config=standalone-full-ha.xml

- Veja no log se não deu erros
vi /opt/wildfly/standalone/log/server.log

- Pare o WildFly


- Adicione as linhas de JAVA_OPTS:
vi /opt/wildfly/bin/standalone.conf
JAVA_OPTS="$JAVA_OPTS -Djboss.bind.address=<IP MAQUINA>"

Ao invés de IP da máquina você pode usar 0.0.0.0 que é mais genérico



- Configure o mod_cluster no WildFly:
- acesse o arquivo standalone-full-ha.xml
- procure o subsystem modcluster e altere o conteúdo dele para:

<mod-cluster-config advertise-socket="modcluster" proxies="apache1" advertise="false" sticky-session="true" load-balancing-group="arquitetura" connector="ajp">
   <dynamic-load-provider>
     <load-metric type="cpu"/>
   </dynamic-load-provider>
</mod-cluster-config>


-dentro do seu socket-binding-group, você deve colocar isso:

<outbound-socket-binding name="apache1">
<remote-destination host="<IP INTERNO DO APACHE>" port="80"/>
</outbound-socket-binding>

Mais sobre isso: https://developer.jboss.org/thread/272022


- Inicie o WildFly
./standalone.sh -server-config=standalone-full-ha.xml


- Faça deploy de uma aplicação de testes
- Faça o deploy da aplicação systemprops jogando o war na pasta deployments do WildFly: https://dl.dropboxusercontent.com/u/8155843/TDC%20Floripa%202015/systemprops.war

Teste o load balancer
1) Acesse via broser a aplicação pelo apache http server: http://<ip_do_apache>/systemprops
2) A aplicação mostrará em qual host você vai estar: arquitetura-1 ou arquitetura-2. Vai depender de onde o loadbalancer te direcionou
3) Vá até a máquina que você foi direcionado (arquitetura-1 por exemplo) e pare o WildFly
4) Acesse a mesma URL e veja que você foi redirecionado para o arquitetura-2, ou seja, o loadbalancer está funcinando
5) Suba novamente o wildfly


Segurança
- Nunca inicie nada como root
- Não deixe acessível na web o servidor onde está o WildFly (configuração de infra). Resumindo, você não pode conseguir pingar o servidor onde está o WildFly, pois só o servidor do Apache deve estar disponível.
- Use SSL
- Permita o acesso ao mod cluster manager apenas na rede interna (melhor opção) ou apenas para um determinado IP. Algo como:
<Location /mod_cluster_manager>
SetHandler mod_cluster-manager
Order deny,allow
Deny from all
Allow from <seu_ip>
AuthType Basic
AuthName "MCM"
AuthUserFile /etc/modclusterpassword
Require user admin
</Location>

Mais sobre segurança em: https://developer.jboss.org/thread/258299


Perfomance
- Com Java 8 já vai aumentar muuuito a performance comparado com versões anteriores..
- o load balancer é bom para performance pois vai distribuir os acessos deixando tudo mais rápido...
- gzip compression no Apache é essencial
- Configure xms e xmx...
- faça testes de desempenho e utilize ferramentas de monitoramento: http://localhost8080.blogspot.com.br/2016/07/monitorar-ambiente-infra-e-jboss-wildfly.html
- Tuning: http://localhost8080.blogspot.com.br/2014/06/tunning-de-aplicacoes-java.html


Integração contínua
Use! :)


Consultoria:
Lembrando que se precisar dou consultorias nesse assunto e também em questões como performance, arquitetura, integração contínua, montagem de ambientes com load balancer e cluster, etc... Só entrar em contato: adriano@localhost8080.com.br


Abraço!
Adriano Schmidt

Publicar ionic na web

Pessoal... dei uma pesquisada aqui sobre usar ionic na web... A ideia é usar o mesmo código da sua app em ionic para publicar na web e os usuários acessarem via browser...

Bom, fonte principal da minha pesquisa foi esse tópico de fórum: https://forum.ionicframework.com/t/deploy-ionic-app-as-a-website/2845/45


Seguem alguns apps funcionando com ionic na web:

Snaphappi
http://app.snaphappi.com/on-the-go.App/#/app/gallery/all/top-picks

Strappd
https://strappd.org/

American Society of Hematology
http://ashpocketguides.hematology.org
https://itunes.apple.com/us/app/ash-pocket-guides/id1055482799?mt=8
https://play.google.com/store/apps/details?id=org.hematology.pocketguides&hl=en

National Marrow Donor Program
http://hct.bethematchclinical.org
https://itunes.apple.com/us/app/transplant-hct-guidelines/id405310144?mt=8
https://play.google.com/store/apps/details?id=com.nmdp.webView&hl=en




Alguns pontos de atenção:

Usar media query para CSS específico para web.. ou seja, crie um arquivo web.css por exemplo e use @media (min-width: 601px) { <seu CSS aqui> }. Nesse arquivo coloque todo o CSS referente à parte web. Se preferir quebrar em mais arquivos, pode fazer tmb, a ideia é usar o media query para coisas específicas de telas grandes.

Tem que trabalhar margens/paddings e tamanhos de fontes... usando percentuais em margem e padding, e "em" ao invés de "px" nos font-size...

Talvez alguns componentes (combobox/componente de data/sliders/toggle) podem não funcionar... Nesse caso teria que usar um outro componente ou se for só estilo corrigir com CSS

Verificar se login vai funcionar bem... JWT..

Onde usar plugin tem q verificar se é celular: if(window.cordova)
Por exemplo se usar push notification vai ter que fazer esse if para o código de push não rodar na web

Se você salva dados no localstorage de forma aberta, e publicar a app na web pode dar problemas, alguém pode alterar dados ali e "hackear" sua aplicação. Para funcionar direto, tem que de alguma forma criptografar os dados salvos e descriptografar quando precisar, ou salvar os dados em outro lugar.

Tem que ter que testar em vários browsers (Teríamos que fazer isso de qualquer forma, mas aqui é pra ver se o ionic tem alguma limitação)

Sugiro testar nesses browsers:
Chrome
Firefox
IE10+
Microsoft Edge 13
Safari
Safari no IPhone
Chrome no Android

Nos browsers que não funcionar e nos demais browsers que não estão na lista acima, você pode sugerir para o usuário baixar/trocar de browser

O scrool pode não funcionar como esperado com o mouse pois o touch é diferente, mas é possível arrumar.



Tecnicamente falando:

Aqui um cara mostra como ele fez pra rodar:
https://forum.ionicframework.com/t/deploy-ionic-app-as-a-website/2845/40

Outro cara q fez algo:
https://github.com/shprink/ionic-cross-platform-boilerplate

Mas talvez só dar ionic serve já é o suficiente (configurando pra usar a porta correta e talvez outros pequenos ajustes):



De qualquer forma recomendo fazer uma POC com sua aplicação para validar...


Agradeço a Rangel Torrezan que me deu a ideia :)


Abraço!
Adriano Schmidt

sexta-feira, 9 de setembro de 2016

Traduzir plugin WordPress

Opa..

Tive que traduzir o plugin UPME e para fazer isso segui esse tutorial:

https://premium.wpmudev.org/blog/how-to-translate-a-wordpress-plugin/

Basicamente peguei o arquivo .po (no meu caso upme-en_US.po) que fica wp-content/plugins/nomeDoPlugin/l10n

Então fiz uma cópia desse arquivo e renomeei para upme-pt_BR.po

Baixei o PO Edit: https://poedit.net/download

E abri o upme-pt_BR.po nesse POEdit...

Traduzi o que eu precisava... Salvei... e aí gerou um upme-pt_BR.mo (q é o compilado das traduções)

Então é só jogar o upme-pt_BR.po e upme-pt_BR.mo dentro da pasta wp-content/languages/plugins

Pronto :)

Abraço!
Adriano Schmidt

domingo, 4 de setembro de 2016

Validar nome de usuário em PHP com regex

Opa,

Para validar um nome de usuário em PHP basta fazer assim:

if (preg_match('/[^a-z.\d]/', 'jose.silva')) {
    //invalido
}

aqui só permiti letras minúsculas, ponto final e números.

Abraço!
Adriano Schmidt

Post número 200 :D

Esse é meu post número 200 aqui no blog...

isso é bom? não sei... mas é legal olhar pra trás e ver o quanto de coisa diferente que já fiz nesses quase 7 anos de blog... mas mais legal ainda é de tempos em tempos ler um comentário do tipo "Vaaaaleu cara! Tava o dia inteiro apanhando nesse bug, e teu post me salvou!"

Esse não é um blog "comercial" onde posto coisas querendo milhões de visualizações... simplesmente vou postando como resolvi alguns problemas que passei... e de vez em quando isso é útil para outras pessoas também... muitas vezes é útil pra mim, pra eu lembrar como fiz resolvi determinado problema hahah

Com certeza esse não é o melhor de todos os blogs... mas acredito que é o blog com o nome mais legal :D

S2 localhost8080.com.br S2

E bóra para mais 200 posts \o)

Abraço!
Adriano Schmidt

Wordpress - Como usar um shortcode em um código PHP?

Oi, hoje precisei escrever em um código PHP um shortcode do wordpress, algo como:

[myshortcode param=value]

Para fazer isso simplesmente usei a function do_shortcode():

<?php echo do_shortcode("[myshortcode param=value]"); ?>

Abraço!
Adriano Schmidt

domingo, 21 de agosto de 2016

WordPress default user image - Como alterar?

Oi,

Para alterar a imagem default de um novo usuário no WordPress basta seguir esses passos:

- Acesse o wp-admin
- Acesse "Settings > Discussion" ou em português "Configurações > Discussão"
- No final da tela tem um campo "Avatar padrão"... só trocar.

Fonte: https://codex.wordpress.org/How_to_Use_Gravatars_in_WordPress

Abraço!
Adriano Schmidt

sábado, 20 de agosto de 2016

Integrar página do Wordpress com RD Station

Opa,

Hoje tive que integrar com o RD Station um formulário que estava em uma página do WordPress.

Bom, primeiro tem que gerar o código JS lá no RD Station conforme esse tutorial:
http://ajuda.rdstation.com.br/hc/pt-br/articles/208726186--Beta-Como-gerar-e-instalar-o-script-de-integra%C3%A7%C3%A3o-de-formul%C3%A1rios-

Depois tem que instalar esse plugin no WordPress para poder inserir código JavaScript dentro de uma determinada página:
https://wordpress.org/plugins/scripts-n-styles/

Agora, no wp-admin, vai na página que tem o formulário
Vá na seção "Scripts n Styles"
Vá no segundo bloco de "Script" pois você quer colocar antes do </body>

E ao invés de colocar o script como o RD gerou:

<script type="text/javascript" src="URL_DO_JS"></script>  
<script type="text/javascript">
    var meus_campos = {
        'campo1': 'email',
        'campo2': 'nome'
     };
    options = { fieldMapping: meus_campos };
    RdIntegration.integrate('ID_GERADO', 'NomeDoFormulario', options);  
</script>


Altere algumas coisas: retire os <script> e o carregue o JS via JS:

var scriptTag = document.createElement('script');
scriptTag.src = 'URL_DO_JS';
document.body.appendChild(scriptTag);

scriptTag.onload = function() {
 var meus_campos = {
  'campo1': 'email',
  'campo2': 'nome'
 };
 options = { fieldMapping: meus_campos };
 RdIntegration.integrate('ID_GERADO', 'NomeDoFormulario', options);
};

Bom, é isso.

Abraço!
Adriano Schmidt

UPME - Como alterar o tamanho da foto de perfil

No UPME (plugin para perfis no Wordpress, profileplugin.com) você pode alterar o tamanho das imagens do perfil alterando dois lugares.

Nesse exemplo alterei de 50px para 80px.

* Adicione, no final do arquivo functions.php, um filtro com a lógica abaixo:

add_filter('upme_custom_profile_pic', 'upme_custom_profile_pic');

function upme_custom_profile_pic($profile_pic_display,$params) {
    return str_replace('s=50','s=80',$profile_pic_display);
}


* Mas além disso vc deve alterar o CSS:
.upme-head .upme-pic .avatar-50 {
    width: 80px!important;
    height: 80px!important;
}


Abraço!
Adriano Schmidt

segunda-feira, 8 de agosto de 2016

Ionic view

Oi, hoje vou mostrar como testar sua app ionic com o Ionic View

Faça login ou cadastre-se no Ionic View:
https://apps.ionic.io/login

Após fazer login, crie uma app e anote o id dela

Vá no seu projeto na sua máquina e altere o ionic.project para ter esse id

vá no terminal na pasta do seu projeto e digite "ionic upload"

Digite seu e-mail e senha do Ionic View e pronto :)

Baixe a app do Ionic View no seu celular e já poderá testar :)

Abraço!
Adriano Schmidt

sexta-feira, 5 de agosto de 2016

Uma martelada

Oi :)

Ouvir seu cliente falando "obrigado, agora eu durmo tranquilo" não tem preço :D





Quando eu era pequeno ouvia uma história do cara que cobrou 10 mil reais e ficou um mês consertando um navio.... mas não resolveu o problema!


Depois veio outro cara e cobrou 100 mil pra ficar uma semana mas também não consertou o navio!


Por fim veio um cara e resolveu o problema com uma martelada e cobrou 1 milhão... logo reclamaram:

Como 1 milhão por uma martelada? O outro ficou um mês e cobrou 10 mil

E a resposta foi

Cobro 1 real pela martelada e 999.999 por saber onde dar a martelada

Quando o cliente me falou "cara, a gnt não ia achar o problema, estávamos culpando tudo menos isso" eu lembrei dessa história...

a diferença é que não cobrei 1 milhão hahahah

#consultoria #homeoffice

sábado, 16 de julho de 2016

Monitorar Ambiente/Infra e JBoss/WildFly

Segue uma lista de ferramentas e algumas observações para monitorar ambientes e também servidores de aplicação.

Já usei quase todas essas ferramentas e sempre estão surgindo novas. Fiz estas anotações rápidas para uma consultoria que dei e acredito que pode ser útil para outras pessoas.

Para monitorar o ambiente e JBoss/WildFly:

RHQ
- Para monitoar o JBoss/WildFly
- É da própria Red Hat
- Não é na nuvem, precisa de uma máquina pra ele
- É free
- Não é tão facil de instalar/configurar

Javamelody
- É free
- É fácil de instalar

Datadog
- Free até 5 hosts com 1 day retention
- $15 por host com 13 month retention

NewRelic
- $75USD/month per host


Para monitorar infra, máquinas e sistema operacional, pode-se usar umas dessas duas:
Nagios
Zabbix - Cada vez está sendo mais usado


Para centralizar logs de várias máquinas em um só lugar:

Logentries
- Send up to 5GB/month
- 7 day Retention

Log Stash
- Log stash is an open source tool for collecting, parsing, and storing logs for future use
- Kibana 3 is a web interface that can be used to search and view the logs that Logstash has indexed.
- Both of these tools are based on Elasticsearch.
- Elasticsearch, Logstash, and Kibana, when used together is known as an ELK stack.



Lembrando que se precisar dou consultorias nesse assunto e também em questões como performance, arquitetura, integração contínua, montagem de ambientes com load balancer e cluster, etc... Só entrar em contato: adriano@localhost8080.com.br


Agradeço ao Vinícius Fritzen que já utilizou várias destas ferramentas e me ajudou quando eu estava fazendo essa pesquisa.


Abraço!
Adriano Schmidt
adriano@localhost8080.com.br

How to install Ionic on Mac

Go to http://nodejs.org/en
Download the npm
Install the npm

Go to terminal and type the following command in order to test the installation
$ npm version

Now, type in the terminal the following commands in order to install cordova and ionic
$ sudo su (probably you will need to type your password)
$ npm install -g cordova ionic
$ npm install -g bower
$ npm install -g ios-sim
$ exit
$ ionic version (if a popup shows up asking for installing something, say yes)

if you already have an ionic project, go to the folder project, or create a new project:

$ ionic start myApp tabs

Go to the folder project and run these commands:
$ bower update
$ npm install
$ ionic platform add ios
$ ionic build ios
$ ionic emulate ios

That's it :)
Adriano Schmidt

domingo, 10 de julho de 2016

WordPress - User registration is currently not allowed

Hi there :)

When you get the message "User registration is currently not allowed" in your WordPress plataform, and you want to allow anyone to register on your site/blog, you should go to "WP-admin > Settings > General" and check "Anyone can register".



Best regards,
Adriano Schmidt

sexta-feira, 1 de julho de 2016

How to use Font Awesome in Photoshop or Illustrator?

First of all, download the font on http://fontawesome.io/

Install the file FontAwesome.otf normally.

Go to Photoshop or Illustrator.

Insert a text field and change the font-family to Font Awesome

Go to http://fontawesome.io/cheatsheet/

Copy the icon that you want to use and paste it in your text field in Photoshop/Illustrator.

You can use this plugin as well: http://creativedo.co/FontAwesomePS

Best regards,
Adriano Schmidt

quinta-feira, 30 de junho de 2016

BitBucket - Authentication failed

I got this error trying to run the "git pull" command in a project on BitBucket:

C:\work\Dropbox\workspaces\ws-ionic\myapp>git pull
Password for 'https://adrianoschmidt@bitbucket.org':
remote: Invalid username or password. If you log in via a third party service you must ensure you have an account password set in your account profile.
fatal: Authentication failed for 'https://adrianoschmidt@bitbucket.org/myuser/myapp.git/'

In order to solve this problem I've accessed https://id.atlassian.com/login and I've clicked on "Forgot your password?"

After resetting my password, everything started to work normally again :D

Best regards,
Adriano Schmidt

terça-feira, 28 de junho de 2016

Como mudar o lugar das informações do autor no Wordpress?

Oi...

Em um blog que estou trabalhando, o autor do post aparecia beeem lá em baixo, no fim do post.

Para dar mais visibilidade ao autor... eu coloquei ele no lado do texto...

Bom, isso vai depender de cada tema, mas o que eu fiz foi esconder a caixa original:

/* escondendo a caixa de informacoes do autor, pois sera usada outra */
#content .post_content .post-author {
 display: none!important;
 visibility: hidden!important;
}

Talvez seja um pouco diferente par você, mas a ideia é essa ali.

E para eu exibir as informações do autor no lado do texto, no meu template tinha um widget onde eu podia colocar HTML.
Então eu instalei o plugin Author Bio Shortcode:
https://br.wordpress.org/plugins/author-bio-shortcode/installation/

E no Widget eu botei isso:
[author_bio name="yes" avatar="yes" ]

Além disso, criei esse CSS:

/* alterando o estilo do novo box de informacoes do autor, na pagina de post de blog */
.author_bio_shortcode .avatar img {
    float: left;
    margin: 5px 10px 0px 10px;
    border-radius: 150px;
    border: 2px solid #981258;
    height: 96px;
    width: 96px;
}

Mas quando é celular, esse widget vai lá pra baixo... então fiz um menorzinho para celular...

Para isso editei o código fonte do tema, alterei o "Post único (single.php)" e adicionei o código abaixo antes do início do conteudo:

<div class="author-info-mobile">
 <?php echo get_avatar( get_the_author_meta( 'ID' ), 40 ); ?>
 Por <?php the_author_link()?>
</div>

E adicionei o CSS abaixo para customizar o estilo e para só aparecer em celulares e tablets:

/* estilo do nome do autor para mobile, na pagina de post de blog */
@media (min-width: 768px) {
 .author-info-mobile {
  display: none;
  visibility: hidden;
 }
}

.author-info-mobile {
 margin-left: 11px;
 font-size: 14px;
 color: white;
}

.author-info-mobile img {
 border-radius: 150px;
 border: 2px solid #981258;
 margin-right: 5px;
 height: 40px;
 width: 40px;
}

Provavelmente pra vc vai ser um pouco diferente... mas a ideia é essa aí :D


---------------------------

Depois que escrevi o post, precisei achar um plugin pra poder colocar fotos pra cada usuário (para que o próprio usuário ou o admin setasse uma foto para o usuário, por padrão pega do gravatar).

Usei esse plugin:
https://wordpress.org/plugins/user-photo/

Em configurações > User Photo vc pode mexer nas configurações se quiser.

Pra usar só tem q chamar userphoto_the_author_thumbnail() q vem a foto... mas no meu widget não dava pra colocar código PHP.

Então tive que instalar esse plugin para ter um widget q eu pudesse colocar código PHP:
https://wordpress.org/plugins/php-code-widget/

E montei tudo na mão:

<div class="author_bio_shortcode">
  <div class="avatar">

      <?php userphoto_the_author_thumbnail() ?>

      <h3 class="name"><?php the_author()?></h3>

      <div class="bio"><p>
        <?php the_author_description() ?>
         Para saber mais: <?php the_author_link()?>
      </p>
   </div>
</div>

E no single-post ao invés de usar
echo get_avatar( get_the_author_meta( 'ID' ), 40 );
eu usei
userphoto_the_author_thumbnail()

Abraço!
Adriano Schmidt

segunda-feira, 6 de junho de 2016

Loja Integrada - Mostrar todas as formas de pagamento

No Loja Integrada, para modificar a forma de pagamento, é preciso clicar em "Alterar forma de pagamento"...

Com o CSS que vou mostrar aqui já fica de início mostrando todas as opções.

Antes:



Depois:



Segue o código para fazer isso:

/* ajustando para aparecer todas as formas de pagamento */
#formas-pagamento-wrapper #formasPagamento .deposito, 
#formas-pagamento-wrapper #formasPagamento .pagseguro {
    display: block!important;
}

#formas-pagamento-wrapper #exibirFormasPagamento {
    display: none!important;
}


Aí no meu caso só configurei para o deposito e pagseguro (classes usadas ali no CSS)... para fazer mais é só ver a class utilizada pela forma de pagamento q vc quer e alterar o script.

PS: Ele dá uma tremidinha quando troca a forma de pagamento enquanto está o "carregando", mas acho q não é nada demais.

Abraço!
Adriano Schmidt

domingo, 5 de junho de 2016

Failure [INSTALL_FAILED_NO_MATCHING_ABIS]

Hi :)

I tried to install an .apk into a cell phone and I got the error Failure [INSTALL_FAILED_NO_MATCHING_ABIS]

C:\ws-ionic\localhost8080app>adb.exe install -r platforms/android/build/outputs/apk/android-x86-debug.apk
2442 KB/s (33320124 bytes in 13.320s)
        pkg: /data/local/tmp/android-x86-debug.apk
Failure [INSTALL_FAILED_NO_MATCHING_ABIS]

That happened because I should have used the armmv7 version and not the x86 for this cell phone... the cpu architecture of the cell phone was the other one...

With the bellow command, the app was successfully installed

adb.exe install -r platforms/android/build/outputs/apk/android-armv7-debug.apk

Best regards,
Adriano Schmidt

terça-feira, 31 de maio de 2016

Adicionar * nos campos obrigatórios da Loja Integrada

Opa :)

O formulário de cadastro da loja integrada é legal.. mas não tem os asteriscos de obrigatório... pra adicionar os * é só usar esse CSS:

.required label:after { content:" *"; }

Abraço!
Adriano Schmidt

segunda-feira, 30 de maio de 2016

Adicionar item no menu da Loja Integrada

Fala pessoal :D

No menu superior da Loja Integrada você consegue adicionar todas as categorias e/ou todas as páginas extras... mas só um item em específico não dá :(

Pra isso fiz um javascript (nesse caso também conhecido como enjambrascript hahah) para adicionar apenas um item no menu.

Basta alterar o label e o link e adicionar esse trecho de código lá na seção Minha loja > Incluir código HTML > Código no cabeçalho

<script>
$('#nivel-um').ready(function()
{
 var newItem = document.createElement("li");
 newItem.className += ' borda-principal';

 var newLink = document.createElement("a");
 newLink.className += ' titulo cor-secundaria';
 newLink.href = '/pagina/quem-somos.html';

 var textnode = document.createTextNode("Quem Somos");

 newItem.appendChild(newLink);
 newLink.appendChild(textnode);

 var list = document.getElementsByClassName('nivel-um')[0];
 list.insertBefore(newItem, list.childNodes[0]); //use esse para adicionar no inicio do menu
 //list.appendChild(newItem); //use esse para adicionar no fim do menu
});
</script>

Se precisar alterar algo de CSS, basta olhar o CSS do menu atual e ajustar no script e pronto :D

Vaaaleu!
Adriano Schmidt

sábado, 28 de maio de 2016

yeoman gulp angular is not defined

Hi :D

I was trying to use the Yeoman to generate a project with AngularJS and Gulp

But the CSS was not working and on the console was the error "angular is not defined"



I was following this tutorial:
https://github.com/yeoman/generator-angular#readme

However, in order to fix the error I needed to change the gulpfile.js by this one:
https://gist.github.com/adrianoschmidt/ab0b74aa694fafe66de518a31f856b8a

That's all :)

Best regards,
Adriano Schmidt

quinta-feira, 19 de maio de 2016

Wordpress - How to change the base URL?

Hiiii,

I'm going to show you how to change the base URL of your wordpress.

First of all, you need to access your database and to run these commands:

use <put_here_the_name_of_your_database>;
select * from wp_options;

You will see lots of lines, we will change the lines with the column 'option_name' equals 'siteurl' and 'home'

In order to do that, run the next two commands with the new URL:

UPDATE wp_options SET option_value='http://newurl.com' WHERE option_name='siteurl';

UPDATE wp_options SET option_value='http://newurl.com' WHERE option_name='home';

After that, run again the select command to check if it is OK:

select * from wp_options;

That's all,

Best regards,
Adriano Schmidt

domingo, 8 de maio de 2016

CSS - How to change all classes that begin with a certain string?

Hi :)

I needed to change all classes whose names begin with "icon-" for example: .icon-home, .icon-user, .icon-shopping-cart, .icon-th

and instead doing something like this:

.icon-home, .icon-user, .icon-shopping-cart, .icon-th, .icon-minus, .icon-plus, .icon-trash, icon-chevron-down, icon-signout {
    font-family: FontAwesome!important;
}

I did the same thing using this approach:

i, [class^="icon-"], [class*=" icon-"] {
    font-family: FontAwesome!important;
}

it is a little better :) regular expressions rocks :D

I don't know very well how it works, but you can read more here:
http://stackoverflow.com/questions/23963073/css-regex-selector-match-one-or-another-condition
https://css-tricks.com/attribute-selectors/

Best regards,
Adriano Schmidt

sexta-feira, 6 de maio de 2016

how to change the font-family of all elements?

hi :)

In order to change the font-family of all elements on your website, you could use that:

* {
    font-family: 'source sans pro'!important;
}

In my case, I would like to change only a few kind of elements:

a, span, input {
    font-family: 'source sans pro'!important;
}

But if you have icons that use another font-family like FontAwesome, you may force them to not use what you've set before

i, .icon-home, .icon-user, .icon-shopping-cart {
    font-family: FontAwesome!important;
}

.fa {
    font-family: FontAwesome-v4!important;
}


The "!important" was used to force the use of the font-family even if another font-family was set in another place
I often use the "!important" when I'm working in a platform like WordPress and I am changing/overwriting the theme...
On your website you should not use '!important'

Best regards,
Adriano Schmidt

segunda-feira, 2 de maio de 2016

Ionic - It is forbidden to downgrade devices which previously used M permissions

Hi :)

I have a project developed with Ionic, and when the mobile app was being published on play store, one error occurred:

This configuration cannot be published for the following reason(s):
It is forbidden to downgrade devices which previously used M permissions (target SDK 23 and above) to APKs which use old style permissions (target SDK 22 and below). This occurs in the change from version 100062 (target SDK 23) to version 100072 (target SDK 22).
Version 100062 is not served to any device configuration: all devices that might receive version 100062 would receive version 100072.

I don't know if it happened because the last version was generated in another machine or because we've put the crosswalk plugin in our project.

Well, in order to solve this problem, just put this line in your config.xml

<preference name="android-targetSdkVersion" value="23"/>

Maybe you will need to change the "23" for the version you want to use.

After that, you will generate again with "ionic build android --release" and that's all :D

Best regards,
Adriano Schmidt

domingo, 1 de maio de 2016

how to map an image using html with the area tag?

Hi :)

I'm going to show you how to use the area tag to create a map of links in an html image.

It is very simple, you just need:

- to have an image where you will set the "usemap" attribute with your map's name
- to define the areas and the links inside of a map tag

Just like that:

<img src="url/to/your/image.jpg" usemap="#Map" />

<map name="Map" id="Map">
    <area href="#url1" shape="rect" coords="0,0,250,250" />
    <area href="#url2" shape="rect" coords="251,0,500,250" />
</map>

In this example I have an image with width=500px and heigth=250px
and the left half is a link to #url1
and the right half is a link to #url2

But I recommend you using a tool to generate these areas. That is a good tool: http://imagemap-generator.dariodomi.de/

---------------

If you want to learn more: http://www.w3schools.com/tags/tag_area.asp

---------------

And when you use a map, maybe you will see a blue border around your areas, if you want to remove these borders just put this code in your CSS:

map area{
    outline: none;
}

or just add
style="outline: none"
in each area that you create

---------------

And you can use another shapes instead using a rectangle, but I won't show here how to do that :(

---------------

That's all!
Adriano Schmidt

Retirar logo da Loja Integrada do rodapé

Bom, não é legalmente permitido isso, conforme mostrado nessa FAQ, porém, é útil mostrar isso para outras funcionalidades que vou mostrar a seguir.

Para retirar o logo da loja integrada do rodapé você pode adicionar esse código abaixo no "Editar CSS" da sua loja:

#rodape div .conteiner .row-fluid .span2 {
      visibility: hidden; display: none;
}


Mas não faça isso, não é permitido... porém mostrei pois da mesma forma, você pode fazer outras coisas como retirar o logo do "Integrando-se", empresa que vende temas, mas ao invés daquele código, use esse:

.integrandose {
      visibility: hidden; display: none!important;
}

Att,
Adriano Schmidt

quarta-feira, 6 de abril de 2016

Adobe Photoshop CC - How to change language to english

Hii,

I've installed the Adobe Photoshop CC on my PC, but it was in portuguese and some translations aren't so good, so I wanted to change the language to english.

It is very easy, just follow these steps:

- Quit Photoshop (if it is opened)
- Go to the installation directory and go to <installation folder>\Locales\<pt_BR or the other installed language>\Support Files
- Rename the file "tw10428.dat" to "tw10428.bak"
- Open the Photoshop again

That's it. Very simple.

Best regards,
Adriano Schmidt

domingo, 3 de abril de 2016

Ionic - Timeout

Hi, I will show here how to use the $timeout with Ionic:

Create a variable:
var myTimeout;

Start the timeout:
myTimeout = $timeout(timeIsOver, 10000);
The first parameter is a the function that will be executed after the time that you will set in the second parameter. In this case, 10000 milliseconds (10 seconds)


And do something when the time is over:
function timeIsOver(){
    console.log('timeIsOver');
}

And if, before the time ends, you want to cancel the timeout for not executing the timeIsOver function, just do that:
timeout.cancel(myTimeout);

Thats it :)

Best regards,
Adriano Schmidt

Ionic - How to scroll programatically?

Hii,

If you are in a Ionic project and you want to move your screen (to scroll it) to the top or to the bottom, you just need to receive the $ionicScrollDelegate and call the methods scrollTop or scrollBottom:

angular.module('mymodule').controller('MyCtrl', function($scope, $ionicScrollDelegate) {

$ionicScrollDelegate.scrollTop();

$ionicScrollDelegate.scrollBottom();

That's it :)

Best regards,
Adriano Schmidt

sexta-feira, 1 de abril de 2016

ionic build android does not update apk files

Hi there,

I ran the command "ionic build android" but the apk files at 'platforms/android/build/outputs/apk' folder were not updated

It started to happen after the crosswalk plugin installation

So, I ran the command "ionic state restore" to delete and fetch the plugins of my package.json and to add the platforms (android and/or ios) again.

After that, when I ran "ionic build android" the apk files were updated, but I realized that I should not use the "android-debug.apk" file like I was used to. Now I must use "android-armv7-debug.apk" or "android-x86-debug.apk" regarding the cell phone processor (ARM or x86).

If you don't know your cell phone processor, try one of the files and if it is the wrong file then a message will be showed to you, and you will close the app, uninstall it, and install it again but with the other file.

These are the commands I am using now:
ionic build android
adb.exe install -r platforms/android/build/outputs/apk/android-armv7-debug.apk

Best regards,
Adriano Schmidt

quinta-feira, 24 de março de 2016

ionic - download file

Hi,

I will show you how to download a file from an URL to the device with Ionic.

Be attention: It will only work in a real device, don't use ionic serve, ionic view, ionic live-reload, -l, phonegap build services or anything like this.

Let's go! It is very simple:

First of all, you need to install 2 plugins:

cordova plugin add org.apache.cordova.file-transfer
cordova plugin add org.apache.cordova.file

Now, you need to receive the parameter $cordovaFileTransfer:

.controller('MyCtrl', function($scope, $window, $cordovaFileTransfer) {

And here is the magic code:

function downloadFile() {
  var url = "http://www.localhost8080.com.br/site/img/portfolio-2.jpg";

  var folder = 'localhost8080/';
  var filename = url.split("/").pop();

  var targetPath = window.cordova.file.externalRootDirectory + folder + filename;

  $cordovaFileTransfer.download(url, targetPath, {}, true).then(
    function (result) {
      var myNativeURL = result.toURL());
    }, function (error) {

    }, function (progress) {

    }
  );
}

See more at:
http://www.gajotres.net/using-cordova-file-transfer-plugin-with-ionic-framework/
http://ngcordova.com/docs/plugins/fileTransfer/
https://www.thepolyglotdeveloper.com/2014/09/manage-files-in-android-and-ios-using-ionicframework/

That's it :)
Adriano Schmidt

quarta-feira, 23 de março de 2016

$http get ionic não fuciona no celular

Opa :)

Todos os meus $http.get e $http.post pararam de funcionar quando eu rodava no celular, mas no "ionic serve" estava ok... isso aconteceu depois que subi a versão do cordova...

Para resolver, foi preciso instalar esse plugin:

    cordova plugin add cordova-plugin-whitelist

Ao fazer isso, funcionou perfeitamente.

Fonte: http://stackoverflow.com/questions/30389825/angular-ionic-http-get-not-working-in-real-device-ios

Abraço!
Adriano Schmidt

terça-feira, 15 de março de 2016

has no method 'requestfilesystem'

Olá :D

Hoje no meu projeto ionic aconteceu o erro:
    has no method 'requestfilesystem'

Primeiro de tudo.. se você tentar usar o window.requestFileSystem ou qualquer plugin para acessar arquivos ou fazer download ou upload, não use de forma alguma: ionic serve, ionic view, ionic live-reload, -l, phonegap build

Esses plugins só funcionam em dispositivos reais... talvez no emulador funcione, não cheguei a testar.

Bom, se mesmo assim você ainda estiver com o erro, provavelmente você precisa instalar esse plugin:
    cordova plugin add org.apache.cordova.file

Abraço!!!
Adriano Schmidt

Device communication timed out. Try unplugging & replugging the device

Olá :D

Não estava conseguindo rodar meu projeto ionic no celular (ionic run android)

Dava esse erro da imagem (Device communication timed out. Try unplugging & replugging the device)

Tentei desplugar e plugar o celular.. reiniciei o notebook, reiniciei o celular... nada funcionou!
Teve uma época q quando dava esse erro, eu tentava mais umas 3 vezes q voltava a funcionar... agora posso tentar 1000 mil vezes q sempre dá erro...

Pelo fato de eu estar no Windows, acredito q possa ser algo do adb, alguma coisa de driver talvez....



Achei duas soluções para o problema:

Usei o Ionic View: É muito legal e fácil de usar. Você faz upload da sua app para o Ionic Apps, e no seu celular com a app do IonicView você consegue acessar todas as suas apps (Você pode testar num iphone sem ter um Mac).

Mas com o Ionic View você ainda tem as mesmas limitações do Ionic Serve... Você não consegue testar todos os plugins do Cordova por exemplo.

Então consegui rodar a minha app diretamente no celular através dos seguintes comandos:

ionic build android
adb.exe install -r platforms/android/build/outputs/apk/android-debug.apk

Se não encontrar o adb.exe coloque no seu PATH: <ANDROID_SDK>\platform-tools

Fontes:
https://www.facebook.com/groups/1558333777738228/permalink/1693011350937136/
https://www.thepolyglotdeveloper.com/2014/09/manage-files-in-android-and-ios-using-ionicframework/


É isso aí, vaaaleu!!!
Adriano Schmidt

Split MySQL

Opa :D

Eu tinha uma coluna chamada coluna_ids que continha o valor "172:536"... e eu precisava quebrar esse valor em antes e depois do sinal de dois pontos.

Para pegar o valor antes dos dois pontos eu usei:
select id from tabela where value_id = SUBSTRING_INDEX(SUBSTRING_INDEX(coluna_ids, ':', -1), ':', 1) ))

Para pegar o valor depois dos dois pontos eu usei:
select id from tabela where value_id = SUBSTRING_INDEX(SUBSTRING_INDEX(coluna_ids, ':', 1), ':', 1) ))

Fonte: https://gustavostraube.wordpress.com/2012/12/14/split-string-no-mysql/

Abraço!
Adriano Schmidt

domingo, 21 de fevereiro de 2016

handshake_failure paypal

Opa :D

Rodando meu client Java para obter o token do paypal, obtive o seguinte erro:

javax.net.ssl.SSLHandshakeException: Received fatal alert: handshake_failure
at sun.security.ssl.Alerts.getSSLException(Unknown Source)
at sun.security.ssl.Alerts.getSSLException(Unknown Source)
at sun.security.ssl.SSLSocketImpl.recvAlert(Unknown Source)
at sun.security.ssl.SSLSocketImpl.readRecord(Unknown Source)
at sun.security.ssl.SSLSocketImpl.performInitialHandshake(Unknown Source)
at sun.security.ssl.SSLSocketImpl.startHandshake(Unknown Source)
at sun.security.ssl.SSLSocketImpl.startHandshake(Unknown Source)
at sun.net.www.protocol.https.HttpsClient.afterConnect(Unknown Source)
at sun.net.www.protocol.https.AbstractDelegateHttpsURLConnection.connect(Unknown Source)
at sun.net.www.protocol.http.HttpURLConnection.getOutputStream(Unknown Source)
at sun.net.www.protocol.https.HttpsURLConnectionImpl.getOutputStream(Unknown Source)
at snippet.PaypalToken.main(PaypalToken.java:31)

Pra resolver, é necessário passar esse parâmetro pra JVM:
-Dhttps.protocols=TLSv1.1,TLSv1.2

No eclipse, vai em "Run configurations"


Acessa a aba "Arguments"

Em VM Arguments, coloque "-Dhttps.protocols=TLSv1.1,TLSv1.2" sem as aspas

Pronto, ao rodar novamente funcionará

Fonte: http://stackoverflow.com/questions/34963083/paypal-sandbox-api-javax-net-ssl-sslhandshakeexception-received-fatal-alert-h

Abraço!!
Adriano Schmidt

terça-feira, 16 de fevereiro de 2016

Como remover campos no cadastro de clientes do OpenCart?

O cadastro no opencart é muito grande e pode fazer alguém desistir de comprar seus produtos devido a ter que preencher muitos campos.

Para remover campos como Fax por exemplo, abra o arquivo register.tpl que fica em:
<opencart>\catalog\view\theme\\template\account\

Vá no campo que você quer retirar e coloque no <tr> o style para desaparecer o campo, dessa forma:
<tr style="visibility: hidden; display: none;">

Abraço!!
Adriano Schmidt

Como colocar CEP obrigatório no OpenCart?

Opa, só seguir o passo-a-passo aí:

- Acesse o painel administrativo
- Clique em "Sistema"
- Clique em "Localização"
- Vá em "Brasil" e clique em "Editar"
- Coloque o campo "CEP Obrigatório" como "Sim"

Pronto!

Fiz isso na versão 1.5.6.4 do OpenCart

Abraço!
Adriano Schmidt

quinta-feira, 4 de fevereiro de 2016

Instalando o XAMPP no Windows 10

Se você for trabalhar com PHP... ou WordPress... ou OpenCart... você tem que rodar esses caras em um Apache...

Você pode instalar o Apache separadamente, ou usar o WAMP ou o XAMPP para fazer isso por você

Tentei o WAMP, não funcionou :(

Com o XAMPP deu certo, mas tive q ajustar algumas coisinhas.

Vamos lá:



- Antes de mais nada, saia do Skype! O Skype usa as portas 80 e 443 que também são usadas pelo Apache, depois você pode tirar essa config do Skype ou mudar as portas do Apache, mas recomendo fechar o Skype nesse primeiro momento.

- Podem ocorrer problemas por causa de antivírus e/ou firewall da sua máquina. Se estiver dando uns erros que você não sabe o que é, vale tentar desabilitar antivírus e firewall e tentar novamente.

- Faça o downlaod do XAMPP: https://www.apachefriends.org/pt_br/download.html

- Vai instalando normalmente, escolha o que você quer instalar (eu tirei o MySQL pois eu já tinha ele instalado, tirei o PHPMyAdmin pois já tenho um outro client de banco de dados, e tirei Filezilla, Email, Webalizer... basicamente deixei o Apache, PHP e Pearl). Não lembro exatamente, OK? Faça o que seu coração mandar.



- Pode ser que aconteça esse erro "problem running post-install step"



- Se acontecer, aperte OK e siga a instalação normalmente, após finalizar a instalação arrumaremos isso.

- Caso tenha acontecido o erro, você vai ter que baixar o "Microsoft Visual C++ 2008 SP1 Redistributable Package (x86)": http://www.microsoft.com/en-us/download/details.aspx?id=5582

- Após baixar e instalar, vá na pasta onde o XAMPP foi instalado e rode o setup_xampp.bat

- Se você não fizer isso, você ia ter o erro: httpd.exe: Syntax error on line 520 of C:/work/Dropbox/othertools/xampp/apache/conf/httpd.conf: Syntax error on line 17 of C:/work/Dropbox/othertools/xampp/apache/conf/extra/httpd-xampp.conf: Cannot load /xampp/php/php5ts.dll into server: N\xe3o foi poss\xedvel encontrar o m\xf3dulo especificado.

- Agora abra o Painel de Controle do XAMPP e inicie o Apache...

- Se der erro, vá na pasta do XAMPP e rode o apache_start.bat pois você poderá ver mais detalhes no log



- Para mim deu o erro "Server Root must be a valid directory":



- Então acessei esse arquivo ali, na linha indicada, e alterei o caminho para apontar para minha pasta do XAMPP e do Apache
de:
ServerRoot "/xampp/apache"
para:
ServerRoot "C:/xampp/apache"



Bom, foi isso, depois disso tudo, funcionou perfeitamente:



Vaaaleu!
Adriano Schmidt

Como redirecionar uma página do WordPress?

Ooopa :D

Hoje precisei que uma página fixa de um blog wordpress redirecionasse para uma página externa ao blog.

Foi muito simples, só instalei esse plugin:

https://wordpress.org/plugins/page-links-to/

e ao entrar na edição da página, lá embaixo aparece um painel onde você coloca a URL e pronto!

Simples e perfeito!

Abraço!
Adriano Schmidt

sexta-feira, 15 de janeiro de 2016

Como setar o img src com CSS?

Opa :)

Eu não queria colocar o src da minha logo em todos os lugares que iam utilizar a logo, então ao invés de fazer isso:

  <img class="img/minha-logo.png" />

Eu fiz isso:

  <img class="minha-logo" />

  .minha-logo {
      content: url("img/minha-logo.png");
  }

Pronto, está "componentizado" :D

Abraço!
Adriano Schmidt

domingo, 10 de janeiro de 2016

Como mockar o document com Jasmine?

Oi :)

Eu tinha no meu código AngularJs (Ionic) o seguinte trecho de código:
document.getElementById("canvasId").getContext("2d")

Quando eu fui rodar o meu teste com Jasmine obtive o erro:
User Controller
    ? when the user creates the product
        TypeError: 'null' is not an object (evaluating 'document.getElementById('canvasId').getContext')
            at C:/Dropbox/workspaces/ws-ionic/my-app/www/js/user/userCtrl.js:9
            at C:/Dropbox/workspaces/ws-ionic/my-app/www/lib/angular/angular.js:11659
            at C:/Dropbox/workspaces/ws-ionic/my-app/www/lib/angular/angular.js:11745

Para resolver isso eu tinha que fazer um mock da variável document.

Para isso, bastou adicionar as duas linhas abaixo no beforeEach do meu teste (ou em qualquer lugar do teste antes de chegar nas linhas que geraram o erro):
$document = angular.element(document);
$document.find('body').append('<canvas id="bar"></canvas>');

É isso aí, abraço!!
Adriano Schmidt

quinta-feira, 7 de janeiro de 2016

Como converter e formatar datas em Angular?

Faaala :D

Se você tem a data, mas ela está como String, você precisa primeiro transformá-la numa data:

var myDate = new Date(myStringDate);

Depois, é só formatar como quiser:

var formattedDate = $filter('date')(myDate, 'dd/MM/yyyy');

Veja que usamos o $filter, então você deve ter ele acessível :)

Abraço!!
Adriano Schmidt