Today websites are full of events (new mail, new chat-message, content update etc.). Often it is not enough to indicate this events only visually to get user attention. You need sounds! Ion.Sound library, made for playing small sounds, will help you with this task.
Ion.Sound is a jQuery plugin for playing sounds on events. It has been tested on Google Chrome, Mozilla Firefox, Opera, Safari, IE(9.0+) and mobile browsers. Ion.Sound freely distributed under terms of MIT licence.
Requirements: jQuery Framework
Demo: http://ionden.com/a/plugins/ion.sound/en.html
License: MIT License
Succinct is a tiny jQuery plugin for truncating multiple lines of text. It shortens your text to a specified size, and then adds an ellipsis to the end. You can specify the elements that you would like to truncate as a selector, and then set the size parameter to the amount you would like to see.
Requirements: –
Demo: http://micjamking.github.io/succinct/
License: MIT License
Codrops has shared an article: Medium-Style Page Transition, which teaches how to achieve Medium’s next page transition effect—an effect that can be seen by clicking anywhere on the “Read Next†footer at the bottom of the page. This effect is characterized by the lower article easing upward as the current article fades up and out.
Requirements: –
Demo: http://tympanus.net/Tutorials/MediumStylePageTransition/
License: License Free
Bulletproof Email Buttons Generator helps you design gorgeous buttons using progressively enhanced VML and CSS. You can change the background text, background image, background color, border width and color easily as well. You can also create rock-solid background images in emails too.
Requirements: –
Demo: http://www.campaignmonitor.com/resources/buttons/
License: License Free
When the user pushes the “?” key, QuestionMark.js triggers a modal window that displays keyboard shortcuts for your app — similar to what happens on Twitter, Gmail, GitHub, etc. Hat tip to Robert Nyman. The modal is removed when the ESC key is pushed or the user clicks behind the modal.
Keyboard shortcuts for web applications are pretty useful. This could also be a generic ‘help’ menu for the pp, but that would require some tweaking to the code and the CSS. For now, this works primarily as a shortcut keys menu.
Requirements: JavaScript Framework
Demo: http://impressivewebs.github.io/QuestionMark.js/
License: License Free
WP Test is a fantastically exhaustive set of test data to measure the integrity of your plugins and themes. The foundation of these tests are derived from WordPress’ Theme Unit Test Codex data. It’s paired with lessons learned from over three years of theme and plugin support, and baffling corner cases, to create a potent cocktail of simulated, quirky user content.
Requirements: WordPress
Demo: http://wptest.io/
License: GPL License
Fast Image Cache is an efficient, persistent, and—above all—fast way to store and retrieve images in your iOS application. Part of any good iOS application’s user experience is fast, smooth scrolling, and Fast Image Cache helps make this easier.
A significant burden on performance for graphics-rich applications like Path is image loading. The traditional method of loading individual images from disk is just too slow, especially while scrolling. Fast Image Cache was created specifically to solve this problem.
Requirements: iOS Application
Demo: https://github.com/path/FastImageCache
License: MIT License
ifvisible.js is a crosbrowser & lightweight way to check if user is looking at the page or interacting with it. It can handle activity states too, such as being IDLE or ACTIVE on the page. You can manually trigger status events by calling them directly or you can set events with their names by giving first argument as a callback. You can also set your smart intervals with ifvisible.js, if user is IDLE or not seeing the page the interval will automatically stop itself.
Requirements: JavaScript Framework
Demo: http://serkanyersen.github.com/ifvisible.js/demo.html
License: License Free
Resumable.js is a JavaScript library providing multiple simultaneous, stable and resumable uploads via the HTML5 File API. The library is designed to introduce fault-tolerance into the upload of large files through HTTP. This is done by splitting each file into small chunks. Then, whenever the upload of a chunk fails, uploading is retried until the procedure completes. This allows uploads to automatically resume uploading after a network connection is lost either locally or to the server. Additionally, it allows for users to pause, resume and even recover uploads without losing state because only the currently uploading chunks will be aborted, not the entire upload.
Resumable.js does not have any external dependencies other than the HTML5 File API. This is relied on for the ability to chunk files into smaller pieces. Currently, this means that support is limited to Firefox 4+, Chrome 11+ and Safari 6+.
Requirements: –
Demo: http://www.resumablejs.com/
License: MIT License
We’ve recently released a simple & powerful WebGL 3D engine named Babylon.JS: a complete JavaScript framework for building 3D games with HTML 5 and WebGL While he was writing his engine, we’ve built a small team made of Pierre Lagarde, Sébastien Pertus, Michel Rousseau and I to imagine a framework on top of Babylon.JS to help developers building games in a very simple way. This framework is named Babylon.GameFX and mainly targets people that are not very comfortable with some 3d gaming concepts and don’t consider themselves as 3d gurus. But it could be useful also for more advanced developers as we’ve tried to implement some boring tasks for you also. By the way, if you’re a 3d beginner, you should have a look to this series: Tutorial series: learning how to write a 3D soft engine from scratch in C#, TypeScript or JavaScript
Pierre and I have just finished a v0.1 of the client part. You can download it from Github: BabylonJS.GameFX & you can find some simple samples on our website: http://gamefx.babylonjs.com/
Sébastien has almost finished a back-end set of APIs to help you handling a leaderboard in a near future. We’ll then talk only about the client part here.
By the way, please note that we’re mainly working on this framework on our part time and that v0.1 means that this is far from being completed. So, please be kind with us if everything is not perfect yet :) But we’d like to start sharing with you what we’ve done so far, listen to your feedbacks and continue/enhance it in the next weeks. We will then iterate with your feedbacks in the next releases.
In this first tutorial, we’re going to see how to use the main features we’ve shipped. By following this tutorial, you’ll be able to create the following result in less than 30 lines of code:
Read the rest of this entry »
