quinta-feira, 21 de setembro de 2017

Construindo um PARSER em javascript - I

Entender a filosofia e a construção de um PARSER de expressões aritméticas é muito importante para aqueles que pretendem fazer programas parametrizados ou com algumas macros ou scripts de configuração e até execução.

Expressão aritmética

As expressões aritméticas são compostas de operandos (números) e de operadores ("+", "-", "*", "/" e exponencial ["^"]).

O sinal dos operandos

Um dos dificultadoreS, que iremos constatar no momento da programação de um Parser, é que os operandos podem ter o sinal negativo. Isto poderá fazer com que dois operadores ("*-" ou "/-" ou "^-") apareçam juntos na expressão, quebrando a lógica natural esperada de OPERANDO-OPERADOR. Em nosso Parser, vamos armazenar os operandos conjuntamente com os seus sinais, e considerar que, na última prioridade de execução das operações, SÓ EXISTEM SOMAS.

A teoria em um diagrama

Percorrer expressões aritméticas é um procedimento cujo esquema geral está representado no diagrama a seguir:


Vamos percorrer a expressão aritmética geral mostrada em (1), caracter a caracter, discernindo, a cada um que é lido, se é um numeral, sinal ou operador aritmético (op1, op2, op3, ...), até alcançarmos o fim da expressão. Na primeira passada, o sinal do operando estará expresso como um operador. E como dissemos, quando encontrarmos o operador da subtração ("-"), o que faremos é colocá-lo como sinal do operando internamente em uma variável de memória, conjuntamente com o operando, e transformar o operador em operador de soma. Esta filosofia de interpretação da expressão aritmética vai economizar um operador, e impedirá a colisão de dois operadores, como ressaltamos mais acima ("O sinal dos operandos").

A prática em um diagrama exemplo

A seguir mostramos um exemplo prático do que falamos no item anterior, expresso em um diagrama:


Aqui estamos tratando das expressões seguindo a ordem de prioridade. Em outro post vamos tratar dos níveis de parênteses, assunto que vai fechar esta série.

Algumas diretrizes para um PARSER:

  1. O rastreamento é feito da esquerda para a direita;
  2. O rastreamento é feito caracter a caracter;
  3. Os espaços entre os caracteres devem ser evitados e, caso existam, suprimidos;
  4. A cada OPERADOR detectado, uma nova variável é reservada em um array;
  5. O operador da subtração é convertida em sinal do número que o sucede;

A razão da diretriz 5 se explica pelo fato citado no item "O sinal dos operandos".

Fluxograma do Parser para expressões

Para deixar o procedimento bem explicado, vamos apresentar um fluxograma misto de instruções e dados:



EXPRESSAO - Variável do tipo string que armazena toda a expressão.
SINAL - Sinal do operando, levando em consideração a regra 5 citada.
[i] - Caracter sendo lido (indice i).
[i+1] - Caracter seguinte ao lido (índice i+1).
PROX_SINAL - Armazena o sinal do próximo operando, pois o sinal precede um operando.
ind - Indice para o array de variáveis que armazenam os operandos.
S - Variável que armazena os caracteres, um a um, rastreados de um operando. Quando é achado um operador, esta variável é esvaziada.

Resultado em debug

Executando o código (listagem completa no último post desta série) em javascript, obtemos o seguinte resultado no navegador:


O array exibido mostra os operandos tanto em itens sequenciais quanto em itens indexados pelos nomes das variáveis ("V01", "V02", ...).

Conclusão

O PARSE de expressões é uma operação simples, mas que exige a observância de sinais e operadores.



terça-feira, 19 de setembro de 2017

substring ou slice em javascript

O Javascript apresenta um novo comando para retirada de pedaços de uma string, em alternativa ao substr, em alguns casos. É o comando slice.

A seguir, apresentamos o uso de ambos e os resultados obtidos:


O substr tem a grande vantagem de extrair um pedaço da string a partir de um ponto de referência. Já o slice negativo faz apenas o papel de um comando right, disponível em muitas linguagens.


domingo, 22 de janeiro de 2017

Como acabar de vez com essa merda de Amisites, Nuesearch e Luckysite

