JavaFace-elblogdelprogramador

jueves, 30 de mayo de 2013

Explora y lee Archivos de tu Pc con java (Forma 1)

5/30/2013

A petición de un usuario hoy les presento como realizar un explorador de archivos y leer el archivo seleccionado,pero primero.

Que es un JTree?

un JTree es un árbol que muestra un conjunto de datos en jerarquía, el cual podemos abrir cada nodo o directorio y subdirectorios que posea el directorio origen en este caso un explorador de archivos del directorio desktop o escritorio de la Pc.

para mi un arbol o JTree es uno de los elementos de swing mas complejos seguido del JTable que tiene java. el código que comparto con ustedes lo saque de una aplicación(Decompile) para que lo puedan mejorar si son curiosos dentro del proyecto de descarga encontraran una clase cuyo nombre esFileTreeListener es el escucha de la claseFileTreePanel ademas de ser el oyente o evento me permite añadir un JPopupMenu con el fin de añadir o eliminar elementos al hacer click derecho con el mouse.

Pero como añado o en listo los archivos de un determinado directorio?

para en listar un directorios tengo al metodolistRoots()de la clase File que me permite en listar todos los directorios del computador.

DefaultTreeModel es la clase que nos contendrá todos los datos en este caso los archivos que veremos en el JTree(La vista)

DefaultMutableTreeNode me permite identificar los padres(Directorios) y saber si cada padre tiene hijos(Ficheros) esto lo usa el JTree para saber que pintar y diferenciar quien es hijo(Fichero) de cada padre(Directorios), ademas esta Clase permite modificar las asociaciones entre padres y hijos lo quepermitiríaañadir nuevos hijos a los padres o añadir mas padres.

File[] roots = null;
        if (Constants.isWindows)
            roots = fsv.getRoots();
        else
            roots = File.listRoots();
        
        if (roots.length == 1)
        {
            rootNode = new DefaultMutableTreeNode(new FileTreeNode(roots[0]));
            populateSubTree(rootNode);
        }
        else if (roots.length  1)
        {
            rootNode = new DefaultMutableTreeNode("Computer");
            for (File root:roots)
                rootNode.add(new DefaultMutableTreeNode(root));
        }
        else
            rootNode = new DefaultMutableTreeNode("Error");
        
        fileTreeModel.setRoot(rootNode);

este pequeño fragmento de código es el inicializador ,primero determina que tipo de sistema operativo tiene el usuario luego en lista los directorios y comienza añadir los padres y los hijos.

Como leer un Archivosegúnsea la extension al seleccionar un hijo(Fichero) del JTree?

dentro de la claseFileTreePanel existe un método llamandoAbreArchivo(valor1,valor2) este método me recibe dos valores la clase padre que posee el main(principal) y la ruta del archivo seleccionado esta ruta la recibe la claseFileReader que luego pasara a ser leida por unBufferedReader que me obtendrá el contenido del archivo seleccionado.

if (abrir != null) {
              System.out.println("ENTRO ABRIR");
                  
                if (abrir.getAbsolutePath().endsWith(".txt")||abrir.getAbsolutePath().endsWith(".java")) {
                
                     System.out.println("ENTRO EN LEER");
                         /***********************************/
                         FileReader archivo = new FileReader(abrir);
                         BufferedReader leer = new BufferedReader(archivo);
                         while ((s = leer.readLine()) != null) {
                             cad += s + "\n";
                             
                         }
                             main.getTextArea().setText(cad);
                            
                        leer.close();
                    
                }
                else {
               
                    JOptionPane.showMessageDialog(null, "Solo se permiten archivos con extension *.txt,*.java ");
               }
                 
              }

DESCARGAR CODIGO FUENTE

lunes, 27 de mayo de 2013

Aprende como Crear un circulo de amigos Google+ en java (Parte 1)

5/27/2013

Hace algún tiempojc-Mouse admin y programador de jc-mouse(blog)y jc-mouse(net), me pregunto un día si podría realzar un ejemplo sobre los círculos de amigos que tiene google+(por cierto google+ se actualizo y para mi gusto esta mejor que facebook :)). y hoy es ese día y recordé que existe una forma con un layout especial para colocar cualquier elemento de forma circular y el resto seria trabajo deGraphics2D mi objetivo era de comunicarme con google a través de su API para obtener las imágenes de los seguidores en google+ pero no tuve existo ,por ahora comparto con ustedes la primera parte de la aplicación por que falta aun mas.

