Juan Pablo Garcia Blog

En el ultimo proyecto que estoy desarrollando, me encontré con la necesidad de utilizar un edior WYSIWYG  (What you see is what you get) y he optado por FCKEditor. Un completisimo editor, que incluye muchas funcionalidades, entre algunas:

• Inserción de imagenes, con un Server Browser que permite subir imagenes a nuestra aplicación.
• Insercion de archivos en flash.
• Previsualización
• Posibilidad de maximizar el contenido que estamos editando.
• Asignacion de archivo de estilos, y previsualización de los mismos en tiempo real.
• Integración, para ASP.NET, ColdFusion, ASP, Java, PHP y otros…
• Y muchas cosas mas…

Pero bueno, vamos al problema que me he encontrado:

Al insertar este control en un UpdatePanel de ASP.Net Ajax en intentar submitir los cambios en FireFox, se pierden el texto ingreado en el control.

Para que esto no suceda, como indican en la FCKEditor Wiki debemos registrar un Script en nuestra pagina, y añadir un atributo onclick, en nuestro control que se encarga de enviar los datos.

Para ello, crearemos un Script y lo guardaremos por ejemplo en /FCKEditor/editor/js/FCKHack.js con las siguientes lineas de código:

// Some Class
function MyFCKClass()
{
        this.UpdateEditorFormValue = function()
        {
                for ( i = 0; i < parent.frames.length; ++i )
                        if ( parent.frames[i].FCK )
                                parent.frames[i].FCK.UpdateLinkedField();
        }
}
// instantiate the class
var MyFCKObject = new MyFCKClass();

Luego en nuestra pagina, añadiremenos las siguientes lineas en el Page_Load:

protected void Page_Load(object sender, EventArgs e)
{
    if (!Page.IsPostBack)
    {
        if (!Page.ClientScript.IsClientScriptBlockRegistered("FCKAjaxHack"))
        {
            Page.ClientScript.RegisterClientScriptBlock(this.GetType(),
                "FCKAjaxHack",
                String.Format(@"<script type=""text/javascript"" src='{0}'></script>",
                ResolveUrl("~/FCKEditor/editor/js/FCKHack.js")));
        }
    }
    string sFCKHack = @" if (eval('(typeof(MyFCKObject) != \'undefined\')'))
                    {
                        MyFCKObject.UpdateEditorFormValue(); return true;
                    }
                    else
                    {
                        return true;
                    }";
    cmd.Attributes.Add("onclick", sFCKHack);
}

Donde cmd  en este caso es el botón que se encarga de submitir la página.

Fuentes:
http://forums.asp.net/1513800/ShowThread.aspx#1513800
http://wiki.fckeditor.net/Troubleshooting#head-c83215c3393542ddc261fb2b7a64b60a41253d76

Ayer estuve luchando un poquito con el WordPress intentando buscar algún plugin interesante para escribir mis posts. Sobretodo para poder incluir en ellos código "tabulado y coloreado".

Despues de varios intentos de plugins se me vino a la memoria que, Angel Java Lopez hábia comentado en un post hace unos dias la existencia del nuevo Microsoft Live Writer una aplicacion de escritorio pensada para escribir posts y publicarlos en diferentes Blogs Engines.

Los motores de Blogs soportados, son Windows Live Spaces, Blogger, LiveJournal, TypePad, WordPress , entre otros.

La verdad es que me quede asombrado, al instalarlo, y al intentar publicar mi primer post por la sencillez y facilidad. Y la poca por no decir NADA tarea de configuración necesaria para poder postear en mi nuevo WordPress.

Ademas de todas las funcionalidades que se nos suelen venir a la cabeza al pensar en un programa de estas caracteristicas, éste incluye una opción para añadir Mapas a nuestros posts utilizando Windows Live Local el cuál viene integrado, Ver Mapa de Ejemplo.

La primer impresión al utilizarlo fue un poco decepcionante, ya que lo que buscaba principalmente era poder insertar codigo, como les cuento en primer párrafo. Pero… buscando un poquito por internet, me encontre con este Plugin, que justamente hace eso, y la verdad que lo hace de maravillas. Fue el primero que encontré pero ahora que estoy escribiendo esto para mencionar la URL me he encontrado con este otro y tal vez luego lo pruebe.

