made overlay blur optional...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2016-11-08 17:27:27 +03:00
parent 42da8c67f0
commit 0ee066261f
4 changed files with 39 additions and 8 deletions

View File

@ -45,10 +45,6 @@
/* NOTE: this does not include text... /* NOTE: this does not include text...
...need a way to go around this... ...need a way to go around this...
*/ */
.blur>* {
-webkit-filter: blur(2px) saturate(0.3);
filter: blur(2px) saturate(0.3);
}
.blur>.drawer-widget { .blur>.drawer-widget {
-webkit-filter: none; -webkit-filter: none;
filter: none; filter: none;

View File

@ -70,15 +70,29 @@
/* NOTE: this does not include text... /* NOTE: this does not include text...
...need a way to go around this... ...need a way to go around this...
*/ */
.blur>* { .blur>* {
-webkit-filter: blur(2px) saturate(0.3); /*-webkit-filter: blur(2px) saturate(0.3);
filter: blur(2px) saturate(0.3); filter: blur(2px) saturate(0.3);*/
-webkit-filter: saturate(0.5) brightness(0.8);
filter: saturate(0.5) brightness(0.8);
} }
.blur>.overlay-widget { .blur>.overlay-widget {
-webkit-filter: blur(0.8px) saturate(0.3); /*-webkit-filter: blur(0.8px) saturate(0.3);
filter: blur(0.8px) saturate(0.3); filter: blur(0.8px) saturate(0.3);*/
-webkit-filter: saturate(0.5) brightness(0.8);
filter: saturate(0.5) brightness(0.8);
} }
.overlay-blur-enabled.blur>* {
-webkit-filter: blur(2px) saturate(0.5) brightness(0.8);
filter: blur(2px) saturate(0.5) brightness(0.8);
}
.overlay-blur-enabled.blur>.overlay-widget {
-webkit-filter: blur(0.8px) saturate(0.5) brightness(0.8);
filter: blur(0.8px) saturate(0.5) brightness(0.8);
}
.blur>.overlay-widget:last-child { .blur>.overlay-widget:last-child {
-webkit-filter: none; -webkit-filter: none;
filter: none; filter: none;

View File

@ -27,6 +27,8 @@ var toggler = require('lib/toggler')
// For more docs see: docs for actions.js and .chainApply(..) // For more docs see: docs for actions.js and .chainApply(..)
// //
// XXX might be good to move this to actions.js // XXX might be good to move this to actions.js
// XXX might also be a good idea to mark the actual protocol definition
// and not just the implementation...
var protocol = var protocol =
module.protocol = function(protocol, func){ module.protocol = function(protocol, func){
return function(){ return function(){

View File

@ -8,6 +8,7 @@
/*********************************************************************/ /*********************************************************************/
var keyboard = require('lib/keyboard') var keyboard = require('lib/keyboard')
var toggler = require('lib/toggler')
var actions = require('lib/actions') var actions = require('lib/actions')
var features = require('lib/features') var features = require('lib/features')
@ -432,6 +433,8 @@ var makeDrawer = function(direction){
var DialogsActions = actions.Actions({ var DialogsActions = actions.Actions({
config: { config: {
'ui-default-container': 'Overlay', 'ui-default-container': 'Overlay',
'ui-overlay-blur': 'on',
}, },
// a bit of introspection... // a bit of introspection...
@ -563,6 +566,11 @@ var DialogsActions = actions.Actions({
make.done() make.done()
}) })
})], })],
toggleOverlayBlur: ['Interface/',
toggler.CSSClassToggler(
function(){ return this.ribbons.viewer },
'overlay-blur-enabled',
function(state){ this.config['ui-overlay-blur'] = state }) ],
}) })
var Dialogs = var Dialogs =
@ -578,6 +586,11 @@ module.Dialogs = core.ImageGridFeatures.Feature({
actions: DialogsActions, actions: DialogsActions,
handlers: [ handlers: [
['start',
function(){
this.config['ui-overlay-blur']
&& this.toggleOverlayBlur(this.config['ui-overlay-blur'])
}],
['__call__', ['__call__',
function(res, action){ function(res, action){
if(res instanceof jQuery || (res instanceof widget.Widget)){ if(res instanceof jQuery || (res instanceof widget.Widget)){
@ -992,6 +1005,12 @@ module.ContextActionMenu = core.ImageGridFeatures.Feature({
var WidgetTestActions = actions.Actions({ var WidgetTestActions = actions.Actions({
testAction: ['- Test/',
function(){
console.log('>>>', [].slice.call(arguments))
return function(){
console.log('<<<', [].slice.call(arguments)) }}],
// Usage Examples: // Usage Examples:
// .testDrawer() - show html in base drawer... // .testDrawer() - show html in base drawer...
// .testDrawer('Header', 'paragraph') - show html with custom text... // .testDrawer('Header', 'paragraph') - show html with custom text...