Artigos Sobre javascript


JavaScript é uma linguagem de programação criada por Brendan Eich para a Netscape em 1995, que a princípio se chamava LiveScript. A Netscape, após o sucesso inicial desta linguagem, recebeu uma colaboração considerável da Sun, a qual permitiu o uso do nome JavaScript para alavancar o Livescript, porém as semelhanças entre a linguagem da Sun o Java e o Javascript são quase nulas.
A linguagem foi criada para atender, principalmente, às seguintes necessidades:
  • Validação de formulários no lado cliente (programa navegador);
  • Interação com a página.
Assim, foi feita como uma linguagem de script. JavaScript tem sintaxe semelhante à do Java, mas é totalmente diferente no conceito e no uso.
De acordo com seu sistema de tipos, o JavaScript é:
  • fraca - sua tipagem é mutável;
  • dinâmica - uma variável pode assumir vários tipos diferentes durante a execução;
  • implícita - as variáveis são declaradas sem tipo.
  1. É interpretada pelo interpretador JavaScript, ao invés de compilada;
  2. Possui ótimas ferramentas padrão para listagens (como as linguagens de script, de modo geral);
  3. Oferece bom suporte a expressões regulares (característica também comum a linguagens de script).
Sua união com o CSS é conhecida como DHTML. Usando o Javascript, é possível modificar dinamicamente os estilos dos elementos da página em HTML.
Dada sua enorme versatilidade e utilidade ao lidar com ambientes em árvore (como um documento HTML), foi criado a partir desta linguagem um padrão ECMA, o ECMA-262, também conhecido como ECMAScript. Este padrão é seguido, por exemplo, pela linguagem ActionScript da Adobe(Antigamente Macromedia, porém a empresa foi vendida à Adobe).
Além de uso em navegadores processando páginas HTML dinâmicas, o JavaScript é hoje usado também na construção do navegador Mozilla, o qual oferece para a criação de sistemas GUI todo um conjunto de ferramentas (em sua versão normal como navegador, sem a necessidade de nenhum software adicional), que incluem (e não apenas) um interpretador de Javascript, um comunicador Javascript ←> C++ e um interpretador de XUL, linguagem criada para definir a interface gráfica de aplicações.

Criando o primeiro código em java script
Em qualquer editor de texto  insira o código java script dentro do xtml

<html>
 <head>
    <title></title>
</head>
<body>
      <!--<Código Java Script>-->
      <script type="text/javascript">
      alert("Olá Mundo");//Janela de Alerta do Java Script
     document.write("Olá Mundo");//Escreve na página
        </script>
</body>
</html>


2 artigo   Validador de numeros

<html>
<head>
<script language="JavaScript" type="text/javascript">

function mascara_Numero(campo,leg,msg)
{
valor = document.getElementById(campo.id).value;
legenda = document.getElementById(leg);
pos=0;
   while(pos < valor.length && valor!="")
   {
   if((  valor.charCodeAt(pos)!= 144 &&  valor / valor >0))
legenda.innerHTML = "";
   else
   {
   legenda.innerHTML = "<font color='red'>" + msg + "</font>";
   return false;
   }
  po++;

   }
};
</script>
<body>
<form name="formCadastro" id="formulario" method="post" action="#" >

Codigo:<br/>
<input type="text" name="txtCodigo" id="Numero"  size="10" maxlength="6" onkeyup="mascara_Numero(this,'codigo','Digite apenas números')"/>
<label id="codigo"></label> <br/>
 </form>
</body>
</html>

Artigos Sobre css

Bordas arredondadas em css

Exemplo:












