Browse files

should add a lock mode

  • Loading branch information...
1 parent 62eaf02 commit 8e7ce954caf7b1673cc81926c2a53450ac1894e0 @stenson committed May 9, 2012
Showing with 29 additions and 26 deletions.
  1. +12 −24 script/functions.js
  2. +0 −1 script/funklet.js
  3. +17 −1 style/diagram.css
View
36 script/functions.js
@@ -69,12 +69,13 @@ var writeMeasures = function(count, measureBlock) {
if (count > 1) {
var $block = $(measureBlock).show();
var width = $block.width() / count;
+ var i = 1;
do {
$block.append(
- $('<div/>').addClass('measure').width(width-1).text(count)
+ $('<div/>').addClass('measure').width(width-1).text(i)
);
- } while (--count)
+ } while (++i <= count)
return $block.children();
} else {
@@ -86,10 +87,14 @@ var animateGridForMeasureChanges = function(diagram, grid, $blocks) {
var shouldAnimate = true;
var queued = false;
var $grid = $(grid);
+ var visibleFrame = 1;
var currentFrame = null;
var animate = function(frame, speed) {
- $grid.animate({ top: (-((frame||currentFrame)/32 * 93)) }, speed || 100);
+ var f = (typeof frame == 'number' ? frame : currentFrame) / 32;
+ visibleFrame = f;
+ $grid.animate({ top: (-(f * 93)) }, speed || 0);
+ $blocks.removeClass('selected').eq(visibleFrame).addClass('selected');
};
$(diagram)
@@ -98,16 +103,18 @@ var animateGridForMeasureChanges = function(diagram, grid, $blocks) {
})
.on('mouseleave', function() {
shouldAnimate = true;
- if (queued) animate();
+ if (queued) animate(null, 300);
});
$blocks.on('click', function() {
- animate((parseInt($(this).text(), 10) - 1) * 32, "slow");
+ lockGrid = true;
+ animate((parseInt($(this).text(), 10) - 1) * 32, 300);
});
return function(i) {
currentFrame = i;
shouldAnimate ? animate() : (queued = true);
+ $blocks.removeClass('current').eq(i/32).addClass('current');
};
};
@@ -198,25 +205,6 @@ var writeModifiersIntoTable = function(length, where, modifiedValues, hats) {
return tds;
};
-var makeGridDraggable = function(grid) {
- var start = false;
- var $grid = $(grid);
- var offsetTop = $grid.offset().top;
-
- $grid
- .on('mousedown', function(event) {
- start = event.pageY;
- })
- .on('mousemove', function(event) {
- if (start !== false) {
- $grid.css('top', event.pageY - offsetTop);
- }
- })
- .on('mouseup', function() {
- start = false;
- });
-};
-
/* listening for value changes */
var listenForValuesFromRows = function(rows, values, limit, modifiers) {
View
1 script/funklet.js
@@ -58,7 +58,6 @@ var rows = writeValuesIntoTable(values, trs.slice(1), names);
var grid = getElement("grid");
var measureBlocks = writeMeasures(count/32, getElement("measures"));
var updateGrid = animateGridForMeasureChanges(diagram, grid, measureBlocks);
-//makeGridDraggable(grid);
/*
--------------------------------------------------------------------
View
18 style/diagram.css
@@ -393,7 +393,7 @@
width: 20px;
color: #888;
background: #eee;
- float: right;
+ float: left;
text-align: center;
font-size: 10px;
line-height: 18px;
@@ -406,6 +406,22 @@
color: white;
}
+#measures .measure.selected {
+ background: white;
+ color: rgb(238, 153, 162);
+ font-weight: bold;
+}
+
+#measures .measure.current {
+ background: #777;
+ color: white;
+}
+
+#measures .measure.selected.current {
+ background: rgb(238, 153, 162);
+ color: white;
+}
+
#swing-meter {
height: 20px;
width: 143px;

0 comments on commit 8e7ce95

Please sign in to comment.