Skip to content

Instantly share code, notes, and snippets.

@samdroid-apps
Created March 8, 2015 09:43
Show Gist options
  • Save samdroid-apps/bf7f91e75c255a3c8dc7 to your computer and use it in GitHub Desktop.
Save samdroid-apps/bf7f91e75c255a3c8dc7 to your computer and use it in GitHub Desktop.
Highlight the palette menu bars on click
diff --git a/js/palette.js b/js/palette.js
index 50aff9e..8a114f5 100644
--- a/js/palette.js
+++ b/js/palette.js
@@ -1162,9 +1162,48 @@ function loadPaletteMenuHandler(palette) {
var locked = false;
var trashcan = palette.palettes.trashcan;
var paletteWidth = MENUWIDTH + (palette.columns * 160);
+ var circle = null;
+
+ palette.menuContainer.on('mousedown', function(event) {
+ if (circle !== null) {
+ palette.palettes.stage.removeChild(circle);
+ }
+
+ circle = new createjs.Shape();
+ circle.graphics.f(ACTIVECOLOR).drawCircle(0, 0, MENUWIDTH);
+ circle.alpha = 0;
+ palette.palettes.stage.addChild(circle);
+
+ var s = new createjs.Shape();
+ s.graphics.r(0, 0, MENUWIDTH, 42);
+ s.x = palette.menuContainer.x;
+ s.y = palette.menuContainer.y;
+ circle.mask = s;
+
+ createjs.Tween.get(circle)
+ .to({scaleX: 0.3, scaleY: 0.3,
+ x: event.rawX / palette.palettes.scale, y: event.rawY / palette.palettes.scale})
+ .to({scaleX: 1, scaleY: 1,
+ x: palette.menuContainer.x, y: palette.menuContainer.y},
+ 650, createjs.Ease.circInOut);
+
+ createjs.Tween.get(circle)
+ .to({alpha: 0.05}).to({alpha: 0.3}, 400);
+
+ palette.menuContainer.on('pressup', function(event) {
+ createjs.Tween.get(circle).to({alpha: 0}, 400);
+ setTimeout(function() {
+ palette.palettes.stage.removeChild(circle);
+ circle = null;
+ }, 650);
+ });
+ });
palette.menuContainer.on('click', function(event) {
if (Math.round(event.stageX / palette.palettes.scale) > palette.menuContainer.x + paletteWidth - STANDARDBLOCKHEIGHT) {
+ palette.palettes.stage.removeChild(circle);
+ circle = null;
+
palette.hide();
palette.palettes.refreshCanvas();
return;
@@ -1232,6 +1271,14 @@ function loadPaletteMenuHandler(palette) {
var dx = palette.menuContainer.x - oldX;
var dy = palette.menuContainer.y - oldY;
+ // Move the highlight circle
+ if (circle !== null) {
+ circle.x += dx;
+ circle.y += dy;
+ circle.mask.x += dx;
+ circle.mask.y += dy;
+ }
+
// If we are over the trash, warn the user.
if (trashcan.overTrashcan(event.stageX / palette.palettes.scale, event.stageY / palette.palettes.scale)) {
trashcan.highlight();
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment