Archivo de la etiqueta: bug

internet-explorer-logo

IE aplica degradé sobre imagenes transparentes [solución]

Tengo que decirlo: es alucinante los bug que tiene IE (da igual la versión, nunca terminan de solucionarlos).

El ultimo con el que me di es que si usas una imagen transparente para hacer un fondo transparente, se va a ver genial en todos los navegadores menos en Internet Explorer (7 y 8, el 9 no se)

Así es como debería verse:

Y asi es como se ve en IE:

Curioso… bueno googleando un poco di con la respuesta y es básicamente un comportamiento no deseado. Al señor no se le ocurre mejor idea que degradar un fondo transparente que se repita (background-repeat: repeat;) siempre que la imagen sea de 1pxX1px…. raro. Eso me va a enseñar a querer optimizar imagenes :P

por si no quedó claro, hay que hacer la misma imagen pero con por tamaño “prudente”: 10pxX10px para que IE no crea que tiene que degradar la imagen ¬¬

RARISIMO: Android y su perdida de sensibilidad en la pantalla

Puede que haya mil motivos mas por los cuales una pantalla capacitiva pierda sensibilidad, pero la que me tocó esta vez es de las cosas mas raras que me encontré.

Actualice mi móvil a la ultima de Android, cuando termino de cargarse la ROM mi móvil reinicia… bueno aparece la pantalla de bienvenida tipo wizard para configurar cositas como idioma, teclado, etc. El tema es que en ese punto tocaba la pantalla y de a momentos me hacia caso y de a momentos no. Era como intermitente la capacidad de respuesta de la pantalla.

Para ser sincero pensé que había jodido el móvil por no usar la ROM oficial de Movistar + Samsung :)

Busque por Internet un poco hasta que me di con una respuesta en un foro que reza lo siguiente:

“Fijate si t pasa cuando lo tenes cargando…a muchos nos pasa cuandoblo cargamos… no se abren aplicaciones pero es como q el touch se pone inestable al hacer “click”… probalo con un apk por ej touch test… (la bajas del market)”

No me jodan!, ¿que si esta enchufado puede que la pantalla se ponga errática?… Así fue, desconecte el móvil del ordenador (recuerden que lo tenia enchufado porque estaba cargándole una nueva ROM) y anduvo sin problemas.

internet-explorer-logo

Solución al box-model en ie7 usando jQuery

Sé que hay soluciones hechas para este problema en particular, pero pesa 33k y solo necesitamos unas líneas como van a ver para lograr lo mismo…

Sabido es que a ie se la sudan los estándares y cuando los incorporan por lo general lo hacen taaarde.
La propiedad CSS “box-sizing” no es la excepción.

Ya sabemos que el siguiente CSS va a arreglar los desfases que se dan cuando un input que esta con un width:100%; dentro de un div que tiene un ancho fijado.

.elemento {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

Y como comente en el post anterior, esta propiedad no está soportada en ie7.

Soluciones hay de todo tipo, pero lo cierto es que teniendo jQuery en todos mis desarrollos, se me hiso más que obvia la decisión de usar un script que arregle este bug en lugar de usar cosas más raras (archivos .htc por ejemplo).

Para implementar la solución solo necesitas poner este script:

$(document).ready(function () {
    if ($.browser.msie && ($.browser.version.substr(0, 1) == 7 || $("meta[content='IE=EmulateIE7']").length > 0)) {
        $(".ie7Fix-Box-model").each(function (i, v) {
            var el = $(v);
            //calculamos
            var pL = el.css("paddingLeft").replace("px", "") != "" ? el.css("paddingLeft").replace("px", "") : 0;
            var pR = el.css("paddingRight").replace("px", "") != "" ? el.css("paddingRight").replace("px", "") : 0;
            var bLW = el.css("borderLeftWidth").replace("px", "") != "" ? el.css("borderLeftWidth").replace("px", "") : 0;
            var bRW = el.css("borderRightWidth").replace("px", "") != "" ? el.css("borderRightWidth").replace("px", "") : 0;
            var newSize = el.width() - (parseInt(pL, 10) + parseInt(pR, 10) + parseInt(bLW, 10) + parseInt(bRW, 10));
            //le aplicamos el nuevo tamaño
            el.width(newSize);
        });
    }
});

Y ponerle la class “ie7Fix-Box-model” a todos los input que necesites arreglar.

Ver ejemplo (vean el codigo fuente)

Druplicon

Drupal: Error “HTTP request status”

Si ves que drupal te dice en el reporte de estado (admin/reports/status) algo como esto:

Your system or network configuration does not allow Drupal to access web pages, resulting in reduced functionality. This could be due to your webserver configuration or PHP settings, and should be resolved in order to download information about available updates, fetch aggregator feeds, sign in via OpenID, or use other network-dependent services.

Podes decirle a Drupal que ignore este error poniendo la siguiente linea al final del archivo settings.php:

$conf[‘drupal_http_request_fails’] = FALSE;

Al que le interese profundizar mas en el asunto aca esta el hilo:

http://drupal.org/node/245990


PD: lo estoy ignorando al error porque en mi servidor si hay comunicación y aunque Drupal me dice que no la hay, el mismo es capaz de avisarme cuando hay actualizaciones… curioso.

jquery-logo

jQuery: .css(“background-position”) falla en Internet Explorer

Me iba a poner a explicar porque falla y todo lo que tuve que hacer hasta darme cuenta del problema y la forma de solucionarlo, pero prefiero por esta vez simplemente dejarles la función que hice para arreglar el problema:

El siguiente método se acopla a jQuery por lo que lo pueden cargar justo después de jQuery y usarlo normalmente.

/**
 * Devuelve un array con la posicion X e Y respectivamente.
 */
$.fn.bgPosition = function() {
    var bgp = "background-position";
    return $.browser.msie ? [parseInt($(this).css(bgp + "-x").split(" ")[0]), parseInt($(this).css(bgp + "-y").split(" ")[0])] : [parseInt($(this).css(bgp).split(" ")[0]), parseInt($(this).css(bgp).split(" ")[1])];
}

Y como mencione, el uso es bastante sencillo.

//Para usarlo:
alert("las posiciónes X e Y del fondo son: " + $("#cajaConFondo").bgPosition()); //muestra [posX, posY]
alert("La posición X del fondo es: " + $("#cajaConFondo").bgPosition()[0]); //muestra posX
alert("La posición Y del fondo es: " + $("#cajaConFondo").bgPosition()[1]); //muestra posY

Para cerrar el post el problema en resumen es que internet explorer no reconoce la propiedad “background-position” del metodo .css(). En su lugar hay que usar “background-position-x” y “background-position-y

Y una cosita mas: el método solo funciona con pixeles porque es lo que me hacía falta, porcentajes y demases yerbas quedan excluidas salvo que alguien quiera aportar esa parte ;)

