Sk-etchbook

Source: JavaScript Essential Training (2007) - Lynda.com

OK today's challenge. I'm looking to store and retrieve data, specifically testimonials. I've done this before with Flash but am now looking to do it with PHP alone.

Initially my intention was to store data to an array. This doesn't seem suitable now as I need to retrieve the data and display the name separately, from the review and also display a shortened extract of the reviews on other pages. Concatenating the review is no good as this can crop the paragraphs in unsuitable places.

I decided the best option is to save form data to a MySQL database. Then a separate field for name, extract & full review can be given.

I not an expert so I'm making this up on the fly! Here's a few resources...

How to Access a MySQL Database Using PHP

Inserting Data Into a MySQL Database using PHP

Storing User Submitted Data and Files in MySQL

MySQL Docs

I received an email today saying our portfolio is no longer working on our website?

The portfolio in question was powered by Flickr and displayed using a Javascript lightbox. This was a pretty nifty way of giving clients a low cost and user friendly way of uploading image files.

Upon checking I found this message on Flickr:

As of today, flickr pages displayed in an iframe break out and replace the entire page. This breaks my flickr app Discussr. Is there any particular reason for this change? It seems pointless and rude to me.

It seems like they've upset a few people by doing this. Not giving any advance notice certainly didn't help matters.

The main reason given is that they don't like having their content framed in other sites. They've never liked it. It doesn't drive direct.

I don't see what the problem was, Flickr branding was plastered all over the slideshows anyway so viewers still knew who was powering things.

Looks like I've got some fixing to do. A few options of app are given in the thread, I'll look into them.

Over the past few months I've been predominantly focussing on developing my Javascript and jQuery competence.

Functions are a very powerful and efficient way of grouping, executing and reusing code. They're a standard part of many scripting and programming languages including Javascript, Actionscript and PHP so getting familiar with the syntax and how they work can be very rewarding.

There are two stages to any function; declaration and invocation. Imagine this to be an author-reader relationship, the latter utilising information created by the former. Highly effective as you only need one author to satisfy millions of readers.

The basic structure of a function declaration is as follows.

function nameOfFunction(listOfVariableNames) {
  code to be executed goes here
}

And to invoke (or call) a function you would place the following code wherever required:

nameOfFunction();

Or for functions with variable parameters you would call as follows:

nameOfFunction(listOfVariables);

Pretty simple. This is all you really need to know to start using functions.

They're are further ways of achieving similar results and you can also assign functions to variables in some languages. See one of these links for more information about a specific language.

Javascript | Actionscript | PHP

I received this from Google Apps. Great move is all I can say, I like many developers have dropped support for IE6. It can add a ridiculous amount of time to projects just because a few people don't know how to or are scared of updating. It's not complicated to click on a button and make people move with the times.

Evolve or be fossilized...

Dear Google Apps admin,​

In order to continue to improve our products and deliver more sophisticated features and performance, we are harnessing some of the latest improvements in web browser technology. This includes faster JavaScript processing and new standards like HTML5. As a result, over the course of 2010, we will be phasing out support for Microsoft Internet Explorer 6.0 ​as well as other older browsers that are not supported by their own manufacturers.

We plan to begin phasing out support of these older browsers on the Google Docs suite and the Google Sites editor on March 1, 2010. After that point, certain functionality within these applications may have higher latency and may not work correctly in these older browsers. Later in 2010, we will start to phase out support for these browsers for Google Mail and Google Calendar.

Google Apps will continue to support Internet Explorer 7.0 and above, Firefox 3.0 and above, Google Chrome 4.0 and above, and Safari 3.0 and above.

Starting this week, users on these older browsers will see a message in Google Docs and the Google Sites editor explaining this change and asking them to upgrade their browser. We will also alert you again closer to March 1 to remind you of this change.

In 2009, the Google Apps team delivered more than 100 improvements to enhance your product experience. We are aiming to beat that in 2010 and continue to deliver the best and most innovative collaboration products for businesses.

Thank you for your continued support!

Sincerely,

The Google Apps team

http://www.tripwiremagazine.com/2009/12/45-incredible-jquery-plugins-making-images-more-dynamic-and-elegant.html

Galleries

http://devkick.com/lab/fsgallery/

http://tympanus.net/codrops/2009/09/13/dynamic-jquery-image-gallery-with-uploader/

http://fancybox.net/

http://www.serie3.info/s3slider/demonstration.html

http://www.buildinternet.com/project/supersized/

