camen design

Etho

Sun, 14 Jul 2013 11:17:00 +0000

Etho

Through the life-changing experience of an intense 16-hour labour we are able to announce to you the birth of our son Etho Samuel on the 2^nd of July 2013. We are all doing well and just beginning to get a grasp on the change of routine this brings upon us.

Discuss this in the forum

kroc-fund-drive

Sun, 12 May 2013 17:40:00 +0000

Howdy, folks! Kroc has decided to let me take over Camen Design for today — not literally, mind you — and has given me the opportunity to borrow his podium for this blog entry.

My name is Clint Franklin. I am known on the forums here as “theraje” (no caps, please). Way, way, WAY back in mid-2011, ol' Kroc chirps at me on IM, saying he had a surprise for me. Not being one who is particularly fond of surprises, I inquired about the nature of this surprise. If I recall correctly, he told me to wait a week while he put on some finishing touches. I think it all boils down to him teasing me.
Well, after a week had passed, he said he was finished, and wanted to send me a video. Now, I know what you’re thinking — “Big deal. I just go to YouTube and watch videos all day long.”
But, as I'm sure a few of you will recall, at that time, I was using the very best Internet connection I could afford in my area. 56k dial-up. Not only that, but 56K dial-up that would, on its best days, max out at 28.8K. Even a “standard” video would be impossible to view via YouTube. In fact, poor Kroc had to virtually obliterate the video quality, to the point where things could be vaguely recognizable. He then had to reduce the picture size down to some ridiculous dimension. Think along the lines of: Barely takes up all the screen space on an average cell phone manufactured in 2003.
I think the final “preview” video was around 2 megabytes. Of course, it took about 15 minutes to download this 2-meg file. Yes — 15 minutes to download 2 measly megabytes. And that was pretty decent, for me. And this was less than two years ago.
When I saw the video, I just watched, slack-jawed, as I saw Kroc’s work. Long story short, it described my situation (and included plenty of amusing, yet home-hitting, visuals) in a way people could understand. Because, folks, I tell you what — you just have no clue how precious data is until you have to wait 20+ minutes for a 3-minute MP3 song to download onto your computer! Or when you can’t browse 90% of the Web because of server timeouts and JavaScript-heavy site architectures.
The real shocker was that this video (in higher quality, of course — if Kroc had released the “preview” version publicly, the world would have gouged its eyes out) was part of a campaign to encourage people to donate money so that I could afford the only means of acquiring anything remotely similar to broadband (which would have been satellite Internet — 3G was completely unavailable in my house).
The reason Kroc wanted to gather up the money was because I had no access to anything faster than 28.8k dial-up, except for satellite — and not only does it START at $60 a month… you are forced to sign a two-year contract. If you wish to cancel before the two years expires, you are required to pay an early termination fee (several hundred dollars!).
I, being legally disabled and unable to work (and even if I COULD work, I lived out in the boonies, and the nearest grocery store took half an hour to drive to), was certainly unable to afford such. That said, I never was one who liked to ask people for things (I hated the idea of having to apply for disability in the first place, but that changed when it became obvious that I had no other choice). I value self-sufficiency. So, initially, I was a bit perturbed. No… I was sick to my stomach. I didn’t have the heart, at the time, to say “no” to Kroc on this. He put WAY too much work into it. He was WAY too excited about it.
So, even with the knowledge that not only did I dislike the idea, but also that people would get the urge to assume things (which they did — calling me a bum, telling me to get a job, and so on, not knowing my situation), and that even if people did find it in their heart to help, that it would not necessarily work out (satellite Internet performance and reliability is very, very dubious). And if that were to happen, I would have wasted those people’s charity. I don’t know if I could have dealt with that.
But, I caved. Kroc wanted so badly for me to have the chance to do the things I love — working on programming projects, artwork, and so on — that I couldn’t say no. Plus, the idea of me having the opportunity to work again, doing contract work online, made me feel as though I could at some point become productive and not be at the mercy of a government check.

This video is available only in WebM format. It may not play on some devices. If in doubt, view this page with Mozilla Firefox

In the end, we collected over 50% of our goal of $2000 (the total cost of covering the contract period). We stopped short because after catching a lot of flak from those people I mentioned early (the ones who like to ASS-ume things about which they have no understanding), I had basically decided to commit suicide. The world and everyone in it wanted me to suffer, but I'd rather just kill myself and get it over with, I thought.
I regained my composure a few months later, but still went to bed, every night, saying the same prayer to a god I didn’t even believe existed: “God, please let me go to sleep now, and just never let me wake up again.”
To wrap things up, I spent the following few months in and out of hospitals (both medical and mental), hoping that my life would just end. Then, out of nowhere, something very strange happened. I won’t go into details — some call it a “revelation” from God himself… others call it a severe psychotic breakdown… all I can tell you, definitively, is that something changed in me. I regained the will to live.
After my “psychotic breakdown,” I was put into group therapy. While there, one of the other patients told me about an apartment complex that is set up for people like me who are disabled — think of it as a retirement community, not for retirees, but for the disabled.
Long story short, a former tenant caused problems at that complex, and the building manager (who had met with me previously) told me she had an opening, and wanted me to move in. That was in October of 2012.
The money donated to me for the campaign Kroc started allowed me to not only pay the deposits for the rent and electricity (which added up to several hundred dollars, and would have kept me out if I were unable to pay them), but to accomplish the original goal — I now live in an area that has access to DSL Internet service! So long, 28.8 Kbps… hello 12.0 Mbps!!! Goodbye, 6 minutes to download 1 megabyte… Good to see ya, 1 megabyte per second!!!!!!
And now, of course, my life has improved by an order of magnitude from before. The people who donated did not merely help me get on broadband. They gave me a place to stay, an opportunity to get the help I need (medically, psychologically, etc.), to find work (it no longer costs $30 in gas to take a trip to the nearest business!!!), to attend church (I was an atheist for roughly 8 years, until my “revelation” from God gave me the strength to get out of bed again), to form my first real romantic relationship (wedding bells may not be far off), and to help others and be blessed by the people who are now a part of my life, and would not have been otherwise. Those of you who donated have helped far, far more people than just little old me.
I may have been upset with Kroc starting all of this fundraising jazz in the first place, but now, all I can feel is immense gratitude to him and all of the people who helped — whether it was by donating money, moral support, a shoulder upon which to cry…
Now that I'm getting all sentimental, I'm just going to say that I'm incredibly blessed to have a God that heard my cries, and had all the right people in place who gave me the strength to push myself forward, to the point where I could waste three dozen paragraphs explaining what could have been said in two simple words:
Thank you.
Yours Truly,
Clint Franklin, aka. “theraje”