Cabe destacar, que además de la aplicación, también se incluye el Windows Live Writer SDK , el que nos permitirá añadirle funcionalidad, programando nuestras propias mejoras.

Aquí les dejo un ScreenShoot para que vean como es la UI. Y de paso pruebo la insención de Imágenes con Thumbnails. Saludos!

Hoy me he dado cuenta al intentar utilizar los CSS Friendly Adapters para un GridView que en la Version 1.0 Final, no brinda la posibilidad de setearle por medio de estilos el tamaño de cada columna.

Lo primero que se me ocurrió fue agregarle a cada BoundField el atributo HeaderStyle-Width pensando que el adaptador me iba a agregar el width por cada columna, pero no fue así.

Ya me habia puesto a mirar el codigo del archivo GridViewAdapter.cs, pero como no estaba muy inspirado, me puse a buscar un poco en la web, donde me encontre con este thread. En el cual me he encontrado con la solución.

Resumiendo un poco el post, lo que debemos hacer es añadir un par de lineas al método WriteRows del archivo GridViewAdapter.cs, el cual lo adjunto al final de este post.

Lo que logramos es que al setear el atributo HeaderStyle-CssClass de cada BoundField del GridView, el Adapter agrege un class a cada <TH> de nuestra tabla, para que luego por medio de CSS podemos encontrar la columna y setearle su tamaño.

Además podemos añadir también un atributo ItemStyle-CssClass el cuál nos permitirá añadirle un class a cada una de nuestras <TD> , por ejemplo, para configurar la alineación del contenido de las columnas. En el siguiente ejemplo no incluyo esta opción pero el comportamiento es el mismo, incluso podriamos asignarle el mismo nombre de clase que para el <TH>.

Un ejemplo puede ser:

<asp:GridView ID="grdNews" runat="server" AutoGenerateColumns="false">
    <Columns>
        <asp:BoundField HeaderText="ID" DataField="NewsLanguageID" HeaderStyle-CssClass="NewsID"  />
        <asp:BoundField HeaderText="Titulo" DataField="Title"  HeaderStyle-CssClass="NewsTitle" />
    </Columns>
</asp:GridView>

Lo que nos generaría un HTML similar a este:

<div class="AspNet-GridView">
    <table cellpadding="0" cellspacing="0" summary="">
        <thead>
            <tr>
                <th class="NewsID" scope="col">ID</th>
                <th class="NewsTitle" scope="col">Titulo</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>1</td>
                <td>Titulo Novedades 1</td>
            </tr>
            <tr class="AspNet-GridView-Alternate">
                <td>3</td>
                <td>Titulo Novedades 2</td>
            </tr>
        </tbody>
    </table>
</div>

Y luego en la hoja de estilos, algo así como:

.AspNet-GridView .NewsID
{
    width:50%;
}
.AspNet-GridView .NewsTitle
{
    width:50%;
}

A continuacion adjunto el método completo y el codigo agregado que se encuentra despues del comentario ” — Añadido —“

