dracoblue.net

Preloading CSS-images for :hover

The top navigation here at dracoblue.net is done with css images, which also have a :hover-effect (showing a lighter version of the image).

So there is a:

http://dracoblue.net/style/menu_news_hover.png

and a

http://dracoblue.net/style/menu_news.png

In CSS it looked like that:

a#newsLink {
    background: transparent url('menu_news.png') no-repeat;
}
a#newsLink:hover {
    background: transparent url('menu_news_hover.png') no-repeat;
}

All this is quite common, but I was facing a usability problem here. The

*hover.png files won't be loaded until one of the links got hover'd. In the perspective of the server owner, you might be happy about that. But for the user, the image is unavailable for nearly a second, because it takes time to deliver the image to the user.

So here is my solution to preload the image (without using javascript or stub-'s).

td#newsLink a {
  background: transparent url('menu_news.png') no-repeat;
}
td#newsLink a:hover {
  background: transparent url('menu_news_hover.png') no-repeat;
}
[strong]td#newsLink {
    background:
        transparent
        url('menu_news_hover.png')
        fixed no-repeat
        -120px -120px;
}[/strong]

I moved the #newsLink to the td surrouding the newsLink. And at the end, I added a new decleration for a non-repeating and - with coordinates -120x-120 - clearly invisible image.

In css, html, open source by DracoBlue @ 23 Feb 2009 | 207 Words

Concat multiple references as one imploded column (mysql)

In my blog I have the following structure (short version):

entry = id,title
category = id,name
entry_in_category = category_id, entry_id

I want to query for the following:

id | title           | categories
---------------------------------
1  | My Entry        | php,mysql
2  | Second ...      | mysql,java

So if you want to get all entries with the corresponding categories you may do a refetch on each of the entries id in the entryincategory table. But if (for example for tags) you really just want to have the name of the categories and nothing more, here comes a pretty gentle way to solve that issue.

SELECT 
    e.id, e.title,
    (
        SELECT <a href="http://dev.mysql.com/doc/refman/5.0/en/group-by-functions.html#function_group-concat">GROUP_CONCAT</a>(c.name)
        FROM entry_in_category e_i_c 
            LEFT JOIN category c ON c.id=e_i_c.category_id
        WHERE e_i_c.entry_id = e.id
    ) categories
FROM entry e

This solution uses the

GROUP_CONCAT function, which was intruduced in mysql 4.1 and concats all results name-fields (oviously not grouped by anything) into a single string.

By default mysql concats the entries by using a ',' but you may use a different seperator by replacing the group-concat-part with the following:

GROUP_CONCAT(c.name SEPARATOR '-')

Thanks to Christian for bringing up a similiar issue, hope that solution helps you to get an idea on how to deal with similiar cases.

In mysql, open source by DracoBlue @ 21 Feb 2009 | 227 Words

UTF-8 connections with Propel in Agavi

If you want to override the propel configurations for charset (encoding) for the connection you usally set the settings['charset'] value to for example utf8.

But if you are using agavi you want to configure propel properly by using agavi's databases.xml.

So after trying a while, here is how you can set the charset (magic is

bold):

<?xml version="1.0" encoding="UTF-8"?>
&lt;ae:configurations
  xmlns:ae="http://agavi.org/agavi/config/global/envelope/1.0"
  xmlns="http://agavi.org/agavi/config/parts/databases/1.0">
  &lt;ae:configuration>
    &lt;databases default="propel">
      &lt;database name="propel"
        class="AgaviPropelDatabase">
        &lt;ae:parameter name="config">%core.app_dir%/config/propelproject-conf.php&lt;/ae:parameter>
        &lt;ae:parameter name="overrides">
          &lt;ae:parameter name="connection">
            &lt;ae:parameter name="dsn">mysql:dbname=icanhazagavirelease;host=127.0.0.1&lt;/ae:parameter>
            &lt;ae:parameter name="user">w00t&lt;/ae:parameter>
            &lt;ae:parameter name="password">not_default_pass&lt;/ae:parameter>
            [strong]&lt;ae:parameter name="settings">
              &lt;ae:parameter name="charset">
                &lt;ae:parameter name="value">utf8&lt;/ae:parameter>
              &lt;/ae:parameter>
            &lt;/ae:parameter>[/strong]
          &lt;/ae:parameter>
        &lt;/ae:parameter>      
      &lt;/database>
    &lt;/databases>
  &lt;/ae:configuration>
&lt;/ae:configurations>

In agavi, open source, php, propel by DracoBlue @ 18 Feb 2009 | 100 Words

Pre-Populating Formfields in Agavi

The AgaviFromPopulationFilter is handy to re-fill a form after validation failed and the user needs to check the values again (without refilling them by hand again).

But the FormPopulationFilter (FPF) is also capable of pre-filling forms.

Just get into your view and add the following:

if ([strong]'read'[/strong] == $this->getContext()->getRequest()->getMethod()) {
        $this->getContext()->getRequest()->setAttribute('[strong]populate[/strong]',
            new AgaviParameterHolder(
                array(
                    'name' => 'Test Entry',
                    [strong]'description'[/strong] => 'This is a short description'
                )
            ), 'org.agavi.filter.FormPopulationFilter'
        );
    }

and your Formfields 'name' and 'description' will be prefilled.

I added the check for 'read' method, since you don't want to auto populate in the case you submitted the data.

The template looks tidy now:

<input type="text" name="name" />
<textarea name="[strong]description[/strong]"></textarea>

Thanks to

veikko and saracen.

In agavi, open source, php by DracoBlue @ 17 Feb 2009 | 132 Words

Unix timestamps in Talend Open Studio

Today (while migrating the userdata for dracoblue.net) I was facing the issue, that I needed to transform the unix timestmaps (used by SimpleMachinesForum) into date-objects.

After trying different things, I noticed that the easiest way is the java-function to create a new Date-Object.

Converting UnixTimestamp (int/long) to Date:

new java.sql.Timestamp(new Long(row1.registerDate)*1000)

Explanation: Since the Timestamp expects milliseconds since 01/01/1970, but I have seconds, I need to multiply be 1000. But since the initial Value may be a int, which can't be that big we need to convert it to Long first.

Converting Date String (e.g. dd.MM.yyyy) to UnixTimestamp:

(TalendDate.parseDate("dd.MM.yyyy",row1.registerDate)).getTime()

Converting Date Object to UnixTimestamp:

row1.registerDate.getTime()

In java, open source, talend by DracoBlue @ 15 Feb 2009 | 120 Words

Page 27 - Page 28 - Page 29

Give something back

Were my blog posts useful to you? If you want to give back, support one of these charities, too!

Report hate in social media Campact e.V. With our technology and your help, we protect the oceans from plastic waste. Gesellschaft fur Freiheitsrechte e. V. The civil eye in the mediterranean

Recent Dev-Articles

Read recently

Recent Files

About