<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br" >
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!--<Bloco CSS-->
    <style type="text/css">
        /*pegando a div noticiaBox*/
        #noticiaBox
        {
            /*Funciona no google Chrome, ie 9*/
            border-radius:10px;
            /*Funciona no Mozila*/
            -moz-border-radius:10px;
            border:1px solid #efefef;
            background-color:#eeffff;/*Passando uma cor para o box*/
            width:400px;/*Definindo a largura em px */
            overflow:auto;/*Faz com que o conteudo dentro do box nao sai caso o conteudo seja maior do que altura definida ele aumenta o box mais esconde o scroll faça
            p teste acrescentando varios conteudos dentro do box noticia*/
        }
        /*Pagando o h1 dentro do box noticia*/
        #noticiaBox H1
        {
            color:silver;/*color: com essa propriedade você pode passar a cor para o texto*/
            padding-left:20px; /*conteudo abordado em outros artigos*/
        }
           
    </style>
  </head>
  <body>
    <div id="noticiaBox">
        <h1>MSDN - subscriptions</h1>
        <ul>
             <li>Conheça os benefícios do assinante</li>
             <li>Compare as opções de assinatura</li>
             <li>Faça o tour</li>
             <li>Adquira uma assinatura agora</li>
       
        </ul>
       
    </div><!--<noticiaBox>-->
  </body>
</html>

Artigos Sobre xhtml

Dia a dia somos supreendimos com nossos clientes sempre pedindo modificações no site desta vez a missão foi aumentar o tamanho de um input do tipo radio.
Caso precise dessa funcionalidade basta seguir o exemplo abaixo.
<input type="radio" value="1" style="width: 5px; height: 5px;" ">

contato

Artigos Sobre ferramentas

Artigos Sobre sql

Dica esperta SQL
Excelente site sobre sql http://beginner-sql-tutorial.com/sql-update-statement.htm aproveitem
Dica esperta SQL.
Quando precisamos mostrar dados para usuário mais esses dados são exibidos  duplicados mesmo com o sql correto podemos usar o Distinct com esse operador só será exibido arquivos distintos.
Sintaxe: SELECT DISTINCT  MEU CAMPO OU TODOS OS CAMPOS .*  FROM MINHA TABELA

Artigos Sobre aspnet

Palestra TDC 2011
ASP.NET MVC


TDC2011 SP Palestra: ASP.Net MVC 3 ao vivo e a cores com Victor Cavalcante - Sábado, 9 de Julho from Globalcode on Vimeo.




Criei uma class que envia e-mail com .net


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
//Chama os objetos responsável por enviar e-mail 
using System.Web.Mail;

namespace sgdc._appclass
{
    public class Email
    {
        private string _mensagem;

        public string Mensagem
        {
            get { return _mensagem; }
            set { _mensagem = value; }
        }
        private string _from;

        public string From
        {
            get { return _from; }
            set { _from = value; }
        }
        private string _to;

        public string To
        {
            get { return _to; }
            set { _to = value; }
        }
        private string _assunto;

        public string Assunto
        {
            get { return _assunto; }
            set { _assunto = value; }
        }
        private string _formatoCorpo;

        public string FormatoCorpo
        {
            get { return _formatoCorpo; }
            set { _formatoCorpo = value; }
        }
        private string _body;

        public string Body
        {
            get { return _body; }
            set { _body = value; }
        }
        private string _smtpServer;

        public string SmtpServer
        {
            get { return _smtpServer; }
            set { _smtpServer = value; }
        }
        private string _send;

        public string Send
        {
            get { return _send; }
            set { _send = value; }
        }

//Metodo responsável por enviar e-mail 
        public void Enviar(string from, string to, string assunto, string texto)
        {
            this._from = from;
            this._to = to;
            this._assunto = assunto;
            this._body = texto;
            MailMessage email = new MailMessage();
            try
            {

                MailMessage mail = new MailMessage();
                mail.To = to;
                mail.From = from;
                mail.Subject = assunto;
                mail.Body = texto;
                SmtpMail.SmtpServer = "localhost";  //your real server goes here
                SmtpMail.Send(mail);
            }
            catch (Exception ex)
            {
                this._mensagem = "Ocorreram problemas no envio do e-mail. Erro = " + ex.Message;
            }
            finally
            {
               
            }

        }


    }
}

msn no site + Asp.net


Nesses artigos vamos utilizar o recurso da Microsoft e customizar esse componente para melhores resultados.
Com a opção de chat nos sites facilitou a comunicação entre cliente e vendedores tornando mais humano a interações entre ambos, e com essa modificação você poderá usar e abusar da nossa criatividade.