private void WriteRows(HtmlTextWriter writer, GridView gridView, GridViewRowCollection rows, string tableSection)
{
    if (rows.Count > 0)
    {
        writer.WriteLine();
        writer.WriteBeginTag(tableSection);
        writer.Write(HtmlTextWriter.TagRightChar);
        writer.Indent++;

        foreach (GridViewRow row in rows)
        {
            writer.WriteLine();
            writer.WriteBeginTag("tr");

            string className = GetRowClass(gridView, row);
            if (!String.IsNullOrEmpty(className))
            {
                writer.WriteAttribute("class", className);
            }

            //  Uncomment the following block of code if you want to add arbitrary attributes.
            /*
            foreach (string key in row.Attributes.Keys)
            {
                writer.WriteAttribute(key, row.Attributes[key]);
            }
            */

            writer.Write(HtmlTextWriter.TagRightChar);
            writer.Indent++;

            foreach (TableCell cell in row.Cells)
            {
                DataControlFieldCell fieldCell = cell as DataControlFieldCell;
                if ((fieldCell != null) && (fieldCell.ContainingField != null))
                {
                    DataControlField field = fieldCell.ContainingField;
                    if (!field.Visible)
                    {
                        cell.Visible = false;
                    }

                    if ((field.ItemStyle != null) && (!String.IsNullOrEmpty(field.ItemStyle.CssClass)))
                    {
                        if (!String.IsNullOrEmpty(cell.CssClass))
                        {
                            cell.CssClass += " ";
                        }
                        cell.CssClass += field.ItemStyle.CssClass;
                    }
                    // -----------------------------
                    // -------- Añadido ------------
                    // -----------------------------
                    if (tableSection == "thead")
                    {
                        if ((field.HeaderStyle != null) && (!String.IsNullOrEmpty(field.HeaderStyle.CssClass)))
                        {
                            if (!String.IsNullOrEmpty(cell.CssClass))
                            {
                                cell.CssClass += " ";
                            }
                            cell.CssClass += field.HeaderStyle.CssClass;
                        }
                    }
                    else
                    {
                        if ((field.ItemStyle != null) && (!String.IsNullOrEmpty(field.ItemStyle.CssClass)))
                        {
                            if (!String.IsNullOrEmpty(cell.CssClass))
                            {
                                cell.CssClass += " ";
                            }
                            cell.CssClass += field.ItemStyle.CssClass;
                        }
                    }
                    // -----------------------------
                    // -----------------------------
                }

                writer.WriteLine();
                cell.RenderControl(writer);
            }

            writer.Indent--;
            writer.WriteLine();
            writer.WriteEndTag("tr");
        }

        writer.Indent--;
        writer.WriteLine();
        writer.WriteEndTag(tableSection);
    }
}

Ya es voz pópuli el lanzamiento del Service Pack 1 para Visual Studio 2005.

Luego de haber instalado, primero la versión Beta y ahora la versión RTM, les aconsejo que previamente tengan en cuenta los siguientes temas.

1.- Si previamente han instalado la Beta, para poder instalar la RTM, es necesario desinstalarla.

Para ello :

Panel de Control > Agregar o Quitar Programas > Quitar Service Pack 1

(En el caso de Windows XP SP2, hacer click en la zona superior en “Mostrar Actualizaciones” para poder visualizarla)

2.- Descargar el SP1 en el mismo lenguaje de la instalación original. aquí

3.- Si tienen instalado WAP (Web Application Project) es necesario desinstalarlo antes de realizar el proceso de actualización al SP1.

4.- Si poseen algun antivirus residente, deshabilitarlo durante la instalación.

5.- Y una de las cosas mas importantes, realizar una instalacion en “silencio” o “Desatendida”. Ya que el proceso de instalación es muy largo y como bien dice uno de los mensajes cuando comenzamos, “Puede tardar incluso HORAS”

Para llevar a cabo este ultimo paso:

Crear un archivo .bat en la misma carpeta donde han descargado el archivo del SP1 (por ejemplo installVS2005SP1.bat) con el siguiente contenido:

reg export HKLM\Software\Policies\Microsoft\Windows\Installer installer.reg
reg add HKLM\Software\Policies\Microsoft\Windows\Installer /v MaxPatchCacheSize /t REG_DWORD /d 0 /f
net stop msiserver
start /wait VS80sp1-KB926601-X86-ENU.exe
reg delete HKLM\Software\Policies\Microsoft\Windows\Installer /v MaxPatchCacheSize /f
reg import installer.reg
net stop msiserver
del /q installer.reg 2>nul

y Ejecutar el archivo.

Fuentes:

http://weblogs.asp.net/jgalloway/archive/2006/12/19/things-i-wish-i-d-known-before-i-installed-vs-2005-service-pack-1.aspx

http://blogs.msdn.com/heaths/archive/tags/VS+2005+SP1/default.aspx

Despues de dar algunas vueltas por la web, buscando un “Engine” de Blog me he decidido finalmente por WordPress.

Basicamente he optado por este, por su simplicidad y sus carácteristicas. Lo he conocido gracias a OpenSourceCMS, una pagina dedicada, como su nombre lo indica, a gestores de contenido de código abierto.

Otro que me ha gustado mucho es el Community Server, el que utilizan mis amigos de Southworks, pero despues de estudiarlo un poco, y ver su gran potencial, me he dado cuenta, que está mas enfocado a una comunidad de usuarios.

En este espacio intentaré escribir sobre los problemas y trabas a los que me voy enfrentando dia a dia, esperando que este medio pueda ser de utilidad para otras personas que se encuentren ante los mismos retos.

Juan Pablo García.