jul 05

Valeu Luringa pelo set list

Ouçam aqui quase todas as músicas que achei no grooveshark

jan 19

Para inserir o Firebug Lite em qualquer site que você queira no Android, iPhone, iPad, no computador do trabalho (onde você não tem permissão pra instalar nada), etc. Basta adicionar este código abaixo como favorito e clicar depois de ter aberto o site que deseja debugar.

javascript:(function(F,i,r,e,b,u,g,L,I,T,E)%7Bif(F.getElementById(b))return;E=F%5Bi+'NS'%5D&&F.documentElement.namespaceURI;E=E?F%5Bi+'NS'%5D(E,'script'):F%5Bi%5D('script');E%5Br%5D('id',b);E%5Br%5D('src',I+g+T);E%5Br%5D(b,u);(F%5Be%5D('head')%5B0%5D%7C%7CF%5Be%5D('body')%5B0%5D).appendChild(E);E=new%20Image;E%5Br%5D('src',I+L);%7D)(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','%23startOpened');

Como assim!?

Pra quem não sabe, há uma forma de se inserir js em qualquer site pela barra de endereço. Faça o teste, neste meu blog mesmo!

  1. Apague tudo o que estiver na barra de endereço
  2. Escreva: javascript:alert(‘Luiza está no Canadá’);
  3. <Enter>
Sacou?! Se você adicionar este código no lugar de uma url de um favorito ele executará o código na página que estiver aberta.
PS.: Não é tão fácil de usar num aparelho touch e/ou mobile, mesmo porque a interface é pra quem tem um mouse e mesmo se seu aparelho tiver uma daquelas canetas a tela dele provavelmente é bem pequena, mas quebra um galho dependendo do que quiser fazer com o debugger!
Tagged with:
nov 22

Cheguei na versão 2.0 da WebApp Jornaleiro. Com isso trazendo melhorias no layout, disponibilidade de app offline, armazenamento de configurações e várias opções de localidade, pra você poder ler notícias da região que mais lhe interessa.

Para ter essa WebApp no seu aparelho mobile acesse jornaleiro.jampow.com.br e adicione-a em sua tela inicial.

Quaisquer dúvidas ou sugestões deixe um comentário por aqui, terei grande prazer em responder ou implementar uma melhoria!!

Tagged with:
nov 14

Não sei vocês mas eu e meus pais gostamos muito destes jornais de distribuição gratuíta, em especial o Metro e o Destak. Mas ambos não têm uma app ou um acesso fácil ao PDF pelo site deles e não é sempre que passamos num cruzamento em que distribuem, por isso fiz esse site/App chamado jornaleiro!

Está acessível pelo endereço jornaleiro.jampow.com.br.

Adicione à sua tela inicial no iPhone ou Android e baixe o PDF do dia do Metro ou do Destak para ler em seu mobile.

Teremos mais novidades em breve!

out 23

Este post é pra quem gosta de música e já teve a oportunidade de brincar com a app Ocarina para iPhone ou a versão alternativa para Android (que eu não conheço).

Em dois dias fiz um dicionário bem simples das notas, de acordo com o modo e a escala escolhidas. Todo o código está disponível na minha página do GitHub.

Depois coloco um Live Demo aqui, mas por hora é isso.

set 07

Já tinha dado uma lida aqui, outra ali, mas hoje resolvi pôr a mão na massa definitivamente e fazer algo que alguns clientes vêm pedindo há algum tempo. Uma ferramenta simples onde pudesse colocar alguns endereços ordená-los como eu quiser e pedir ao google que trace as rotas entre os pontos.

1. Iniciando

Vamos começar com a estrutura básica e a inicialização do mapa.

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps - Rotas</title>
<link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />

  <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
  <script type="text/javascript">
    var directionDisplay;
    var map;

    function initialize() {
      directionsDisplay = new google.maps.DirectionsRenderer();
      var saopaulo = new google.maps.LatLng(-23.5489433, -46.6388182);
      var myOptions = {
        zoom: 12,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        center: saopaulo
      }
      map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
      directionsDisplay.setMap(map);
    }

  </script>
</head>
<body onload="initialize()">
<div id="map_canvas" style="float:left;width:100%;height:100%;"></div>
</body>
</html>

2. Adicionando alguns controles

Certo. Vamos modificar um pouco e colocar um painel de controle a direita, para que possamos adicionar uma lista com endereços, para facilitar um pouco, vamos carregar o jQuery (1.6.2) e jQueryUI (1.8.16). Nosso HTML entre as tags <body></body> ficam assim.

<div id="map_canvas" style="float:left;width:70%;height:100%;"></div>
<div id="control_panel" style="float:right;width:30%;text-align:left;">
  <div style="padding:10px">
    <input type="text"   id="addr" name="address" />
    <input type="button" id="adic" name="adicionar" value="Adicionar à Rota" />

    <p>Dê um duplo clique para remover um endereço da rota</p>

    <ol id="route">
      <li id="1">R. Cipriano Barata, 200 - São Paulo</li>
      <li id="2">Av. Lacerda Franco, 400 - São Paulo</li>
    </ol>

    <input type="button" id="trace" name="trace" value="Traçar Rota" />
  </div>

</div>

E ao nosso JavaScript adicionamos:

    $(function(){

      //Adiciona endereço à lista
      $('#adic').click(function(){
        var ender = $('#addr').val();
        if (ender != '') {
          $('#addr').val('');
          var newid = new Date().getTime();
          $('#route').append('<li id="' + newid + '">' + ender + '</li>');
        }
      });

      //Habilita função de ordenação da lista
      $('#route').sortable({axis:'y'});

      //exclui no duplo clique
      $('#route').delegate('li', 'dblclick', function(){
        $(this).remove();
      });

    });

Legal, temos uma lista dinâmicas de endereços e um botão pra atualizar o mapa, que não faz nada ainda. Então…

3. Atualizando o mapa com as rotas

Começamos instanciando o objeto DirectionsService da API, para isso vamos adicionar a seguinte linha nas declarações iniciais do nosso bloco de JS.

var directionsService = new google.maps.DirectionsService();

E por fim no clique do botão “Traçar Rota”


      function getText(id) {
        return $('#'+id).text();
      }

      $('#trace').click(function () {
        var addresses = $('#route').sortable("toArray");
        var len       = addresses.length

        if (len < 2) {
          alert('Se liga... Não existe rota sem pelo menos dois endereços!');
          return false;
        }

        var start = getText(addresses[0]);
        var end   = getText(addresses[len - 1]);
        var waypts = [];
        for (var i = 1; i < len-1; i++) {
            waypts.push({
                location:getText(addresses[i]),
                stopover:true});
        }

        var request = {
            origin: start,
            destination: end,
            waypoints: waypts,
            optimizeWaypoints: false,
            travelMode: google.maps.DirectionsTravelMode.DRIVING
        };
        directionsService.route(request, function(response, status) {
          if (status == google.maps.DirectionsStatus.OK) {
            directionsDisplay.setDirections(response);
          }
        });
      });

O resultado final, você pode ver aqui.

Acompanhe a evolução do código ou proponha melhorias no meu repositório do Git Hub

ago 13

Bem, eu também não sabia, mas agora eu sei! Sim, mas também não falarei o que é! Acesse este site, faça os simples exercícios propostos e descubra você mesmo, é fácil e rápido!

Se você não é tão bom de inglês, fique tranquilo! Eu estou traduzindo/adaptando traduzi/adaptei as lições para o português pra que todos possam entender!

Atualizarei este post em breve com o link traduzido assim que concluir o trabalho.

Pra vê-la em português, clique na bandeira do Brasil no rodapé da página.

Até mais!

Tagged with:
mar 13

Não sei você mas eu já precisei trabalhar em locais sem internet, até mesmo em casa quando meu provedor de internet resolve me deixar na mão. Mas enfim, você precisa produzir e não lembra como escreve aquele método que você tanto precisa e não consegue acessar a internet para consultar a documentação… o que fazer?!

Enquanto estiver com internet prepare seu computador pra quando ela se for!

ruby:

cd ~/.rvm/source/ruby-1.8.7-p302
rdoc -o ~/rubydoc --format=html

gems:

gem install yard
yard server --gems
Tagged with:
out 16

Depois do curso de imersão rails da e-genial sinto-me mais confiante pra usar o rails e todo o poder de ruby, por isso decidi buscar mais gems pra resolver meus problemas e tirar algumas das bibliotecas JS que tenho usado, por exemplo, pra fazer gráficos, como o FLOT pra jQuery. Já tinha visto meio por cima o Google Charts, mas como já tinha iniciado a implementação dos gráficos com FLOT achei melhor dar continuidade e avaliar depois uma alteração ou deixar para novos projetos, quando achei a GEM chamada GoogleCharts, mais auto-explicativa impossível! Muito fácil de usar também. A única desvantagem que vejo em usar essa GEM é o fato dela devolver uma imagem estática com o gráfico, com javascript conseguimos ter algumas “firulas” interativas que os clientes adoram, por outro lado, pra renderizar o JSON no formato que o plugin exige é um pouco mais trabalhoso. #segueadica

Tagged with:
abr 15

Testei a distro Ubuntu Lucid Lynx alpha 3, gostei muito da integração com as redes sociais e da velocidade de inicialização (+/- 15 segundos), a instalação também foi extremamente simples, até minha chefe quer testar/aprender agora, será que consigo converter mais um usuário?!

A única coisa que não gostei foram os botões pra fechar, minimizar e expandir das janelas do lado esquerdo como no macOS, mas isso se resolve mudando o tema.

Vamos aguardar o lançamento oficial!

Tagged with:
preload preload preload