Desenvolvimento
Primeira mente precisamos configurar esse recurso no site da Microsoft, para acessar basta entrar nessa pagina http://settings.messenger.live.com/applications/WebSettings.aspx

Configuração do Modulo.

Você estará abrindo uma página de configurações do MSN no live.com, preencha seus dados referente ao seu Windows Live ID.
A próxima página irá exibir uma opção chamada " Permitir que qualquer pessoa na Web veja a minha presença e me envie mensagens.". Marque ela e clique em "salvar" na barra acima.
Após salvar suas configurações, clique no menu "Criar HTML" localizado na lateral esquerda.
Nesta página, vamos escolher  o  controle botão Lembrando que o seu usuário poderá utilizar seu Windows Live ID próprio ou manda uma mensagem como "Visitante".
Logo abaixo aparece um campo onde é exibido um código que você deve copiar e salvar em um bloco de notas.

Vamos iniciar o Visual Studio, criei um novo projeto Web Application ou Web Site nesse exemplo estou utilizando Web Application usando a versão do .NET Framework 3.5

Na página default.aspx entre no source da pagina,  e acrescente na teg head  o componente jquery,e vamos acrescentar o código Java script que fará o controle se o MSN esta online ou não, abaixo a imagem ilustrativa da estrutura do código.
Explorando o código Java script.

  <script type="text/javascript">
<!--< Classe msnStatus ela retorna o status do MSN >-->
  function msnStatus(presence) {
            var idx = presence.id.indexOf('@');
            if (idx >= 0) {
                var id = presence.id.substr(0, idx);
                var element = document.getElementById('Microsoft_Live_Messenger_PresenceButton_' + id);
                if (element) {
                    element.innerHTML = "";

                    var conversationUrl = element.attributes['msgr:conversationUrl'].value;

                    var statusIcon = document.createElement('img');

                    var Status = statusIcon.title = presence.statusText;
<!--<Recebe o status da variável “Status”, e como valor fazemos  as comparações  e atribuímos  para a variável especifica -->
                    $(document).ready(function () {

                        var txtMsnOn = "Clique aqui (Atendente está Online)";

                        var txtMsnOcupado = "Clique aqui (Atendente está Ocupado)";

                        var txtMsnAusente = "Clique aqui (Atendente está Ausente)"

                        var txtMsnOf = "Atendente está Offline";



                        $("#boxstatusMsn").removeAttr("class");

                        if (Status == "Offline") {
           <!-- < Caso o status da variável seja offline, atribuo para o meu span o texto da variável “txtMsnOf”-->
                            $("#statusMsg").text(txtMsnOf);

                        }

                        else if (Status == "Ocupado") {

                            $("#statusMsg").text(txtMsnOcupado);

                        }

                        else if (Status == "Ausente") {

                            $("#statusMsg").text(txtMsnAusente);

                        }

                        else {

                            $("#statusMsg").text(txtMsnOn);

                        }

                    });

                }
            }        }

  </script>

Depois de conhecer a estrutura do java script temos que configurar o corpo de nossa pagina dentro da  tag body ,precisamos colocar os seguinte código como no exemplo a baixo.

    <div>
     Atendimento:<span><a href="http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=e709ab67aad5cfca@apps.messenger.live.com&mkt=pt-br"><label id="statusMsg"></label></a></span>

<div id="Microsoft_Live_Messenger_PresenceButton_e709ab67aad5cfca" msgr:conversationUrl="http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=e709ab67aad5cfca@apps.messenger.live.com&mkt=pt-br"></div>

<script type="text/javascript" src="http://messenger.services.live.com/users/e709ab67aad5cfca@apps.messenger.live.com/presence?dt=&mkt=pt-br&cb=msnStatus"></script>

    </div>

Agora precisamos usar o código gerado pela Microsoft que  provavelmente está como o código abaixo. Nesse código o que vamos aproveitar e apenas o id gerado pela Microsoft localizado na letra vermelha uma vez localizado o id vamos copiar esse código  e apagar a estrutura da Microsoft e vamos deixar na nossa body  a estrutura  que montei

Estrutura Microsoft.

