diff --git a/sky.controls.js b/sky.controls.js index 0ada62e..02b5e4a 100644 --- a/sky.controls.js +++ b/sky.controls.js @@ -6,7 +6,6 @@ nullable: true, lookup: function(pattern,response){} - }; class SkySelect { @@ -35,6 +34,7 @@ self.update(); } ); + this.wrap.addClass("skyselect-wrapper"); this.type = SKY.type(this.options.type); @@ -44,6 +44,15 @@ } html(){ return this.wrap; } + value(item){ + if (arguments.length) + { + this.select(item); + return this; + } + return this.selectedItem; + } + open(){ this.popup.slideDown(); this.isOpen = true; return this; } close(){ if (this.isOpen) @@ -52,27 +61,30 @@ this.popup.hide(); this.isOpen = false; - - if (this.options.nullable && (this.element.val()=="")) - { - this.selectedItem = null; - } else { - this.element.val( - this.selectedItem ? this.options.render(this.selectedItem) : "" - ); - } + this.activeItem = null; } return this; } + restoreSelection(){ + if (this.options.nullable && (this.element.val()=="")) + { + this.selectedItem = null; + } else { + this.element.val( + this.selectedItem ? this.options.render(this.selectedItem) : "" + ); + } + } + markCurrentSelected(){ var self = this; - var currentSelectedIdentity = self.options.type.identity(self.selectedItem); + var currentSelectedIdentity = self.options.identity(self.selectedItem); this.popup.children(".skyselect-item").each(function(){ var li = $(this); - var item = li.data("skyselect-item"); - if (self.options.type.identity(item) == currentSelectedIdentity) + var item = li.data("skyselectItem"); + if (self.options.identity(item) == currentSelectedIdentity) li.addClass("selected"); else li.removeClass("selected"); @@ -81,13 +93,13 @@ markActive(item){ var self = this; - var currentActiveIdentity = self.options.type.identity(item); + var currentActiveIdentity = self.type.identity(item); self.activeItem = item; this.popup.children(".skyselect-item").each(function(){ var li = $(this); - var item = li.data("skyselect-item"); - if (self.options.type.identity(item) == currentActiveIdentity) + var item = li.data("skyselectItem"); + if (self.type.identity(item) == currentActiveIdentity) li.addClass("active"); else li.removeClass("active"); @@ -97,7 +109,7 @@ select(item){ this.close(); this.selectedItem = item; - this.element.val(this.options.type.render(item)); + this.element.val(this.type.render(item)); this.markCurrentSelected(); } @@ -116,26 +128,38 @@ this.popup.empty(); $.each( items, function(){ var item = this; + var identity = self.type.identity(item); var li = $("
") .addClass("skyselect-item") - .append(self.options.type.render(this)) + .append(self.type.render(this)) .appendTo(self.popup) - .data("skyselect-item", this) + .data("skyselectItem", item) .on("click", function(ev){ self.select( item ); } ) - .on("hover", function(ev){ + .on("mouseover", function(ev){ self.markActive(item); }); + if (self.currentActiveIdentity == identity) + li.addClass("active"); }) this.markCurrentSelected(); } + valid(){ + return true; + } + onKeyDown(ev){ var self = this; switch (ev.which) { + case 13: // RETURN + if (this.isOpen){ + + } + break; case 27: // ESC this.close(); break; @@ -143,14 +167,15 @@ if (this.isOpen){ var currentActiveLi = $(".skyselect-item.active", this.popup); if (currentActiveLi.length){ - var nextLi = currentActiveLi.next(".skyselect-item"); - if (nextLi.length) + var prevLi = currentActiveLi.prev(".skyselect-item"); + if (prevLi.length) { + this.markActive(prevLi.data("skyselectItem")); } } else { - var firstLi = this.popup.first("skyselect-item"); + var firstLi = $(this.popup.children(".skyselect-item").get(0)); if (firstLi.length) - this.markActive(firstLi.data("skyselect-item")); + this.markActive(firstLi.data("skyselectItem")); } } break; @@ -161,11 +186,13 @@ var nextLi = currentActiveLi.next(".skyselect-item"); if (nextLi.length) { + this.markActive(nextLi.data("skyselectItem")); } } else { - var firstLi = this.popup.first(".skyselect-item"); - if (firstLi.length) - this.markActive(firstLi.data("skyselect-item")); + var firstLi = $(this.popup.children(".skyselect-item").get(0)); + if (firstLi.length){ + this.markActive(firstLi.data("skyselectItem")); + } } } else { this.open(); @@ -193,19 +220,31 @@ onFocusOut(ev){ var self = this; setTimeout( function(){ self.close(); }, 100 ); + this.restoreSelection(); } } $.fn.skySelect = function(options){ - $.each( this, function(index,item){ +/* $.each( this, function(index,item){ var skySelect = $(item).data("skySelect"); if (!skySelect) skySelect = new SkySelect(item,options); }); - if (this.length == 1) - return $(this).data("skySelect"); - return this; + + var me = $(this.get(0)); + if (me.hasClass("skyselect-wrapper")) + return me; + return me.parents(".skyselect-wrapper").data("skySelect"); + */ + var me = $(this.get(0)); + var skySelect = me.data("skySelect"); + if (skySelect && options){ + throw "skySelect() must not be called with options when already initiaized"; + } + if (!skySelect) + skySelect = new SkySelect(me,options); + return skySelect; } }( SKY, jQuery )); diff --git a/sky.types.reference.js b/sky.types.reference.js index b663031..821cfcd 100644 --- a/sky.types.reference.js +++ b/sky.types.reference.js @@ -48,6 +48,27 @@ }); */ this.html( html ); + this.lastSelectedItem = null; + } + + valid(){ + this.html().skySelect().valid(); + } + changed(){ + var skySelect = this.html().skySelect(); + return (skySelect.value() != this.lastSelectedItem); + } + + value(val){ + var skySelect = this.html().skySelect(); + + if (arguments.length) + { + this.lastSelectedItem = val; + skySelect.value(val); + return this; + } + return skySelect.value(); }