tag: JavaScript

OpenWrt GUI

23 Sep, 2005 - 1 minutes

Finally I bit the bullet and decided to implement OpenWrt web-based user interface using Felix Fietkau’s code. Well, MIPS processors used by OpenWrt units are not race horses and GUI is slow to my taste. Yes, I know that stock firmware is not faster. "Slow" is absolute category for me.

How do we combat latencies and slow network speed? Exactly. We can apply the same for OpenWrt, where "slow network speed" is replaced with "slow processor on local network". So I decided to do The Right Thing(tm) and implement it using AJAX approach. I will use Dojo.

Code: my categories

After some requests I decided to publish my code for categories. It’s very simple. It was inspired by following articles: A "category" Data Model (note: this article uses old-style model format, it doesn’t work anymore) and Relating an object to itself, many-to-one.

from django.core import meta

class Category(meta.Model):
    """
    Category defines following fields:

    name        - simple name of category, e.g., 'C++'
    full_name   - full name of category, which includes names of all parents,
                  e.g. 'Development::C++'
    parent      - reference to parent category or null
    description - HTML description of category, or null

    Notes:

    1) full_name is not editable. It is calculated automatically
       by calculate_full_name() method during save phase (hook _pre_save).
    2) Separator specified by get_separator() method. It can be
       overridden in subclasses.
    """
    name        = meta.CharField(maxlength=50)
    full_name   = meta.CharField(maxlength=250, unique=True,
                                 editable=False)
    parent      = meta.ForeignKey('self', blank=True, null=True,
                                  related_name='child')
    description = meta.TextField(blank=True, null=True,
                                 help_text="Use raw HTML.")

    class META:
        verbose_name_plural = 'Categories'
        module_name = verbose_name_plural.lower()
        admin = meta.Admin(
            list_display  = ('full_name',),
            search_fields = ['full_name',],
            js = (
                '/tiny_mce/tiny_mce.js',
                '/appmedia/admin/js/textareas.js',
            ),
        )
        ordering = ('full_name',)

    def __repr__(self):
        return self.full_name

    def _pre_save(self):
        self.full_name = self.calculate_full_name()

    def get_separator(self):
        return '::'

    # note: used in templates
    def get_all_children(self):
        "get list of all children of the category"
        output = []
        children = self.get_child_list()
        for c in children:
            output.append(c)
            output.extend(c.get_all_children())
        return output

    # note: the last object of the list is the category itself
    # note: used in templates
    def get_all_parents(self):
        "get list of all parents of the category from top level parent down"
        id_list = []
        object = self
        while True:
            id_list.append(object)
            if not object.parent_id:
                break
            object = object.get_parent()
        id_list.reverse()
        return id_list

    # note: used in templates
    def calculate_full_name(self):
        "calculate full name from parent list"
        return self.get_separator().join([x.name for x in self.get_all_parents()])

    # note: used in templates
    def get_path(self):
        "get relative path of the category"
        return 'categories/%d/' % self.id

As you can see it is very simple. This model defines full_name field, which is auto-populated. I was toying with an idea to keep parent_name and produce full_name by concatenating parent_name with name. But after some trials I decided against it: it introduced a lot of complexities and runtime overhead by saving a few bytes in database. In my opinion it doesn’t worth it. This model defines some convenience methods as well. They are meant to be used in templates.

Opera and Dojo

5 Sep, 2005 - 1 minutes

I decided to try how well Opera works with my site. It mostly works. You can go and see stuff but all Dojo-related code doesn’t work. Interesting that Google Maps works properly.

When I switched to admin mode to edit this article, it turned out that TinyMCE doesn’t work either.

But good news is Dojo and TinyMCE failed gracefully.

Dojo: 1st impression

3 Sep, 2005 - 2 minutes

The best thing about Dojo 0.1: it’s quite easy to create portable widgets. Such widgets work similar to Microsoft IE’s behaviors but they are even more self-contained. Dojo widgets can work with fragments of HTML and CSS, which will be inserted during the object creation. The event system is very elaborate. Of course Dojo is more than a simple widget factory. For example I didn’t try the I/O facility yet.

New Design 0.1 is here!

New design is here. Well, some elements of it. I had bigger ideas, but CSS didn’t work reliably, and JavaScript option was in debugging mode. So I decided to update this site now and add other planned stuff later.

One reason I postponed JavaScript thingy is I want to try Dojo. It looks like a good foundation for widgets. I am going to create a couple of them at least. If it works okay, I’ll be using it in other projects as well. Stay tuned.

Using TinyMCE with Django’s Admin

26 Aug, 2005 - 2 minutes

Update (3/13/2011): this article is obsolete now and preserved here mostly for its historic value. Nowadays I use Dojo’s dijit.Editor as a WYSIWYG HTML editor — it is more functional and much simpler to setup and extend. Read all gory details in Using Dojo Rich Editor with Django’s Admin.

I decided to add a WYSIWYG editor to my admin portion of the site. Apparently you can find some nice open source WYSIWYG editors nowadays. Probably FCKeditor, Xinha and TinyMCE are the most prominent ones. Some people already tried different editors with Django, e.g., Xinha — http://www.socialistsoftware.com/?p=10, TinyMCE — http://www.socialistsoftware.com/?p=8. Now it’s my turn.