Descargar ejemplo

Druplicon

Drupal 6: El tag http-equiv=”Content-type” de
sale duplicado

Un curioso bug en Drupal y de facil solucion. Solamente tenes que poner el siguiente snippet en el template.php de tu theme o bien en algún modulo de tu propia factoría :)

function TU_THEME_preprocess_page(&$vars) {
    $matches = array();
    preg_match_all('/(]*>)/', $vars['head'], $matches);
    if (count($matches) >= 2) {
        $vars['head'] = preg_replace('/]*>/', '', $vars['head'], 1); // strip 1 only
    }
}
jquery-logo

jQuery.height() calcula distintos tamaños entre navegadores [solución]

Este es un tip rápido pero útil.

Escenario:
Tenes un div con el id “elDiv” con el siguiente CSS:

#elDiv {
	border: 1px solid #336699;
	float: right;
	padding: 20px;
	width: 500px;
}

Y en Firefox/Chrome/Safari/Opera al hacer $(“#elDiv”).height(); te entrega 400px por decir algo (el tamaño depende de lo que tenga dentro).
Pero curiosamente en Internet explorer te da un tamaño raro… de menos, unos 358px en nuestro ejemplo.

¿Qué pasa?
Pasa que no le especificaste un modo de renderizado al HTML por medio del DOCTYPE, y por culpa de ello Internet explorer va a renderizar el contenido en modo “Quirks Modehttp://es.wikipedia.org/wiki/Quirks_Mode.

Si no queres leer el articulo de Wikipedia te comento que lo único que tenes que hacer es poner lo siguiente por encima del tag <html>:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/DTD/strict.dtd">

PD: el valor de 358px en mi ejemplo viene de que en modo quirks, IE toma el tamaño del tamaño real menos el padding y el borde: 400 - 40 - 2 = 358.

internet-explorer-logo

El botón de Facebook connect Internet Explorer no aparece (Solución)

Justamente ese fue el problema que tuve hoy. Integré Facebook Connect en una pagina que tengo hecha en Drupal y no había forma de hacer que el botoncito de login se vea en Internet Explorer 7 u 8…

Después de un kilo y medio de I+D descubro que resulta ser que es porque IE no sabe que hacer con los tag <fb>, y dicho problema se soluciona de la forma mas tonta del mundo:
Metiendo el siguiente trozo de código en la etiqueta <html>:

xmlns:fb="http://www.facebook.com/2008/fbml"

Y como nota quiero aclarar que no hace falta reemplazar el atributo existente ya que pueden coexistir ambos:

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xml:lang="es_ES" lang="es_ES">

Y listo. el fukin botoncito ya aparece en IE 7 y 8 (en el 6 ni me gasté en probarlo).

Druplicon

Múltiples drupal_execute() en Drupal 6 es imposible… O NO :)

El otro día Nicolas, un amigo y compañero de trabajo se quebró la cabeza con este tema. La cosa debía ser mas bien simple, en un bucle tenia que procesar una serie de datos, rellenar un formulario programaticamente y darle un drupal_execute() para que se creen una cantidad de nodos…

Eso fue de todo menos simple. Resulta que el que programó la función drupal_validate_form() se olvidó que podía caber la posibilidad de que alguien quisiera llamarlo en bucle, y no se le ocurrió mejor idea que cachear la primera validación y cortar cualquier otra dentro de un mismo request.