Discuss this in the forum

Browser Vendors, You Have _Failed_ Us

Wed, 20 Mar 2013 08:54:00 +0000

Browser Vendors, You Have Failed Us

Browser vendors have unilaterally lost sight of real problems that plague real users.
I am so angry right now. The thing that causes me so much anger is not that Google are shutting down their RSS reader product, it’s that the browser vendors sat back and allowed all the power over content to go into the hands of Facebook and now Google.

I wrote two years ago that browser vendors were failing to focus on the real problem that: users don’t want, and find it slow and painful, to trudge around their daily round of websites and that the web browser should be exposing an automatic, intelligent and ultimately useful interface to RSS.

Why can I not do something about this? Becuase creating another RSS web service to ‘replace’ Google Reader does not solve the underlying problem, that is:—personal aggregation of content should not be dependnt on a business model.

Google never offered a pay option. Reader had to supliment other strategies. RSS does not benefit Google+, whose aim is to centralise all the content including the ability to process and access it.

RSS is a browser feature, a browser’s responsibility. It is a personalised view upon the web, just as bookmarks and add-ons are. It makes managing daily content much easier, just as bookmarks and add-ons do. The browser—as the personal portal on to the web—is best positioned to aggregate the web for the user. It knows the user’s browsing habits better than even the most evil of evil advertisers. The browser vendors could make the web faster, easier, less cluttered and junky than any web sevice ever could. And it could do all of that with the barest minimum of privacy-intrusion, without a single ad and without a conflicting business model.

Because browser vendors failed to see personalised aggregation as a benefit to regular users, these regular users have taken to Facebook as their personalised aggregation service, taking the power over content away from the browser vendors.

Facebook will one day soon be a major technology player rivalling Google, Amazon and even Apple. Facebook are already big, yes, but for now they’re ‘just a website’. When they control the technology landscape because they control access to the content then things turn very bad for users. Mozilla, prepare to be side-lined by a ‘website’.

That brings me to the second big thing browser vendors have failed users with: e-mail.

It is 2013 and there is still no way to set Firefox as the default e-mail client in Windows. There is no way to make it so that when a user right-clicks a file and goes Send To > Mail Recipient that Firefox will launch with the user’s preferred web-mail.

This is no end of headaches for my customers. They are constantly slipping up because they do not discern the difference between actions that invoke the native mail client and the fact they are using web-mail. Functions they expect to work simply don’t, such as using the e-mail toolbar button in Windows Explorer. Most of my customers have unsent e-mails in the outbox of Outlook Express or Windows Mail because the native client was launched instead of their web-mail. Attaching files is an unbelievable pain because of this. Customers have to be carefully taught that no, you don’t go to the picture first, you write the e-mail first, then click attach and then have to understand the concept of a different view upon the file-system and that the Pictures folder in there, is actually the same as the Pictures folder their muscle-memory is programmed to use from the Start Menu.

E-mail sucks because browser vendors don’t care about real problems that plague real users every day.

If I were Mozilla I would integrate e-mail back into Firefox. The browser already knows the user’s web-mail user names and passwords. It could automatically configure everything. The user could have a clean interface to their e-mail without having to go through painful web-mail clients. Attachments would be easier. E-mail links in web pages would actually work. Native OS e-mail actions would actually do the right thing for once. Users would actually benefit more from this than redesigning the f*cking shape of the tabs or removing the RSS button from the toolbar.

Two years have passed. The boat has been missed. Facebook and Google control the content, how it is accessed, how it is processed. There is no way back. You have failed us, browser vendors.

Discuss this in the forum

Making the Ugly Elegant: Templating With DOM

Thu, 07 Mar 2013 19:38:00 +0000

Making the Ugly Elegant: Templating With DOM

How It Works
The Code
Caveats
The API
History

Templating is easy to do in any particular way, but doing it right is hard. I can’t count how many hip new template engines have popped up in just the last few years alone. I’m about to add one to the pile, but it is certainly not ‘hip’. It is however the closest I have ever gotten to the fabled golden fleece of “100% separation”. Unlike most other forms of templating, this really doesn’t mix logic and HTML, nor does it try to mask the blatent logic (“if this, then this”) by renaming ‘logic’ or using a {{special syntax}}.

What we’re going to do is this: take a static (and I mean static) HTML page, load it into the DOM as an XML tree and then use the PHP as your logic, removing bits of the template not needed and changing the text about.