Pero existe un layout que me permite colocar los elementos de forma circular?

siCircleLayout permite añadir cualquier varios elemento y dar las coordenadas para ubicar los de forma circular solo tendríamos que instanciar la claseCircleLayout , setLayout(newCircleLayout).

la claseCircleLayout ya viene incluida en el proyecto de descarga para cualquir uso que le quieran dar yo ya tengo unas ideas de como darle uso.

Como darle forma circular al panel y a las imagenes?

ya teniendo el layout que era la parte mas difícil el resto solo tendríamos que hacer uso de la claseGraphics2D .

Darle forma al JPanel

int w = getWidth(); 
     int h = getHeight();
     Graphics2D g2d = (Graphics2D)g.create();
     g2d.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
     /********************************/
     //TextLayout me permite pintar o añadir texto a cualquir elemento en este caso un JPanel
     TextLayout texto = new TextLayout("Soy Seguidor(a)",new Font("Dialog", Font.PLAIN, 21), g2d.getFontRenderContext()); 
     TextLayout total = new TextLayout("10",new Font("Dialog", Font.BOLD, 30), g2d.getFontRenderContext());    
     /*********AÑADO LA FORMA CIRCULAR AL JPANEL**********************/
  g2d.setPaint(new Color(21,160,203));//AÑADO COLOR DE FONDO
  g2d.fill(new Ellipse2D.Double(3, 3, w-6, h-6));//LE DOY LA FORMA AL JPANEL
  g2d.setColor(new Color(100, 100, 100));
  g2d.drawOval(3, 3, getWidth()-7, getHeight()-7);
  g2d.setColor(new Color(255, 255, 255, 50));
  g2d.drawOval(3, 3, getWidth()-6, getHeight()-6);
  /*********AÑADO EL TEXTO Y LE DOY COLOR***************/
  g2d.setColor(Color.WHITE);
  texto.draw(g2d,w/3,h/2); //TEXTO CENTRADO SEGUN EL TAMAÑO DEL TEXTO
  g2d.setColor(new Color(204, 204, 204));
  total.draw(g2d,w/2-10,h/2+32); 
  /**********/
  g2d.dispose();

Darle forma a lasimágenes
las imágenes de los seguidores serian botones que estarían agregados al JPanel con el layoutCircleLayout , hago lo mismo que hice en el JPanel pero, para redondear las imágenes tendría que utilizar la claseEllipse2D.Float(x, y, w,h); esta clase me permite realzar la forma circular seguido de la clasedrawImage() que me permite pintar la imagen dentro del JButton.

if(getImage()!=null){
        g2.setClip(getForma());//LE DOY FORMA A LA IMAGEN CON LA CLASE ELLIPSE
        g2.drawImage(image,3,3, w-6,h-6,this);//PINTO LA IMAGEN EN EL BOTON
       }

protected Shape getForma(){
     
    int w=this.getWidth();
       int h=this.getHeight();
         
      return  new Ellipse2D.Float(3, 3, w-6,h-6);
  }

y de esa forma obtendré las formas deseas que se asemejen al circulo de amigos de Google+.

DESCARGARTE EL CODIGO FUENTE

Añade a tu blog las Tabview o pestañas ideal para las redes sociales

5/27/2013

Las Tabview o pestañas están diseñadas para agrupar un sin numero de widgets o gadgets de blogger con el fin de ahorrar espacio en la plantilla

Instalaciónen blogger

Paso 1) Añadir el CSS y el script

Nos dirigimos a Plantilla--Editar HTML-- y damos un clic dentro del editor de blogger, luego realice la combinación de teclas CTRL-F esto es para abrir el buscador dentro del editor y busque la etiqueta de cierre/b:skin justo arriba de ella pegue el siguiente código CSS.