Como toda nova praga que aparece, (1) afeta o navegador de Internet e (2) enche de sites com pretensas soluções, mas que só te mostram, e não apagam.

Aqui vamos ensinar como ficar livre DEFINITIVAMENTE desta praga, além de te preparar para ficar livre de tantas outras.

No Windows, basta editar o arquivo hosts, que fica localizado no caminho:

C:\Windows\System32\drivers

Você deve editar o arquivo como Administrador.

Veja, nas últimas linhas, o que deve ser acrescentado:

# Copyright (c) 1993-2009 Microsoft Corp.
#
# This is a sample HOSTS file used by Microsoft TCP/IP for Windows.
#
# This file contains the mappings of IP addresses to host names. Each
# entry should be kept on an individual line. The IP address should
# be placed in the first column followed by the corresponding host name.
# The IP address and the host name should be separated by at least one
# space.
#
# Additionally, comments (such as these) may be inserted on individual
# lines or following the machine name denoted by a '#' symbol.
#
# For example:
#
#      102.54.94.97     rhino.acme.com          # source server
#       38.25.63.10     x.acme.com              # x client host
# localhost name resolution is handled within DNS itself.
# 127.0.0.1       localhost
# ::1             localhost
# route add 104.25.99.11 172.217.28.4
0.0.0.0 www.amisites.com
0.0.0.0 www.luckysite.com
0.0.0.0 www.luckysites.com
0.0.0.0 www.nuesearch.com

Este macete usa os próprios recursos do protocolo TCP/IP, sem as falsas promessas de removedores mentirosos, que não funcionam, e te deixam na mesma.

Uma vez salvo, reinicie o seu computador.


quinta-feira, 20 de outubro de 2016

Modificando Angular JS para aceitar seletores jQuery

Como toda inovação, o framework Angular provocou certas perdas de funcionalidades.

Uma destas perdas foi em relação à instrução "find" do jQuery, ao qual deu o nome de "JQLite".

A alteração

No entanto, podemos restituir o poder ao JQLite do framework Angular JS através de uma pequena modificação, que mostramos abaixo.

Basta procurar a função find do JQLite através de qualquer editor de texto na versão de desenvolvimento:


Abaixo da função "find", inclua o seguinte:


Se o navegador for de uma atualização recente, ele certamente possuirá a instrução "querySelector"

No código

Em sua página que utiliza o Angular, o código será parecido com o seguinte:

<div id="d01" class="d01" ng-app="App" ng-controller="myCtl" ng-init="firstName='John'">

<p>Input something in the input box:</p>
<p>Name: <input type="text" ng-model="firstName"></p>
<p>You wrote: {{ firstName }}</p>
<script>
angular.module('App', []).controller('myCtl', function ($scope, $document) {
angular.element($document).ready(function () {
$document.findsel("#d01").css("backgroundColor", "lightyellow");
});
});
</script>
</div>

Repare que tivemos que fazer a injeção de $document no módulo.





segunda-feira, 19 de setembro de 2016

Google Custom Search limits - Pesquisa personalizada da Google tem limites diários

De mecanismo livre para pesquisa, a Google está começando a impor limites aos seus usuários.

Ao longo do tempo ela vem criando APIs, ou seja, serviços dedicados a determinados campos do conteúdo virtual.

O caso das pesquisas personalizadas (Custom Searches) é algo útil para quem faz pesquisas em um grupo limitado de sites (pois a proliferação absurda do número de sites e de artigos vem se tornando um empecilho perigoso para os leigos) a toda hora.

Ai você vai utilizando e descobre que depois de 100 (cem) pesquisas deste tipo, tem que pagar um valor para a Google. Absurdo. Que história é essa ? Se o Google se tornou uma biblioteca pública, e nós já pagamos os domínios e os provedores, vamos pagar pro Google por quê ? Nós, os internautas, construímos a Google. Se ele se tornou o que é hoje, foi graças a nós.

Parece que teremos, num futuro bem próximo, migrar para outras ferramentas de pesquisa, como Bing da Microsoft, Yahoo, Ask, etc. Ou então, a comunidade livre terá que tomar a frente e fazer um novo, com base na experiência dos já existentes.

