Skip to content


UTF-8 Encode in Javascript

UTF-8 encode for Javascript. I’m not going to attach a license to it, maybe Public Domain or something, it’s slightly more lightweight than the other implementations.

"utf8": function(input) {
//return unescape(encodeURIComponent(input)); //may or may not work
for(var n = 0,
output = ''; n < input.length; n++){
var c = input.charCodeAt(n);
if(c < 128){ output += input[n]; }else if(c > 127) {
if(c < 2048){ output += String.fromCharCode(c >> 6 | 192);
}else{
output += String.fromCharCode(c >> 12 | 224) + String.fromCharCode(c >> 6 & 63 | 128);
}
output += String.fromCharCode(c & 63 | 128);
}
}
return output;
},

Posted in Uncategorized.


Talk to the bot!

http://botbash.antimatter15.com/chat.htm

You can talk to the awesome omegle-learning robot with it’s 20MB database!

The way it works is pretty cool, there is that client which is using postMessage to communicate to a frame hosted with google app engine which is polled at an insanely fast rate (practical DDoS at 2 requests per second). That gets stored on a datastore, and my server in my basement is also DDoSing google, recieving new messages (probably using BOSH/XMPP would be better…). It uses JSONP to query the server’s php server and computes a response with MySQL and PHP. Then it’s sent to the HTML, postMessaged to the iframe and t hen ddoses google and etc.

Posted in Uncategorized.


ShinyTouch/JS

Yay for yet another demo that strives to mix an mash almost everything HTML5 related! ShinyTouch in JS dumps the stuff from a <video> tag with ogg encoded video (well, almost all video from linux is ogg encoded so it’s just whatever format i got first from cheese). It gets dumped into <canvas> and getImageData does it’s magic.

Interestingly, if you don’t use the video and just do data from a raw image, you get upwards of 125fps on V8. Adding the video, it ceases to work on Chromium (maybe a linux thing? this tells me it’s just linux, but you can never be so sure).

//At this point, run away as the algorithm gets messy and hackish