La solución por la que se decantó Nicolas fue la de crear una implementación propia de ciertas funciones. Antes que digan algo, recomiendo que se den una vuelta por los foros de Drupal y se convensan de la imposibilidad de aplicar una solución mejor.
De hecho esta solución es bastante buena, porque no tenes mas que poner el código en tu modulo, e invocar la versión modificada de drupal_execute().

La modificación se tuvo hacer mucho antes de llegar a drupal_validate_form() para poder tomar control sobre la misma, por lo que en esta modificación hubo que reemplazar funciones de:
drupal_execute() -> drupal_execute_no_cache()
drupal_process_form() -> drupal_process_form_no_cache()
drupal_validate_form() -> drupal_validate_form_no_cache();

los archivos modificados son estos:

/**
 * @see drupal_execute
 * Unica diferencia, utiliza métodos propios (_no_cache) para evitar el cacheo de validaciones
 */
function drupal_execute_no_cache($form_id, &$form_state) {
    $args = func_get_args();
    // Make sure $form_state is passed around by reference.
    $args[1] = &$form_state;
    $form = call_user_func_array('drupal_retrieve_form', $args);
    $form['#post'] = $form_state['values'];
    drupal_prepare_form($form_id, $form, $form_state);
    drupal_process_form_no_cache($form_id, $form, $form_state);
}
/**
 * @see drupal_process_form
 *
 * @param $form_id
 * @param $form
 * @param $form_state
 */
function drupal_process_form_no_cache($form_id, &$form, &$form_state) {
    $form_state['values'] = array();
    $form = form_builder($form_id, $form, $form_state);
    // Only process the form if it is programmed or the form_id coming
    // from the POST data is set and matches the current form_id.
    if ((!empty($form['#programmed'])) || (!empty($form['#post']) && (isset($form['#post']['form_id']) && ($form['#post']['form_id'] == $form_id)))) {
        $form_state['process_input'] = TRUE;
        drupal_validate_form_no_cache($form_id, $form, $form_state);
        // form_clean_id() maintains a cache of element IDs it has seen,
        // so it can prevent duplicates. We want to be sure we reset that
        // cache when a form is processed, so scenerios that result in
        // the form being built behind the scenes and again for the
        // browser don't increment all the element IDs needlessly.
        form_clean_id(NULL, TRUE);
        if ((!empty($form_state['submitted'])) && !form_get_errors() && empty($form_state['rebuild'])) {
            $form_state['redirect'] = NULL;
            form_execute_handlers('submit', $form, $form_state);
            // We'll clear out the cached copies of the form and its stored data
            // here, as we've finished with them. The in-memory copies are still
            // here, though.
            if (variable_get('cache', CACHE_DISABLED) == CACHE_DISABLED && !empty($form_state['values']['form_build_id'])) {
                cache_clear_all('form_' . $form_state['values']['form_build_id'], 'cache_form');
                cache_clear_all('storage_' . $form_state['values']['form_build_id'], 'cache_form');
            }
            // If batches were set in the submit handlers, we process them now,
            // possibly ending execution. We make sure we do not react to the batch
            // that is already being processed (if a batch operation performs a
            // drupal_execute).
            if ($batch =& batch_get() && !isset($batch['current_set'])) {
                // The batch uses its own copies of $form and $form_state for
                // late execution of submit handers and post-batch redirection.
                $batch['form'] = $form;
                $batch['form_state'] = $form_state;
                $batch['progressive'] = !$form['#programmed'];
                batch_process();
                // Execution continues only for programmatic forms.
                // For 'regular' forms, we get redirected to the batch processing
                // page. Form redirection will be handled in _batch_finished(),
                // after the batch is processed.
            }
            // If no submit handlers have populated the $form_state['storage']
            // bundle, and the $form_state['rebuild'] flag has not been set,
            // we're finished and should redirect to a new destination page
            // if one has been set (and a fresh, unpopulated copy of the form
            // if one hasn't). If the form was called by drupal_execute(),
            // however, we'll skip this and let the calling function examine
            // the resulting $form_state bundle itself.
            if (!$form['#programmed'] && empty($form_state['rebuild']) && empty($form_state['storage'])) {
                drupal_redirect_form($form, $form_state['redirect']);
            }
        }
    }
}
/**
 * @see drupal_validate_form
 *
 * @param $form_id
 * @param $form
 * @param $form_state
 */
function drupal_validate_form_no_cache($form_id, $form, &$form_state) {
    // If the session token was set by drupal_prepare_form(), ensure that it
    // matches the current user's session.
    if (isset($form['#token'])) {
        if (!drupal_valid_token($form_state['values']['form_token'], $form['#token'])) {
            // Setting this error will cause the form to fail validation.
            form_set_error('form_token', t('Validation error, please try again. If this error persists, please contact the site administrator.'));
        }
    }
    _form_validate($form, $form_state, $form_id);
}

Como dije. Copienlo a su módulo y usen drupal_execute_no_cache() en lugar de drupal_execute().