<script type="text/javascript" src="http://settings.messenger.live.com/controls/1.0/PresenceButton.js"></script>
<div
  id="Microsoft_Live_Messenger_PresenceButton_e709ab67aad5cfca"
  msgr:width="100"
  msgr:backColor="#D7E8EC"
  msgr:altBackColor="#FFFFFF"
  msgr:foreColor="#424542"
  msgr:conversationUrl="http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=e709ab67aad5cfca@apps.messenger.live.com&mkt=pt-BR"></div>
<script type="text/javascript" src="http://messenger.services.live.com/users/e709ab67aad5cfca@apps.messenger.live.com/presence?dt=&mkt=pt-BR&cb=Microsoft_Live_Messenger_PresenceButton_onPresence"></script>


Estrutura Tutorial

Essa estrutura e que vamos utilizar no corpo da nossa pagina mais antes precisamos alterar  o id dessa estrutura pelo id gerado pela Microsoft, para ter uma maior segurança podemos localizar e substituir usando o Visual Studio apertanto a tecla ctrl+f  


<div>
     Atendimento:<span><a href="http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=e709ab67aad5cfca@apps.messenger.live.com&mkt=pt-br"><label id="statusMsg"></label></a></span>
<div id="Microsoft_Live_Messenger_PresenceButton_e709ab67aad5cfca" msgr:conversationUrl="http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=e709ab67aad5cfca@apps.messenger.live.com&mkt=pt-br"></div>

<script type="text/javascript" src="http://messenger.services.live.com/users/e709ab67aad5cfca@apps.messenger.live.com/presence?dt=&mkt=pt-br&cb=msnStatus"></script>

    </div>


Exemplo do código do body da pagina.

 <body>
    <form id="form1" runat="server">
    <div>
     Atendimento:<span><a href="http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=e709ab67aad5cfca@apps.messenger.live.com&mkt=pt-br"><label id="statusMsg"></label></a></span>

<div id="Microsoft_Live_Messenger_PresenceButton_e709ab67aad5cfca" msgr:conversationUrl="http://settings.messenger.live.com/Conversation/IMMe.aspx?invitee=e709ab67aad5cfca@apps.messenger.live.com&mkt=pt-br"></div>

<script type="text/javascript" src="http://messenger.services.live.com/users/e709ab67aad5cfca@apps.messenger.live.com/presence?dt=&mkt=pt-br&cb=msnStatus"></script>

    </div>
    </form>
</body>
Resultado Final.

Com essa funcionalidade na sua pagina você poderá colocar imagem ou personalizar o status de acordo com a mensagem recebida pela Microsoft.



 
Twitter + ASP.NET

Um tutorial bem simples usando o .rss do twitter para obter as mensagens o resultado pode ser visto no site http://www.radiodoceu.com/ na barra de noticias Primeiramente inicie o Visual Studio criei um novo projeto ou website como na imagem abaixo File>>New>>Project
Depois clique no botão ok.

Entre na pagina Default.aspx  no modo Designer  dentro da div insira  o titulo Notícia,e arraste o componente Unbound depois basta Renomear  na aba Properties  no campo ID para blTwitter .

Depois entre na Default.apsx.cs ou aperte a tecla  F7  dentro da pagina basta adicionar o código abaixo


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Xml;

namespace twitter
{
    public partial class _Default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {


            /*Twitter*/
            XmlDocument doc = new XmlDocument();
            doc.Load("http://twitter.com/statuses/user_timeline/radiodoceu.rss");

            //Diferente do métodos SelecNodes, aqui especificamos no XPath apenas o elemento que deverá ser consultado
            XmlNodeList No = doc.SelectNodes("//title");


            //Percorremos o objeto, mostrando no navegador os dados encontrados para aquele elemento especificado no XPath
            for (int i = 0; i < 10; i++)
            {
                blTwitter.Items.Add(No.Item(i).InnerText);

            }
        }
    }
}




Agora e so salvar e testar sua aplicação caso você queira personalizar a sua aplicação você pode usar o css  lembrando que o componente usado e uma lista

.twitter li {text-decoration:none;color:#d67200;background-color:transparent;}

.twitter {list-style-image: url(images/twitter.gif)}