I got this idea from this blog post: Your templating engine sucks and everything you have ever written is spaghetti code (yes, you). The article itself is long, agressive, rambling and fails to demonstrate the principle concretely. I simply ignored all the text and focused on the core principle that was being noted: instead of embedding some form of code in the HTML (even if it’s just evolved search/replace syntax), just load the HTML into DOM and minpulate there so that the HTML itself is ignorant of the templating.

The reason why this is not just the same as a {{special-syntax}} is that we are not mixing two different languages, syntaxes or programming models in one HTML file. If you change your templating engine, it’s still HTML. If you change your logic, it’s still HTML. Special syntaxes invent another language to intermix with HTML and thus add programatic concepts to a declartive syntax—which is not clean separation no matter what you name it.

Ever since the ’Web was invented there has been a transluscent, yet intransient divisor between those developers who understand the fundamental difference between a declerative markup syntax and a programming language, and those who don’t. Some learn to see this difference, others simply ignore it and believe that it is a swell idea to tie structured data to a structured program that will bit rot one thousand times quicker than the data will. If you are trying to replace HTML or CSS with JavaScript, you are doing it wrong and have just signed a maintenance contract from hell, with yourself, for yours and your data’s life.
Kroc Camen—I Don’t Want to Do This Any More

By doing it this way, the HTML file itself can be designed independently of the software, and that whoever does the HTML doesn’t have to know PHP. You could change the whole server language and it wouldn’t change the template one bit. More importantly you can actually view the whole look of the template in the browser without running the software. The reason I’m adopting this templating approach for NoNonsense Forum is to make it easier for anybody to modify the look of their forum without having to learn PHP, and hopefully encourage more contribution from all skill levels.

It took a few revisions, two weeks and a lot of head-wracking to beat the DOM into something elegant, but here it is, NoNonsense Templating:

How It Works

The first thing to wrap your head around is that DOM templating works on the principle of mostly taking away rather than adding. Logic-wise this is more difficult to get used to than you would think; you will be used to adding data according to logic rather than “if this, then remove the thing that it is not”.

Firstly your template should be a static HTML page that contains all of the content and ‘possibilities’ of your output, where by we will remove what is not relevant to the page. For example:

<p id="login" class="logged-out">
	You are not logged in.
</p>
<p id="login" class="logged-in">
	You are logged in as <b class="username">Bob</b>
</p>

In the PHP we can modify the HTML this way:

(Please note that templates you load must be valid XML and have a single root node—e.g. “<html>”—in order to work, the examples in this article omit this for simplicity. See XML caveats for more details)

//load the template and provide an interface
$template = new DOMTemplate (file_get_contents ('test.html'));

//lets imagine the user is logged in, remove the logged-out section and set the username
$template->remove ('.logged-out');
$template->setValue ('.username', 'Alice');

