Connect With WRD
feed via e-mail
feed via e-mail

Archive for the ‘Goodies’ Category

Sharrre is a jQuery plugin that eases creating social sharing widgets for Facebook,Twitter, Google Plus, Digg and Delicious.

The plugin calls the social buttons on demand which is great for minimizing the number of initial requests and improving loading speeds.

Sharrre jQuery Plugin

Any type of custom designs can be created for the widgets (no need to use the default buttons provided by the social networks) and events(like, +1, tweet, etc.) can be fired up with the plugin's API calls.

P.S. Google Plus widget requires PHP to work (the PHP file is already included in the package).

A website toolbar is something that can beautify or uglify web pages depending on the solution used and how it is configured.

Skysa LogoIn order to improve the visibility of several things on WRD, last month, I have integrated, Skysa, a free-to-use (with paid plans) toolbar that can sit either in the header or footer of websites (check the footer>left of this page) and provides many features in a tiny space.

Skysa is loaded with many applications for social buttons, translating pages, content aggregating, announcements, polls, chat, games and more.

As the toolbar is highly-customizable, I have placed social buttons with the order I preferred, so readers would easily tweet, like or +1 WRD (and, it worked as expected, the amount of such social activities were much higher than the previous months).

Skysa Who is Online Map

And, with a minimalistic approach, only activated the social widgets, translate, "who is on" and scroll-to-top apps. Simply, the ones that will ease the way readers browse and use WRD.

The translate app is great, it remembers the choice of the reader and auto-translates any other pages that readers would visit. So as the "who is online". Besides an "online readers count", it displays them on a world map.

It is possible to track the usage on each application, how many times they are clicked, etc. and, from the statistics, I can easily tell that "they were actively used".

Skysa Stats

Skysa has an application gallery where you can browse, choose and activate quickly. Every app has its own customization options.

If you have a membership-based website, the app can integrate into that as well and use the profile info (name, photo, etc.) when needed.

For paid plans, it enables you to create custom applications, manage multiple toolbars and place ads inside it.

Also, worth mentioning, the color of everything inside the toolbar can be completely customized so that it will fit perfectly into any website.

Conclusion

The most exciting thing about a toolbar is its ability to "always staying inside the viewport". During this 1 month, Skysa proved me that it can help me use that space efficiently and it is a stable platform.

There is definitely a lot of room for improvement, new apps, more positioning options, etc. but Skysa is very solid at what it does. No problems faced during that month.

I can keep using the toolbar or not, but, if you in search of such a solution, I definitely suggest giving the application a try.

Countdown.js is a JavaScript library for calculating and displaying the timespan between two dates.

The library calculates the value continuously considering "the time goes on" and keeps generating an accurate output.

It can provide the timespan in many formats like milliseconds, seconds, minutes, hours, days, weeks and even millennias.

Countdown.js

There are methods for displaying it as an English sentence like "3 years, 6 months, 21 days, 10 hours, and 32 minutes".

The countdown can be reset easily and there are callbacks both on start and end.

If you are developing mobile web applications, you already experienced the difficulty of debugging them.

iWebInspector is a free tool for debugging, profiling and inspecting web applications that run on iOS Simulator (iPhone or iPad).

iWebInspector

The tool simply attaches the Web Inspector to any tab opened in Safari for iOS, to a chrome-less web app (full screen) or to a PhoneGap application.

It enables us to:

  • see and browse every element on your HTML element. You can change attributes, content and styles and see how they apply on Safari
  • see all the resources involved in this page, including Databases, Local Storage, Cookies and ApplicationCache
  • check all the network traffic on your website
  • see all your scripts, create breakpoints, watches and debug your JavaScript code.
  • record a timeline showing you rendering, scripting and loading times while you browse on Safari
  • profile your JavaScript code
  • audit your code, showing you a report on performance and other stuff
  • see and use the JavaScript console

Simply, a great addition for mobile developers.

jqPagination is a jQuery plugin for quickly creating a JavaScript-controlled pagination interface and functionality.

The plugin is controlled with the special class names and attributes of HTML elements (for defining the prev, next buttons or setting the max pages).

It has a pretty unique, simple-yet-functional feature which is the ability to clicking on the pagination item and setting the page to be displayed manually.

jqPagination

jqPagination has a single callback which is ran when a pagination request is made and returns the page number to be displayed.

Its design can be customized easily and the plugin degrades nicely when JavaScript is disabled.

  • Tags:
  • Filed under: Browsing, Goodies
  • 0 Comments
  • Sometimes, we need to display images that are bigger than the viewport or we have a limited space.

    PanoJS3 is a JavaScript widget that stitches together a set of tiled images and presents it with panning + zooming support.

    It is a very useful widget specially for displaying panoramic images, maps or huge documents.

    PanoJS3

    Besides the desktop, it also works on mobile browsers with touch interfaces (supports pinch to zoom and pan gestures).

    A simple map helps finding out the which part of the image is being viewed and it is possible to enable fullscreen mode with a click.

    selfoss is an open source and lightweight web application that can fetch content from any number of sources.

    RSS is the content type supported by default, however, with its plugin system, any new source types (log files, e-mails, etc.) can be implemented by adding a single class.

    selfoss

    The application has a simple-yet-functional interface which also supports navigating via keyboard.

    It is also flexible in means of the database used; you can either go with MySQL, SQLite or MongoDB.

    Player Framework is an open source video player framework for HTML5, Silverlight, Windows Phone and other platforms.

    It offers a JavaScript API for controlling the player where the API methods are the same on both the HTML5 and Silverlight versions.

    Such a consistency is very handy for using any of the versions as a fallback of the other with almost no extra coding.

    HTML5 Player Framework

    The framework has support for playlists using an array of media items or using a link to a media RSS feed.

    W3C timed text (TTML) for captions can be used and there are controls like volume, mute, fullscreen, poster-displaying.

    Player Framework is modular, can be extended easily and its look/feel can be customized using CSS.

  • Tags:
  • Filed under: Goodies, Media, Other License
  • 3 Comments
  • Many designers/developers were excited to see the launch of the jQuery Mobile ~a year ago and waited for the stable release to start building for mobile.

    With an announcement yesterday, the project officially reached to its first stable release.

    jQuery Mobile Stable Release

    jQuery Mobile already supports a huge set of mobile browsers, has the ThemeRoller for mobile and it is very well-documented with guides + examples for an easy start.

    The framework includes many widgets for (touch-optimized) mobile layouts: toolbars, buttons, pages/dialogs, content formatting, list views and forms. All built on jQuery core for a familiar and consistent syntax.

    IM.js is a JavaScript library that can find the differences between images very quickly.

    It scans the given images pixel-by-pixel using HTML5 canvas and outputs their similarity ratios.

    IM.js

    The developer has created IM.js for auto-testing the similarity of URL snapshots taken from different browsers which is a great idea for quickly finding out any rendering differences or problems. It can also be used for many other cases like detecting duplicate images.

    And, besides the ratio, it can create a canvas where the two different images are joined for easily seeing the differences at one sight.

    Uptime Robot
    feed-holder
    FeedBurner
    • aXmag - Flash Page Flip Magazine Software, PDF to Flash Converter
    • PSD to HTML
    • ManageWP
      PSD to HTML