wip image viewer comrpession edit

bin/style.css

@@ -1131,6 +1131,38 @@ input[type=checkbox]:checked:after {
 .hide-properties .cdb-large .btn-cdb-large {
   opacity: 1;
 }
+/* Image Viewer */
+.image-properties {
+  height: 100%;
+  background-color: #111;
+  width: 320px;
+}
+.image-properties .title {
+  text-align: center;
+  font-size: 12px;
+  margin: 4px;
+  background-color: #1e1e1e;
+}
+.image-properties .save-compression {
+  width: 100%;
+  margin: 4px;
+}
+.image-properties .compression-infos {
+  width: 100%;
+  margin-top: 10px;
+  margin-bottom: 10px;
+}
+.image-properties .field {
+  margin: 5px 5px 0 50px;
+  display: flex;
+  flex-direction: row;
+}
+.image-properties .field label {
+  margin-right: 4px;
+}
+.image-properties .field select {
+  flex-grow: 1;
+}
 /* Curve editor */
 .hide-curve-editor {
   position: relative;

bin/style.less

@@ -1221,6 +1221,45 @@ input[type=checkbox] {
 		}
 	}
 }
+/* Image Viewer */
+.image-properties {
+	height : 100%;
+	background-color: #111;
+	width: 320px;
+
+	.title {
+		text-align: center;
+		font-size: 12px;
+		margin: 4px;
+		background-color : rgb(30,30,30);
+	}
+
+	.save-compression {
+		width: 100%;
+		margin: 4px;
+	}
+
+	.compression-infos {
+		width: 100%;
+		margin-top: 10px;
+		margin-bottom: 10px;
+	}
+
+	.field {
+		margin: 5px 5px 0 50px;
+		display: flex;
+    	flex-direction: row;
+
+		label {
+			margin-right: 4px;
+		}
+
+		select {
+			flex-grow: 1;
+		}
+	}
+}
+
 
 /* Curve editor */
 @timelineHeight: 20px;

hide/view/Image.hx

@@ -76,20 +76,60 @@ class Image extends FileView {
 		element.html('
 			<div class="flex vertical">
 				<div class="toolbar"></div>
-				<div class="heaps-scene">
+				<div class="scene-partition" style="display: flex; flex-direction: row; flex: 1; overflow: hidden;">
+					<div class="heaps-scene"></div>
+					<div class="image-properties">
+						<div class="title">Image compression</div>
+						<div class="compression-infos"></div>
+						<input type="button" class="save-compression" value="Save"/>
+					</div>
 				</div>
 			</div>
 		');
 
 		cleanUp();
-
+		
 		scene = new hide.comp.Scene(config, null, element.find(".heaps-scene"));
 
+		var compressionInfo = element.find(".compression-infos");
+		function addField(parent: Element, label:String, options:Array<String>) {
+			var field = new Element('<div class="field">
+				<label>${label}</label>
+				<select class="field-select">
+				</select>
+			</div>');
+
+			var select = field.find(".field-select");
+			for (opt in options) {
+				select.append(new Element('<option value="${opt}">${opt}</option>'));
+			}
+
+			parent.append(field);
+		}
+
+		addField(compressionInfo, "Format :", ["No compression", "BC1", "BC2", "BC3", "R16U", "RG16U", "RGB16U", "RGBA16U"] );
+
+		var fs:hxd.fs.LocalFileSystem = Std.downcast(hxd.res.Loader.currentInstance.fs, hxd.fs.LocalFileSystem);
+		@:privateAccess var textureConvertRule = fs.convert.getConvertRule(state.path);
+
+		var fieldSelect = compressionInfo.find(".field-select");
+		fieldSelect.val(textureConvertRule == null ? "No compression" : textureConvertRule.cmd.params.format);
+		fieldSelect.on("change", function(_) {
+			var newVal = fieldSelect.val();
+			trace(newVal);
+		});
+
 		this.saveDisplayKey = state.path;
 		this.viewMode = getDisplayState("ViewMode");
 		if (this.viewMode == null)
 			this.viewMode = Compressed;
 
+		var saveCompression = element.find(".save-compression");
+		saveCompression.on("click", function(_) {
+			var dirPos = state.path.lastIndexOf("/");
+			//var name = dirPos < 0 ? path : path.substr(dirPos + 1);
+		});
+
 		var shader = new ImageViewerShader();
 
 		tools = new hide.comp.Toolbar(null,element.find(".toolbar"));