Hoje, ao pesquisar um assunto sério, encontramos páginas desde aquelas feitas por pirralhos de 12 anos, até as produzidas seriamente por verdadeiros PhD's.

Os critérios para se filtrar o que é realmente é bom estão mais ou menos descritos no artigo:

Como é um texto bem escrito.

Conclusão

Se não forem tomadas providências, em algum tempo o Google começará a restringir o número de resultados a duas páginas, ou cobrar para mostrar resultados de sites de universidades, ou outros critérios espúrios.

Divulgue este artigo, pois O CONHECIMENTO É LIVRE.

terça-feira, 13 de setembro de 2016

Estrutura básica de uma extensão XUL para o Mozilla Firefox

As extensões Firefox são uma forma de se publicar aplicativos cliente para navegadores.

As extensões do Chrome tem muitas limitações, devido às políticas de proteção e de contabilização do Google. Portanto, se for fazer extensões, faça para Firefox.

Estrutura de diretórios

As extensões apresentam a seguinte estrutura de diretório dentro do Windows:


Função dos diretórios

content - Armazena os arquivos XUL de extensão, bem como bibliotecas JAR e Javascript a que estes arquivos XUL façam referência;
locale - Armazena as constantes, nomes de labels e outros parâmetros que dependem da língua na qual a extensão será utilizada;
skin - Armazena as folhas de estilo (CSS) a serem intercambiadas para adaptação da interface da extensão.

Função dos arquivos

content/Hello.xul - Arquivo funcional principal da extensão. Poderia ter outro nome, mas precisa, obrigatoriamente, levar a extensão XUL;
chrome.manifest - Os desenvolvedores convencionaram chamar este tipo de arquivo de "manifesto", ou seja, a "placa" de referências dos caminhos onde estão os principais arquivos da aplicação. A origem de tal terminologia remonta aos programadores Java;
install.rdf - Contém informações básicas para registro da extensão no Firefox, como nome do projeto da extensão e informações de versão pouco importantes para o funcionamento, mas muito importantes para o controle da evolução da extensão.

Explicação detalhada dos conteúdos

install.rdf

<?xml version="1.0"?>

<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
  xmlns:em="http://www.mozilla.org/2004/em-rdf#">

  <Description about="urn:mozilla:install-manifest">
    <em:id>hello@meyer.com</em:id>
    <em:name>XUL Hello</em:name>
    <em:description>Welcome to XUL!</em:description>
    <em:version>0.1</em:version>
    <em:creator>Meyer</em:creator>
    <em:homepageURL>https://www.dvelopment.com.br</em:homepageURL>
    <em:type>2</em:type>

    <!-- Mozilla Firefox -->
    <em:targetApplication>
      <Description>
        <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id>
        <em:minVersion>4.0</em:minVersion>
        <em:maxVersion>10.*</em:maxVersion>
      </Description>
    </em:targetApplication>
  </Description>
</RDF>

Como o leitor mesmo pode ver, não existem informações que possam influir no funcionamento da extensão. As mais importantes para o controle do projeto estão destacadas em vermelho. O código em fonte azul corresponde ao Firefox, e NÃO PODE SER ALTERADO.

chrome.manifest

Apesar de levar o nome chrome, este arquivo não carrega em si nenhuma compatibilidade com o navegador deste nome.

content hello content/

Apenas esta linha é necessária em nosso exemplo mínimo de extensão Firefox. Ela associa o "content" (conteúdo) ao caminho content/ do diretório que contém a nossa extensão, a partir da sua raiz.

content/Hello.xul

Este é o nome de um dos arquivos XUL utilizados em nossa extensão e, no nosso caso, o único.

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window
id="findfile-window"
title="Find Files"
orient="horizontal"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<!-- Other elements go here --> 
<label value="This is some text"/>
</window>

Nesta estrutura de código, as tags Windows delimitam o mesmo objeto Windows que conhecemos do DOM (Document Object Model) do HTML.

Empacotamento da extensão

