Archives for 2011
You are currently browsing 24 articles posted 2011.
Sony and Google and the PS4
Published Saturday 24th of December 2011
I'd love it if Google and Sony could join forces on the PS4 (PSLife? :) and deliver super hardware (something like Nvidia's next) with Android / Google TV on top.
All your saves and user profiles etc would be handled online (or "in the cloud" as everybody seems to love to say these days), of course you should be able to try and buy games online - but they have to keep the blu ray so you can still buy the discs.
Android's (bound-to-come) Siri copy together with motion sensors (the improved PSEye) and maybe something like the (Swedish :) Tobii eye-tracking system would be the answer to Kinect and allows you to control the whole thing with your voice, eyes and body.
Of course if you're using Android on other devices you'll have access to everything on them as well (and even the ability to stream games to your portable like a mini-OnLive).
Be the first to post a comment
jQuery 3D Circle
Published Monday 12th of December 2011
I wanted to learn more about CSS 3D transforms so I started experimenting with the login page on SleekPHP.
It all turned into a jQuery Plugin called "3D Circle". I haven't uploaded it to the site yet but you can find both the CSS and the JS (beta) on Google code.
There's also a demo you can try out here (only tested in Chrome).
It's just a save of the HTML, CSS and JS on that page so you won't actually be able to sign up or do anything else. That's not the point of the demo though so.
I've only tried it in Chrome but use all vendor prefixes in the CSS so if your browser supports them all it should work in it too.
It took me a while to get everything the way I wanted it. The circle is automatically generated based on the items on the page. So if you add or remove items the circle adapts.
First I tried calculating the positions myself using sin and cos and apply them to the item's translateX and translateZ values. This worked fine before I started rotating the items as well. Without rotation the items were all facing the screen but they were at least in a circle.
When I started rotating the items all hell broke lose and nothing looked right. After some debugging I noticed that the rotation's origin is always from the 0, 0, 0 position. So the item would no longer rotate around itself but around the point at 0, 0, 0.
Thanks to this, though, it was much easier than having to calculate the circle positions myself. All I needed to do was place all the items at z: radie and then rotate them by 360 deg / num items.
Doing that placed all my items in a nice circle. Now to rotate this circle all I needed to do was rotate the parent element of all the items.
The problem with this, though, is that some items will be "in front" of the 0 z pane. That means they will look pretty much twice their size and that's not what we want.
My first thought was to simply move the wrapper of the items in the z pane, but doing that introduced the same problem I had before with the items themselves; now the rotation of the wrapper would go around its 0, 0, 0 position while it's sitting at 0, 0, -radie.
The only solution I could come up with was to wrap the circle in yet another element used only to move the circle in x, y or z.
So the final HTML requires quite a lot of wrapping elements. If you're doing this to a list of elements though you'll already have a
uland possibly a wrappingnavorsectionso you'd only need to add one extra element.The outer wrapper is the "stage" for the circle. It contains the perspective and perspective-origin properties. Without these the transforms will all be flat.
The second wrapper is the "mover" for the circle. It is only used for moving the entire circle its radie in the z pane. This way we avoid having elements twice their size.
The third wrapper is the actual circle and its direct descendants are the circle items.
As you can see the demo is from SleekPHP's login page, you can check out SleekPHP's logger at the bottom of the page. I've got loads of other work atm so progress has been a bit slow lately.
Be the first to post a comment
A thousand monkeys at a thousand typewriters in PHP
Published Tuesday 6th of December 2011
I actually had this idea ages ago and last night I started thinking about it again while trying to fall asleep so I decided to write the thing once and for all.
Using the
convBasefunction from the comments section here php.net/manual/en/function.base-convert.php as well as this little code snippet:<?php
$base = '0123456789abcdefghijklmnopqrstuvwxyz '; # add more if you wish
$slots = 1000000; # increase to get longer texts
$variations = pow(strlen($base), $slots);
for ($i = 0; $i < $variations; $i++) {
echo '"' . convBase($i, '0123456789', $base) . '"<br/>';
}You can make your computer print every text that's ever been written as well as any text that ever will get written in any language that uses the $base characters.
You'll get the LOTR trilogy written backwards only Frodo is called Froggo and the sky's color is purple and instead of beer everybody drinks the Swedish drink Trocadero.
You'll also get the answers to every question that can be asked in text and you'll get a detailed explanation of your life that's correct down to every little detail.
Mind you you'll get everything in between as well :P
Be the first to post a comment
SleekPHP User Handling
Published Thursday 1st of December 2011
SleekPHP development has gone a bit slow lately but last night I managed to get quite a lot of work done on the user management.
SleekPHP's user management is database driven and allows any number of users with any number of authorization levels (as opposed to aFramework's that wasn't DB driven and only two users and two auth levels could exist).
In addition to writing the Model, DB, User, UserModel and UsersModel classes I've also written a Form class which all three modules on the login page use.
The form class is used to generate, submit and validate forms consistently across SleekPHP sites.
It's not a core class and could really be used in any project. If you want to see it in action you can check out the RegisterModule. You'll also see how the different model classes are used there.
I'm severely tired so sorry if this doesn't make sense :P
Join 4 others and post a comment
SleekCMS Progress
Published Monday 17th of October 2011
Since releasing SleekPHP.com to the public I've been hard at work on SleekCMS.
With SleekCMS I'm aiming to create a very flexible CMS that allows users to create any number of content types (similar to node types in Drupal). Each content type can have any number of user defined "fields" (like "thumbnail", or "email" or "whatever").
Contents can be places in hierarchies as each row has a parent_id. The idea is to provide an API so that users easily can display content rows in a number of ways.
There will also be support for tags and attachments (a media library pretty much).
I'm also planning on making the SleekCMS admin a bit of a hub for all kinds of information about your SleekPHP site as well as SleekPHP news and whatnot.
There's loads of work left before it is functional but I hope to finish it and convert AndreasLagerkvist.com too SleekPHP before Christmas. We'll see how that goes :)
Btw: I know it currently looks almost identical to Google+ :P
Join 2 others and post a comment
SleekPHP.com is Live
Published Wednesday 28th of September 2011
After a month or so of some seriously late nights (early mornings) I've now gone live with SleekPHP.com.
Everything about SleekPHP kan be found there so I won't write any more here.
SleekPHP.com. Oh yea, SleekMobile too.
Be the first to post a comment
SleekPHP Progress
Published Wednesday 21st of September 2011
SleekPHP is the new name for aFramework and it is as usual a complete rewrite with loads of improvements.
It builds on the same structure as aFramework where a Site can extend many other Sites and each Site consists of many Pages which each have many Modules.
One of the things I wanted to focus on with SleekPHP was to try and write better OOP. For example all of the previously mentioned components are now classes with handy functionality. Where before the aFramework-class would handle almost everything there are now 3 main classes that make up a page:
- SleekPHP - ties everything together and holds instances of DB, Router, User etc
- Site - represents a Site (a directory in the Sites/-directory along with a mandatory SiteName.info-file)
- Page - represents a Page (an .xml file in a Site's Pages/-directory)
I've been scratching my head quite frequently lately trying to figure out where each method should reside. For example, should it be Site->renderPage(pageName) or Page->render()? I think it's ok as it is now, and these things can quite easily be changed without having to change third party code afterwards.
I've also tried to focus a lot on keeping the core stuff really clean and properly commented and also try to move as much as possible to external modules and plug-ins.
Plug-ins is another new feature as well and all they really are are functions that run at a certain points in the execution of the framework. I've for example moved the HTML packing and debug logging to plug-ins instead of keeping them somewhere in core.
There's still a lot to be done but core is getting close to being "finished" and after that I'm gonna focus on getting sleekphp.com as well as mobile.sleekphp.com (SleekMobile) up and running. After that I need to convert andreaslagerkvist.com to the new code. Which is a massive project so it may take some time.
If you're interested in the code you can as always find it on Google code.
I'd start with the index.php file, then check out the SleekPHP class which should lead you to the Site class and finally the Page class.
There's a total of 15 files in core but some of them are almost empty at the moment. Almost all of the meat is done in the files mentioned above.
Be the first to post a comment
Server Problems and More
Published Wednesday 21st of September 2011
You may have noticed the site's been down a few days (weeks even perhaps) and because I've been a bit lazy it's taken me 'til today to fix it.
Me and a couple of mates have had our own VPS for a while now but a while back it suddenly went down and because there's really nothing crucial on it no one's been in the mood to sort it out.
Today I set up my own brand new server and will start using that for future projects. I've also spent the evening backing up data from the old server.
When doing the DB-dumps I noticed that one of my sites (one I've completely stopped working on ages ago) had gone from a 300kb dump to a 30mb dump in a matter of weeks. Which is most likely the root of our problems.
I was using a modified version of Jonathan Snook's spam checker and apparently the damn bots have now found a way around that too. Luckily it has yet to affect any of my other sites using the same spam tool.
Anyway, I got into the cleaning up spirit and decided to drop quite a few of my sites. In fact I deleted all my personal projects except for this site and will be moving a couple of other projects away from the server (and aFramework) soon as well.
The reason I've taken down a-framework.org (along with the demo and bugtracker) is that I've started work on the new version of the framework; SleekPHP.
My plan for the future is:
- Move all sites off the old server
- Archive aFramework and all of its sites
- Convert andreaslagerkvist.com to SleekPHP
- Remove old server, have only andreaslagerkvist.com and sleekphp.com on new server (both running SleekPHP)
The biggest problem is converting this site to SleekPHP. SleekPHP's engine is pretty much finished but I haven't built any of the many sites that come with aFramework yet (like aCMS and aBlog etc). In fact, I haven't even set up the DB-stuff in SleekPHP yet.
I'm not sure yet whether I should try to create at least something basic to put on this domain before I remove the old server or if I might just let andreaslagerkvist.com rest for a while and then reboot in a few months with the new framework (and most likely a new design as well). I guess I'll lose all my Google ranking in that time but wtf all that leads to is bug reports on jQuery plugins anyway :P
Be the first to post a comment
New Project; SleekMobile
Published Monday 22nd of August 2011
Like I've mentioned before I've been working a little with jQuery Mobile lately and there's a few things I feel can be done differently.
jQuery Mobile requires you to put a lot of extra attributes in your HTML elements and it also injects a bunch of divandspanelements in your code.That's why I started writing my own. And instead of data-attributes or .classes SleekMobile is built using SASS @mixins.
Head over to the documentation to find out more.
Join 1 others and post a comment
Thoughts on jQuery Mobile
Published Monday 22nd of August 2011
I've been working with jQuery Mobile a bit lately and while it's a really great lib with awesome developers behind it, I felt that there's a few things that could be done differently.
For one it requires you to write a lot of extra HTML. Here's an example of a connected list of buttons with icons:
<!-- Normal HTML -->
<nav>
<a href="#">Item 1</a>
<a href="#">Item 2</a>
</nav>
<!-- jQuery Mobile -->
<nav data-role="controlgroup" data-type="horizontal">
<a href="#" data-role="button" data-icon="arrow-r" data-theme="c">Item 1</a>
<a href="#" data-role="button" data-icon="arrow-r" data-theme="d">Item 2</a>
</nav>As you can see there's quite a lot more code in the jQM version, and most of it has only to do with styling.
jQuery Mobile then runs through your HTML and injects
spananddivelements here and there. Here's an example of a list of links:<!-- Normal HTML -->
<ul>
<li><a href="#">Link</a></li>
</ul>
<!-- jQuery Mobile -->
<ul data-role="listview" data-inset="true" data-theme="c">
<li><a href="#">Link</a></li>
</ul>
<!-- After jQuery Mobile's finished -->
<ul data-role="listview" data-inset="true" data-theme="c" class=" ui-listview ui-listview-inset ui-corner-all ui-shadow ">
<li data-theme="c" class="ui-btn ui-btn-icon-right ui-li ui-btn-up-c">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="#" class="ui-link-inherit">Link</a>
</div>
<span class="ui-icon ui-icon-arrow-r"></span>
</div>
</li>
</ul>This can get somewhat confusing when you're trying to script or even style elements and suddenly your HTML structure is completely different.
It's particularly annoying when it comes to forms and updating form elements that have been turned into
divs andspans.Also, I felt it wasn't entirely straight forward on how to best override some of jQM's default settings for paddings/margins and even themes.
What are your thoughts on jQuery Mobile?
Be the first to post a comment
How to Create a Scrolling Twitter Feed Using jQuery
Published Friday 24th of June 2011
In this tutorial I'll explain how to create one of those scrolling twitter feed boxes that are quite common on many websites today.
I'll be using jQuery as well as Remy Sharp's Silky Smooth Marquee plug-in.
The HTML
Most of the code will be generated with JS. But we'll add a container and a little "Loading..."-text directly in the HTML.
<div id="twitter">
<h2>Latest tweets</h2>
<p>Loading...</p>
<noscript>This feature requires JavaScript</noscript>
</div>I'll also use the noscript element to inform users without JS that they need to turn it on in order to see the tweets.
You could fetch the tweets using PHP and CURL but that makes your entire page halt until the tweets are loaded so I prefer the JS-approach.
The CSS
You can style it any way you like really but this CSS will make it look kind of like in the image above.
/* The container for the module */
#twitter {
background: #f1f2f8;
width: 600px; /* Up to you but remember to change the div width below as well if you change it */
padding: 0 10px;
overflow: hidden; /* clearfix */
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
-ms-border-radius: 5px;
border-radius: 5px;
}
#twitter h2 {
float: left; /* We'll make the heading sit on its own line next to the tweets */
width: 85px; /* Might wanna change this depending on the text in the heading */
margin: 0;
padding: 6px 0; /* I'll set the top and bottom padding here rather than in the container so as not to cut off any text */
font-size: 12px;
color: #4b9fff;
line-height: 1;
}
/* The marquee plug-in turns a marquee element into a div */
#twitter p,
#twitter marquee,
#twitter div {
float: left;
width: 505px; /* Container width - heading width - 10px (for some right padding) */
margin: 0;
padding: 6px 0; /* Again we set the padding in here so as not to cut text */
line-height: 1;
}
/* All the tweets will be links pointing to your page on twitter */
#twitter marquee a,
#twitter div a {
margin: 0 10px 0 0;
color: #333;
text-decoration: none;
}
/* The i is used to display the date of the tweet */
#twitter marquee a i,
#twitter div a i {
font-style: normal;
color: #999;
}The JavaScript
Now for the interesting bits.
var Twitter = {
init: function () {
// Pass in the username you want to display feeds for
this.insertLatestTweets('realjknoxville');
},
// This replaces the <p>Loading...</p> with the tweets
insertLatestTweets: function (username) {
var limit = 5; // How many feeds do you want?
var url = 'http://twitter.com/statuses/user_timeline.json?screen_name=' + username + '&count=' + limit + '&callback=?';
// Now ajax in the feeds from twitter.com
$.getJSON(url, function (data) {
// We'll start by creating a normal marquee-element for the tweets
var html = '<marquee behavior="scroll" scrollamount="1" direction="left">';
// Loop through all the tweets and create a link for each
for (var i in data) {
html += '<a href="http://twitter.com/' + username + '#status_' + data[i].id_str + '">' + data[i].text + ' <i>' + Twitter.daysAgo(data[i].created_at) + '</i></a>';
}
html += '</marquee>';
// Now replace the <p> with our <marquee>-element
$('#twitter p').replaceWith(html);
// The marquee element looks quite shite so we'll use Remy Sharp's plug-in to replace it with a smooth one
Twitter.fancyMarquee();
});
},
// Replaces the marquee-element with a fancy one
fancyMarquee: function () {
// Replace the marquee and do some fancy stuff (taken from remy sharp's website)
$('#twitter marquee').marquee('pointer')
.mouseover(function () {
$(this).trigger('stop');
})
.mouseout(function () {
$(this).trigger('start');
})
.mousemove(function (event) {
if ($(this).data('drag') == true) {
this.scrollLeft = $(this).data('scrollX') + ($(this).data('x') - event.clientX);
}
})
.mousedown(function (event) {
$(this).data('drag', true).data('x', event.clientX).data('scrollX', this.scrollLeft);
})
.mouseup(function () {
$(this).data('drag', false);
});
},
// Takes a date and return the number of days it's been since said date
daysAgo: function (date) {
// TODO: Fix date for IE...
if ($.browser.msie) {
return '1 day ago';
}
var d = new Date(date).getTime();
var n = new Date().getTime();
var numDays = Math.round(Math.abs(n - d) / (1000 * 60 * 60 * 24));
var daysAgo = numDays + ' days ago';
if (numDays == 0) {
daysAgo = 'today';
}
else if (numDays == 1) {
daysAgo = numDays + ' day ago';
}
return daysAgo;
}
};
Twitter.init();And there you have it. View the scrolling twitter feed in action here.
Join 33 others and post a comment
E3 Was Shite... As Usual
Published Monday 6th of June 2011
I had really high hopes for this year's E3. Rumors of a new Nintendo console had me hoping that Sony and M$ would follow suite and announce the PS4 and XBOX 720.
Microsoft
Microsoft's presentation was by far the worst of the three showing pretty much nothing but Kinect bollocks and a few expected games (GoW, Halo and Forza 4). The fact that the only promising XBOX exclusive for ages (Ryse) turned out to be Kinect crap didn't exactly help.
One thing that looked kind of cool, I thought, was the new Bing for XBOX thingy (although Bing really is a crap service that has to rely on Google to produce relevant search results). Voice command was just a ridiculous gimmick of course but I reckon what they have going is the closest to the type of media centre I wrote about recently.
What was missing: GTAV, BF3 on a console, XBOX 720.
Sony
Sony didn't really have any nice surprises either but at least they didn't spend as much time on the casual market as MS did with Kinect.
Uncharted 3 obviously looked totally awesome and Resistance 3 seemed like an improvement from the previous iterations. Sly 4 is apparently meant to be really good as well and the God of War and ICO collections are highly awaited.
They also presented their new portable device officially named PS Vita. It looks quite powerful and after what Nintendo showed I wouldn't be surprised if Sony tried to copy what Nintendo are doing with their new Wii U controller.
If you think about it it really shouldn't be that difficult seeing as the PS Vita basically is a controller with a screen that has WiFi plus a shit load of horse power. I guess the fact the the PS Vita is missing some of the DualShock's buttons could be a bit of a problem. But not for every game.
Update: VG247: Sony: Vita could be used as PS3 controller
What was missing: Last Guardian, Agent, FFvs13, new Quantic Dream title, Gran Turismo 6 and of course the PS4.
Nintendo
After Sony's and Microsoft's disappointing presentations I had super high hopes for Nintendo's new (supposedly hard core) console.
They started out with 45 minutes of kiddy games that made most people yawn it seemed (why do these clowns insist on showing the E3 crowd - most likely the most hard core gamers on the planet - kid games and motion controls? We don't give a fuck about that).
Eventually, however, they finally got to the interesting bit, the new Wii U. They didn't actually show the console itself which confused quite a lot of people into thinking it was nothing more than a Wii add-on (Sweden's number 1 gaming magazine's editor in chief for one, LOL).
But I have to say the new console was a disappointment as well. Seeing as they didn't focus at all on showing anything that looked remotely next gen I assume it won't be more powerful than the 8 year old tech we have in our lousy consoles today.
The new controller seemed like it had potential for some cool gimmicks but at the same time it looks stupidly uncomfortable and ridiculously expensive.
What was missing: A proper next gen console with GTAV running in crazy good looking graphics.
Conclusion
If they don't announce new consoles before or during the next E3 I'll be switching to PC again. The tech that's in current gen systems is a fucking joke and they've reached the limits of what can be done with it now. Sure you can always tweak a few algorithms to squeeze out a couple of extra frames per second but what we really need is up to date hardware!
I want to see games that utilize Euphoria, PhysX, DX11, completely destructible environments (ala Red Faction) all at once while looking as good as BF3. That will never happen on today's rubbish consoles.
All the hope I had for Nintendo was lost as well as their latest crap box didn't seem to bring anything new to the table. Like I mentioned before it seems feasible that Sony might use the PSVita the same way Nintendo uses its Wii U controller anyway so then they've got shit all.
Did you watch it? What did you think?
Be the first to post a comment
I Want a Google Entertainment Centre
Published Friday 27th of May 2011
Spotify, Groove Shark, Voddler, OnLive - There's plenty of online media centres available today with varying degree of content and usability.
I really like Spotify and have used it for a few years now. OnLive looks cool but isn't really there yet I think. Voddler seems to have failed at least in trying to be the "Spotify for films".
I think most of these companies simply don't have the resources needed to sign licenses with all the record labels and movie producers out there and I would very much prefer to have one single service for all media.
What I want, and think might be possible, is for Google to step up and take over the lot of it. Google has the money and the power as well as the biggest server farms on the planet. One of Google's goals is to make all the information on the planet searchable. This includes web pages obviously, but also images, books, news archives, patents, academic journals and more.
So what's missing? Well entertainment media is one thing. I want Google to start indexing films, TV-series, video games and music. I want an as easy to use service as Google Search that lets me find (and watch, obviously) any of the aforementioned media.
Imagine having one simple interface for all your media needs. Basically Spotify but with tabs for "Music", "Films", "TV-Shows" and "Video Games". How awesome would that be?
One of the coolest things with streaming, especially video games, is that you can do it from any device. Imagine being able to play Battlefield 3 on your HTC Desire. All you really need is a descent broadband.
If they did create something like this, I for one would gladly pay at least €100 a month for it. A service like that would be all you'd ever need for all your entertainment needs.
Come on Google, make me happy!
Update: Getting closer! :D
Be the first to post a comment
SASS is Brilliant
Published Monday 18th of April 2011
I've used my own CSS constants parser for a few years now and I can't imagine writing CSS without it nowadays.
I wrote the parser years ago when I had more time for my own projects and since then I've come up with loads of things I've been wanting to add to it.
Quite recently TB recommended SASS to me in the comments to my CSS Wish List article and for a recent project I gave it a go.
SASS has got everything on my todo-list for my own parser + loads more. Its @mixins are almost identical to my own take on constants but SASS' @mixins has support for many things I have yet to add to my own parser.
SASS also comes with variables and a bunch of super handy color functions.
It doesn't merge every file in the CSS-dir like mine, but instead loops through @import directives and pulls all the code in to the same file.
I'm going to convert all my handy CSS constants to SASS @mixins shortly and I've also looked into Compass' collection of @mixins based on popular CSS frameworks.
Writing CSS without @mixins (or similar) is not an option for me anymore and with all the other handy functionality SASS comes with it's an obvious choice for me.
Thus I will be deprecating my own parser and start using SASS exclusively from now on. It's an added bonus that other smart people are constantly improving it as well.
Now if I could only find a substitute for aFramework... :)
Join 2 others and post a comment
Vendor Prefixes are Getting Ridiculous
Published Friday 15th of April 2011
$chat-user-box {
background-color: #e9f2f8;
background-image: -moz-linear-gradient(top, #e9f2f8, #dae9f4); /* FF3.6 */
background-image: -ms-linear-gradient(top, #e9f2f8, #dae9f4); /* IE10 */
background-image: -o-linear-gradient(top, #e9f2f8, #dae9f4); /* Opera 11.10+ */
background-image: -webkit-gradient(linear, left top, left bottom, from(#e9f2f8), to(#dae9f4)); /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, #e9f2f8, #dae9f4); /* Chrome 10+, Saf5.1+ */
background-image: linear-gradient(top, #e9f2f8, #dae9f4);
filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#e9f2f8', EndColorStr='#dae9f4'); /* IE6–IE9 */
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
-o-background-clip: padding-box;
-ms-background-clip: padding-box;
background-clip: padding-box;
position: relative;
margin: 0 0 4px;
padding: 5px 5px 5px 45px;
border: 1px solid #a3b5d9;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-o-border-top-right-radius: 5px;
-o-border-bottom-right-radius: 5px;
-ms-border-top-right-radius: 5px;
-ms-border-bottom-right-radius: 5px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}FFS
Join 1 others and post a comment
Chopin, Nocturne, opus 27 #2
Published Saturday 9th of April 2011
Awesome. Awesome to the max.
And LOL
Be the first to post a comment
How to Create a Carousel with CSS and jQuery
Published Saturday 19th of March 2011
Almost every website I visit nowadays has one of those fancy carousel's in the top to display the most valuable content to visitors.
In this article I'll explain how you can create one yourself using jQuery, the jQuery.scrollTo-plug-in and CSS.
First, we'll start with the HTML.
Join 1 others and post a comment
CSS Wish List
Published Friday 18th of March 2011
CSS keeps getting better and better and browser vendors implement more and more every year (except for you-know-who that tend to wait a little more like 5 years) but there's always stuff missing I wish it'd had.
Photo by Francesco MarinoHere's a few things I wish they'd add in the future.
Join 4 others and post a comment
MVC Without a Framework
Published Saturday 12th of March 2011
MVC (Model - View - Controller) is an excellent way to divide the tasks of an application into different layers that all handle separate things.
Image: Renjith Krishnan / FreeDigitalPhotos.netMany PHP frameworks use the MVC model but in this article I will try to explain how you can utilize MCV without the use of a framework.
First, I'll try to explain what the different layers all mean.
Join 2 others and post a comment
Sleek 1.0 and a New Design
Published Friday 11th of March 2011
I've started sketching out ideas for a new version of Sleek. Sleek 0.1 really didn't get very far although the foundation is pretty solid.
Version 1.0 will follow the same structure as aFramework has since the first version.
Join 2 others and post a comment
Facebook iFrame App Skeleton
Published Tuesday 15th of February 2011
I've had to work on building a Facebook app the last few weeks and I have to say it's a right piss take.
Documentation is lacking and whatever information you can google your way to seems to always be outdated.
That's why I thought I'd document my findings here.
You should read on if you want to create a Facebook iFrame App that:
- Lives on a facebook page rather than on apps.facebook.com
- Requires the user to be logged in and accept that the app has access to basic details about the user
- Presents different content depending on whether user has "liked" a certain page or not
Join 3 others and post a comment
5 Resons You Should Switch to Ubuntu
Published Thursday 10th of February 2011
I switched from Windows to Mac a few years ago and then to Ubuntu about two, three years ago and I can never imagine going back to either Wintendo or Apple.
I think that if you play games on a console (rather than your computer) there's absolutely no reason to use Windows and unless you're a graphical designer I reckon Ubuntu is definitely superior to Mac. Obviously gamers and designers are aplenty but I think if you read this you're probably a developer anyway.
So, here are 5 reasons why you, too, should make the switch :)
Join 3 others and post a comment
Coding Music
Published Friday 7th of January 2011
I like to listen to music when I write code and I think I'm not alone so I thought I'd share my favorite coding albums, songs and artists with you all.
I find instrumental music is the best to code to as it doesn't interrupt your thoughts the way lyrics can do. That's why I almost exclusively listen to jazz, classical music and soundtracks when I code.
Some of these albums are not instrumental but in a language I don't understand which is also ok :)
Obviously I use the absolutely brilliant Spotify so all these albums are available there.
Be the first to post a comment
New jQuery Plug-in
Published Tuesday 4th of January 2011
I recently wrote a little plug-in that helps with creating progressively enhanced Google maps.
The way it works is that you, as a user, create a static Google map using the Google Static Maps API and then simply run the plug-in on a parent-element of said static map which will in turn replace the static map with a dynamic one.
Setting up a static map is as simple as creating an img element and setting the src attribute to the static map API's URL:
<img src="http://maps.google.com/maps/api/staticmap?center=59.33961,18.080712&zoom=15&size=440x200&sensor=false&markers=59.33961,18.080712" alt="" />Doing it this way assures even users without JavaScript gets a map and you only have to do it once. The plug-in reads the attributes found in the src of the img and generates the JS-map based on those.
It's still in beta and doesn't support everything but do have a look.
Be the first to post a comment