The command “remove ('.logged-out')” finds all elements that have a class of “logged-out” and deletes them (You can also refer to IDs using ‘#id’).

The setValue method sets the text-content of an element, removing anything that was within. By replacing element content it means that you can provide dummy text to test the look and feel of your template, and it will be replaced with the real data. No more staring at {{NAME_GOES_HERE}}!

Behind the scenes “.logged-out” becomes the full XPath “.//*[contains(@class,"logged-out")]”. The shorthand syntax also supports specifying a required element type and/or an attribute to target, e.g:

$template->setValue ('a.my-button@href', '/some_url');

You can also use full XPath syntax:

//if using HTTPS, change the Google search box to use HTTPS too
if (@$_SERVER['HTTPS'] == 'on') $template->setValue (
	'//form[@action="http://google.com/search"]/@action', 'https://encrypted.google.com/search'
);

Looping is always a sore point in templating. How do you take a chunk and repeat it down the page without having to define a ton of logic in your templates?

Looping with the DOM is shockingly elegant!

$item = $template->repeat ('.list-item');
foreach ($data as $value) {
	$item->setValue ('.item-name', $value);
	$item->next ();
}

The repeat method takes an element (via shorthand/XPath) to be used as the repeating template and copies it, then you just set and remove elements from the repeating template as if it were its own template. Once you’ve templated that iteration you call the next method and the HTML is added after the previous element, then the template repeater resets itself back to the original HTML so you can template it again!

Once you’ve made all your changes to the template, just retrieve the final HTML and output.

die ($template);

See the API for details of all the functions.

The Code

View source code
View source code on GitHub
Discuss this article in the forum (no registration required)

If you would like to see a real-world use of this templating system with a ton of examples you can draw from real, practical code you can examine the source code of my forum system called NoNonsene Forum here:

If you don’t like the idea of targetting classes or IDs in your HTML, have a look at v4 of DOMTemplate that finds elements according to data-template attributes.

Caveats

Whitespace handling is good, but not perfect

In the case of repeating an element the whitespace within is kept, but the whitespace outside the element is not. This is not a major problem, it just means that the closing and opening tags of your lists will be paired (e.g. “…</li><li>…”).

The biggest issue is that when elements are removed, the whitespace around them remains, meaning that you get a number of blank lines in the output HTML where the elements used to be. There’s no direct way of handling this other than perhaps using a search/replace to remove blank lines in the HTML after it’s been templated.

One benefit of using the DOM however is that if you want minify the HTML a little, you can just add “$this->DOMDocument->preserveWhiteSpace = false;” to the constructor function of DOMTemplate and the markup will be returned as a big blob with few line-breaks.

If you add “$this->DOMDocument->formatOutput = true;” instead, the markup will be ‘tidied’ for you, re-nesting the elements neatly in an easy to read fashion.

XML woes

DOMTemplate stores and manipulates the template internally as strict XML. Thankfully, since v16, DOMTemplate automatically converts your source HTML to XML on loading and converts from XML to HTML on output, thus alieviating most of the input-strictness problems with earlier versions. There is however still a few caveats to remember:

HTML must be valid
The automatic conversion of HTML named-entities (invalid in XML) into Unicode is still not comprehensive. 248 of the most common are covered, but a total of over 2100 exist. DOMTemplate may in a future version cover all 2100+ named entities, but until then ensure that your HTML source does not use any named-entities outside of the 248 recognised by DOMTemplate
HTML that you load either through DOMTemplate or apply to the template using setValue must have only one root node. I.e. a list of elements can not be used unless wrapped by an element.

The API

Instantiation

Provide the HTML to load as a string when instantiating the template class. It must be valid and have only one root element (e.g. <html>).

$template = new DOMTemplate (file_get_contents ('index.html'));

If you are loading an XHTML document, or any XML file with a default namespace (e.g. <html xmlns="http://www.w3.org/1999/xhtml">), you must specify a prefix (any will do) and the namespace URL like so:

$template = new DOMTemplate ('index.html', 'html', 'http://www.w3.org/1999/xhtml');

All XPath queries you make with this template must prefix element names with the namespace, including for the shorthand:

$template->setValue ('//html:title',         'Hello World');		//XPath
$template->setValue ('html:a#my-button@href, 'http://google.co.uk');	//shorthand

This bizzare requirement is a limitation in the design of XPath itself.

Shorthand XPath Syntax

All of the methods that accept a query (setValue, set, addClass, remove & repeat) use a shorthand-syntax where you only need to provide the class (“.class”) or ID (“#id”) you want to target and the full XPath query is built for you. E.g. `.my-button`
An element type can be provided: `a#my-button`
An attribute name can be provided which will be the target of the setValue, set and remove methods: `a#my-button@href`
You can test attributes for values (the element will be selected, not the attribute):
`label@for="submit"`
You can specify the index of an element to select: `li[1]`
You can select child elements: `#list/li/a`
You can also just use full XPath query, as-is: `/html/head/title`
You can provide multiple targets by separating the queries with commas, e.g: `.header, .body, .footer`
You can intermix shorthand and full XPath like this.

`(string)` Output

To get the HTML out of the template, cast the template class object to a string, e.g.:

$template = new DOMTemplate ('<span>test</span>');
echo $template;

In instances where the intended type is ambiguous, use PHP’s casting syntax to force a string conversion:

$html = (string) $template;

`repeat`

repeat (string $query)

Takes a shorthand XPath query and returns a DOMTemplateRepeaterArray object instantiated with the element(s) selected in the query. This object supports the set, setValue, addClass & remove methods, in addition to the following method:

`next`

Takes the current HTML content of the elements within DOMTemplateRepeaterArray object and appends it as a sibling to the previously repeated template (i.e either the element(s) you instantiated the repeater with, or the element(s) that were added by the previous call to the next method), then resets its HTML content back to the original HTML it had when it was created.

In simple terms, it adds the templated HTML to end of a list and then resets it back to the original HTML, to be used again. In practical terms, like this:

$item = $template->repeat ('.list-item');
foreach ($data as $value) {
	$item->setValue ('.item-name', $value);
	$item->next ();
}

`setValue`

setValue (string $query, string $value, [bool $asHTML=false])

Replaces the content of all elements matched with the shorthand XPath query with the given value. The string value is HTML-encoded (unless you give `asHTML` as true), so any HTML in the value will appear as-is, rather than be rendered as HTML. This method intelligently sets the value to elements, attributes and classes according to the XPath used. See addClass for details on HTML class behaviour.

$template->setValue ('#name', 'Kroc');

`set`

set (array $queries, [bool $asHTML=false])

Allows you to write code in a more compact way by specifiying an array of shorthand XPath queries and their associated value to set.

$template->set (array (
	'#name' => 'Kroc',
	'#site' => 'http://camendesign.com'
));

`addClass`

addClass (string $class)

Adds the specificed HTML class name to every element matched with the shorthand XPath query. If an element already has a class attribute, mutliple class names will be separated by spaces when the new class is added.

$template->addClass ('#section', 'open');

`remove`

remove (string $query | array $queries)

Deletes all the elements (and their children) matched with the shorthand XPath query.

$template->remove ('.secret-stuff');

Also accepts an array in the format of “'xpath' => true|false”.
If the value is false, the XPath will be skipped. This allows you to write compact removal code by not having to write “if (x) $template->remove ('y');” several times in a row, e.g:

$template->remove (array (
	'.section-1' => $section == 1,
	'.section-2' => $section == 2,
	⋮
));

For a good example of this style of writing, see the code for NoNonsense Forum.

In addition to this behaviour, you can also remove classNames from a class attribute, whilst retaining any other class names present by specifying the className to remove in the value, when tragetting a class attribute with the XPath, thusly:

$template->remove (array ('a@class' => 'undesired'));

History

v16 Filtering of HTML on input and output, removing the strict-XML requirement for source text. The `html` method was removed in favour of casting the class to a String
v15 Throw an exception for invalid XPath queries or HTML
v14 XPaths are cached for speed
v13 Multiple namespace support
v12 Ability to remove classNames using `remove` method
v11 Changed instantiation to use a string instead of a filename
v10 `repeat` now works simultaneously with multiple elements instead of just one
v9 Greatly improved shorthand XPath syntax adding index matching, child matching & attribute testing
v8 Changed `setValue` to intelligently apply to elements, attributes or classes, with a parameter to include HTML as-is (`setHTML` was removed)
v7 XML prolog is kept if already present and UTF-8 characters are no longer hex-encoded
v6 XML namespace support. Also, template repeating now appends as a sibling, not as the last child of the parent (removes the need for a superfluous parent element).
v5 New shorthand XPath syntax for classes and IDs instead of `data-template` attributes
v4 Added multiple XPath targets
v3 Added method chaining
v2 Added HTML entity decoding
v1 Initial release

Discuss this in the forum

A Summary

Fri, 22 Feb 2013 10:42:00 +0000

A Summary

It is with much intrepidation (for life has become very uncertain) and joy (for life is no longer dull) that I can announce the news of our child, a son, due to us in early July.

Life, ever since meeting the love of it, has been upside down and changing at a relentless pace. First we met, and that was a big, unexpected change. Then I asked her to marry me. In three months we were married, and lived together—no small change for myself, which I found to be effortlessly natural (though obviously challanging). It’s only because of the news of our child that we have had to directly tackle the physical piles of stuff still not yet disseminated into everyday life. We find that having not even gotten settled in our first home we have to up-sticks and down-size (where there is no spare room to pile things) to be able to better focus ourselves on our child.

For this though I am very grateful as a blessing from God; meeting my wife has made me address many, many personal, internal burdens which have reflected—on this blog—through me giving up a great many things physical (the MacBook Pro), spiritual and somewhere in between (software projects), whilst the birth of my son forces me to address my many needs outside of the computer world.

This is where we get to the point. It will not have gone without your notice that I have neither been very active, or reliable for the last year. My more immediate needs in the real world overtake me and though even when there is the adequate time to devote to the website and other matters, I have neither the strength or will.

There is much I want to do, but it will have to wait for a few years whilst I care for my family.

I don’t expect to do much blogging here on the main site (my system isn’t working well for me under my new circumstances and it needs a complete overhaul). You can best be kept up to date with my happenings and thoughts through the system that does work well for my circumstances, my forum.

Thank you to all for your patience, understanding, generoisty and care.

Camen Design will return to irregular service in a future iteration some day. What it will be is only a hazy idea right now, but I do know for certain that I will do my own things in my own way and demonstrate to others that they can do the same.

Discuss this in the forum

NoNonsense Forum

Mon, 24 Dec 2012 13:55:00 +0000

NoNonsense Forum

Features
Limitations
Help Out

NoNonsense Forum is a free, open source, PHP-based simple discussion forum. It favours removing barriers to conversation rather than massaging egos.

It is ideal if you want a discussion platform you can throw up in seconds, is quick and easy to administer, simple to use and works great as a private forum for a team working together.

Features

No Database

All data is just RSS. Starting a new thread creates a new RSS feed. Replying adds an item to the feed.

No hoops to jump through

I just want to talk, I don’t want to go through registration and e-mail confirmation and logging in each time.

NoNonsense Forum asks you for a name and password when you post. This name and password forms a unique token, protecting the name from other people using it. Every time you want to post, just use the same name and password to keep the same name.

Add new thread input form — user name and password act as a unique token

This is not the same as registration because you can have as many different names as you want, you don’t have to pre-register a name and password, and you don’t have to go through e-mail confirmation and a login screen before you can do anything.

If your web browser remembers your name and password and fills it in for you, then all you do is type your message and submit. Nothing gets in your way.

Minimal Markup

I wouldn’t have written NoNonsense Forum if I believed that other forum software was doing it right, so likewise I did not opt for normal bbcode. There is no preview function, and I believe that having one just adds hurdles to people posting. What comes out should be exactly what you expect. There should be no black-box that you fear will screw up your text in ways you don’t understand.

Want to insert a blockquote? There’s no quote button, just copy and paste and wrap in speech marks.

"How now brown cow?"

Who knew pink moo?

Gives:

What’s more, the output blockquote includes quotes so that if you copy and paste this, the quote is maintained. Even when nested.

Pre-formatted text / monospace / source-code is also supported in simple fashion:

% CSS
pre		{overflow: auto; margin: 20px 0 0;}
pre, code	{font: 12.5px/20px Monaco, Consolas, monospace, monospace;}
%

You can write anything after the first percent sign, it’s useful as a title or specifying the programming language.

Again, this just copy + pastes back into the text area and will output the same thing.

Mods and Rockers

There is no “edit” ability. Instead users can append to their existing posts. This allows them to note any corrections without the potential of changing facts, post-facto.

Appending and deleting is done by clicking the relevant button on the post and providing the same name and password as was used to create that post.

Despite no database, the forum does have the capability for moderators. Add names to a ‘mods.txt’ and they will be given the ability to append / delete any post or thread. Moderators can be set a global level, or only within sub-forums by creating a ‘mods.txt’ in sub-forums. (A sub-forum is just a folder)

A sign-in is provided for moderators (via HTTP auth), they will have to suffer the woes of logging-in :)

Access control

You can set a forum or its sub-forums to be locked according to two different policies:

Threads:: Only moderators or members can start new threads, but anybody can reply. This could be used as, for example, a kind of blog / news system where by only site staff can post the news, but the public can comment on it.
Posts:: A read-only forum. Only moderators or members can start threads and replies, the public can read only. This would be typical of an archive or announcements sub-forum.

Just create a ‘locked.txt’ in the forum / sub-forum with the desired mode “threads”, “posts” or “private” written within.

Create a “members.txt” file with the names of users you want to be able to post / access the locked forum. Moderators (“mods.txt”) will always be able to post in any locked forum as well as use usual moderator capabilities.

Wide Browser Support

There shouldn’t be unnecessary hurdles added by browsers. NoNonsense Forum works out of the box on:

IE6, 7, 8, 9+
Firefox 3+
Chrome, Safari
Opera 9+
Text-based browsers

And is mobile-optimised too!

Now with Opera Speed Dial support:

How many forums do you know do this?—Instantly see if there’s new posts / replies each time you open your browser!

Customisable, Hackable

NoNonsense Forum provides many routes for customisation, like a basic config file for preferences, an ‘about.html’ file to add a description / extra HTML to each forum (without having to modify the template), a custom CSS file and templates that are 100% HTML so that you don’t have to know PHP or learn a {{special syntax}} to modify the look of your forum.

The PHP source code is heavily commented and explained and free for you to learn from, modify and share.

Limitations

Scale

NoNonsense Forum does not scale well. It is not trying to solve that problem. It is designed so that you can throw up a forum in seconds and have something working with no configuration and nothing to manage. If your forum grows beyond practical limits, switch to a more complete forum package like phpBB.

You might want to run a NoNonsense Forum on a private server or intranet, where scale won’t matter and NNF will be far less hassle than other softwares.

Abuse

I don’t believe that regular users should be treated the same as spammers, trolls and trouble-makers. This is why there is no CAPTCHA. No other forum software seems to have learnt that spam bots and regular users are not on the same level and don’t need the same “solutions”. Forums have registration, e-mail confirmation, CAPTCHAs and all sorts of hurdles and still get spammed.

My forum has none of these hurdles and doesn’t get bot-spammed (not one for over a year). For the moment it is safe simply because it is unique and different and I’ve used some fresh tricks to confuse spam-bots. In the future they might catch up and I’ll have to adapt, but I won’t add more hurdles for users.

However, regardless of spam bots, because there is no ‘username = e-mail’ login, there’s nothing preventing one person using a different name every time and spamming the forum with posts. That is not a software problem, it’s an administration problem and you should ban the user’s IP using your server software / config panel / htaccess.

You could always use the access controls to protect the forum, or disable new users once you have the users you want. NoNonsense Forum is ideal in situations where you need a quick to throw-up, easy to administer private forum, rather than a large scale public forum with thousands of users (though I think it could technically handle it)

Again, should NNF no longer solve your problems it’s time to upgrade to a big software package with all the bells and whistles.

Help Out

Please try it out.

You should read the goals of the project to get an idea of what sort of features suits the flavour of NoNonsense Forum and what will simply be impossible given the design!

The most effective way to “get things done” is to add an issue on GitHub, you can also discuss NoNonsense Forum on—obviously—the forum.

Discuss this in the forum

rainbow-landing

Wed, 31 Oct 2012 08:02:00 +0000

Discuss this in the forum

Transliteration

Sat, 15 Sep 2012 08:43:00 +0000

Transliteration

Update: Reverted o-umlaut conversion to “ö->o” based on this discussion.

Transliteration is when you replace individual characters in a piece of text with alternative characters, commonly used on the web to replace accented characters “ẚèìòù” with their ASCII equivilents “aeiou” to use as filenames or URLs.

This is my take on the subject that uses different levels of fallback to gaurantee a result whatever your environment: It transliterates better than any example snippet you have seen out there as will be explained in the code and afterwards.

//safeTransliterate v3, copyright (cc-by 3.0) Kroc Camen <camendesign.com>
//generate a safe (a-z0-9_) string, for use as filenames or URLs, from an arbitrary string
function safeTransliterate ($text) {
	//if available, this function uses PHP5.4's transliterate, which is capable of converting arabic, hebrew, greek,
	//chinese, japanese and more into ASCII! however, we use our manual (and crude) fallback *first* instead because
	//we will take the liberty of transliterating some things into more readable ASCII-friendly forms,
	//e.g. "100℃" > "100degc" instead of "100oc"
	
	/* manual transliteration list:
	   -------------------------------------------------------------------------------------------------------------- */
	/* this list is supposed to be practical, not comprehensive, representing:
	   1. the most common accents and special letters that get typed, and
	   2. the most practical transliterations for readability;
	   
	   given that I know nothing of other languages, I will need your assistance to improve this list,
	   mail kroc@camendesign.com with help and suggestions.
	   
	   this data was produced with the help of:
	   http://www.unicode.org/charts/normalization/
	   http://www.yuiblog.com/sandbox/yui/3.3.0pr3/api/text-data-accentfold.js.html
	   http://www.utf8-chartable.de/
	*/
	static $translit = array (
		'a'	=> '/[ÀÁÂẦẤẪẨÃĀĂẰẮẴȦẲǠẢÅÅǺǍȀȂẠẬẶḀĄẚàáâầấẫẩãāăằắẵẳȧǡảåǻǎȁȃạậặḁą]/u',
		'b'	=> '/[ḂḄḆḃḅḇ]/u',			'c'	=> '/[ÇĆĈĊČḈçćĉċčḉ]/u',
		'd'	=> '/[ÐĎḊḌḎḐḒďḋḍḏḑḓð]/u',
		'e'	=> '/[ÈËĒĔĖĘĚȄȆȨḔḖḘḚḜẸẺẼẾỀỂỄỆèëēĕėęěȅȇȩḕḗḙḛḝẹẻẽếềểễệ]/u',
		'f'	=> '/[Ḟḟ]/u',				'g'	=> '/[ĜĞĠĢǦǴḠĝğġģǧǵḡ]/u',
		'h'	=> '/[ĤȞḢḤḦḨḪĥȟḣḥḧḩḫẖ]/u',		'i'	=> '/[ÌÏĨĪĬĮİǏȈȊḬḮỈỊiìïĩīĭįǐȉȋḭḯỉị]/u',
		'j'	=> '/[Ĵĵǰ]/u',				'k'	=> '/[ĶǨḰḲḴKķǩḱḳḵ]/u',
		'l'	=> '/[ĹĻĽĿḶḸḺḼĺļľŀḷḹḻḽ]/u',		'm'	=> '/[ḾṀṂḿṁṃ]/u',
		'n'	=> '/[ÑŃŅŇǸṄṆṈṊñńņňǹṅṇṉṋ]/u',
		'o'	=> '/[ÒÖŌŎŐƠǑǪǬȌȎȪȬȮȰṌṎṐṒỌỎỐỒỔỖỘỚỜỞỠỢØǾòöōŏőơǒǫǭȍȏȫȭȯȱṍṏṑṓọỏốồổỗộớờởỡợøǿ]/u',
		'p'	=> '/[ṔṖṕṗ]/u',				'r'	=> '/[ŔŖŘȐȒṘṚṜṞŕŗřȑȓṙṛṝṟ]/u',
		's'	=> '/[ŚŜŞŠȘṠṢṤṦṨſśŝşšșṡṣṥṧṩ]/u',	'ss'	=> '/[ß]/u',
		't'	=> '/[ŢŤȚṪṬṮṰţťțṫṭṯṱẗ]/u',		'th'	=> '/[Þþ]/u',
		'u'	=> '/[ÙŨŪŬŮŰŲƯǓȔȖṲṴṶṸṺỤỦỨỪỬỮỰùũūŭůűųưǔȕȗṳṵṷṹṻụủứừửữựµ]/u',
		'v'	=> '/[ṼṾṽṿ]/u',				'w'	=> '/[ŴẀẂẄẆẈŵẁẃẅẇẉẘ]/u',
		'x'	=> '/[ẊẌẋẍ×]/u',			'y'	=> '/[ÝŶŸȲẎỲỴỶỸýÿŷȳẏẙỳỵỷỹ]/u',
		'z'	=> '/[ŹŻŽẐẒẔźżžẑẓẕ]/u',				
		//combined letters and ligatures:
		'ae'	=> '/[ÄǞÆǼǢäǟæǽǣ]/u',			'oe'	=> '/[Œœ]/u',
		'dz'	=> '/[ǄǅǱǲǆǳ]/u',
		'ff'	=> '/[ﬀ]/u',	'fi'	=> '/[ﬃﬁ]/u',	'ffl'	=> '/[ﬄﬂ]/u',
		'ij'	=> '/[Ĳĳ]/u',	'lj'	=> '/[Ǉǈǉ]/u',	'nj'	=> '/[Ǌǋǌ]/u',
		'st'	=> '/[ﬅﬆ]/u',	'ue'	=> '/[ÜǕǗǙǛüǖǘǚǜ]/u',
		//currencies:
		'eur'   => '/[€]/u',	'cents'	=> '/[¢]/u',	'lira'	=> '/[₤]/u',	'dollars' => '/[$]/u',
		'won'	=> '/[₩]/u',	'rs'	=> '/[₨]/u',	'yen'	=> '/[¥]/u',	'pounds'  => '/[£]/u',
		'pts'	=> '/[₧]/u',
		//misc:
		'degc'	=> '/[℃]/u',	'degf'  => '/[℉]/u',
		'no'	=> '/[№]/u',	'tm'	=> '/[™]/u'
	);
	//do the manual transliteration first
	$text = preg_replace (array_values ($translit), array_keys ($translit), $text);
	
	//flatten the text down to just a-z0-9 and dash, with underscores instead of spaces
	$text = preg_replace (
		//remove punctuation	//replace non a-z	//deduplicate	//trim underscores from start & end
		array ('/\p{P}/u',	'/[^_a-z0-9-]/i',	'/_{2,}/',	'/^_|_$/'),
		array ('',		'_',			'_',		''),
		
		//attempt transliteration with PHP5.4's transliteration engine (best):
		//(this method can handle near anything, including converting chinese and arabic letters to ASCII.
		// requires the 'intl' extension to be enabled)
		function_exists ('transliterator_transliterate') ? transliterator_transliterate (
			//split unicode accents and symbols, e.g. "Å" > "A°":
			'NFKD; '.
			//convert everything to the Latin charset e.g. "ま" > "ma":
			//(splitting the unicode before transliterating catches some complex cases,
			// such as: "㏳" >NFKD> "20日" >Latin> "20ri")
			'Latin; '.
			//because the Latin unicode table still contains a large number of non-pure-A-Z glyphs (e.g. "œ"),
			//convert what remains to an even stricter set of characters, the US-ASCII set:
			//(we must do this because "Latin/US-ASCII" alone is not able to transliterate non-Latin characters
			// such as "ま". this two-stage method also means we catch awkward characters such as:
			// "㏀" >Latin> "kΩ" >Latin/US-ASCII> "kO")
			'Latin/US-ASCII; '.
			//remove the now stand-alone diacritics from the string
			'[:Nonspacing Mark:] Remove; '.
			//change everything to lowercase; anything non A-Z 0-9 that remains will be removed by
			//the letter stripping above
			'Lower',
		$text)
		
		//attempt transliteration with iconv: <php.net/manual/en/function.iconv.php>
		: strtolower (function_exists ('iconv') ? str_replace (array ("'", '"', '`', '^', '~'), '', strtolower (
			//note: results of this are different depending on iconv version,
			//      sometimes the diacritics are written to the side e.g. "ñ" = "~n", which are removed
			iconv ('UTF-8', 'US-ASCII//IGNORE//TRANSLIT', $text)
		)) : $text)
	);
	
	//old iconv versions and certain inputs may cause a nullstring. don't allow a blank response
	return !$text ? '_' : $text;
}

Edit this code on GitHub • You may do anything with this code as long as you leave credit in the code

There is no ‘guaranteed available’ method with which to transliterate effectively in PHP; the functions that can do so vary by PHP version and are not likely to always be installed and enabled on every PHP server out there. The only built-in function strtr guaranteed to be present only replaces one character with another and doesn’t handle the common need to expand one character to multiple, such as converting “ß” to “ss”.

There are a number of libraries and functions out there for transliteration. Those that are comprehensive are massive and therefore total overkill for a small project and often have unhelpful licences, those that are small and compact are usually very incomplete and rely upon a single method that might not be available to you.

My method uses fallbacks so as to guarantee a result and improves upon other methods out there:

Better unicode normalisation: All the transliterations examples I have seen out there that use PHP5.4′s transliterator make the mistake of copy-pasting the example normalisation string given on the website. The results are simply wrong. My code uses a unicode normalisation method that I have worked out that has not been used anywhere else I have seen. It handles thousands of cases that no other library/function does because it uses two-stages of transliteration, first from any script to Latin-1 and then from Latin-1 to US-ASCII. This means that characters such as “㏀” become “ko” where else this would fail on other code I have seen because it would transliterate “㏀” to “kΩ” and then remove the “Ω” for being non-ASCII
Readability: Since the transliteration will be used for filenames or URLs, readability is important, so it’s better to convert some things to more meaningful words such as “¥” to “yen” instead of just “y”. In the example above, it would be trivial for the function to convert “㏀” to “k-ohm” but I chose not to since the single character “㏀” is almost never used on the `Web

I don’t know anything about other languages and writing systems, so if there’s something amiss in my code, please let me know via email, the forums or by editing the GitHub gist

Discuss this in the forum

Announcing PhotoDemon: A Fast, Free, Open-Source Image Processor

Sat, 11 Aug 2012 15:42:00 +0000

Announcing PhotoDemon:
A Fast, Free, Open-Source Image Processor

tannerhelland.com/4183/photodemon-image-processor-vb6/

Myself, and my good friend Tanner Helland grew up in a scene that revolved around Visual Basic 6.

Much hated by “real programmers” for not being a “real language”, Visual Basic 6 struck a chord with the common populous unlike anything since. For a very business-orientated product, a huge scene grew up around teens experimenting with the language.

For all the hate it got, my choice in using it was one of the wisest I made. Software I wrote over 10 years ago still works now and will still work throughout the lifespan of Windows 8. Those who adopted .NET could not say the same and have been dragged along Microsoft’s eclectic upgrade-train, with every new idea thrown in along the way by a directionless Microsoft failing to practice anything they preach (.NET is the future! Silverlight is the future! C# is the future! HTML5 is the future!)

So, it is of deep personal joy for me to link you to some 12 year old software which has only just been released!

I have known PhotoDemon for a long time. Tanner has been sending me copies for over a decade. The wolrd may have changed rapidly around me in those years—Apple went from dead to the No.1 company in the world and Microsoft lost their grip on the ’Web—but PhotoDemon has matured slowly, like a fine wine.

Application design in general has changed fads immensely since the days of PhotoDemon Tanner has included some nice old screenshots showing just how immensely! and though what Tanner started out with couldn’t be further removed from the “apps” of today, the recent changes in UI leading up to this release have been most profound. In 2003 I sent Tanner a massive 20-page e-mail detailing everything I could criticise on the UI-front. In those nine years my design skills have changed irrevocably so I understand how making PhotoDemon look so good today for, let’s remind ourselves, a VB6 program is such an achievement for Tanner who never admitted to knowing much about UI.

So, go check out Tanner’s announcement, read the history and see the screenshots of a program 12 years in the making!

Discuss this in the forum

The Word to End All Words

Wed, 01 Aug 2012 12:45:00 +0000

The Word to End All Words

Like a black monolith you stand.
Thy fearful symmetry.

Upon you is engraved a single word; a magic word,
More powerful than the utterance of Jadis, the queen of Charn,
who ended all life in her world by the Deplorable Word.

It is a word they do not understand.
From birth they have not known it.
It has not been taught, and neither has it been searched for.

By your word kingdoms have been flattened,
Dynasties felled, endless wars begun.
Lives torn apart and thrown asunder.

They do not know how to comprehend it.
It confuses them, frustrates them.
They bash against you, enraged at your silence.

Why do you not respond!?

But you do not respond.
Your silence causes all their machinations to fall apart;
The noise their livelihoods have come to depend upon.

When your silence has drowned out their noise,
Then peace and quiet will ring out everywhere.
For you are the word to end all words: No.

Discuss this in the forum

camen design

Etho

Etho

kroc-fund-drive

Browser Vendors, You Have _Failed_ Us

Browser Vendors, You Have Failed Us

Making the Ugly Elegant: Templating With DOM

Making the Ugly Elegant: Templating With DOM

How It Works

The Code

Caveats

The API

Instantiation

Shorthand XPath Syntax

(string) Output

repeat

next

setValue

set

addClass

remove

History

A Summary

A Summary

NoNonsense Forum

NoNonsense Forum

Features

Limitations

Help Out

rainbow-landing

Transliteration

Transliteration

Announcing PhotoDemon: A Fast, Free, Open-Source Image Processor

Announcing PhotoDemon:A Fast, Free, Open-Source Image Processor

The Word to End All Words

The Word to End All Words

`(string)` Output

`repeat`

`next`

`setValue`

`set`

`addClass`

`remove`

Announcing PhotoDemon:
A Fast, Free, Open-Source Image Processor