A extensão precisa ser compactada em arquivo ZIP (marque os diretórios e arquivos do mesmo nível que o diretório content) e sua extensão precisa ser alterada para XPI. Proceda a estas ações. Se não possuir um compactador, instale o 7zip, ou Windows RAR.

Instalação da extensão

Uma vez que você tenha compactado e renomeado o pacote de arquivos da extensão, execute o Firefox. Acione o menu à direita do navegador, e escolha a opção "Complementos".


Na tela seguinte, clique sobre a engrenagem mais à direita da tela.


Escolha a opção de instalação.

Será exibido o diálogo de arquivos do Explorer, e você deverá achar o diretório onde colocou o pacote renomeado para a extensão XPI.


Serão exibidas as mensagens de confirmação.


O Firefox vai avisar que você está tentando instalar um complemento não assinado. Mesmo assim, clique no botão "Instalar".

Se ele se recusar, assim mesmo, acione a configuração do Firefox (about:config).



Clique em "Serei Cuidadoso". Depois localize a chave "xpinstall".

Altere o valor desta opção para false, desta forma o Firefox vai desprezar esta segurança de assinaturas.

Em seguida ao instalar, conforme vinhamos em nosso roteiro, será dado um aviso, para reiniciar o Firefox.


Faça isso.

Teste da extensão

Lembre-se sempre que o teste e a execução desta extensão SÓ PODE SER FEITO NO NAVEGADOR FIREFOX. Muita gente se esquece disso, e perde tempo precioso, achando que fez algo errado, experimentando a extensão em outro navegador.

Digite o seguinte caminho no navegador Firefox:

chrome://hello/content/Hello.xul

e veja o resultado de todo o nosso esforço:


De onde veio esta frase que aparece no navegador ?

A frase veio da tag Label, colocada no arquivo Hello.xul:


E as tags Window delimitam o objeto que define a janela do navegador.


quinta-feira, 1 de setembro de 2016

Como funciona o jQuery - O que ele é - Hacking jQuery - II

Nesta continuação de "Hacking jQuery", vamos modificar a classe jQuery mínima para admitir o reuso de métodos:

tQuery.js

(function( window, undefined ) {

var
// Referência à raiz jQuery(document)
rootjQuery,

// Usa o documento correto de acordo com a chamada (sandbox)
document = window.document,
location = window.location,
core_version = "a.0.0",
init_selector,
jQuery = function( selector, context ) {
// O objeto jQuery é realmente o construtor init 'melhorado'
return new jQuery.fn.init( selector, context, rootjQuery );
}
jQuery.fn = jQuery.prototype = {
// Versão corrente do jQuery
jquery: core_version,

constructor: jQuery,
init: function( selector, context, rootjQuery ) {
var match, elem;
init_selector = selector;
// Manipula: $(""), $(null), $(undefined), $(false)
if ( !selector ) {
return this;
}
},
size: function() {
if( typeof(this) == 'object' ){
var len = 0;
for (var o in this) {
len++;
}
}
this.context = document;
this.size = len; 
return this; 
},
version: function() {
this.versao = this.jquery;
return this;
}
}

window.jQuery = window.$ = jQuery;
jQuery.fn.init.prototype = jQuery.fn;
rootjQuery = jQuery(document);

})( window );

Agora vamos executar o arquivo HTML alterado:

rtQuery.html


<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=iso-8859-1" />

<title>jQuery Demo</title>

<script type="text/javascript" src="tQuery.js"></script>

</head>
<body id="b1" name="nb1" OnLoad="inicia();">
<p id="p1" name="np1">xxx xxx xxx</p>
</body>
<script>
function inicia(){
var a = $("#p1").version().size();
}
</script>
</html>

Vamos exibir apenas a fase de debug ao chegar no método "version":


Como "version" devolve "this", que é um ponteiro para a instância jQuery, quando o método "size" é invocado ...


e processado ...


o erro não mais ocorre.

No entanto, existe um erro de concepção. O método "size" deveria ser método de "version", portanto deveria estar dentro da sua definição. Fizemos esta "gambiarra" apenas para mostrar a concepção que possibilita métodos chamarem métodos dentro do objeto jQuery.