experementing with image rendering, still odd with chrome...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
This commit is contained in:
Alex A. Naanou 2017-09-03 05:26:24 +03:00
parent d157c9083f
commit 830e1f9cc5
2 changed files with 25 additions and 0 deletions

View File

@ -648,6 +648,13 @@ stretching in width... */
background-size: contain;
border: solid @image-border transparent;
}
.crisp-resize .image {
image-rendering: -webkit-optimize-contrast;
image-rendering: crisp-edges;
}
/*
.current.image {
border: solid 5px red;

View File

@ -203,6 +203,16 @@ module.ViewerActions = actions.Actions({
'ribbon-align-mode': null,
'ribbon-align-delay': 50,
// Change image rendering modes...
//
// See:
// .toggleImageRendering(..)
// css/layout.css
//
// XXX EXPERIMENTAL: this does not seem to have an effect on chrome...
'image-rendering': 'crisp-resize',
},
// Viewer dom...
@ -669,6 +679,12 @@ module.ViewerActions = actions.Actions({
function(target){ }],
ribbonRotation: ['- Interface|Ribbon/',
function(angle){ }],
toggleImageRendering: ['Interface/Image rendering',
toggler.CSSClassToggler(
function(){ return this.dom },
['crisp-resize', 'default-resize'],
function(state){ this.config['image-rendering'] = state }) ],
})
var Viewer =
@ -706,6 +722,8 @@ module.Viewer = core.ImageGridFeatures.Feature({
&& this.toggleRibbonTheme(this.config['ribbon-theme'])
this.config['ribbon-image-separators']
&& this.toggleRibbonImageSepators(this.config['ribbon-image-separators'])
this.config['ribbon-theme']
&& this.toggleImageRendering(this.config['image-rendering'])
// center viewer on resize events...
if(!this.__viewer_resize){