So the thing just searches from right to left up to down within the quad. When it finds a column of something that fits the rgb range of the finger that is larger than a certain threshold, it checks for a reflection from the point. If it detects a reflection then yay! it throws the data at the perspective warper (based on a python one which is based on a C# one and though it would probably be easier to port from C# to JS making long chains of derivative work is fun). If there wasnt a reflection then it logs that and if that number is larger than some othe rthreshold then it kills the scanning and goes on with it’s life. The reflection algorithm just takes the point 5 pixels to the right and assumes that would be a reflection if there was one and a point 15px above and 5px to the left (nasty stuff) and takes the hue value from their RGB values. It takes the absolute value of the difference of the hue values multiplied by 100 (or 200 in the python version) and compares it with a preset configuration variable.

So now that that horrible algorithm which was just whatever came to my little totally untrained mind first. But it works semi-decently, at least for me. But you can hopefully see how nasty it’s inner workings are and it inspires people to clean it up. It’s quite a bit more readable than the Python version and only 200 lines of JS so it won’t be too hard to understand.

But since HTML5 has no Video capture thing for webcams, and my webcam doesn’t work with flash so I can’t use that canvas<-flash webcam bridge i built, uh, almost 2 years ago. So now you just get to gaze at my finger moving for like 20 seconds!

http://antimatter15.com/misc/shiny/shinytouch.html

Posted in ShinyTouch, Touchscreens.

Tagged with , , , , , , , , , , , , , , , , , .


JS vs Python

I sorta expected it due to the new V8, Tracemonkey, Nitro, and SquirrelFish engines. But I’m thinking of making a port of ShinyTouch to JS and I was looking into what differences it might end up as.

I have to say I’m really quite suprised. It’s a simple piece of code:

setTimeout(function(){
var start = (new Date).getTime();
var n = 0;
for(var i = 0; i < 10000000; i++){
n += i;
}
var end = (new Date).getTime();
alert(end-start);
},5000)

Just doing a loop a huge number of times and adding some numbers. But the unscientific results are quite amazing:

Python: 2640, 2110, 2000, 2190

Firefox 3.0 Spidermonkey: 777, 672, 685, 665

Firefox 3.5 TraceMonkey: 659, 365, 629, 629

Chromium Nightly: 146, 150, 147, 152

While these only test basic arithmetic and recursion, The browser is 15 times faster than Python, it just feels quite incredable.

Posted in Uncategorized.

Tagged with , , , , .


ShinyTouch Videos

The first one is shot from recordMyDesktop-gtk and the second one is from Cycorder on my iPhone.

Posted in Google Wave, ShinyTouch, Touchscreens.

Tagged with , .


Totally failed mini-project: svg-edit + svgweb

So I tried to get svg-edit to work with svgweb’s flash shim (IE support). Sadly, it’s a total failure!

http://antimatter15.com/misc/svgweb-svgedit/svg-editor.html?svg.render.forceflash=true

I only got far enough to get drawing lines, paths, polygons and rectangles working. Ellipses and text do not work. Selecting a shape shows the tracker, but if you drag it then it just flies over to (0,0) and dies. Partly because I didn’t spend any more than an hour getting the port to work, but the issues I’ve encountered is that svgweb doesn’t implement shape.getBBox() (but it did provide shape._getX(), shape._getY(), shape._getWidth(), and shape._getHeight() so it wasn’t hard to implement that). Then was that since it’s using a flash shim, the events which they hook on the container with jQuery only show the evt.target as the <embed> which the flash resides in. But I got a strange hack where you have 2 copies of the event listeners and kill the selects from the jQuery one, but doing that makes unselecting impossible.

Posted in Ajax Animator.

Tagged with , , .


Shinytouch Perspective Transform

Shinytouch perspective transforms now work!

One big issue with ShinyTouch is that it didn’t transform points correctly, but now it has been totally resolved by stealing this (MIT licensed) from the linux (python!) port of Wiimote Whiteboard (Johnny lee’s famous work). Now it works totally insanely awesomely, no elitists necessary.

Posted in ShinyTouch, Touchscreens.

Tagged with , , , , .


Future plans on VectorEditor

I don’t really care about VectorEditor, If someone finds it useful and wants to take over it, well, I’m not really updating it. Not many people are updating it, and once svgweb is mixed with svg-edit for 95% browser penetration and rotation works, it will be able to do everything VectorEditor does and more.

Sure it makes the project quite fragmented, a Richdraw version, an OnlyPaths version, a VectorEditor version, and now a svg-edit one. But each one will hopefully be mostly compatible with each other (mostlyish)

Posted in Ajax Animator.

Tagged with .


Massive Memory leak

I was running my ajax animator for a hour playing a relatively large animation, and my computer totally died. I tested it again, and within ~2 minutes RAM usage was up to 1.1GB. I looked it up https://bugs.launchpad.net/ubuntu/+source/firefox-3.0/+bug/380318 I guess i’m lucky with 4GB of ram, so it lasted maybe a few minutes longer than it should have.

At least it’s not a ajax-animator flaw, just a firefox one.

Posted in Ajax Animator.


My Ideal Browser Addon System

A rephrased version of my previous post, but this one is slightly more specific and some more stuff.

I was thinking that since lots of people/companies are trying to make the browser a lot more OS-like, or at least trying to stop you from using anything outside a browser. What does the browser really need to improve?

My idea is that projects like Jetpack, Greasemonkey (to a lesser degree), the Chrome extensions system (havent even looked at it tough, I’m just judging based on lack of media attention), and everything that Microsoft does (things they do are inherently wrong) are not going the right path. Jetpack is closer to right (duh, it inspired this post), and Greasemonkey is the closest to right (Jetpack took off the Greasemonkey idea, but took the wrong turn, IMO).

What they’re focusing on, is not to overlap with what the W3C and WHATWG does by semi proprietarily developing product-specific innovations. What I think is that Web Pages should be the same thing as extensions. The HTML standard needs a notifications API, because we already have alert() and something less annoying is not at all a security issue. With that, half of the jetpack apps, which are notifiers can be implemented totally as a web page. No different APIs, no special install things, and for the heck of it, no installing! It’s the whole Web philosophy that made the Web work, attached to what adds to the web.

What I think is great about my idea (other than being my idea), is that your Application can now be the same page as your Information and Install page. While Jetpack could integrate Information and Install, and Firefox’s XUL/XPI system before it needed a page for info, a install window, and an application interface. With this consistent system, ultimately, things are harder to confuse and you can get to what you’re trying to do more intuitively and consistently.
After that, they need a way of making tabs persist and become “background” (which would be a tab but with only an icon, so it’s unobtrusive). Then you can replace the functionality of most addons. Browsers that do not support persisting and background tabs gracefully degrade and allow for slow and smooth adoption.

The biggest part is a browser web page permissions system, which the web desperately needs, and the Web browser vendors and plugin makers are attacking in the totally wrong way. Not totally wrong, but totally inconsistent. Think about it, Flash has a sub-window in a flash animation to enable access to webcam/audio, Gears makes a distracting box pop up, and Firefox’s geolocation system makes a bar appear on the top. Imagine when they try to add more (HDD storage, Webcam, Sockets, Audio, Microphone, Fullscreen, Printer, loading files, etc), you have 6 bars stacked on top of each other and a infinite loop of modal windows that pop up to ask you for where you live.  Whatever each vendor cares to do, I don’t care, but I want that all to be consistent. So why not some HTML tag (maybe a meta rel=feature) and a JS queryFeature (or whatever they wanna call it), and it makes a semitransparent pretty drop down menu on the top right of the page which shows checkboxes for the page to enable (and it would only have the 1-2 features the page is asking for, so it’s not hard at all). Anything the browser doesn’t yet implement can be disabled with a little tooltip saying “Feature not available” for more graceful degrading.

The permissions system could fix tons of things intentionaly removed from the HTML5 standard for security. The fear for providing an API for Fullscreen <video> was that someone could have a fullscreen video that resembles someone’s computer and does super evil spyware or something. Having a permissions system like the one above totally removes that issue.

The permissions could be anything, access to subframes, controlling other tabs, etc. Anything that is a security issue that could still be useful can be put into the permissions system. The things could be color-coded based on dangerous-ness, etc. Anything could be implemented as a web page.

Posted in Design.