.tabviewcont{
margin:15px 0;
padding:0;
clear:both;
list-style:none;
}
.tabviewnav {
margin: 0;
padding: 0;
font-size:14px; /* Tamaño de la fuente en las pestañas */
font-weight:bold;
}
.tabviewnav li {
float: left;
margin: 0 -15px 0 0;
list-style:none;
}
.tabviewnav li a {
float: left;
position: relative;
padding: 0 40px;
height: 0; 
line-height: 30px;
text-transform: uppercase;
text-decoration: none;
color:#fff;
border-right: 30px solid transparent;
border-bottom: 30px solid #3D3D3D;
border-bottom-color: #0597db;


}
.tabviewnav li a:hover {
color:#fff;
border-right: 30px solid transparent;
border-bottom: 30px solid #dba105;
border-bottom-color: #b4fc60;
text-decoration:none;
}
.tabviewnav li.tabviewactive a,
.tabviewnav li.tabviewactive a:hover {
border-right: 30px solid transparent;
border-bottom: 30px solid #3D3D3D;
border-bottom-color: #a11bd2;
color:#fff;
}
.tabviewcont .tabviewtab {
padding:5px;

}
.tabviewcont .tabviewtab h2,
.tabviewcont .tabviewtabhide {
display:none;
}
.tabviewtab .widget-content ul{
list-style:none;
margin:0 0 10px 0;
padding:0;
}
.tabviewtab .widget-content li {
border-bottom:1px solid #ccc;
margin:0 5px;
padding:2px 0 5px 0;

}

Terminado de copiar el codigo CSS , buscamos la etiqueta/head y justo arriba de ella pegamos el siguiente código javascript(este código nos agrupa los gadgets).

script type='text/javascript' 
// Tabview para agrupar gadgets
//![CDATA[ 
document.write('style type="text/css".tabview{display:none;}/style');function tabviewObj(argsObj){var arg;this.div=null;this.classMain="tabview";this.classMainLive="tabviewcont";this.classTab="tabviewtab";this.classTabDefault="tabviewtabdefault";this.classNav="tabviewnav";this.classTabHide="tabviewtabhide";this.classNavActive="tabviewactive";this.titleElements=['h2','h3','h4','h5','h6'];this.titleElementsStripHTML=true;this.removeTitle=true;this.addLinkId=false;this.linkIdFormat='tabviewidnavtabnumberone';for(arg in argsObj){this[arg]=argsObj[arg]}this.REclassMain=new RegExp('\b'+this.classMain+'\b','gi');this.REclassMainLive=new RegExp('\b'+this.classMainLive+'\b','gi');this.REclassTab=new RegExp('\b'+this.classTab+'\b','gi');this.REclassTabDefault=new RegExp('\b'+this.classTabDefault+'\b','gi');this.REclassTabHide=new RegExp('\b'+this.classTabHide+'\b','gi');this.tabs=new Array();if(this.div){this.init(this.div);this.div=null}}tabviewObj.prototype.init=function(e){var childNodes,i,i2,t,defaultTab=0,DOM_ul,DOM_li,DOM_a,aId,headingElement;if(!document.getElementsByTagName){return false}if(e.id){this.id=e.id}this.tabs.length=0;childNodes=e.childNodes;for(i=0;ichildNodes.length;i++){if(childNodes[i].className&&childNodes[i].className.match(this.REclassTab)){t=new Object();t.div=childNodes[i];this.tabs[this.tabs.length]=t;if(childNodes[i].className.match(this.REclassTabDefault)){defaultTab=this.tabs.length-1}}}DOM_ul=document.createElement("ul");DOM_ul.className=this.classNav;for(i=0;ithis.tabs.length;i++){t=this.tabs[i];t.headingText=t.div.title;if(this.removeTitle){t.div.title=''}if(!t.headingText){for(i2=0;i2this.titleElements.length;i2++){headingElement=t.div.getElementsByTagName(this.titleElements[i2])[0];if(headingElement){t.headingText=headingElement.innerHTML;if(this.titleElementsStripHTML){t.headingText.replace(/br/gi," ");t.headingText=t.headingText.replace(/[^]+/g,"")}break}}}if(!t.headingText){t.headingText=i+1}DOM_li=document.createElement("li");t.li=DOM_li;DOM_a=document.createElement("a");DOM_a.appendChild(document.createTextNode(t.headingText));DOM_a.href="javascript:void(null);";DOM_a.title=t.headingText;DOM_a.onclick=this.navClick;DOM_a.tabview=this;DOM_a.tabviewIndex=i;if(this.addLinkId&&this.linkIdFormat){aId=this.linkIdFormat;aId=aId.replace(/tabviewid/gi,this.id);aId=aId.replace(/tabnumberzero/gi,i);aId=aId.replace(/tabnumberone/gi,i+1);aId=aId.replace(/tabtitle/gi,t.headingText.replace(/[^a-zA-Z0-9-]/gi,''));DOM_a.id=aId}DOM_li.appendChild(DOM_a);DOM_ul.appendChild(DOM_li)}e.insertBefore(DOM_ul,e.firstChild);e.className=e.className.replace(this.REclassMain,this.classMainLive);this.tabShow(defaultTab);if(typeof this.onLoad=='function'){this.onLoad({tabview:this})}return this};tabviewObj.prototype.navClick=function(event){var rVal,a,self,tabviewIndex,onClickArgs;a=this;if(!a.tabview){return false}self=a.tabview;tabviewIndex=a.tabviewIndex;a.blur();if(typeof self.onClick=='function'){onClickArgs={'tabview':self,'index':tabviewIndex,'event':event};if(!event){onClickArgs.event=window.event}rVal=self.onClick(onClickArgs);if(rVal===false){return false}}self.tabShow(tabviewIndex);return false};tabviewObj.prototype.tabHideAll=function(){var i;for(i=0;ithis.tabs.length;i++){this.tabHide(i)}};tabviewObj.prototype.tabHide=function(tabviewIndex){var div;if(!this.tabs[tabviewIndex]){return false}div=this.tabs[tabviewIndex].div;if(!div.className.match(this.REclassTabHide)){div.className+=' '+this.classTabHide}this.navClearActive(tabviewIndex);return this};tabviewObj.prototype.tabShow=function(tabviewIndex){var div;if(!this.tabs[tabviewIndex]){return false}this.tabHideAll();div=this.tabs[tabviewIndex].div;div.className=div.className.replace(this.REclassTabHide,'');this.navSetActive(tabviewIndex);if(typeof this.onTabDisplay=='function'){this.onTabDisplay({'tabview':this,'index':tabviewIndex})}return this};tabviewObj.prototype.navSetActive=function(tabviewIndex){this.tabs[tabviewIndex].li.className=this.classNavActive;return this};tabviewObj.prototype.navClearActive=function(tabviewIndex){this.tabs[tabviewIndex].li.className='';return this};function tabviewAutomatic(tabviewArgs){var tempObj,divs,i;if(!tabviewArgs){tabviewArgs={}}tempObj=new tabviewObj(tabviewArgs);divs=document.getElementsByTagName("div");for(i=0;idivs.length;i++){if(divs[i].className&&divs[i].className.match(tempObj.REclassMain)){tabviewArgs.div=divs[i];divs[i].tabview=new tabviewObj(tabviewArgs)}}return this}function tabviewAutomaticOnLoad(tabviewArgs){var oldOnLoad;if(!tabviewArgs){tabviewArgs={}}oldOnLoad=window.onload;if(typeof window.onload!='function'){window.onload=function(){tabviewAutomatic(tabviewArgs)}}else{window.onload=function(){oldOnLoad();tabviewAutomatic(tabviewArgs)}}}if(typeof tabviewOptions=='undefined'){tabviewAutomaticOnLoad()}else{if(!tabviewOptions['manualStartup']){tabviewAutomaticOnLoad(tabviewOptions)}}
// 
/script

