web
jQuery UI - autocomplete
jQuery is a powerful javascript liberary, which dramatically simplify the manipulation of elements on a web page and much more.
jQuery UI is a set of user interface objects implemented by jQuery. jQuery UI contains an autocomplete widged which I find very useful.
To implement the widget:
- Download the jQuery UI liberary from http://jqueryui.com/download
- Place the needed javascript files on your web server. These files are:
- jquery.js
- jquery-ui.js
- jquery.ui.core.js
- jquery.ui.widget.js
- jquery.ui.autocomplete.js
- Add a script tag to the header of your page for each of these files, e.g.
<script type="text/javascript" src="js/ui/jquery.ui.autocomplete.js"></script>Wherejs/uiis the relative path to the folder where your files from previous point are located. - Add a javascript into you source code:
$(function() {
$( "#i1".autocomplete({
source: "data.php",
minLength: 1
});});
Wherei1is the ID of the input field you want to have autocomplete on. 'data.php' is the file responding to the queries of the widget.
E-Mail Filters
Many people get huge amounts of mail every day. It can be painful to sort, categorize and handle all those mails manually. Furthermore, it costs a lot of valuable time that you could spend elsewhere.
However, there is an automatic approach that can save you a lot of this time: E-Mail Filtering
<strong>Challenge:</strong>
<ul><li>Choose an E-Mail client (either desktop client or web mail)</li>
<li><strong>Create the following filters:</strong></li><li>a filter that automatically labels mails from tuwien.ac.at with "TU" or moves them to a folder called "TU"</li><li>a filter that sends unwanted mails (containing words of your choice) to the spam folder</li><li>a filter that marks e-mails containing the words "Knowledge Management" as important (e.g. by flagging or starring)</li></ul>
Taggings:
AutoComplete input box
For the improvement of user experience on a web site it is useful to provide a autocomplete element on some inputs. On the Internet there are many scripts available for download which implement autocomplete functionality. Unfortunately most of them are not functioning properly in all web browsers or have other important drawbacks - are not skinable, not flexible for different uses, etc.
We want to implement a good autocomplete widget which would not have all the mentioned disadvatages.
Embedding Google Calendar as iframe
Requirement: You will need a Google Account for this. You can create a new one here: https://www.google.com/accounts/NewAccount
- Go to https://www.google.com/calendar
- Click the down arrow right beneath the calendar you want to share and choose "Calendar settings"
- There is a row called Embed this calendar: Click on "Customize the color, size, and other options" to customize the calendar's style to your needs. (If you're familiar with HTML, you also can manipulate the HTML code directly.
- Now copy the HTML-Code to the Clipboard by pressing Ctrl+C (Mac: Cmd+C).
- And paste it into the source-code of your webpage (for example by using a web editor like Dreamweaver or a Blogging software like WordPress or Blogger).
Taggings:
Embed Calendar
When creating Blogs or Websites, it's sometimes helpful to have a calendar on the site. This is often needed to inform certain members of a group or organization about a schedule or certain events. While it can be painful to create a calendar on your own, there are online calendars which can be embedded into a webpage very easily.
Task:
<ul><li>Find an online calendar of your choice.</li>
<li>Learn how to embed this calendar into your webpage.</li>
<li>Try to customize color and size of the calendar.</li></ul>
Taggings:
Open Remote Tabs
Nowadays, there are many different browsers available. Sometimes we want or have to change between them because every browser has its advantages and disadvantages. Furthermore, at work, people often use a different browser (e.g. Internet Explorer) than at home (e.g. Google Chrome, Mozilla Firefox). Now, when coming home, there should be an easy way to re-open the tabs they had open at work or simply at a different location.
Every modern browser allows to open many tabs. However, it is not easy to move these tabs from one browser to another.
Challenge:
<ul><li>Find an <strong>easy</strong> way to open tabs in the browser of your choice that you recently opened in another browser.</li><li>Choose at least <strong>two</strong> different browsers to work with.</li><li>This should also work when the remote browser is already closed.</li></ul>
Taggings:
Improve accessibility of a website
For differently-abled people it is quite complicated to access content on the Internet. To improve this the W3C consortium issued a recommendation called WCAG - Web Content Accessibility Guidelines.
The <a href="http://www.w3.org/TR/WCAG10/">recommendation </a> defines 3 priority levels of the recommendations:
[Priority 1]
A Web content developer must satisfy this checkpoint. Otherwise, one or more groups will find it impossible to access information in the document. Satisfying this checkpoint is a basic requirement for some groups to be able to use Web documents.
[Priority 2]
A Web content developer should satisfy this checkpoint. Otherwise, one or more groups will find it difficult to access information in the document. Satisfying this checkpoint will remove significant barriers to accessing Web documents.
[Priority 3]
A Web content developer may address this checkpoint. Otherwise, one or more groups will find it somewhat difficult to access information in the document. Satisfying this checkpoint will improve access to Web documents.
However a lot of websites does not fulfill even the Priority 1 recommendations. We want to find a client-side solution for altering of such pages for the people with special needs.
Access Database 2010 Portability
There is a case with a very small company that has recently operated from a database in Access 2010 made in two layers (database programs and link to another database with the data.)
They would be interested in its portability to the web. The question is:
Given that the number of users are few, up to 5 or 6. Sharepoint, web services, MS Office Comunications Server 2007 ... What technology / platform would be well, to use logic layer (the program) and link the db on the server? (Customer has a Windows 2003 server and fixed IP).
Spam-Protect web forms
Spam is not only a problem for emails, but more so for web forms. Bots from spammers try to fill out forms all over the internet. But unlike in your email inbox, the data from your web forms normally does not get spam filtered, which makes spam in these cases an even bigger problem.
The goal is to add spam protection (CAPTCHA) to your web forms to make sure only humans fill in and submit the form.
Download Flickr Favorites
The prominent foto and video sharing website flickr.com hosts billions of photos. For me, it is a fascinating and simple way of getting inspiration in a very visual way. I thereby use tags for searching, e.g. „holiday austria“, scan through the individual search results and mark those pictures as favorites which I really like. This way, I selected over 2200 fotos as beeing favorites to me. The process of marking those favorites consists of a single action, a click on the little star icon, located over the top left of each foto in the individual foto view. Being best practive with web services, flickr provides nice URLs for its users (e.g. http://www.flickr.com/photos/stefanl/) and it also provides nice URLs for a users favorites (e.g. http://www.flickr.com/photos/stefanl/favorites/) but since flickr is an online service, photos marked as favorites remain at the accounts of their respective owners and are only „embedded“ to the selecting user. There are quite a few use cases where you want to export (in my case, exporting is equivalent to downloading, without special treatment of eventually available metadata) several or all of those favorites. You may want to create a beautiful screensaver, make prints of those fotos, etc. To my knowledge, flickr doesn‘t provide an easy way to achieve this on their website. I put a lot of effort into my collection of favorites, regularly use them for brainstorming and inspiration and I simply want an offline backup.
Pages
