Написал псевдо консоль… написал TODO приложение… всё красиво, всё с jQuery….
Вот сегодня решил написать файл менеджер(под висту чтоб косил).
Короче: для полноценности плюшек не хватала лассо(т.е. выделение зоны с файлами).
Родился велосипедик…(для работы нужно jquery и jquery.event.move-Stephen Band )
(function($){
$.fn.lasso = function(options) {
var defaults = {
// path to css to be imported
stylePath: null,
lassoClass: "lasso",
// elements that must be returned as param for onClickAfter event, full selector text
toListenFor: "*",
// fired after selected area, array os selected elements as param
afterSelected: function(arr){},
// function fired while selecting a zone, event as param(see event properties)
whileSelecting: function(e){},
removeAfterSelected: true,
};
// extend options
var options = $.extend(defaults, options);
// lasso html
var lassoHtml = "<div class='"+options.lassoClass+"'></div>";
// do the job fot each initialization
this.each(function() {
obj = $(this);
// set style
if ( options.stylePath == null || options.stylePath == "" )
{
options.stylePath = "border:1px dotted white; background: black; opacity: 0.3";
}
else
{
$("body").prepend("<style type='text/css'>@import url("+options.stylePath+");</style>");
}
// deny text selection
obj.css({ /* Normal browsers */
"-webkit-user-select" : "none",
"-khtml-user-select": "none",
"-moz-user-select" : "none",
"-o-user-select" : "none",
"user-select" : "none"
});
/* IE */ obj.bind("selectstart", function(){ return false });
// bid selection event
obj.bind("movestart move moveend", function(e){
e.stopPropagation();
// get lasso object
var lassoObj = $("." + options.lassoClass);
switch( e.type )
{
case "movestart":
// remove old lasso case exists
if ( lassoObj.length > 0 )
{
lassoObj.remove();
}
// append lasso html
$("body").append(lassoHtml);
// setup lasso style
$("." + options.lassoClass).css({
"position" : "absolute",
"border" : "1px solid silver",
"background" : "#908089",
"opacity" : "0.2",
"filter" : "alpha(opacity=20)",
"z-index" : 10000,
"width" : 0,
"height" : 0,
"margin" : 0,
"padding" : 0,
"top" : e.startX + "px",
"left" : e.startY + "px",
});
$("body").css("cursor", "default");
break;
case "move":
var ws = options.whileSelecting;
// check and call it
if ( typeof ws == "function" ) ws(e);
// extend lasso
$("." + options.lassoClass).css({
"width" : Math.abs(e.deltaX),
"height" : Math.abs(e.deltaY),
"left" : (e.deltaX > 0 ? e.startX : e.pageX) + "px",
"top" : (e.deltaY > 0 ? e.startY : e.pageY) + "px",
});
break;
case "moveend":
var lstr = "." + options.lassoClass;
$("*").bind("click.tempLasso", function(){
if ( $(lstr).length > 0 ) $(lstr).remove();
// collect garbages
$().unbind("click.tempLasso");
});
// get selected elements
var chArr = [];
if ( e.deltaX < 0 )
{
e.startX += e.deltaX;
e.startX = Math.abs(e.startX);
}
if ( e.deltaY < 0 )
{
e.startY += e.deltaY;
e.startY = Math.abs(e.startY);
}
var endX = e.startX + Math.abs(e.deltaX);
var endY = e.startY + Math.abs(e.deltaY);
obj.children(options.toListenFor).each(function(){
var os = $(this).offset();
var Xfrom = os.left;
var Yfrom = os.top;
// true as outer* param case required with margins
var Xto = $(this).outerWidth() + Xfrom;
var Yto = $(this).outerHeight() + Yfrom;
if ( ( (e.startX <= Xfrom && Xfrom <= endX) || (e.startX <= Xto && Xto <= endX) ) &&
( (e.startY <= Yfrom && Yfrom <= endY) || (e.startY <= Yto && Yto <= endY) ) )
{
chArr.push( $(this) );
}
});
var as = options.afterSelected; // чернобыльская…
// check and call it
if ( typeof as == "function" ) as(chArr);
if ( options.removeAfterSelected ) lassoObj.remove();
break;
}
return;
});
});
};
})(jQuery);
П.С. во вложениях изображение- как оно должно выглядеть(там курсор не захватило при принтскрине)
файл с примером(там же весь код, можно смело переименовать после закачки )…
П.П.С единственное выдаёт иногда х*.. плз взгляните, а то мозг у меня уже не варит…