Paso 2) Añadir los Gadgtes

Culminado el paso 1, busque el sidebar de su preferencia donde va a ubicar los Tabview o las pestañas y dentro de este pegar el siguiente codigo.

div id='sidebar-wrapper'!--el sidebar--
!--INICIO DE PESTAÑAS--
div class='tabview'
    !--INICIO DE PESTAÑA1--
    div class='tabviewtab' id='Pestaña1' title='Facebook'
      b:section class='sidebar-social' id='widget-pestana-1' maxwidgets='1' showaddelement='yes'/
    /div
   !--FIN--
   !--INICIO DE PESTAÑAS2--
   div class='tabviewtab' id='Pestaña2' title='Twitter'
      b:section class='sidebar-social' id='widget-pestana-2' maxwidgets='1' showaddelement='yes'/
    /div
   !--FIN--
   !--INICIO PESTAÑAS3--
   div class='tabviewtab' id='Pestaña3' title='Google +'
      b:section class='sidebar-social' id='widget-pestana-3' maxwidgets='1' showaddelement='yes'/
   /div
   !--FIN--
/div
!--FIN--
/div!--fin del sidebar--

si tienen algun problema diganmelo para realizar la respectiva correcion

Intrega en tu Blog las cajas de comentarios de Facebook y de Blogger fácil y rápidamente

5/27/2013

A petición de un usuario . Hoy les presento una forma de como integrar o agrupar las cajas de comentarios de Facebook y de Blogger de manera sencilla y rapida.