http://eyecon.ro/spacegallery/

http://highslide.com/

http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

Carousel
http://www.dynamicdrive.com/dynamicindex4/stepcarousel.htm
http://jqueryfordesigners.com/jquery-infinite-carousel/

Panoramic & Tours
http://www.openstudio.fr/jQuery-spherical-panorama-viewer.html?lang=en
http://www.openstudio.fr/jquery-virtual-tour/salleformation.html

Wrap text

http://jwf.us/projects/jQSlickWrap/

Move / Scrolling / Sliding

http://buildinternet.com/2009/03/sliding-boxes-and-captions-with-jquery/
http://flowplayer.org/tools/scrollable.html
http://cssglobe.com/post/5780/easy-slider-17-numeric-navigation-jquery-slider

Cookies. You hear about them quite a bit, but what are they?

Cookies are itsy bitsy little text files stored on your computer and put there by a website you visited. They are generally useless to anyone except the pubisher (the visited website) and can only be read by them.

Cookies save details specific to you so the data does not need to be stored by the website.

They are, in short, a prefernce file with a silly name. Netscape invented the tecnology in the mid 90's and named them afer a comic "The Magic Cookie".

Here's a nice and very straigt forward guide to creating your own themes:

WPDesigner.com - so you want to create Wordpress themes huh?

Wordpress is great! It's just so very simple to use and intuitive. I'm leaning about creating custom themes and Wordpress based websites. There is a nice tutorial here on Geeks are Sexy telling you how to set up locally. I'm using WAMP instead of XAMPP but the process is the same.

It's always the little things. In the world of web design the things which you would expect to be simple and obvious seem to cause the most pulling out of hair and raised stress levels.

Like a simple request to provide Letterheads in Microsoft Word format.

Luckily however I've already battled this foe.

Here's a great tutorial on how to do this...

This popped up at the top of a search listings the other day.

http://www.google.com/explanation.html

This got me thinking. In a society of free speech and via a medium which is difficult, nigh impossible to moderate what kind of filtering is actually going on in search results? I image specific words are filtered out for the purpose of safe searches but filtering of obnoxious and offensive opinions can not be simple.

Furthermore should it be done? In a developed society surely all are entitled to their opinions. It would be the responsibility of the offender to justify his stance point yet to refrain from persisting to the point of forcing their unwelcome views on others. The offended then should equally respect the offenders view and not take offence. Rather it is the offendeds responsibility to offer their contrasting opinions and justify them. Disagreement is likely but should be respected.

Total comprehension and through understanding of any situation or element requires complete information. Positive, negative, objective and subjective.

There is a limit of course when these views are acted upon where it does become immoral, turns to bullying and can degrade the quality lives however this is not the topic here.

To me, offensive opinions are not offensive. They are mealy the results of the individuals life experiences and the influence of their exterior. A mind ravaged with hate and anger is the worse prison of all. There are no bars, no doors and no windows. You remain trapped for as long as they exist.

Would it not then be the right thing to help these people escape their prisons. Censorship and condemnation has no positive returns.

The manifestation of conciousness at a sentient level is a truly miraculous thing. We all possess the ability to manage, construct and reconstruct our own realities, our personalities and perceptions can be moulded. The only way to overcome the negative aspects of our own psyches to to question our beliefs. Questions which sometimes need to be offered others.

Negative, spiteful opinions towards generalised groups or stereotypes, even ones based on our own experiences or "what we have been told" are nothing more than childhood monsters.

What may initially appear to be a hideous, evil and scary monster lurking in the darkened corner of your room turns out to be nothing more than teddy bear once viewed in the light.

Freaky little article here on Wired. Looks like in the future technology really will be getting under your skin.

Permalinks are them squiggly wiggly long strings of letters/numbers/characters which point to the informative tit-bit of which you peruse.

Anyway. More often than not they look like nonsense and drivel. Here is a bit more info on how to make Worpress links a tad more easy in the eye:

http://codex.wordpress.org/Using_Permalinks

Time to move on from them handy little HTML form generation apps and tools and learn what's involved in writing them myself.

Yes, indeedy-doo.

Creating the actual HTML form is the easy part. This can be done by any old bean with a pair of hands, it's pretty simple coding and even easier select-from-drop-menu simple if you use Dreamweaver.

The complicated part is collecting the data from the forms and doing something with it. Now I am still a PHP novice so this was also a learning experience on this level.

Here's some good tutorials on the subject:

