POSTing JSON to a Sinatra-MongoDB service

I’m using Sinatra and MongoDB, a sensational combo, to build a web
service and wanted to post JSON from the browser. It was easy in the
end, but docs were a little lacking in a couple of places, leading to
confusion.

From the browser, just post the JSON – I’m using the JollyToad library
for $.toJSON (http://jollytoad.googlepages.com/json.js):

$.post(“/sessions”, $.toJSON({
user: $(“#user”).val(),
….
})

In the server, I get the JSON payload using request.body.read.to_s
inside a Sinatra rule, and convert it with JSON.

post ‘/sessions’ do
session = JSON.parse(request.body.read.to_s)
…
end

(The hard part was working out how to get the raw data, i.e.
request.body.read, and then realising it’s not actually a string.
There are a few variants such as request.POST – see also
http://www.gittr.com/index.php/archive/getting-data-into-a-sinatra-application/)

silly video portal – an experiment using tiddlywiki to make a generic web app (no TW look’n’feel)

http://tiddlywiki.mahemoff.com/video.html

(tested in FF 3.6)

The tiddlywiki above is a lame video portal that looks like a generic
web app (only uglier). However, behind the scenes, it’s a tiddlywiki.
Actually, that’s not such a big secret as you probably saw a FOUT –
Flash Of Unwanted TiddlyWiki (cf
http://en.wikipedia.org/wiki/Flash_of_unstyled_content) – before the
page loaded. I’m not sure how easy it is to get rid of that – perhaps
a plugin that writes to the MarkupPeHead shadow or something.

But anyway, the point is to show how such a page can be styled.

There is actually a bit of a secret here. If you hover up to the
top-right, you’ll find a secret Backstage button. It gives you power
access to the rest of the tiddlywiki. I have in mind to replace that
with a “flip” button that would flip the UI into a regular TiddlyWiki.
(Would be awesome to do a 3D flip effect a la
http://lab.smashup.it/flip/ .)

It uses the TiddlyWiki theme concept. You make a tiddler with any of
three sections (blocks with headings): StyleSheet, ColorPalette, and
PageTemplate. Then switchTheme(“nameOfTiddler”) will switch the theme.
There are various plugins to peform this action on behalf of users.

However, the standard theme mechanism has a couple of catches –
there’s no CSS reset (I think there should be an option to attempt to
blank out any CSS before applying the theme); somewhere in the code,
there’s an assumption the PageTemplate contains a div called
“tiddlerDisplay” (I guess that’s a bug; thanks to @FND for helping me
on this point). Taking those into account, here’s how I made this
custom UI:

* Make a new tiddler called fancyTheme. It looks like this:

|StyleSheet|##StyleSheet|
|PageTemplate|##PageTemplate|

!StyleSheet
/* CSS RESET */
// a big ol’ CSS reset stylesheet, using Eric Meyer’s scheme. see my
recent post on those.

/* HACK TO ALLOW a “tiddlyDisplay” element */
#tiddlerDisplay { display: none; }

/* TIDDLYWIKI INTEGRATION */
#backstageButton a { height: 20px; opacity: 0.01; }
#backstageButton a:hover { opacity: 1; }
// in the future, there will be more stuff to switch back and forth
between regular tiddlywiki and the custom UI

/* CUSTOM STYLES */
// the custom style, in this case the style for a video portal

!PageTemplate

Not Another Video Freakin’ Portal

…etc….

——-

All this is related to the TiddlyWiki MU vision I described in
http://softwareas.com/multi-user-tiddlywiki . If users can spin off
new instances, TiddlyWiki could be used as a general engine for making
generic web app, not just TiddlyWiki++ UIs, but UIs that look
radically different. The nice thing about the Flip concept is that
vanilla TiddlyWiki is a handy interface for performing basic admin, a
little like the Rails scaffold concept, or the earlier Naked Objects.
You build a web app centered around a tiddler-based data store; anyone
permissioned can edit those tiddlers.

This is the plan for Scrumptious Trails (http://trail.scrumptious.tv).
I’ll be porting over the generic web interface to a TiddlyWiki one
using the techniques described above.

responses to @jaremfan’s “to all designers – how do you feel about your clients making design suggestions? good or bad?”

• @jaremfan What @Cennydd said. Thu Dec 17 14:39:07 +0000 2009 from DarciD
• @jaremfan Depends if it’s a good idea or not! If not find out what the real goal behind it is and explain how we can find a better solution. Thu Dec 17 13:53:48 +0000 2009 from PeteWilliams
• @jaremfan Sometimes the act of demanding is just a (misguided) way of asking for your expert opinion. Thu Dec 17 13:43:26 +0000 2009 from logorrhoea
• @jaremfan If they’re sensible, do them. If they’re not, discuss options and ways to progress. Refusal can sometimes be a viable option. Thu Dec 17 13:27:53 +0000 2009 from Cennydd
• @jaremfan Listen to suggestions. Demands are a must have that is not always possibble in web design. Thu Dec 17 13:22:10 +0000 2009 from microedge
• @jaremfan Suggestions are always welcomed. Managing the suggestions is where the skill of consulting comes in. Thu Dec 17 12:47:20 +0000 2009 from DarciD
• @jaremfan i would feel bad about any designer that would feel bad about design suggestions from clients Thu Dec 17 12:18:02 +0000 2009 from mahemoff
• @jaremfan Welcomed. The skill comes in looking at suggestions with objectivity and successfully managing them. Thu Dec 17 12:12:19 +0000 2009 from Cennydd
• @jaremfan Depends if they’re suggestions or demands! Thu Dec 17 12:08:45 +0000 2009 from PeteWilliams

(via http://ListOfTweets.com)

fixed nasty tiddlywiki bug involving defaultCustomFields

This was a nasty bug mostly for the diagnosis part than the solving of
it, as it came up in a weird way. In brief:
– I was looking at a tiddlywiki, inside tiddlyweb, and getting
weirdness in the way tiddlers were being persisted.
– @FND on irc was a big help and pointed out “server.title” field was
being erroneously set.
– Turned out config.defaultCustomFields included server.title for some reason.
– I thought it was something the comments plugin was doing. But it was
a new thing I’d done…I’d created a tiddler using
store.saveTiddler(……) and for the fields parameter, I’d set it to
config.defaultCustomFields. Bad news as it was causing the underlying
value to be changed.

Ideally, creating a new tiddler would be as simple as
store.createTiddler(). Given the current API, though, I learned my
lesson.

http://bit.ly/izBr a cautionary tale reminding us to ship with sensible defaults /src @ajpiano

We’re having a problem sending email out of the department.””What’s the problem?” I asked.”We can’t send mail more than 500 miles,” the chairman explained.I choked on my latte. “Come again?

via ibiblio.org

Seeking CSS *hard* reset

Here is a good summary of CSS resets:
http://perishablepress.com/press/2007/10/23/a-killer-collection-of-global-css…
CSS resets typically aim to neutralise styles for each browser (e.g.
setting body padding and margin to zero), force you to “opt in” to
certain features (e.g. setting headings to non-bold), and sometimes
sprinkle in a dash of opionated opionionship (e.g. making HR elements
invisible).

These stylesheets are generally minimal; they assume a lot about
browser defaults. For example, you won’t see “body { background:
white; color: black; }” because every modern browser already defaults
to that.

This usually works fine, but sometimes you want to keep re-applying
different stylesheets dynamically (using a library such as
http://jquery.tiddlywiki.org/twStylesheet.html) and not have each
stylesheet contaminated by any previously applied stylesheet. For
this, you need a hard reset, and I’m not sure any exist. Eric Meyer’s
reset (http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/)
is the closest thing, as it does define black-on-white colours, but it
doesn’t define lots of other things, like font family.

I’m currently looking at them because we (Osmosoft) have been thinking
about how to deploy TiddlyWeb apps, and focusing more on delivering
apps to run as plugins inside a TiddlyWeb-backed TiddlyWiki; as
opposed to running as standalone, plain-old-HTML, REST clients.
Running inside a TiddlyWiki will make deployment easier – we only have
to think about deploying one product: a solid TiddlyWeb-backed
TiddlyWiki which supports some mechanism for the admin to configure
plugins. There’s no “Scrumptious” distro as such; it’s just “install
TiddlyWeb-backed TiddlyWiki (a “one-click” operation); visit the
TiddlyWiki in your browser; and choose “Scrumptious” from the plugin
catalogue”.

The alternative (as I mentioned the other day) is to run these things
inside an iframe, where they will be sandboxed, but I’d rather not as
it would be nicer to have a normal communication channel between the
plugin UI and the rest of TiddlyWiki.

5 hours of IE6 fudging on Scrumptious trails

I’ve just made a bunch of changes to bring Scrumptious trails
(http://trail.scrumptious.tv) UI up to speed. I’d done the same work a
while back (http://mini.softwareas.com/making-scrumptious-trails-ie6-ready),
but the UI’s changed a lot lately, mainly thanks to some excellent
design direction from @juggernautdave
(http://www.flickr.com/photos/juggernautdave/4132581298/) on the top
bar design.

Key fixes:

* The iframe wasn’t being shown. Kind of a problem when that’s the
point of the player – to let the user walk through several websites,
each of which appears in the iframe. Took some experimenting before I
realised the iframe had a height of zero in IE. It’s set to 100% of
body height (absolute positioned) and body height is apparently zero
in IE. Not having the time to look into this properly, I have opted
for a hack, and set the iframe’s height using $(window).height() –
$(“topBar”).height().

* Transparent PNGs: I put @davem’s supersleight jQuery plugin
(http://allinthehead.com/retro/338/supersleight-jquery-plugin) to good
use. It’s great to make PNGs transparent in one go. (We were unable to
get decent-quality images in GIF, which is why we used PNGs; I think
it would actually be possible to get decent quality GIFs with the
right conversion techniques though?) supersleight doesn’t solve the
problem of background-position being ignored, so I also had to add
some IE-specific “margin” styles. I did look at one of the alternative
techniques involving behavior, which does suport background-position,
but I had various trouble with it, and I also found its use of URLs
relative to the HTML would cause me some deployment grief, given the
unusual deployment model. (At present, I am building a standalone
trails player and one served from tiddlyweb; very soon, I’ll be trying
to get the trails player running inside of tiddlywiki.)

* A few other layout tweaks.

* I was using ev.which at one point to find the mouse button.
Unfortunately jQuery.Event doesn’t (yet?) neutralise the mouse button
when an event fires, so I just manually checked it (good summary of
issues here – http://unixpapa.com/js/mouse.html). Basically, I use
“firstButton = (ev.which==1 || ev.button==0).

And that’s it. Once it’s checked in and uploaded, I’ll be turning my
attention to fitting into TiddlyWiki. Instead of trying to deploy
scrumptious as a standalone app built on TiddlyWeb, we are opting for
a model where Scrumptious is a TiddlyWiki/TiddlyWeb plugin, and this
will coincide with TiddlyWiki/TiddlyWeb providing support for easily
pulling in such plugins from its standard UI. (Actually, I’m really
talking about TiddlyWebWiki, which is basically the main initial
purpose of TiddlyWeb; to provide a simple RESTful server store for
TiddlyWikis.)

when 3D printers hit the $500 mark

Met an interesting guy on the plane yesterday, a guy who happens to
know a lot about 3D printers
(http://en.wikipedia.org/wiki/3D_printing). In industry, this is
already a big deal. It’s also been experimented with medical
applications. What I find really interesting is when it hits consumer
space. Turns out there’s already a $5000
printer. All it would take is a couple of enterprising manufacturers –
an Epson or an HP – to come along and soon enough, these devices might
hit the $500 mark, enough for most households to get into.

I heard an activist a while ago talking about the UK proposed three
strikes law, and he was arguing that all we need to do is wait out
politicians who “don’t get it” for another decade or so, and all will
be good. Music industry by that time will realise people don’t want
physical cassettes/vinyl/CDs and movie industry will realise people
don’t want physical cassettes/discs. But that argument forgets that
it’s all a moving target, and an exponentially moving one at that.

With 3D printers will come the possibility of making physical goods.
Small ones at first and building up to furniture, clothes, who knows.
And with it will come a whole raft of questions about intellectual
property, what’s good for innovation, what’s morally correct for
society, Most fun of all, the question of who can operate a 3D printer
that’s capable of cloning itself.

bash alias to open file at a certain search term, for easy tweaking of config settings

function svnglobal { vim ‘+/global-ignores =’ $HOME/.subversion/config ; }

This is a handy way to keep coming back to a config setting you often
want to change.

I was actually just going to write down the pertinent setting here,
and then I realised I can instead encapsulate it in a line of (bash)
code instead. Code > Docs.

(okay it’s technically a function for convenience of defining it, not an alias.)

Doing a Lot with Few People (@freyfogle of @nestoria) – kind of a “scaling humans” in a startup talk #scalecamp

@freyfogle shares a few things he’s learned as co-founder of nestoria
(real estate search)

– Focusing on high quality features, rather than lots of things done mediocre
– No surprises – I’d rather know about bad news than be surprised about it
– Using open source and contributing back
– Keeping employees happy. Worst thing that can happen is someone
leaves and having to go through recruitment process.

Giving back to the community – doing it efficiently. Sometimes, it’s
difficult to contribute back code, so do other things like sponsoring
or running events.

Hiring – candidates often by word-of-mouth. Careful interview process.
Being upfront about the kind of work they’ll be doing from the start.