October 9th, 2007 by W.Regenczuk

Configuration and application

I believe I did one thing right when coding the theme. I have distinguished between javascript application and javascript configuration. Two objects are created withing WP namespace:

  • Wp.bloginfo – printed by php theme configuration
  • WP.theme – an application

During my read of AjaxWp instructions I have realized that all the things that Gianni Milanesi asks people to fill-in can be filled by WordPress itself. I have created Wp.bloginfo object within header.php that is actually pronted by php.

1
2
3
4
5
6
7
8
9
10
11
12
13
<script>
    // Wp superglobals
    Wp.bloginfo = {
        url: '<?php bloginfo('url'); ?>/',
        ajax_comments_url: '<?php bloginfo('template_url'); ?>/comments_ajax.php?comments_ajax',
        title:'<?php bloginfo('title'); ?>',
        description:'<?php bloginfo('description'); ?>',
        template_url: '<?php bloginfo('template_url'); ?>',
        rss2_url: '<?php bloginfo('rss2_url'); ?>',
        comments_rss2_url: '<?php bloginfo('comments_rss2_url'); ?>',
        wp_query: '<?php _e(http_build_query($wp_query->query)); ?>'
    };
</script>

The application, Wp.theme object reads Wp.bloginfo as a configuration. Here is – in short application – looks like:

1
2
3
4
5
6
7
8
9
10
11
<script>
Ext.namespace('Wp');
 
Wp.theme = function() {
    return {
        init: function() {
            // application init
        }
    };
}();
</script>

As I said Wp.theme read Wp.bloginfo as a configuration. True, if you initialize application once it is configured. To put all this together I have came up with the following:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/theme.js"></script>
<script type="text/javascript">
    // Wp superglobals
    Wp.bloginfo = {
        url: '<?php bloginfo('url'); ?>/',
        ajax_comments_url: '<?php bloginfo('template_url'); ?>/comments_ajax.php?comments_ajax',
        title:'<?php bloginfo('title'); ?>',
        description:'<?php bloginfo('description'); ?>',
        template_url: '<?php bloginfo('template_url'); ?>',
        rss2_url: '<?php bloginfo('rss2_url'); ?>',
        comments_rss2_url: '<?php bloginfo('comments_rss2_url'); ?>',
        wp_query: '<?php _e(http_build_query($wp_query->query)); ?>'
    };
    // blank image
    Ext.BLANK_IMAGE_URL = Wp.bloginfo.template_url +'/ext/resources/images/default/s.gif';
    // theme execution
    Ext.onReady(Wp.theme.init, Wp.theme);
</script>
ajax javascript framework grid tree javascript library component extjs ext js wordpress blog theme ajax javascript framework grid tree javascript library component extjs ext js wordpress blog theme ajax javascript framework grid tree javascript library component extjs ext js wordpress blog theme ajax javascript framework grid tree javascript library component extjs ext js wordpress blog theme ajax javascript framework grid tree javascript library component extjs ext js wordpress blog theme ajax javascript framework grid tree javascript library component extjs ext js wordpress blog theme ajax javascript framework grid tree javascript library component extjs ext js wordpress blog theme ajax javascript framework grid tree javascript library component extjs ext js wordpress blog theme ajax javascript framework grid tree javascript library component extjs ext js wordpress blog theme
Pages: 1 2 3 4 5 6 7 8 9
7 Responses to “Ext JS Theme Revealed”
Nico says:

Testing theme =)

Great app

testando says:

testando, m testando, m testando, m testando, m

Khashayar says:

well done

Me says:

good!

bywide says:

nice … O_O

Trojan, says:

hello! i like this themes, but i can’t install.why ? pls help me!