Museo&Web patch html5 - it

Museo&Web è un CMS distribuito dal MiBact (con licenza GPL 2.0), il progetto ha la particolarità di fornire out-of the boxuna serie di moduli utili per musei, biblioteche, archivi, dipartimenti e centri di ricerca. È, inoltre, un buon esempio di investimento pubblico verso la collettività visto il codice aperto.

Link texts with images: Imbrex

Imbrex 0.0.1 alfa

View on Github --- Download

«Bent or curved tile like a half-cylinder used for gutters or for covering the junction of adjacent concave or flat tiles with upstands.»

Imbrex is a tool to manage collections of texts linked with images and vice-versa. It comes from TILE, Text-Image Linking Environment, but Imbrex has a new design, web oriented and centered on usability and user experience.

Colored roof tiles on top of the Cathedral of St. John in Milwaukee, Wisconsin By Dori CC BY-SA 3.0 us, via Wikimedia Commons

A Cocktail of technologies. 2016 Project

One year ago the PHP-MVC framework CodeIgniter code become a project of the "British Columbia Institute of Technology", during this year the new team released a new stable version.

v3, a Three Levels Validation Contact Form for Bootstrap

v3, or vCube, is a contact form that I just published on github.

The form has three levels of validation:

• Javascript Validation
• PHP Anti spam tests
• PHP Validation

Every configuration is in one configuration array, then the script builds the form, validates and sanitizes the data for you.

The script includes a library for js validation: Bootstrap Validator, a library for PHP validation: GUMP (which I added a couple of functions) and a plug-in for captcha.

vCube class makes cooperate the two classes:

• it builds the HTML to trigger the javascript 
• drives the data trought GUMP for server side parsing

Between these two steps v3 makes three anti-spam tests:

• is not a bot,
• hidden form field value,
• the form is compiled in a time range (2-3600 seconds).

See the web-page on Github: http://orazionelson.github.io/v3/

See the project page on Github: https://github.com/orazionelson/v3

HTML5, Not Just a Version Number (Part 1)

The number in HTML5 means something more than a mere version. It doesn't identify only a markup language but an environment, with, at least, three languages (HTML v.5, CSS v.3 and Javascript) in a pattern, surrounded by a collective strenght to share prototypes and best practices.
An ecosystem strongly oriented to provide web-services, born with a discreet awareness for the future of the web, the abstraction of users wants/needs and the background of the technology frustrations that troubled the Internet in the past decade.

UNITED WE STAND

Manage long keywods lists with Tokenfield for Bootstrap

Renewing the Flatnuke dashboard I had to find a solution to manage long lists of tags or keywords, I struggled for a while until I discovered Tokenfield; that's serendipity for nerds.

Awesome icons with Font Awesome

Font Awesome is an "iconic font designed for Bootstrap", the font contains 369 icons divided into a few main areas: Web Application, Form Control, Currency, Text Editor, Directional, Video Player, Brands and Medical.

Easter-eggs in CSS3 ... and a bit of jQuery

I know it's a bit late, Easter is gone but I'm still digesting tons and tons of casatiello (a delicious neapolitan salt cake) and coding is a good idea to help my stomach.

Ok, let's try to draw an easter-egg just using CSS3 and jQuery.

I need to obtain at least an egg, a ribbon and a cockade; everything has to be resizable with the page.

Append and Animate ONCE with jQuery on mouse action

Using jQuery you can see that appending a text portion or adding an animation to an element on the mouse passage (or on click) brings to an unpleasant loop effect. 

HTML5 frameworks an overview (part IV): let's ... Initializr

An html5 framework is a pre-built set of pages in html5 with a highly structured css/css3 and some enhances and features added by javascript, so it's not only html5 but concerns a set of technologies always more strictly integrated.

HTML5 frameworks an overview (part III): Twitter Bootstrap

An html5 framework is a pre-built set of pages in html5 with a highly structured css/css3 and some enhances and features added by javascript, so it's not only html5 but concerns a set of technologies always more strictly integrated.

HTML5 frameworks an overview (part II): HTML5Boilerplate

An html5 framework is a pre-built set of pages in html5 with a highly structured css/css3 and some enhances and features added by javascript, so it's not only html5 but concerns a set of technologies always more strictly integrated.

HTML5 frameworks an overview (part I): Skeleton

An html5 framework is a pre-built set of pages in html5 with a highly structured css/css3 and some enhances and features added by javascript, so it's not only html5 but concerns a set of technologies always more strictly integrated.

jliyn : Just Load If You Need, a jQuery method

Let's have a web page with some tabbed content, at least: a long text, a pic gallery and a video gallery.
The page loading could be very slow, so why charge all the content at the same time?

just load if you need

Onfly v1 - A fast and easy info system for mobile

Onfly is a lightweight solution to share info, messages, suggestions, skills or dictionaries; you can use it in your LAN or in Internet.

A fresh interface provides small suggestions, phone numbers and links on your smartphone or tablet.

An easy to use admin back-end (built on top of https://code.google.com/p/phpliteadmin/) helps to manage your messages.

Polaroid Gallery effect: tutorials and demos

I've always loved Polaroid photos, in the web there are several tutorials and demos to repeat their format and add some nice effects. Here's a small overview about the most interesting, for me:

A "Read more/Hide" link with jQuery

Sometimes you have long text and few space to show it, with jQuery and CSS is very simple to hide part of the text and create a "Read more" link.

jQuery: .hover()

The function .hover() resumes the methods mouseenter and mouseleave. Let's assume that we have an hidden div in our CSS:

#effect{display:none;}

jQuery: .clone()

The .clone() function is useful to copy a portion of code somewhere in a page.

jQuery: .load()

The load () function of jquery allows us to load a page (or a part of it) in an element.

Let's make an example with a link and an empty div:

hello!!

By clicking on the link we want to load a page in # description, simply call the load () function in this way:

$(function(){
  $('.itemlink').click(function() {
   $('#description').load('loaded.html');  
  });
});

Demo: