return true

FHA Mortgage Rates WordPress Widget

2010-03-15T09:01:00.000-07:00

I have recently developed a new WordPress widget named "FHA Mortgage Rates". Once installed, it provides you a customizable widget which you can drag into your sidebar, showing daily updated mortgage rates for you readers. The plugin can be useful for real estate related blogs. You can customize it's color scheme and size to match your weblog's look.

Installation

1. Download plugin's ZIP file and extract archive's content into wp-content/plugins directory.
2. Activate the plugin through WP admin screen.
3. Go to the widgets page of WordPress admin screen and drag "FHA Mortgage Rates" widget onto your sidebar.
4. Done! Use and enjoy it!

Troubleshooting

If you have any suggestions regarding to plugin's functionality, or find a bug, please don't hesitate to write about it in the comments to this post.

Download

Will be available soon on WordPress plugin repository.

My new weblog

2009-11-13T23:54:00.000-08:00

Links for nerds - my new weblog where I collect links different technology-related news.

Sorry

2009-09-24T23:21:00.000-07:00

There are some problems with WordPress plugin repository, so currently I cannot commit some critical changes. I am really sorry.

PDF and PPT Viewer - WordPress plugin for embedding documents to your posts

2009-09-15T07:22:00.000-07:00

Recently Google published Google Docs undocumented feature that let us embed PDF documents and Power Point presentations to the webpages. Surprisingly this document viewer isn't created with Flash. All the user need to view documents is ~~love~~ JavaScript. Of course I couldn't ignore this cool feature and created WordPress plugin that let you embed PDF and PPT documents to your posts. The plugin is called PDF and PPT Viewer.

Installation

Upload pdf-ppt-viever folder to the /wp-content/plugins/ directory.
Activate the plugin through the 'Plugins' menu in WordPress.

Basic Usage

It's extremely easy to use PDF and PPT Viewer. Just start writing a new post. Then, when you need to insert PDF or PPT file to your post, press Add Media button above WYSIWYG editor. Then go to the desired tab and insert a file to the post in a usual manner. If this file is a Power Point presentation or PDF document, the plugin will determine it automatically and do the rest of work for you. As a result you'll get the file embedded to your post in the manner that is shown here. Note that if you insert the file from your media library, you should set Link URL to the File URL.

You can set size of the viewer to fit the theme that you use. Go to Settings -> Miscellaneous in the WordPress menu and set corresponding values in the PDF and PPT Viewer settings section.

Advanced usage

PDF and PPT Viewer supports shortcodes. It means that you can write code like [pdf-ppt-viewer href="document_uri" width="viewer_width" height="viewer_height"], e.g. [pdf-ppt-viewer href="http://infolab.stanford.edu/pub/papers/google.pdf" width="400" height="500"], which will embed PDF or PPT document to your post. All arguments, except href, are optional. By default, widht and height of the viewer are set according to blog settings. Using this way of embedding documents, you can save your time and have a better control over viewer's size.

Supported platforms

PDF and PPT Viewer supports all modern browsers. The plugin doesn't require installation of non-standard PHP extensions on your server, so you will not have problems with your hosting provider. PDF and PPT Viewer works with WordPress 2.8 and higher.

Resources

PDF and PPT Viewer in WordPress plugin directory

Download

Good luck!

Learn the basics of jquery with our CISSP dumps. Download 642-902 dumps to learn how to create jQuery plugins and become expert using 70-640 dumps.

Media Finder - WordPress plugin for searching images and video

2009-09-10T03:56:00.000-07:00

Do you like WordPress? I do. This engine probably doesn't have the best architecture, sometimes its code is just awful, but its agility and excellent user interface attract lots of users around the world. I decided to contribute to the development of WordPress community and wrote a plugin Media Finder.

This plugin helps you find images and video on Flickr and YouTube quickly and easily and insert them to your post with one click. A lot of readers find posts with illustrations more interesting in comparison to the text-only posts. But we often don't have necessary illustrations which fit the subject of our posts. Here Media Finder can help you. It lest you find mediafiles on the largest storages of video and images on the internet, and illustrate your posts with them.

Installation (will take no logner than a minute)

Upload media_finder.php file to the /wp-content/plugins/ directory.
Activate the plugin through the 'Plugins' menu in WordPress.

Usage

It's extremely easy to use Media Finder. Just start writing a new post, then, when you need to insert image or video, press Add an Image / Add Video button (above the text editor) and go to Search tab on the opened window. After that enter the search query and press Enter. You'll see search results pretty soon after that. If you've searched for images, then in addition to inserting to the post, you can view it's larger version. And if you've searched for video, you can view larger version of the preview image and watch the video. And that's it!

UPD: From the version 0.0.2 I have added 2 options for the images search. First, you can specify the order of the images - by relevance, publication date or interestingness. Second, you can choose the license, end Media Finder will search only for images that support the chosen license. Thanks to iCounsellor who suggested this feature. In addition, all images that you insert to your post are by default linked to the author's photostream, because Creative Commons license requires it, but you can change it easily, if you want.

Supported browsers

FF2+, IE6+, Opera 9+, Google Chrome.

Web hosting support

Media Finder requires curl PHP library to be installed on your server. As an alternative, allow_url_fopen flag in php.ini flag should be set to 1. Don't worry, most fo the servers have the required library installed. If not, contact your hosting provider support service.

Support of different WordPress versions

I have tested Media Finder using WordPress 2.8.4, but earlier versions can also work. You can install the plugin and check whether it's compatible with your version of WordPress. Media Finder doesn't use database and doesn't make any unalterable actions, so you won't have trouble even in case of incompatibility.

UPD: Media Finder works with WordPress 2.7 and higher.

How you can help

Just use Media Finder.
If you like it, tell your friends or write a little post about it.
If you find a bug or have an idea that will help to improve the plugin, write about it here in the comments.
If you think you can improve design or functionality of the plugin and you wish to do it, I'll be glad to collaborate with you. Write to Kadalashvili at Vladimir at gmail dot com.

What I am planning to do

Of cource, I am planning to fix bugs as soon as possible. In addition, I am going to test the plugin for compatibility with earlier versions of WordPress. I am also going to add some options for search, for example, sorting the results by date, relevance or popularity. If you have some ideas about adding new features, please share them.

Resources

Media Finder on WordPress plugin directory
Download
Happy blogging!

SexyCombo 2.0.7 released

2009-07-31T00:48:00.000-07:00

I have just released new version of SexyCombo jQuery plugin. This release was very productive. I have fixed all (I hope) bugs related to IE6. dropUp config option is now deprecated, the plugin can determine whether option list should go down or up automatically. Some minor changes related to usability were also made.

Must read!!!

2009-04-03T03:01:00.000-07:00

11 jQuery Plugins to Enhance HTML Dropdowns - a great article about jQuery plugins that can customize default selectboxes. Must read!!!

Sexy Combo jQuery plugin

2009-02-24T06:18:00.000-08:00

Introduction

Sexy Combo is a jQuery plugin that allows you to turn default browser selectboxes into much more attractive and usable comboboxes. The user can choose whether to select option from the dropdown list or just type it. This widget reaches its maximum efficiency when we have selectboxes with lots of options (e.g. countries or states), so it would be difficult for users to find option in the huge list.

The plugin is usable not only for end users, but also for developers. Sexy Combo has a lot of configuration options so you can modify its behaviour and appearance. FRom this version the core CSS file is separated from the CSS that provides combo's appearance, and now you are able to easily create new skins for the plugin.

Examples

Please view demo page to see the possibilities of Sexy Combo.

Installation

Please follow these instructions to install Sexy Combo:

Download and unpack the archive.

Include jQuery and plugin files to your web page:

 <script type="text/javascript" src="path_to_plugin/lib/jquery-1.3.2.js"></script>
 <script type="text/javascript" src="path_to_plugin/lib/jquery.sexy-combo-2.0.js"></script>

Include core and skin CSS files to your page:

     <link rel="stylesheet" type="text/css" href="path_to_plugin/lib/sexy-combo.css" />
     <link rel="stylesheet" type="text/css" href="path_to_plugin/skins/skin_name/skin_name.css" />

Done! Now make your selectboxes look and behave sexy! $("select").sexyCombo();

Usage and configuration options

Sexy Combo has a number of configuration options that are passed to the plugin in the form of JavaScript object, e.g. $("select").sexyCombo({triggerSelected: true});. The full list of options is:

(string) skin - name of the skin that will be applied to the combobox. Default is "sexy"
(string) suffix - this option allows you to configure text input's name. The suffix will be appended to the name of the selectbox. Default is "__sexyCombo".
(string) hiddenSuffix - the same as previous, but for the hidden input. Default is "__sexyComboHidden".
(string) initialHiddenValue - the initial value of the hidden input of the combo. Default is "" (empty string).
(string) emptyText - if provided, will be shown when an empty text input has no focus.
(bool) autoFill - if true, user's input will be autofilled with the value of the first item of the dropdown list. Default is false.
(bool) triggerSelected - if true, the selected option of the selectbox will become the initial value of the combo. Default is false.
(function) filterFn - a filter function that determines which options should be in the dropdown list. This function takes two parameters - current text input value and dropdown list item's value, and should return true if item should be in the dropdown list, otherwise false. Default is null.
(bool) dropUp - if true, the dropdown list will appear above text input. Default is false.

It is possible to create multiple comboboxes from which users can choose more than one option. All you need is to set "multiple" attribute of your selectbox to true, or set multiple config option to true if you create combo without selectbox. Currently this option does not work with autoFill config option. It will be fixed in one of the futute releases.

You are also able to create combos without using existing selectboxes. If you want to do this, you should use static method of jQuery.sexyCombo object named create, for example:

      $.sexyCombo.create({
          id : "id",
   name: "name",
   container: "#container",
   data: [
       {value: "1", text: "First option", selected: true},
       {value: "2", text: "Second option"},
       {value: "3", text: "Third option"}
   ]
      });

Below is the list of configuration options for static creating of comboboxes. You can pass them to the create method together with options we have discussed above.

(string) name - the name of the selectbox that will be created. Optional. Default is "" (empty string).
(string) id - the id of the selectbox that will be created. Optional. Default is "" (empty string)
(mixed) container - jQuery selector, jQuery object or DOM element that will hold the widget. Optional. Default is $(document).
(array) data - data that contains information about combo's options. This is an array of objects, which should have three properties - value(value of the option) and text(text that is displayed for this option) and (optionally) selected (if set to true, option's "selected" attribute will be set to true. Makes sence only with triggerSelected config option set to true). This option is required.
(string) url - the URL of JSON object that contains data for combo's options. Object's format is the same as for data option. If specified, data option will be ignored.
(object) ajaxData - data that will be passed to AJAX request.
(bool) multiple - if true, the combobox will be multiple. Default is false.

Appearance customization

In this version I have separated core CSS and presentational CSS, so now it's possible to create new skins for Sexy Combo. The download package contains one example skin. Feel free to create your own based on it.

Browser compatibility

Sexy Combo has been tested and works on the following browsers:

Internet Explorer 6 (PC)
Internet Explorer 7 (PC)
Firefox 1.5 (Linux)
Firefox 2 (Linux)
Firefox 3 (PC)
Opera 9 (PC)

Support project

Every user of Sexy Combo adds some value to it, so you help me by just using it. However, if you want to help more, you can do the following:

Tell the world about Sexy Combo. You can write an atricle or a blog post about it or just tell your friends/collegues about it.
Test it on browsers that are not currently supported "officially".
Report a bug.
If you are web designer/developer, I will be glad to collaborate with you. If you have some suggestions on design/programming, feel free to email me at Kadalashvili at Vladimir at gmail dot com.

Please don't donate money, it's needless.

Want to hire JavaScript programmer?

Please view my CV

Resources

Sexy Combo on the Google Code
Sexy Combo in jQuery plugins directory.
Demo page

Learning of jquery-plugin is simple and easy with our 70-680 dumps and SY0-201 dumps. Learn JQuery to create impressive client-side-based user interface components using 642-813 dumps.

My CV

2009-02-24T04:44:00.000-08:00

Vladimir Kadalashvili

Address:

