added panel visual indicator on open (not sure if the trigger belongs where it currently is)...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2014-01-07 23:10:50 +04:00
parent 837ee9120f
commit 00afb047e3
4 changed files with 28 additions and 6 deletions

View File

@ -127,7 +127,7 @@ Roadmap
[X] bookmarked (list) operations [X] bookmarked (list) operations
[X] mark/unmark tagged [X] mark/unmark tagged
[X] crop [X] crop
[_] 33% Panels [_] 34% Panels
[X] 100% panel constructors [X] 100% panel constructors
[X] panel [X] panel
[X] side-panel [X] side-panel
@ -135,12 +135,12 @@ Roadmap
[_] 0% panel state [_] 0% panel state
[_] track panel state [_] track panel state
[_] use panel state for defaults when opening panels [_] use panel state for defaults when opening panels
[_] 66% actions [_] 75% actions
[_] 66% openPanel [X] 100% openPanel
[X] if panel is not loaded load it [X] if panel is not loaded load it
[X] if a panel is not open, open it and all parents [X] if a panel is not open, open it and all parents
| XXX need to open auto-hidden side panels... | XXX need to open auto-hidden side panels...
[_] focus panel (???) [X] blink panel
[_] openPanels [_] openPanels
[X] closePanel [X] closePanel
| collapse a panel... | collapse a panel...

View File

@ -77,6 +77,9 @@
border: solid 1px silver; border: solid 1px silver;
box-shadow: none; box-shadow: none;
} }
.sub-panel.blink {
box-shadow: 0px 0px 10px 0px rgba(255,0,0,1)
}
.sub-panel summary { .sub-panel summary {
background: #ddd; background: #ddd;
/* /*
@ -261,6 +264,9 @@
.dark .sub-panel { .dark .sub-panel {
border: solid 1px #333; border: solid 1px #333;
} }
.dark .sub-panel.blink {
box-shadow: 0px 0px 10px 0px rgba(255,255,0,1)
}
.dark .sub-panel summary { .dark .sub-panel summary {
background: #333; background: #333;
color: silver; color: silver;
@ -339,6 +345,9 @@
.gray .sub-panel { .gray .sub-panel {
border: solid 1px #454545; border: solid 1px #454545;
} }
.gray .sub-panel.blink {
box-shadow: 0px 0px 10px 0px rgba(255,255,0,1)
}
.gray .sub-panel summary { .gray .sub-panel summary {
background: #444; background: #444;
color: silver; color: silver;

View File

@ -97,7 +97,7 @@ $(function(){
</script> </script>
<body> <body>
<p>click <a href="javascript:toggleAutoHide()">here to toggle panel autohide</a> and <a href="javascript:toggleThemes()">here to toggle theme...</a></p> <p>click <a href="javascript:openPanel('Edit: Filters')">to show the editor panel</a> and <a href="javascript:toggleThemes()">here to toggle theme...</a></p>
</body> </body>
</html> </html>

View File

@ -141,6 +141,16 @@ function getPanel(title){
} }
function blinkPanel(panel){
panel
.addClass('blink')
setTimeout(function(){
panel.removeClass('blink')
}, 170)
return panel
}
/********************************************************************** /**********************************************************************
* Constructors... * Constructors...
@ -470,7 +480,10 @@ function openPanel(panel){
panel.trigger('panelOpening', panel) panel.trigger('panelOpening', panel)
} }
return panel //return panel
// XXX should we be blinking here???
// ...is this the right context for this???
return blinkPanel(panel)
} }