New Code: Touch handling, Fonts, User Interface, oh and a Buckyball

This is sort of actually not “new code” as the project is the latest version of my Cube project to display 3D shapes as “balls and sticks” models. However, I’ve added quite a lot of extra code which might be useful to others so I’m posting it as “new code”.

All my code is available from my website: http://www.math.ntnu.no/~stacey/HowDidIDoThat/iPad/Codea.html. The project itself is the “Cube” project (available as a codea file) and I’ve also posted all the lua files in my Library.

I’ll list those aspects of the code that I think might be interesting to people who otherwise might not be interested in downloading a project that just displays a shape on the screen.

  1. User Interface I have menus, sliders, text boxes, colour pickers, keypads (for text or numerical input). There is a class that controls the user interface (so that the actual program doesn’t have to do much) and interaction between the user and program is handled by this controller. As an example, if a program wants a string from the user then the program calls a function ui:getText(f) (assuming that ui is an instance of the user interface class). The argument to this is itself a function which is called when the user submits the text. This means that the program continues working while waiting for the user’s input.

  2. Touch Handler This is a class which makes it easier (I think) to deal with touches. The touch object supplied by Codea is rather basic - in particular it deals with an instant in time and not with a “continuous touch”. This class allows a higher-level of handling. It gathers all touches to itself (a bit like Sauron with the rings, only less sinister) and then hands them out to objects in an orderly fashion.

  3. Font If you run the Cube project then you’ll see this in action. It’s a way of specifying a bitmap font and printing stuff on the screen hopefully in an efficient way. I’ve converted a few fonts to suitable format from the X11 fonts and from the TeX Gyre family.

  4. Colour Just a note to say that my previous colour class has been downgraded to simply extra functions that work on color objects. I was feeling a little silly writing fill(self.colour.colour) all the time.

  5. UTF8 This provides some helper functions for dealing with utf8 strings, working character-by-character rather than byte-by-byte (as the string library does). Probably more to implement.

That last comment goes for everything. There’s always more to do, and I’m learning a lot about programming (and programming efficiency) as I work with Codea - which is a Good Thing but does mean that my code is a bit unpolished!

I’ve tried to comment my code a bit to make it easier to use, but I expect I’ve missed out all the important things!

Andrew, this is amazing work. Congratulations! I ask myself if those routines can also be used for a mesh grid plotting functions of form z=f(x,y) or even surf() alike plots with colored facets. I am still puzzling around with that. Using normals to facets should be possible, and using dot product of normal and eye vector should work as well. I guess this is one valid method fur such kind of plots. Maybe you have an idea here?

Your UI is really great. I was thinking about such thing as well, but no clue at all how to code that.

It looks cool. I’ll try it out when I get a chance. The UI looks cool. I’ll try it when I get a chance. I was working on a sprite pack with all the UI element parts in it, but it’s hard because a lot of the graphics are crunched by iOS and I’m not jail broken. Only yesterday did I find the quick look plugin to look at iOS graphics.

Where is “Particles in a box”? I really liked that one.

Still there. It’s under “Projects” near the bottom of the page.

This is incredible! @Andrew_Stacey has packed so much in to this! The keypad is cute - not that I could ever go back to a phone like that! :slight_smile: I for one will be cannibalising this… :slight_smile:

Wow. Just wow. I’m jealous, and that’s high praise. Thank you for sharing.

@Simeon and crew - this needs to be included with the built-in examples. Not only is it really well done, it’s a treasure trove of useful stuff. If you’re not ready to do a built-in font, include this for the soft-font if for no other reason - especially if Apple is forcing you to remove project import.

@Andrew - this is really brilliant. The UI is crazy, it must have been a lot of work.

As @Bortels mentioned: we would love to include it as an example in a future release, if you’d like that.

This is HUGE, literally. Just amazing.
I’m definitely going to use this.

Simeon, of course you can use my code! What you will need to do is check the licences on the code that isn’t mine to check that including it in Codea’s examples is okay. I expect so, providing the contributed code can be licensed separately from the rest, since they are free licences. Specifically, the BinDecHex routines and the files derived from the TeX Gyre fonts.

