Structure of styling system

Not for 'how-to' coding questions but PHP theory instead, this forum is here for those of us who wish to learn about design aspects of programming with PHP.

Moderator: General Moderators

Post Reply
crazycoders
Forum Contributor
Posts: 260
Joined: Tue Oct 28, 2008 7:48 am
Location: Montreal, Qc, Canada

Structure of styling system

Post by crazycoders »

I have a system i am developping (a framework) that creates highlevel classes used to manage the styles of objects.

I had decided to go with several objects that split the different css properties in groups such as:
- font styles (fontfamily, size, color, etc)
- border styles (border-left-style, border-bottom-size, border-right-color, etc)
- container styles (position, left, top, clear, float, margin-left, margin-top, etc)
- content styles (padding-left, padding-top, horizontal-align (text-align), vertical-align, etc)
- background styles (background-image, background-repeat, etc)

I had decided to do so to split the load of the css handling to different classes so if a user doesn't require changing all the different styles, some of the objects wouldn't even be created thus saving process time when rendering and saving data and also saving memory.

So a simple label or button would have the properties: fontstyle, borderstyle, containerstyle, backgroundstyle and contentstyle. So far no problem, but when we get to custom or complex controls such as my debugger control, i'd need the following:

- debuggerfontstyle
- debuggerborderstyle
- debuggerbackgroundstyle
- debuggercontentstyle
- debuggercontainerstyle
- noticefontstyle
- noticeborderstyle
- noticebackgroundstyle
- noticecontentstyle
- noticecontainerstyle
- warningfontstyle
- warningborderstyle
- warningbackgroundstyle
- warningcontentstyle
- warningcontainerstyle
- errorfontstyle
- errorborderstyle
- errorbackgroundstyle
- errorcontentstyle
- errorcontainerstyle

This can become cumbersome to work with for a standard user because he must know all the style properties. Now i'm faced with a dilema... Either the user has to live with the numerous styles accessors or i have to sacrifice process and probably a bit more of memory to achieve this instead:

- debuggerstyle
- noticestyle
- warningstyle
- errorstyle

What would you do, i want to think user and also think about custom component developers for later and also think about performance impacts... They must all balance together no?
Theory?
Forum Contributor
Posts: 138
Joined: Wed Apr 11, 2007 10:43 am

Re: Structure of styling system

Post by Theory? »

What if you created more generic methods for each CSS property and then pass the ID or Class to the constructor or the method itself.

Code: Select all

 
public function fontFamily($id, $value) {
   $property = '#' . $id . '{ font-family: ' . $value . ';}';
}
 
That's a really poor demonstration, but hopefully you can see what I mean.
crazycoders
Forum Contributor
Posts: 260
Joined: Tue Oct 28, 2008 7:48 am
Location: Montreal, Qc, Canada

Re: Structure of styling system

Post by crazycoders »

It's not that easy, the framework i'm building extracts value from an XML declarative file just like ASP.Net does. So a designer could use a designersoftware to generate that file. Now the framework reads that file and sends the information into the various components.

A style has to be a component for the sake of the framework because i want developpers to be able to access the style objects and be able to change values in the styles in a live fashion. If they know how to access the styles they don't need to know the internals of CSS such as how to render the different rules because all the components are built to do that for them.

You way of doing, although it could be a good way to do in other circumstances, cannot be applied to my scenario.
Theory?
Forum Contributor
Posts: 138
Joined: Wed Apr 11, 2007 10:43 am

Re: Structure of styling system

Post by Theory? »

Blah sorry, I didn't understand. Useless again. Good luck though.
josh
DevNet Master
Posts: 4872
Joined: Wed Feb 11, 2004 3:23 pm
Location: Palm beach, Florida

Re: Structure of styling system

Post by josh »

I don't see how XML changes anything. Use an object with 2 descendants, one for loading a plain object one that loads itself from XML and write the application as you would normally. Personally I wrote a CSS editor script a long time ago I scraped some source for the CSS spec, extrapolated that into a relational database, and wrote an interface ontop of that.
User avatar
VirtuosiMedia
Forum Contributor
Posts: 133
Joined: Thu Jun 12, 2008 6:16 pm

Re: Structure of styling system

Post by VirtuosiMedia »

You should check out the syntax of one of the JavaScript libraries like MooTools or jQuery. It might give you some ideas.
crazycoders
Forum Contributor
Posts: 260
Joined: Tue Oct 28, 2008 7:48 am
Location: Montreal, Qc, Canada

Re: Structure of styling system

Post by crazycoders »

Thanks, i decided to go with one big object after all cause i realised that my framework's core webcontrols had two styles, enabled and disabled. Using 5 different objects for each state could have confused the user, so i merged all of them in one big object that anyway shouldnt take much more space in memory since all properties start with null.

So instead of fontstyle, containerstyle, contentstyle, backgroundstyle and borderstyle, i now only have a style object.
Post Reply