From 830e1f9cc5c8ae73b4b783963dd2edc204c7b7a5 Mon Sep 17 00:00:00 2001
From: "Alex A. Naanou" <alex.nanou@gmail.com>
Date: Sun, 3 Sep 2017 05:26:24 +0300
Subject: [PATCH] experementing with image rendering, still odd with chrome...

Signed-off-by: Alex A. Naanou <alex.nanou@gmail.com>
---
 ui (gen4)/css/layout.less |  7 +++++++
 ui (gen4)/features/ui.js  | 18 ++++++++++++++++++
 2 files changed, 25 insertions(+)

diff --git a/ui (gen4)/css/layout.less b/ui (gen4)/css/layout.less
index 60c8f1e0..5eab5635 100755
--- a/ui (gen4)/css/layout.less	
+++ b/ui (gen4)/css/layout.less	
@@ -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;
diff --git a/ui (gen4)/features/ui.js b/ui (gen4)/features/ui.js
index ff3e6f09..d7dafc0e 100755
--- a/ui (gen4)/features/ui.js	
+++ b/ui (gen4)/features/ui.js	
@@ -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){