Uzbekistan, Tashkent, Karasu 3, 13, 73

Email: Kadalashvili.Vladimir@gmail.com

Phone: +998903288184

Weblog: http://vladimir-k.blogspot.com

Skills

Programming languages:

PHP, JavaScript, Python, SQL

Databases:

MySQL only. I like to write fast and well-optimized SQL queries. I can also study another database engines if needed.

Markup languages:

XHTML, CSS, XML, XPath, RSS, Atom

Frameworks:

Zend Framework (PHP), Django (Python), jQuery, jQuery UI, Prototype, scriptaculous, ExtJS (JavaScript), Blueprint (CSS)

Frontend development:

Producing standards-compliant and cross-browser XHTML / CSS, understanding concepts of semantic XHTML, ability to make layouts without using tables. Very strong knowledge of writing clean, cross-browser JavaScript. A great experience of working with jQuery (my favourte JavaScript library). I have also some experience with Prototype, but I don't like it so much. Like to use Blueprint as a CSS framework, but able to make layouts from the scratch.

Backend development:

Have a great experience with PHP, my current duties include PHP coding. But I like Python mostly, it's the most beautiful language I think. But I have no a lot of experience with Python.

Coding:

I like to write code for both computers and humans. Have a strong sence of what I call "beautiful code", and I like tools that can help me to produce such a code - jQuery, for example. Have a strong habit to write self- and well-commented code.

Web security:

Understanding the concepts of web security, preventing SQL injections, XSS, DOS attacks. Strong habit to validate user input and log everything.

CMS / Publishing platforms:

WordPress, Drupal, Joomla. Writing plugins / creating themes.

APIs:

Twitter API, Google Chart API, Facebook API, Goolge gadgets API.

Operating systems:

Windows XP, Linux. Prefer working in Linux.

IDEs:

Zend Studio, Macromedia Dreamweaver.

Experience

I am currently working for Witamean web studio. Current duties include writing PHP / JavaScript / CSS code. I have worked at this company for 1.5 years.

I am also developing a number of small open-source projects, so you can evaluate my coding skills. These projects are:

Sexy Combo - my favorite and most successful jQuery plugin (more than 1000 downloads from Google Code only). It'sa widget that aims to replace default browser selectboxes - users can not only select values from the list, but also to type them. Nice, usable, customizable, object-oriented. You are strongly encouraged to take a look at it.
Rich Array - jQuery plugin for performing various operations with arrays.
Sexy Vote - jQuery plugin that is a voting widget similar to Google Groups.
Submit Killer - jQuery plugin for killing form submit.
Timed Event - jQuery plugin that allows to make buffered and delayed event hadnlers very easily.
Progmatic - Google gadget that displays news for programmers from Slashdot, Hacker News, Digg and Reddit. News from each source are displayed in a separate tab.
Hot or Not - Google gadget that displays pics from Hot or Not website in a very attractive form, using tabs navigation.
Hot or Not Lite - the same as previous one, but without tabs feature.

About you

I want to work in a small team of tech guys where I can do amazing things that will help people. I would like to work as a JavaScropt programmer, but can also do server-side coding. If I will be allowed to use jQuery in my work, it would be a great plus. Expected salary is $1000 / month.

Testing tasks

I am not good at writing CVs, so if you are interested in hiring me, I will be glad to complete testing task for you to show my skills.

Who is the hottest?

2009-01-22T09:25:00.000-08:00

I have just developed new iGoogle gadget for Hot or Not called Hot or Not Lite. It does almost the same things as the previous, but without tabs stuff. With Hot or Not Lite you can choose which pictures (girls, guys or the best) to see in the gadget's settings. I have three reasons for this decision. First, a lot of users don't need to see all this stuff - girls, guys and the best. For example, I watch only girls' photos. Second, tabs and user preferences didn't work well with syndication services - for example, they didn't work properly with Blogger. I don't know whether it's a Blogger issue or syndication issue in general. Third, the gadget will be more lightweight because of tab's absense.

Both of the gadgets for Hot or Not are usable and attractive. I developed the second gadget to satisfy more users' needs. But if you want to embed it to your website, Hot or Not Lite will work better. Install, use, enjoy and become the hottest!

Install Hot or Not Lite on your iGoogle page

Embed to your website

Hot or Not news

2009-01-21T04:11:00.001-08:00

I have just placed Hot or Not gadget on my blog's sidebar. There are some problems related to Blogger's gadgets implementation. Gadget works perfectly on iGoogle, but some strange errors appear in Blogger, and I haven't created workaround for it yet. But I decided to leave it in order to give impression about it to my visitors. I will work further on this gadget in order to reduce loading time and fix Blogger-related issues. Install it and enjoy!

The hottest people on your iGoogle page

2009-01-17T10:54:00.000-08:00

Many of us use one of the most popular Facebook applications named Hot or Not. I am personally a fan of this application, and I met a lot of new friends using it. I will not explain here how it works - you can try it yourself if you haven't used it before. I just want to say that I have just released new Google gadget that can display the hottest girls and guys on your iGoogle page. If you like hot people, you should really use it.

Add to iGoogle

Embed to your website

World News

2009-01-08T09:52:00.000-08:00

All best world news in one place. Syndicated from Digg, Reddit, Yahoo! News and CNN.com. News from each source are displayed in separate tab. Discover the world!

Add to iGoogle

Embed to your webpage

Scientific

2009-01-07T09:40:00.000-08:00

My new google agdget that displays scientific news. Syndicated from four sources - Digg, Reddit, Y! News and Google News. News from each source are displayed in a separate tab.

Add to iGoogle

Embed to the website

Entertainment News

2009-01-05T09:42:00.000-08:00

My new Google gadget. Digg, Reddit, Y! News and CNN are sources of data.

Add to iGoogle page

Embed to your website

TechNews - google gadget for everybody interested in technology.

2009-01-04T11:03:00.000-08:00

TechNews shows you the latest and most interesting technology news from 4 sources - Digg, Reddit, Y! News and CNN.com.

Install to iGoogle page

Embed to any website

Politician: all politics in your iGoogle page

2009-01-04T10:42:00.000-08:00