Paso 1) Añadir el CSS y el script

nos dirigimos a Plantilla--Editar HTML-- damos un clic dentro del editor de blogger y realizamos la siguiente combinación de teclasCTRL-F , esto es para abrir el buscador dentro del editor de bloggger y buscamos la etiqueta/head , una vez encontrada justo arriba de este pegamos el siguiente codigo.

style
    .comments-page { 
      background-color: rgba(255, 255, 255, 0.6);/*colo de fondo del contenedor*/
      background-image: -webkit-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
      background-image: -moz-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
      background-image: -ms-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
      background-image: -o-linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
      background-image: linear-gradient(rgba(255,255,255,.5), rgba(255,255,255,0));
      width:100%;
      box-shadow: 0px 0px 8px #000; /* Sombra */
   } 
    #blogger-comments-page {  padding: 0px 5px;  display: none;} 
    .comments-tab { 
     float: left;
     font-size:14px; /* Tamaño de la fuente en las pestañas */
     padding: 0 40px;
     height: 0; 
     line-height: 30px;
     text-transform: uppercase;
     cursor: pointer;
     color: #ffffff;
     border-right: 30px solid transparent;
     border-bottom: 30px solid #3D3D3D;
     border-bottom-color: #d50ee7;
     } 
    .comments-tab-icon { height: 14px;  width: auto;  margin-right: 3px;} 
    .comments-tab:hover {   
     color: #ffffff;
     border-right: 30px solid transparent;
     border-bottom: 30px solid #3D3D3D;
     border-bottom-color: #8ef44b; 
    } 
    .inactive-select-tab { 
     color: #ffffff;
     border-right: 30px solid transparent;
     border-bottom: 30px solid #3D3D3D;
     border-bottom-color: #346de3; 
    }
    /style
    script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/ 
    script src='http://code.jquery.com/jquery-latest.js'/
    script type='text/javascript' 
 //![CDATA[
    function commentToggle(selectTab) { 
       jQuery('.comments-tab').addClass('inactive-select-tab'); 
       jQuery(selectTab).removeClass('inactive-select-tab'); 
       jQuery('.comments-page').hide(); 
       jQuery(selectTab + '-page').show(); 
    } 
 //
    /script

Paso 2) Añadir las Cajas de Comentarios
Terminado el paso uno buscamos con el buscador la siguiente linea de código.

b:includable id='comments' var='post'

una vez encontrada seleccione todo asta el cierre de del includable/b:includable ,y reemplace por el siguiente código.

b:includable id='comments' var='post'
 div class='comments' id='comments'