Note that on my page I explicitly place my code in the public domain (I should clarify that that doesn’t apply where the files say something different).

I wouldn’t say it was a lot of work. It was a lot of fun. And to do what I want, then it was fairly necessary. The point of having a keypad instead of a keyboard was that it is a bit less intrusive, especially with the landscape view. So for a quick text input (like a name to save the shape as) it seemed appropriate.

I was doing public domain, but I’m told that there are some countries that don’t recognize that (???) - so I’m going to use MIT (I think) from here on out. Assuming the libraries you used are all open-source attribute (ie. without other baggage like the GPL), they should be fine - sharing the source is kinda automatic with Codea.

To make public domain work everywhere, I use CC0.

Is there a way to add/edit edges? I can’t find it if there is.

It would be nice to be able to set edge and node colors (and perhaps radii and thickness) individually. That also might be really tricky to do without artifacting in some way.

@Andrew_Stacey - I found that if you open the link in Terra, save the page, and say “Open In”, it shows up worth all these different programs that open what I think is a .txt file (even though it shows up a .lua). I prefer this because I dislike opera mini.

Weird - after messing around a bit - no balls/sticks. Stop project and start again, they reappear -for a second, then poof, gone. The behavior persists thru a full kill and restart of Codea. The rest of the ui, the text boxes, are fine, so it’s not a Codea rendering thing.

I’m totally digging your ui stuff, by the way. It reminds me of the tab window manager. That’s a compliment - I loved tab. Still use it some places (mostly VNC where I want to dump flashy special effects for bandwidth considerations).

My plan for setting stuff (like colours, radii, and so forth) on a few nodes or edges is that if there are selected nodes then the changes only apply to those nodes or edges (an edge is selected if its two end nodes are selected). The capability for individual styles is already in the code (see the Borromean example). It’s just adding the code to the bit that changes the styles.

To add or delete edges, select the end nodes and choose “Toggle edges” from the menu. Any edges where both end are selected will disappear, any pairs of nodes without edges will gain one.

For the weird behaviour, I got something similarly weird on a different project. In the end, I had to run the program with an empty draw function. Some memory wasn’t getting cleared that was assigned specifically to that project, I guess. Haven’t been able to reproduce though.

Oh, and for the window manager, as I write it then I’m getting flashbacks of fvwm.

ahhh… I thought “toggle edges” meant “turn edge display on/off”. didn’t explore enough.

I ended up deleting (!) the project, and re-downloading. Good thing we can always download the .codea project again, eh? (sorry - in snarky mood. I blame my children.)

Awhile back I made a brief routine that displayed the Colours in the Colour class. It was a bit slow. I’ve rewritten it using the new native text.

You need to get the Colour class from @Andrew’s site above.

--color display

function setup()
    ct = {}
    cc = 0
    yt = 0
    watch("min")
    watch("max")
    watch("yt")
    for k,v in pairs(Colour.x11) do
            r = Colour.x11[k].colour.r 
            g = Colour.x11[k].colour.g
            b = Colour.x11[k].colour.b
            lt = k .. " " .. r .. "," .. g .. "," .. b
            cc = cc + 1
            ct[cc] = {r=r,g=g,b=b,lt=lt}
        end
        for k,v in pairs(Colour.svg) do
            r = Colour.svg[k].colour.r 
            g = Colour.svg[k].colour.g
            b = Colour.svg[k].colour.b
            lt = k .. " " .. r .. "," .. g .. "," .. b
            cc = cc + 1
            ct[cc] = {r=r,g=g,b=b,lt=lt}
        end
end

function draw()
    background(0,0,0,255)
        min = math.floor(yt / 45)    
        max = math.floor((yt+HEIGHT)/45)
        if min < 1 then min = 1 end
        if min > cc then min = cc end
        if max > cc then max = cc end
        if max < 1 then max = 1 end
        for i = min, max do            
            stroke(ct[i].r,ct[i].g,ct[i].b)
            fill(ct[i].r,ct[i].g,ct[i].b,255)
            text(ct[i].lt, 200, (i * 45)-yt+20)
            rect(0,(i * 45)-yt,40,40)
        end
end

function touched(touch)
    yt = yt + touch.prevY - touch.y   
end