Are you interested in politics? If yes, I encourage you to install my Google gadget called politician. It displays political news from four most authoritative sources - Digg, Reddit, Y! News and CNN.com.

Install to iGoogle page

Embed to your website

Gameplay: google gadget for true gamers.

2009-01-02T10:38:00.000-08:00

I have just released new Google gadget called Gameplay. It syndicates top gamer's news from four sources - Digg, Reddit, Yahoo! News and Slashdot. News from each site are displayed in separate tab. If you are true gamer, I encourage you to install it to your iGoogle page or embed to your website. Install, play and enjoy!

Progmatic: the best programmer's news in one place

2009-01-01T10:23:00.000-08:00

I have just finished Google gadget that displays the most interesting news for programmers from four sources - Slashdot, Hacker News, Digg and Reddit. Top 5 news are displayed from each site, each in separate tab. If you want to get more access to the best technology news, you should really use it. You can install it to your iGoogle page or embed to your web site. If you want to view source code, it is here.

Sexy Combo in the Web

2008-12-31T02:27:00.000-08:00

http://www.mte90.net/index.php?lng=en&mod=articoli&pg=pagina&c=6&articolo=1230669356 - great article about SexyCombo

Learning form jQuery: how to write good software

2008-12-28T04:01:00.000-08:00

1. Provide simple interfaces.

Your users should learn how to use your application as quick as possible. jQuery provides the simplest interface for accessing DOM elements. Everything you should know for it is the $() factory function and CSS selectors. Both designers and programmers are familiar with CSS, so you need minimum time to start using the library. Method names are mnemonic, so you can understand their functionality without looking at the documentation.

Providing documentation is a very good approach, but if your users use it very frequently, it is a signal that you should probably redesign your application. Think about what do your users already know about the problem you solve. Try to make your application to be understood intuitively.

Simple interfaces are good not only for end users, but also for developers. If you have simple and elegant interface, you start to write simple and elegant code almost automatically, and this allows you to solve the problem more quickly and efficiently.

2. Solve real problems.

Don't try to invent problems. There is plenty of them around us, and we should concentrate on reducing them, not producing new ones. Working with DOM was a headache of JavaScript programmers for many years, and jQuery provided the best solution for it. There are lots of such problems in each field, and those developers who solve the complicated ones will get the best reward.

3. Provide only those features that are necessary for solving the problem.

Your application shouldn't be giant. Giant applications cost more, have lots of bugs, and it's difficult for users to learn them. And there is the only way to reduce the size of the application - providing less features. Try to improve existing ones instead. Always ask yourself: if the feature I am going to add to my application is necessary for my users, is it going to make their life better? And if the answer is no, stop even thinking about it. You should think about problem you solve, not about features. This is the way you can create cheap, lightweight, and easy to learn applications.

4. Let third-party developers extend your application.

Yes, you should implement only necessary features. But remember that there are lots of users with specific needs and demands. You can not satisfy all of them, but you can create mechanism that will allow third-party developers to do it for you. Export your data through RSS feeds, provide rich API for developers, and you will get more users.

jQuery has a perfect plugin system that allows developers to create new methods and even selectors. As a result, there are hundreds (or maybe thousands) jQuery plugins that do lots of tasks that jQuery is not able to do natively. The library remains lightweight, but users with very specific needs are able to get ready solutions, without need to code it themselves.

5. Be beautiful.

Your application should be charming. When I work with jQuery, I feel its beauty, but I can not explain it. To reach this, you should write your application with passion, you should really love your job. If you do it just for money, the users will notice it. You can create something perfect (or close to it) if only you invest your emotions, the part of your soul to your job.

What's new with Sexy Combo

2008-12-27T09:12:00.000-08:00

From this version you can make use of triggerSelected config option. If it is set to true, the option which has selected attribute will be the initial value of the combo. You are also able to set combo's name by using name config option.

What I have done

2008-12-24T09:42:00.000-08:00

I have made some changes in my Sexy Combo jQuery plugin. I have added three new configuration options that allow you to set combo's width, empty text and perform autofilling. The first option is obvious. The second option lets you use combobox without using labels (empty text appear when the text input has no focus and the user did not input something to it), and I think it may be good for some layouts. Autofilling option allows you to configure the plugin so that the first item of the dropdown list will become the value of the text input when the dropdown list is shown. However, the text that was added to the input would be selected, so the end user will be able to easily remove it.

I have also fixed 2 issues. The first was visible when you had combobox at the bottom of the page, so dropdown list caused the window to scroll. The second was that Sexy Combo did not allow to "jump" to another form elements using TAB key.

P.S. Thanks to Nikita Melnichenko who told me about TAB key issue and the author of 37 Phenomenal jQuery Plugins and Demos for Developers who mentioned Sexy Combo in his great article.

Sexy Combo 1.0.1 updates

2008-12-20T09:16:00.002-08:00

I have just released Sexy Combo 1.0.1. In the new version you will be able to customize combobox's width. I have also fixed some Opera bugs.

I will continue to work on plugin customization and fixing browser-specific bugs.

Sexy Combo 1.0.0 released!

2008-12-19T09:40:00.000-08:00

I have just released Sexy Combo 1.0.0. It have become cross-browser, so I can claim that it is production-ready! Currently it supports all browsers that jQuery does. I have also removed some configuration options related to the widget presentation, because you can change it editing plugin's stylesheet. Use and enjoy it!!!

Resources

http://code.google.com/p/sexy-combo/ - SexyCombo on Google Code.
http://plugins.jquery.com/project/SexyCombo - SexyCombo in the jQuery plugins directory.
http://phone.witamean.net/sexy-combo/demo/ - demo page

Timed Event jQuery plugin documentation

2008-12-10T23:26:00.000-08:00

In the previous post I wrote about Timed Event jQuery plugin. Here is documentation for it.

Usage

In order to use Timed Event, you must follow these steps:

Download plugin arhcive and unpack it.
Include jQuery and plugin file (jquery.timed-event.js or jquery.timed-event-min.js) to your web page.
Now you can use Timed Event in your code. Use it in this way: $("selector").timedBind("event-type", {delay: [time of delay in milliseconds], buffer: [time of buffer in milliseconds]}, function() { //event handler function }); As you can see, timedBind accepts the same parameters as jQuery native bind function. But you should take into account that the data parameter in bind function is optional, but is required in timedBind function (in other words, all three parameters of timedBind are required). You can pass an empty object as data parameter, but in this case the behaviour of the timedBind will not differ from bind method. Both properties of data object(delay and buffer) are optional, you can pass any combination of them.

Contribution

If you have some suggestions on improvement the plugin, feel free to email me at Kadalashvili at Vladimir at gmail dot com.

Resources

Timed Event jQuery plugin

2008-12-10T23:24:00.000-08:00

JavaScript programming is strongly connected with the events. I can not remember any case when I used JavaScript without using events. At the same time, it is one of the most challenging parts of work of JavaScript programmer, because different browsers "understand" events in different ways. Fortunately, now we have good JavaScript libraries such as jQuery, which makes development of cross-browser JavaScript applications a trivial task. In particular, jQuery simplified working with events strongly.

But programmers always want more. We always want to write better software, have better programming languages and frameworks. This pushes the industry forward, despite the efforts of some stupid bosses.

When working with events I have often faced tasks when I needed to delay handling of the event event for a certain time (event delaying) or (less frequently) to allow event handling only once for a period of time (event buffering). jQuery does not provide any tools to achieve this (and this is the right solution of developers). As for me, in the process of working on various projects, I tried several solutions for this problem, trying to find the most elegant and universal. Now you can evaluate the result of my work in this area - jQuery plugin called Timed Event.

The plugin enables us to solve two tasks that I mentioned - event delaying and event buffering. To achieve this, you will not have to change the code of event handler. You write handler as you would have written it if you didin't need to implement event delaying or buffering. The rest will be done by Timed Event.

Resources

SexyCombo updates

2008-12-10T04:59:00.000-08:00

I have just made some changes to the SexyCombo jQuery plugin. First, I replaced $ function inside plugin to jQuery function. This mistake could lead to the conflicts with Portotype and the other JavaScript libraries. Don't get me wrong, I know the convention about using jQuery function inside the plugin, but I missed it in ONE line of code. Second, I have made some changes in plugin CSS file. The problem I solved occured when you placed one combobox under another. Then the dropdown list of the top combo became partly invisible. The problem was solved by adding one line of code to the stylesheet. Thanks to Birukov Sergey who told me about these two issues.

Resources

http://code.google.com/p/sexy-combo/ - SexyCombo on Google Code.
http://plugins.jquery.com/project/SexyCombo - SexyCombo in the jQuery plugins directory.
http://phone.witamean.net/sexy-combo/ - demo page

Submit Killer jQuery plugin

2008-12-10T03:12:00.000-08:00

Perhaps, web forms data processing is one of the most frequent problems that JavaScript programmers have to solve. Thesse are form validation, AJAX-submitting and a lot of another stuff. Almost always we have to prevent normal form submitting. The simplest solution for this problem which comes to mind first is using <input type="button" /> instead of <input type="submit" />. But this decision is far from perfectness. First, the form is broken when the user have JavaScript disabled. Second, we still give the possibility of submitting by pressing the Enter key on the textbox. So this decision is unreliable and badly-designed, because it doesn't get the possibility to normally submit the form for users that have JavaScript disabled. A more correct approach is to allow the user with JavaScript turned off to perform default submitting , but if JavaScript is enabled, prevent default submitting and process form data somehow using client-side scripting. This principle is called progressive enhancement.

Thus, in order to prevent normal submitting of a web form, you need to prevent default browser behaviour for clicking on submit and image buttons and pressing the Enter key on the textbox. Too much for such a small task. In order to simplify this task upo to one line of JavaScript code, I wrote jQuery plugin called Submit Killer, the only purpose of which is preventing default submitting of web-forms.

Using Submit Killer is very simple. All you have to do is to call the killSubmit method, while jQuery object must contain elements of forms for which you want to prevent default submitting. The simplest case would look like this:


$("form").killSubmit();

This code snippet will prevent default submitting of all web forms on the web page. I'll be glad if Submit Killer helps developers to solve their problems. Leave comments here if you have some suggestions on improving or bug reports.

Good luck!

Resources

Sexy Vote jQuery plugin documentation

2008-12-09T09:32:00.000-08:00

Sexy Vote is a jQuery plugin that allows you to embed easily the voting system on your web site. It is very easy to use (as jQuery itself), but you certainly need to have some knowledge about how to configure it (at least how to write callback function that process voting), and of course some basic skills of JavaScript programming.

Usage

To use Sexy Vote, you must follow these steps:

Download the package and unpack it.
Include jQuery to your web page (e.g <script type="text/javascript" src="jquery.js"></script>).
Include plugin file (jquery.sexy-vote-min.js) to your web page (e.g <script type="text/javascript" src="jquery.sexy-vote-min.js"></script>).
Now sexyVote became a native method of jQuery object, and so you can use it as the other jQuery methods. The elements jQuery object contains will be containers for the voting widget. For example, if you write $("#vote").sexyVote(), the voting widget will be rendered inside the element with an ID "vote". You can similarly write $(".vote").sexyVote(), or something else that fit your needs. Sexy Vote also support chaining (as native jQuery methods do), so you can write, for example $("#vote").sexyVote().parent().show() or anything else you need.
You can configure Sexy Vote if you would like to change its appearance or behaviour. To reach this, sexyVote method accepts single parameter in the form of JavaScript object literal. For example, if you write $("#vote").sexyVote({maxScore: 3}), the maximum score user can give will be 3 (so only three stars will be displayed). The full list of configuration options is located in the next section.

Configuring the plugin

Sexy Vote has a number of configuration options that are passed to the sexyVote method in the form of JavaScript object. Here is the complete list of these options.

activeImageSrc, passiveImageSrc - the URLs of the images that are displayed in the widget. You will probably need to change the default values of these options. Defaults are "active_star.gif" and "passive_star.gif".
maxScore - the maximum score user can give. For example, if you write $("#vote").sexyVote({maxScore: 3}), 3 images (stars) will be displayed and so the user will be able to vote for 3 scores maximum. You will probably not have to change this. Default is 5.
fn - the callback function that is called after user have voted (clicked on the image). The function is called in the scope of event target (in this case, the image that was clicked), and two arguments are passed to the function: the event object and score that the user gave. The main purpose of this function is to give to developers the possibility to send the result of the vote to the server, but, of course, you can do anything in this function. Example: $("#vote").sexyVote({fn: function(e, score) { var $this = $(this); //now $this is jQuery object that contains the image that was clicked. //It is similar to $(e.target) alert("You have put " + score + " score. Thank you for voting!"); }}); Default is empty function.
messages - this property is an array of strings that are messages displayed in response to user's action right to the images. The message in the zero index is diplsayed when the user have voted (i.e. clicked on the image). The rest of them are displayed when the user hovers on the appropriate image. For example, the message in the first index is displayed when the user places mouse pointer over the first image. Default is ["Your vote have been saved.", "Very bad", "Bad", "Good, but could be better", "Good enough", "Very good" ].

Customizing CSS

Sexy Vote generates the following markup:

<img src="active_star.gif" /><img src="passive_star.gif" />...<span>Messages are displayed here</span>

So if you have placed the widget inside the paragraph with the ID "vote", the markup will look like this:


<p>
<img src="active_star.gif" /><img src="passive_star.gif" />...<span>Messages are displayed here</span>
</p>

According to this, you can customize the appearance of the widget. For example, I included the following stylesheet to the demo page:


#vote span {
    margin-left: 3px;
    font-size: 0.8em;
}

Resources

Why commenting is not enough

2008-12-09T04:58:00.000-08:00

Each of us knows you need to listen to the users' feedback in order to succeed. We can never predict the future. The wisest thing we can do is to try to create a good thing, and then monitor the reaction of people and change the product in the appropriate direction. Good clothing manufacturers, such as Zara, do so. Good authors, such as Paul Graham, value the opinion of their readers most of all. One of the main advantages of Web applications compared to the desktop is that developers can constantly improve them, basing on users' feedback, and users see the changes instantly.

Commenting is the most common way of getting feedback on the web. All blog engines have implemented this feature. People comment on the video on YouTube and photos on Flickr, as well as news on Reddit and Digg. But is this the easiest way for users? I think no. Imagine a situation that one of your readers is very busy and has been able to devote only a few minutes to read the post in your blog. Will he leave a comment? Most likely, no.

Consider another situation: you didn't want to write, but you have forced yourself to do so for any reason. The result was the post that was less quality than usually. You have published it, and forgot about it. Will your readers tell about this in the comments? I think not. I do not take trolls into account - they will be happy to express their "opinion". With regard to good readers, they are likely to prefer "not to notice" your mistake. Perhaps some of them simply stop visiting your site. The most loyal readers will remain. But the worst is that this post will make a bad impression about your site for visitors coming for the first time. And all this because of the fact that you didn't get a signal at the right time.

You will not probably deny that the part of the visitors of your site are introverts. They also have their own opinion, but it is difficult for them to express it, so they rarely leave comments. And if this is the only way of feedback on your site, you are missing a part of your audience.

Another situation. You have written documentation for a program that you've created. The only thing you want to know is whether the information is useful and clearly presented. Is the comment the appropriate way of feedback in this case? Probably not.

In general, commenting is not a tool of evaluating the quality of the post. "Great article" and "You suck" are similarly bad. Commenting, in my opinion, is a tool of expression of users' opinion on the topic. At least, good comments.

Understand me correctly - I am not an enemy of commenting. All posts in my blog are opened for commenting, and I delete only trolls' comments and spam. If the reader expresses his opinion (no matter in my favor or not), the comment is always published. I just want to say that commenting is not the only and enough way of getting feedback, it is not suitable for all cases and is not an objective tool for evaluating the quality of the post.

What do I propose? In my opinion, in many cases it would be wise to use a system of voting along with commenting. You want to know whether your readers liked the article? Just ask them about it, and they will answer you. I propose the arrangement: if the user wants to express his opinion about quality of the article, he uses a system of voting. If he wants to express his opinion on the topic of the article, then let him leave a comment.

I didn't invent this. Reddit, Hacker's News and Digg successfully use this system. They combine the systems of voting and commenting, and use the number of votes as an assessment of the quality of the post. And this, in my opinion, is the best approach. Even the busiest reader will find time to vote - that would require less than a minute. If the article would be very bad, readers simply give the lowest rating. For introverts it will not be difficult to evaluate the article. As a result, you will have a more complete picture of what people think of your article and of its topic.

In my spare time, I wrote jQuery plugin called Sexy Vote, which is a widget for voting on the site. It is very simple to use, but offers several possibilities for the configuration, so you can easily customize it to fit your own needs. I will be very happy if it becomes useful for some developers.

Resources

Rich Array jQuery plugin

2008-12-06T22:57:00.000-08:00

Programmers often deal with arrays. This data type is present in almost all programming languages. In this case the difference between languages is in the set of functions of standard library for working with arrays. JavaScript is not an exception, there is a built-in object called Array in this language, with methods for array slicing, getting the index of the element with a specified value etc. In most cases this set of methods is enough (it is excess after all), but sometimes we have a desire to have more rich set of functions, because we have to perform the same operations on arrays several times in our application, and these operations aren't present in the standard library. As a result, you have to write boring, trivial functions, consisting of the only for loop.

Programmers shouldn't do this. Instead of this, they should create a good software that people will want to use, that will help people to solve their problems. Trivial problems kill time and creative energy of the developer, that's why we should try to automate as much of them as possible. As a result we will have more cheap and quality software, and both users and developers will be happy.

jQuery helped us to forget about lots of routine problems that were a part of the life of JavaScript-programmer in the past. Now you aren't forced to set an ID of each element you want to access - this can be done simplier and nicier now. You don't need to worry about browser bugs - the developers of the library deal with them. You should only solve your problem, not being distracted by noise.

The Prototype library extends a standard set of methods of Array object, giving a freedom from solving trivial problems to the developer. jQuery doesn't do it, and it doesn't need to. If the developers tried to make jQuery "for everything", it would lose its main advantage - simplicity. Instead of this, the developers of jQuery have made it pluggable, and it let us to extend the functionality of the library. And I wrote Rich Array - jQuery plugin for working with arrays.

I tried to do all my best to simplify developer's life in this sphere. I included functions for solving the most widespread problems related to arrays to the plugin. Have you ever had to remove null values from the array? To find the intersection of two arrays or difference between them? Filter the array according to some criteria? Sum the values of the array? If yes, than I advice you to use the plugin. It's extrmely lightweight, and your users won't suffer because of long time of page loading. But Rich Array will probably save you some time and energy that you spend as you want - spend more time with your family, have a rest or concentrate on more interesting and important parts of work.

I won't put the documentation for plugin here - the source code is understandable and well-commented. If somebody will want to write the documentation, I will be glad. You may leave here all suggestions on improving or bugs reporting or write me at Kadalashvili dot Vladimir dot gmail dot com.

Good luck!

Resouces:

SexyCombo updates

2008-11-30T05:03:00.000-08:00

In my previous post I wrote about new jQuery plugin which is called SexyCombo. I am glad to report that now I can say that SexyCombo fully supports Firefox 1.5 and higher. I have also fixed rendering errors for IE6, but some features, for example, keyboard navigation in the dropdown list still don't work in this browser. I will continue to work hard on cross-browser compatibility.

Now the demo page of SexyCombo is avaliable online.

SexyCombo jQuery plugin

2008-11-29T04:37:00.000-08:00

Almost every of us had to fill in web forms, in which you need to enter your city or country. Usually it is implemented using selectboxes. But the users will not tell you that it's usable. In fact, the user has to look at the long list for the value that is already known. In most cases it would be faster to enter this value in the text box. But this is unacceptable from the viewpoint of developers, because in this case we have a limited number of options, and it would be unwise to allow users to enter the word "Russia" along with "Russian Federation". I don't mention typos here. So, there is a conflict between the interests of users and developers which needs to be resolved. Apparently, we should somehow mix the advantages of selectboxes and textboxes. Users who want to choose the value using selectbox will continue to do so. We also do not want to infringe on users who prefer to type, but we must make sure that the value user enters is included in some set of possible values.

I don't want to cheat tou - the widget which I now "dreamed" about already exists. It is called combobox. I faced it for the first time using ExtJS library. This is a very rich AJAX library, with a lot of wonderful and rich visual components. But the richness in this case is not always an advantage, since all the components of the library are linked to each other (the developers tried to make it object-oriented, and have used inheritance actively). If you need just a few components of the library, you will still need to use a large part of it. This library is not lightweight, so I won't advise to use ExtJS in applications designed for mass use. But in general this is an excellent library, and its developers, in my opinion, are worth of admiration. They did their job well.

Another JavaScript library which I admire is, of course, jQuery. If the first library has attracted me by its wealth, then I like the second for its simplicity and elegance. One day I will cover this topic in greater depth, and now I will note that this library has a very convenient system of plugins, which allows third-party developers to expand the functionality of the library. I decided to take it up, so I wrote jQuery plugin wich I called SexyCombo.

Just to make a reservation - plugins with similar functionality already exist. For example, this. But I didn't like it because it uses other jQuery plugins as a basis, but, in my opinion, plugin should be a separate unit, without any dependencies. Moreover, I didn't really like its appearance. Of course, we can change stylesheets, and everything will look like we want, but it is still additional work for plugin users. I think the appearance of this type of visual component should be as neutral as possible and suitable for the most sites without need to change it. Not everyone will be pleased to modify the stylesheets, because it is the most important and difficult part of work, as I learned later.

SexyCombo provides roughly the same level of functionality that other implementations of comboboxes. It allows the user to choose values from the drop-down list or to type it in the text box. Keyboard navigation (using arrow keys) on the drop-down list is also implemented.

SexyCombo uses selectboxes as a source of data. This means that you can start using plugin without any changes in the layout. An important feature: when the user changes the value of the combobox, the value of the corresponding selectbox also changes (if possible) automatically, and the change event is triggered. Thus, if you have JavaScript code that uses selectbox somehow, you can leave it unchanged, and everything will work well. For example, you have selectbox, in which the user must choose a color. You have placed <div> element next to the selectbox, which changes its color when changing value of the selectbox. Now, when you use SexyCombo, you can leave the code unchanged, and functionality of your application will not be affected.

Usage

To start using SexyCombo, you should at a minimum:

Download the latest version of the plugin and unpack the archive.
Include jQuery file to your web page. jQuery file comes with the package.
Include plugin file (js/jquery.sexy-combo-min.js) to your web page.
Include plugin stylesheets to your web page (css/sexy-combo.css).
Write $('select').sexyCombo() in your JavaScript file. This code will turn all selectboxes on your page into comboboxes. Of course, you can use other jQuery selectors, for example, $('#future-combo').sexyCombo().

In addition, jQuery.sexyCombo() method takes only one argument in the form of JavaScript object literal that allows you to configure plugin. For example, you can write $( 'select').sexyCombo({listMaxHeight: 250, triggerSelected: true });. This object may have the following properties:






(string) blankImageSrc - the URL of an "empty" images wiich is shown in the place of combobox's icon. You will not probably  have to change this. Default is "http://phone.witamean.net/combo-images/s.gif".


(string) css - CSS class that will be applied to the elements. Use the default plugin's stylesheet as an example of how to write custom one. Note that CSS is a large part of work, and you should REALLY know what you are doing if you are going to change stylesheet. Default is "combo".


(string) selectboxDefaultValue - the value that will be set to the selectbox if none of its options are selected. Default is empty string.


(boolean) ignoreSelectboxDefaultValue - if true, the default option of selectbox (see previous config option) won't be included to the combobox's options. Default is true.


(integer) width - combobox's width


(string) emptyText - the default value of the combobx. Default is empty string.


(boolean) autoComplete - if true, combo's value will be autofilled with the first item of the dropdown list (when list is shown). Default is false.


(boolean) triggerSelected - if true, the selected option of selectbox will be the initial value fo the combo. Default is false.


(string) name - combo's name. Default is selectbox's name + "__sexyCombo".



Supported browsers

Currently  SexyCombo supports Firefox 2 only. Serious rendering errors found in Opera and Internet Explporer 6. I will work hard in this direction, and I hope that  plugin will support a larger number of modern browsers in the near future.


Support Project

SexyCombo  is an open source project, and I will be glad to any form of cooperation. Help to improve plugin , tell your friends about it, write an article about it or help to  others to install and configure it. Your help is invaluable.


If you have any questions or suggestions, please write me at Kadalashvili dot Vladimir dot gmail dot com.


Resources


 http://code.google.com/p/sexy-combo/ - SexyCombo on Google Code.


 http://plugins.jquery.com/project/SexyCombo - SexyCombo in the jQuery plugins directory.


http://phone.witamean.net/sexy-combo/demo/ - demo page


http://k-vladimir.blogspot.com/2008/11/jquery-sexycombo.html - this post in Russian




We offer VCP-410 dumps for web designers and newbies on jQuery. Our 350-001 dumps and tutorial contain complete knowledge of jQuery. Learn how to apply jQuery applications with our 640-802 dumps.



I just want to test my robots.txt plugin. To speed up testing, I place a link to test post here, with an appropriate anchor text - sfhsfs fodms fkspcxm



Okay, it seems that I should test robots plugin one more time. It seems that Google works OK with it, but Yahoo has some problems. I've created a blog called Bots test site, and I hope it will be indexed by Google, Yahoo and Bing really soon. I know that Yahoo is usually slow in indexing, but I hope I'll be lucky this time. I've also written a quick topic about this experiment. Also, here is really cool piece of content. You can read super secret blog.



Future
2008-10-31T10:09:00.000-07:00
 One of the main advantages of Web applications is the possibility of continuous development. The concept of versions in Web programming is almost absent, and the user always receives the latest version of the application. Developers, in their turn can continuously improve their application to test new ideas in practice, and instantly eliminate mistakes. This is much more flexible and effective approach.
 I thought about ways to further develop my application and now want to share these thoughts with you. Of course, perfection has no limits, but this is what I would like to implement first. 

 Global search of contacts. 
 Currently, it is possible to search in the books that are opened at this time. It is usable  live search, but it is still not enough. If there is a possibility of creating public contacts, user must be able to find them. Without this application lose a lot, so this opportunity will be realized as soon as possible. 

 The possibility of copying contacts. 

In my application user can see not only his books but also books belonging to other users, if he has appropriate permissions. But only books belonging to you appear first. It may happen that you  need contacts from other's books quite often, and in this case it is much easier to copy those contacts in one of your books than constantly open other's. This opportunity will also be implemented as soon as possible.


 Creating applications for social networks. 
 My application is not social in the usual sense, but at the same time, his goal is to help to people be in touch. I think many users will want to know about updates in the public books of his friends and acquaintances, and simply add contacts through Facebook or MySpace. In addition, people often need this communicating in social networks.  

 Creating applications for mobile phones. 

I think it's clear.



What am I proud of
2008-10-29T11:39:00.000-07:00
  In my  previous post  I briefly spoke about my recent project and invited anyone to register for a  site  and try it in action. Today I want to elaborate on the merits of the  application  from my point of view.  So what I am proud of:


     
     The application is  purely  ajaxian . What does this mean? From the user's side this is  complete absence  for  page reloads. This saves time and traffic of users, and subject to frequent use this effect is especially palpable. Thus, the "fans" of the application are encouraged  automatically. From the perspective of a programmer it is  the complete separation of client and server side. The server keeps the data and the client receives it at a time when it is needed. In my case, the client is  JavaScript code that runs in your browser, but it can be desktop application, application for mobile phone, Facebook or MySpace application, and much more. And this does not need to change the server part.
     
     

     The high level of customization. Based on my personal experience I can say that users always appreciate the opportunity to upgrade. People like to have power over what they enjoy. In particular, they love to visit sites that are configured in accordance with their own unique  demands, even if they do not use this opportunity. The developers, in turn, are able to observe the behavior of their users and to go after them. If you give your users a clear algorithm of action (the best in your opinion), then you lose this chance. There is no perfect solution, but there are options best for each individual. And only this person knows this option. My job as a developer is to give him the opportunity to rebuild the application according to his needs.
     
     

     The existence of hidden opportunities, such as hot keys and permalinks. You can start using the application right now, but soon you will get used to it, and you will want something more. People like to discoversomething new.
     
     

     Easy and intuitive interface of the application that makes it look like traditional desktop solutions, very fast  registration .
     
     

     The presence of a small social element in the application. Phonebook was created not only to store but also to exchange contact information. To do this, there is a system of controlling access to books. You can make some of the contacts  publicly available, some -  password-protected, but some - to keep private. The existence of password-protected books is, in my opinion, similar to the concept of friends, so fashionable today. While my decision is, in my opinion, more versatile and gives more space to users.
     




 That's it. In one of the following posts I promise to tell about disadvantages of my application and possible directions of its development. 



The first post
2008-10-27T09:39:00.000-07:00
 In my first post I want to tell you about the project which worries me. This is a Web application that I wrote this summer escaping of the terrible heat at home. I haven't been invented the title yet, I'll have to work at it.  I myself  call it Phonebook, but,i think, it's too trivial. Besides, at this stage it  doesn't matter. 
 Internet, among other things, is also a powerful tool for communication. A lot  of my friends use it solely for that purpose. But we also use traditional tools for communication  such as telephone, mail, and personal communication. Furthermore, the more traditional way people communicate, the more they tend to be closer to each other. Found at Facebook or other social networks, people often share phones and other contact information. Moreover, the Internet offers a huge choice of tools for communication - e-mail, social networks, blogs, instant-messengers ... There is a problem - how an ordinary person can store all this information in a simple way. Software for mobile phones is often able to store only (wow!) phone numbers. There are desktop applications that allows you to keep contact information, some of them are very usable. But I have not found a web-based applications designed for this purpose, and decided to fill that gap. 
 Currently application is under testing. I think only users can really test the product, so I decided to open access to all visitors. If you have desire to do so, follow  this  link. Leave all feedback, notes and complaints in comments. 
 P.S. Temporary hosting for my application is granted by Witamean  web studio.