!--INICIO COMENTARIOS--
center
tabletbodytr
tddiv class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' style='float:left;' title='Comentarios Facebook' img class='comments-tab-icon' src='http://cdn1.iconfinder.com/data/icons/WPZOOM_Social_Networking_Icon_Set/32/facebook.png'/ fb:comments-count expr:href='data:post.url'/ Facebook Comentarios /div/td
tddiv class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&apos;#blogger-comments&apos;);' title='Comentarios Blogger'img class='comments-tab-icon' src='http://cdn1.iconfinder.com/data/icons/new_google_product_icons_by_carlosjj-dwke/32/blogger.png'/data:post.numComments/ Blogger Comentarios/div/td
/tr/tbody/table
div class='comments-page' id='fb-comments-page'
b:if cond='data:blog.pageType == &quot;item&quot;'
div id='fb-root'/div id='fb-root'/script(function(d){var js, id = &#39;facebook-jssdk&#39;; if (d.getElementById(id)) {return;}js = d.createElement(&#39;script&#39;); js.id = id; js.async = true;js.src = &quot;/script
fb:comments colorscheme='light' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='740px'//b:if/div
div class='comments comments-page' id='blogger-comments-page' style='display:none; '
!--FIN DE ESTILO--
   div id='mbt-form'
!--FIN DE ESTILO--
    a name='comment-form'/
    b:if cond='data:mobile'
      h4 id='comment-post-message'
        a expr:id='data:widget.instanceId + &quot;_comment-editor-toggle-link&quot;' href='javascript:void(0)'data:postCommentMsg//a/h4
      pdata:blogCommentMessage//p
      data:blogTeamBlogMessage/
      a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/
      iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/
    b:else/
      h4 id='comment-post-message'data:postCommentMsg//h4
      pdata:blogCommentMessage//p
      data:blogTeamBlogMessage/
      a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/
      iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/
    /b:if
    data:post.friendConnectJs/
    data:post.cmtfpIframe/
    script type='text/javascript'
      BLOG_CMT_createIframe(&#39;data:post.appRpcRelayPath/&#39;, &#39;data:post.communityId/&#39;);
    /script
  /div
/div
/center
 !--FIN--
/div
/b:includable

una vez reemplazado el codigo busque la siguiente linea.

b:includable id='threaded_comments' var='post'

realizamos el mismo procedimiento que en el anterios seleccione todo asta el cierre del includable/b:includable yreemplace.

b:includable id='threaded_comments' var='post'
  div class='comments' id='comments'
    
 center
tabletbodytr
tddiv class='comments-tab' id='fb-comments' onclick='javascript:commentToggle(&quot;#fb-comments&quot;);' style='float:left;' title='Comentarios Facebook' img class='comments-tab-icon' src='http://cdn1.iconfinder.com/data/icons/WPZOOM_Social_Networking_Icon_Set/32/facebook.png'/ fb:comments-count expr:href='data:post.url'/ Facebook Comentarios /div/td
tddiv class='comments-tab inactive-select-tab' id='blogger-comments' onclick='javascript:commentToggle(&apos;#blogger-comments&apos;);' title='Comments from Blogger'img class='comments-tab-icon' src='http://cdn1.iconfinder.com/data/icons/new_google_product_icons_by_carlosjj-dwke/32/blogger.png'/data:post.numComments/ Blogger Comentarios/div/td
/tr/tbody/table
div class='comments-page' id='fb-comments-page'
b:if cond='data:blog.pageType == &quot;item&quot;'
div id='fb-root'/div id='fb-root'/script(function(d){var js, id = &#39;facebook-jssdk&#39;; if (d.getElementById(id)) {return;}js = d.createElement(&#39;script&#39;); js.id = id; js.async = true;js.src = &quot;//connect.facebook.net/en_US/all.js#xfbml=1&quot;;d.getElementsByTagName(&#39;head&#39;)[0].appendChild(js);}(document));/script
fb:comments colorscheme='light' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='740px'//b:if/div
div class='comments comments-page' id='blogger-comments-page' style='display:none; '
  
    a name='comments'/
    h4
      b:if cond='data:post.numComments == 1'
        1 data:commentLabel/:
      b:else/
        data:post.numComments/ data:commentLabelPlural/:
      /b:if
    /h4

    div class='comments-content'
      b:if cond='data:post.embedCommentForm'
        b:include data='post' name='threaded_comment_js'/
      /b:if
      div id='comment-holder'
         data:post.commentHtml/
          !--INICIO DE LIKE EN COMENTARIOS--
            script type='text/javascript'
var likeurl=&#39;data:blog.url/&#39;;
//![CDATA[
for(i=0;iitems_copy.length;i++){a=document.getElementById('c'+items_copy[i].id);gl="'"+items_copy[i].id+"'";b=a.innerHTML+'div class="like-cm" onmousemove="likecom('+gl+')"div id="like-cm'+items_copy[i].id+'"/div/div';a.innerHTML=b}function likecom(i){var a=document.getElementById('like-cm'+i);if(a){a.innerHTML='iframe style="margin:-6px 0 0 -13px" frameborder="0" allowtransparency="true" scrolling="no" height="20" src="http://www.blogger.com/blog-post-reactions.g?options=[Like]&textColor=%23666666#'+likeurl+i+'" width="100"/iframe'}}
//
/script
         !--FIN--
      /div
    /div

    p class='comment-footer'
      b:if cond='data:post.allowNewComments'
        b:include data='post' name='threaded-comment-form'/
      b:else/
        data:post.noNewCommentsText/
      /b:if
    /p

    b:if cond='data:showCmtPopup'
      div id='comment-popup'
        iframe allowtransparency='true' frameborder='0' id='comment-actions' name='comment-actions' scrolling='no'
        /iframe
      /div
    /b:if

    div id='backlinks-container'
    div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'
       b:if cond='data:post.showBacklinks'
         b:include data='post' name='backlinks'/
       /b:if
    /div
    /div
  /div

/center
/div
/b:includable

terminado el paso 1 y el paso 2. guarde los cambios y ahora tendra integrado en su blog la caja de comentarios de Facebook y Blogger, se llegara a tener algun problema haganmelo saber para hacer la respectiva correccion

Descargate este video tutorial sobre Twitter Bootstrap mas ejemplos (Idioma Ingles)

5/27/2013

Bootstrap de Twitter es un excelente conjunto de elementos cuidadosamente elaborados de interfaz de usuario, diseños yherramientas de javascript, libremente disponibles para ser utilizados en tus proyecto de diseño web. Bootstrap es modular y se compone esencialmente de una serie de hojas de estilo que implementan los diversos componentes de la caja de herramientas y también es compatible con las técnicas de diseño de páginas web sensibles. aprendera a usar los componentes para la construcción de un sitio web completo Bootstrap-based. Así que si usted se ha preguntado cómo usar Bootstrap en sus proyectos de diseño web, entonces este curso le llevará directamente a velocidad.

Contenido

Introducción
Resumen del curso
Un primer vistazo a Bootstrap
Descripción Bootstrap e instalación
Andamiaje
El Sistema Grid
Presentaciones y diseño de respuesta
La Base Css
Tipografía
Tablas
Botones, imágenes e iconos
Controles de formulario, tallas y estados
Extendiendo controles de formulario y diseños opcionales
Componentes
Menús desplegables
Grupos de botones y menús desplegables
Aquí, píldoras y listas
El Navbar
Pasos para la navegación y la paginación
Etiquetas, escudos y componentes tipográficas
Alertas y barras de progreso
Componentes generales
Javascript
Modal de Windows
Scrollspy
Tooltips y Popovers
Acordeones e Carruseles
Resumen de diseño

DESCARGAR

Descargate este video tutorial sobre ASP.Net Web API OData Services (Idioma Ingles)

5/27/2013

Con este curso aprenderas a utilizar el API Web ASP.NET para crear servicios de datos basados, en el protocolo OData, incluyendo la sintaxis de consulta OData y formateo de mensajes OData.

El protocoloOData es un estándar multiplataforma abierto para exponer los datos a través de servicios basados, enREST HTTP para consultar y actualizar. El API Web ASP.NET ha ampliado para que pueda crear fácilmente servicios que permiten a la sintaxis de consulta OData en la parte superior de cualquier formato que usted elija para sus cargas útiles, o para hacer OData en toda regla tanto con el lenguaje de consulta y el formato compatible con OData . Este curso le enseñará cómo implementar compatibilidad con consultas OData y formato OData de ida y vuelta CRUD (Create-Read-Update-Delete) operaciones en colecciones de recursos expuestos uso de los servicios Web API. Usted primero aprendera algunos fundamentos sobre los servicios de ASP.NET Web API, REST y OData.

Contenido

Resumen del curso
Introducción a la API de servicios Web ASP.NET y OData
OData plataforma, herramientas y recursos
Apoyar OData Sintaxis de consultas
Apoyar OData Formato y Entidad modelos de datos
Actualización de recursos API Web a través de OData
El consumo de servicios OData de NET y Clientes JavaScript

DESCARGAR

JavaFace-elblogdelprogramador

social counter

jueves, 30 de mayo de 2013

Explora y lee Archivos de tu Pc con java (Forma 1)

CLICK EN EL ANUNCIO PARA ACTIVAR EL BOTON DE DESCARGA

Contraseña: www.javaface-elblogdelprogramador.com

lunes, 27 de mayo de 2013

Aprende como Crear un circulo de amigos Google+ en java (Parte 1)

CLICK EN EL ANUNCIO PARA ACTIVAR EL BOTON DE DESCARGA

Contraseña: www.javaface-elblogdelprogramador.com

Añade a tu blog las Tabview o pestañas ideal para las redes sociales

Intrega en tu Blog las cajas de comentarios de Facebook y de Blogger fácil y rápidamente

Descargate este video tutorial sobre Twitter Bootstrap mas ejemplos (Idioma Ingles)

CLICK EN EL ANUNCIO PARA ACTIVAR EL BOTON DE DESCARGA

Contraseña: www.javaface-elblogdelprogramador.com

Descargate este video tutorial sobre ASP.Net Web API OData Services (Idioma Ingles)

CLICK EN EL ANUNCIO PARA ACTIVAR EL BOTON DE DESCARGA

Contraseña: www.javaface-elblogdelprogramador.com

Guia instructiva Offensive Security en PDF convierte en un White Hacker

Categorias

Blog Archive

Entradas populares