The Site Wizard

PHP.net

w3schools

This is an extract sent out by leading recruitment acency Reed:

A recent study suggests that over 50% of employers think the jobs market is overrun by jobseekers with academic qualifications and 68% think not enough candidates have practical skills and vocational qualifications.

This research is supported by recruitment specialists who attended a recent debate on the state of the graduate market. One of the main outcomes was that may graduates lack soft skills and doing a year of traveling might be a better option then continuing in education and doing a masters degree.

There is an emphasis on both schools and employers to provide better training on soft skills like team working, leadership and social skills.

If you are looking to improve on your soft/practical skills then voluntary work is a great way to do so. Why not browse through reed.co.uk's 'benefits of volunteering' or start searching for voluntary jobs now on reed.co.uk.

Internships also provide a great opportunity to upgrade your skills and it has been recently announced that a host of Premier League clubs, including Chelsea, Everton and Sunderland, are on the look out for new interns.

Adobe recently announced that Flash CS5 will support the creation of iPhone applications.

Read more on this fromAdobe News or Labs.

Is this a good thing or will it create a flood of badly designed badly thought out, generally bad apps?

The iPhone experienced phenomenal success however, now the other communications companies are coming out with their own versions (copycats!) they do need to be evolve in some manner.

Is opening up the platform the best approach, will this lead to a greater amount of good quality, useful or entertaining apps. Are Apple hoping to generate a new interest in the iPhone and cling to their market share or are they ahead of the game, do they have something better up their sleeves.

It seems a logical move anyway whatever their motives. Be it to maintain market position or just that there's no longer any benefit to restricting the development environment.

The one thing I am sure of is that the overnight iPhone app millionaires are a thing of the past, well, at least to the same degree. I'm sure as with anything there is always the potential to make money however with a growing number of handhold platforms and easier ways to develop for them the competition has never been so tough.

I imagine Apple will need to take a look at the way apps are sold in iTunes if the number does grow exponentially. Just look at Youtube, a vast amount of media which is made useful because of the effective and intuitive search functionality. To date iPhone app search functionality is not the greatest.

This is pretty entertaining!

Until recently I belonged firmly to the camp of believers disillusioned that mobile phones could simply be targeted like so:

<link rel="stylesheet" type="text/css" media="handheld" href="styles.css">

Unfortunately this may have been true at one point, prior to the advent of smart phones, specifically iPhones. It seems as though the death of the handheld style sheet was forecast even before these little beauties hit the shelves. As far back as 2007 the matter is discussed here on Green Beast and also, giving more weight to CSS3 and Opera Mini here on Russel Beattie and Unintentionally Blank.

The issue has arisen due to the fact that the new smart phones aim to give users the full browsing experience. So no need for limiting the amount of images or layouts used, no need for a handheld style sheet.

Or is there?

Just because you can doesn't mean you should. The user may still have limited bandwidth or not gain anything from seeing scaled down versions of your pretty images. They may even have the browser set to mobile browsing.

So whats' the answer?

As usual, no sooner then one source is pronouncing the death another is declaring the return. There is a very good article here on A List Apart covering this very subject.

Hence the solution is yet again down to common sense. What is the site in question like, is it graphically rich, layout or Flash dependent. If so then it may be beneficial to offer a handheld style sheet for non-smart phones and devices or smart phones browsing in mobile-web mode.

However, problem not solved. Mobile browsers still aren't as fast at rendering as desktop versions, the user could be using 3G or using low bandwidth Wi-Fi. You may just think that zooming in on sections of your page destroys the aesthetics anyway so there is no point on serving up full screen versions to tiny little screens.

If this is the case then handheld style sheets are useless. iPhones and other smart phones ignore them.

Therefore, to target these devices you need to use CSS3 media queries.

The solution given on Code Cookbook is:

<!--[if !IE]>
<link media="only screen and (max-device-width: 480px)"
    href="iPhone.css" type="text/css" rel="stylesheet" />
<![endif]-->

However there are a few comments saying this technique does not work so you may want to try Googling it for yourself. Here is another article to start you off.

Just came across a nice little tip here.

Preloading images is an important factor in providing streamlined and enjoyable user experience. Avoid, waits, flickers of broken image links and general ugliness with this simple CSS:

#preloader {
   /* Images you want to preload*/
   background-image: url(image1.jpg);
   background-image: url(image2.jpg);
   background-image: url(image3.jpg);
   width: 0px;
   height: 0px;
   display: inline;
}