Saturday, November 5, 2011

Smartupdater 4.0.beta is released


http://www.eslinstructor.net/smartupdater/

New features:  100%-jQuery API style.
No new functionality was added in this release. Only new API and coding style were implemented.

Saturday, October 1, 2011

Strict Mode Compatible Micro-Templating Engine


Recently I developed and published jQuery templating plugin http://www.eslinstructor.net/vktemplate/, which is built on very popular Micro-Templating engine written by John Resig. It is a super compact, simple to use and power templating solution. I enjoy to use it.
But... one thing I want to avoid. The thing is the "with()" statement. There are two reasons.

1. The first, and most important reason is the fact, that using "with()" is not recommended, and is forbidden in ECMAScript 5 strict mode.

2. The second reason is performance. Performance can be decreased  if we intencively access objects other then the object specified with the "with()" statement.

Here is the  version of the  ECMAScript 5's strict mode compatible Micro-Templating engine which I created and breefly tested a couple of days ago.


1 function _tmpl(str, data){ 
2 var fn = new Function("o",
3 "var p=[],print=function(){p.push.apply(p,arguments);};" +
4 " p.push('" +
5 str.replace(/[\r\t\n]/g, " ")
6 .replace(/'(?=[^%]*%>)/g,"\t")
7 .split("'").join("\\'")
8 .split("\t").join("'")
9 .replace(/<%=(.+?)%>/g, "',$1,'")
10 .replace(/<%=(.+?)%>/g, "',this.$1,'")
11 .split("<%").join("');")
12 .split("%>").join("p.push('")
13 + "');    return p.join('');");
14 return fn( data );
15 };

Of course, if we remove with() statement, we must explicetly refer to the object which otherwise would be specified with "with()" statement. So, we have to change our template notation:

{name:"john"}
<%= o.name %>
<% if( o.name ) {...} %>

In this notation "o" is related to the function's argumen at line #2 of the example above.

Pro: no forbidden "with()" statement, better performance and better code readability as template-related variables are shown explicetely with object notation and not mixed other javascript variables.

Con: a couple of extra characters per each object's variables.

Next week I gonna to finish testing  and apply this with-free solution to my current plugin.

Monday, September 19, 2011

vkTemplate - jQuery Template Plugin

http://www.eslinstructor.net/vktemplate/
https://code.google.com/p/vktemplate/downloads/list

vkTemplate is a very small, simple and powerful template solution for web applications.
  • Small: Less then 1.5 k if minified
  • Simple: only one function with 2 mandatory and 2 optional parameters. No need to learn some funky template markup language or refer to list of API functions.
  • Power: well known and popular micro-template engin written by John Resig ( http://ejohn.org ) is used in this plugin as a core function. What's nice about this engine is that you can utilize any Javascript in the template and you're not limited to just a few commands.

Smartupdater 3.2 beta is released

http://www.eslinstructor.net/smartupdater3/

New features:

* maxFailedRequestsCb - function to handle "maxFailedRequests" event.
* selfStart - Disable initial self start.

Tuesday, March 8, 2011

Smartupdater v. 3.1 beta is released.

see live example and docs at:  http://www.eslinstructor.net/smartupdater3/


Published on jQuery Plugins portal: http://plugins.jquery.com/project/smartupdater


New Features for ver 3.1:
  • smart Stop:  depend on element's size, current layout and visibility client automatically stops and restarts polling
  • self clean-up:  automatically clears all related timeouts/intervals on element remove/empty event.
New Features for ver 3.0:
  • Switch polling URL dynamically
  • Switch callback function dynamically
  • Remotely select callback function
  • HTTP cache (304 Not Modified)
  • Feedback to server
Improved Feature:
  • Remotely set polling timeout.
Deprecated Feature:
  • multiplies time interval each time when data not changed.

Sunday, August 8, 2010

swapable - jQuery plugin


The jQuery UI Swapable plugin makes selected elements swapable by dragging with the mouse.

Introduction

Enable a group of DOM elements to be swapable. Click on and drag an element to a new spot within the list; drag element and drop one will swap and the other items will not affected. By default, swapable items share sortable properties.

DETAILS

Similar to "Sortable", but only two elements of the selected group are affected: dragged and dropped which are swapped. All other elements stay at their current positions. This plugin is built based on existing "Sortable" jQuery plugin and inherits all sortable options except "cursorAt" one which is hard-coded.
Based on jquery.ui.sortable.js
Depends:
  • jquery.ui.core.js
  • jquery.ui.mouse.js
  • jquery.ui.widget.js
  • jquery.ui.sortable.js
To add the feature to a group of elements:
Minimal configuration:

$("#swappable").swappable({items: '.itemClass',cursorAt: {top:-10} });

Option's specific: 


  • Always set option "cursorAt: {top: -nn} " as a negative Integer.
  • Always set option "items" with items' class name, not element or filter.
Example:


 

  <ul id="foo">
     <li class="bar"><li>
     <li class="bar"><li>
     <li class="bar"><li>
  </ul>


$("#foo").swappable({
   items:'.bar', // Mandatory option, class only.
   cursorAt: {top:-20}, // MUST be set to negative. Default doesn't work!

Saturday, August 7, 2010

smartupdater (jQuery periodicalupdater)

Smartupdater jQuery plugin performs periodical updating functionality and can be used in all sorts of applications which need “polling” mechanisms.

Features

Actions:
  • stop updating.
  • restart updating after stop.
  • dynamically reprogram current timeout
  • remotely set timeout ( server controls polling period )
Monitor:
  • state attribute shows current state ( ON | OFF | undefined )
  • timeout attribute shows current timeout
Smart Behavior:
  • smart updateing - updates only if new data is different from the old one (text or json only.)
  • multiplies polling interval - multiplies polling interval each time data is not changed (text or json only.)
  • handle ajax failures - stop to request data after "maxFailedRequests".

List of available functions

  • smartupdaterStop() - to stop polling
  • smartupdaterRestart() to run polling again
  • smartupdaterSetTimeout() - to set a new polling interval

List of available attributes

  • smartupdaterStatus.state current state ( ON | OFF | undefined )
  • smartupdaterStatus.timeout current timeout

List of available options

  • url - URL for the ajax request. (Required!)
  • type - Can be either GET or POST (see jQuery.ajax for details)
  • data - Array of values to be passed to the page (see jQuery.ajax for details)
  • dataType - Response type – can be text, xml, json etc. (see jQuery.ajax for details)
  • minTimeout - Starting value for the timeout in milliseconds.
  • maxTimeout - Maximum length of time between requests.
  • multiplier - Sets the amount of decay between ajax requests. If this is set to 2, the length of time between each request will double while the response doesn’t change.
  • maxFailedRequests - smartupdater stops after this number of consecutive ajax failures;

See demo at 

get source of smartupdater2 from:


Any questions, comments or suggestions are welcome :)