0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

some menu scrolling

Browse source
This commit is contained in:
Rolux 2010-02-05 20:29:24 +05:30
parent 4d24f9baa3
commit d3fc6207de
2 changed files with 51 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

46
build/js/ox.ui.js
View file

@ -458,6 +458,7 @@ requires
$(function() { $(function() {
$document.keydown(keydown); $document.keydown(keydown);
$document.keypress(keydown);
}); });
function keydown(event) { function keydown(event) {
var key, var key,
@ -1757,9 +1758,9 @@ requires
"OxMenu Ox" + Ox.toTitleCase(self.options.side) + "OxMenu Ox" + Ox.toTitleCase(self.options.side) +
" Ox" + Ox.toTitleCase(self.options.size) " Ox" + Ox.toTitleCase(self.options.size)
), ),
itemHeight = options.size == "small" ? 12 : (options.size == "medium" ? 16 : 20), itemHeight = self.options.size == "small" ? 12 : (self.options.size == "medium" ? 16 : 20),
scrollSpeed = 1, scrollSpeed = 1, // fixme: should this be self.scrollSpeed?
$item; $item; // fixme: used?
// construct // construct
that.items = []; that.items = [];
@ -1835,7 +1836,8 @@ requires
} }
function constructScrollbar(direction) { function constructScrollbar(direction) {
var interval; var interval,
speed = direction == "up" ? -1 : 1;
return $("<div/>", { return $("<div/>", {
"class": "OxScrollbar Ox" + Ox.toTitleCase(direction), "class": "OxScrollbar Ox" + Ox.toTitleCase(direction),
html: oxui.symbols["triangle_" + direction], html: oxui.symbols["triangle_" + direction],
@ -1858,9 +1860,9 @@ requires
}); });
} }
} }
scrollMenu(direction == "up" ? -1 : 1); scrollMenu(speed);
interval = setInterval(function() { interval = setInterval(function() {
scrollMenu(direction == "up" ? -1 : 1); scrollMenu(speed);
}, 100); }, 100);
}, },
mouseleave: function() { mouseleave: function() {
@ -1918,22 +1920,17 @@ requires
if (top <= min) { if (top <= min) {
top = min; top = min;
that.$scrollbars.down.hide().trigger("mouseleave"); that.$scrollbars.down.hide().trigger("mouseleave");
that.$container.css({ that.$container.height(containerHeight + itemHeight);
height: (containerHeight + itemHeight) + "px" that.items[that.items.length - 1].trigger("mouseover");
});
that.$items[that.$items.length - 1].trigger("mouseover");
} else if (top >= max - itemHeight) { } else if (top >= max - itemHeight) {
top = max; top = max;
that.$scrollbars.up.hide().trigger("mouseleave"); that.$scrollbars.up.hide().trigger("mouseleave");
that.$container.css({ that.$container.height(containerHeight + itemHeight);
height: (containerHeight + itemHeight) + "px" that.items[0].trigger("mouseover");
});
that.$items[0].trigger("mouseover");
} }
that.$content.css({ that.$content.css({
top: top + "px" top: top + "px"
}); });
} }
function selectNextItem() { function selectNextItem() {
@ -1994,12 +1991,19 @@ requires
that.hideMenu = function() { that.hideMenu = function() {
Ox.print("hideMenu") Ox.print("hideMenu")
$.each(that.submenus, function(i, submenu) { $.each(that.submenus, function(i, submenu) {
if (!submenu.is(":hidden")) { if (submenu.is(":visible")) {
submenu.hideMenu(); submenu.hideMenu();
return false; return false;
} }
}); });
// fixme: scroll menu back up! // fixme: scroll menu back up!
if (that.$scrollbars.up.is(":visible")) {
that.$content.css({
top: "0px"
});
that.$scrollbars.up.hide();
that.$container.height(that.$container.height() + itemHeight);
}
that.hide(); that.hide();
if (self.options.selected > -1) { if (self.options.selected > -1) {
that.items[self.options.selected].trigger("mouseleave"); that.items[self.options.selected].trigger("mouseleave");
@ -2028,12 +2032,14 @@ requires
height = self.options.element.outerHeight(), height = self.options.element.outerHeight(),
left = offset.left + self.options.offset.left + (self.options.side == "bottom" ? 0 : width), left = offset.left + self.options.offset.left + (self.options.side == "bottom" ? 0 : width),
top = offset.top + self.options.offset.top + (self.options.side == "bottom" ? height : 0), top = offset.top + self.options.offset.top + (self.options.side == "bottom" ? height : 0),
maxHeight = Math.floor(($window.height() - top - 12) / itemHeight) * itemHeight; menuHeight = that.outerHeight(),
maxHeight = Math.floor($window.height() - top - 16);
Ox.print("height", height, "maxHeight", maxHeight);
that.css({ that.css({
left: left + "px", left: left + "px",
top: top + "px" top: top + "px"
}).show(); }).show();
if (height > maxHeight) { if (menuHeight > maxHeight) {
that.$container.height(maxHeight - itemHeight); that.$container.height(maxHeight - itemHeight);
that.$scrollbars.down.show(); that.$scrollbars.down.show();
} }
@ -2133,11 +2139,12 @@ requires
); );
function click() { function click() {
if (!that.hasClass("OxDisabled") && !self.options.items.length) { if (!that.hasClass("OxDisabled")) {
self.options.menu.hideMenu(); self.options.menu.hideMenu();
if (self.options.menu.options("parent")) { if (self.options.menu.options("parent")) {
self.options.menu.options("parent").hideMenu(); self.options.menu.options("parent").hideMenu();
} }
if (!self.options.items.length) {
if (self.options.checked !== null && (!self.options.group || !self.options.checked)) { if (self.options.checked !== null && (!self.options.group || !self.options.checked)) {
that.options({ that.options({
checked: !self.options.checked checked: !self.options.checked
@ -2152,6 +2159,7 @@ requires
}); });
} }
} }
}
function isSelected() { function isSelected() {
return self.options.position == self.options.menu.options("selected"); return self.options.position == self.options.menu.options("selected");

15
demos/test/menu.js
View file

@ -97,7 +97,20 @@ $(function() {
title: "Twelfth" title: "Twelfth"
}, },
], ],
title: "Even More", title: "Even More"
},
{},
{
id: "foo",
title: "Foo"
},
{
id: "bar",
title: "Bar"
},
{
id: "baz",
title: "Baz"
} }
] ]
}); });