fixes for hide-cdb : fixed search, undo, display

bin/style.css

@@ -3,9 +3,6 @@ body {
   padding: 0;
   background-color: black;
 }
-a {
-  text-decoration: none;
-}
 ul,
 li {
   margin: 0;
@@ -26,6 +23,10 @@ body .select2-dropdown {
   font-size: 9pt;
   color: #aaa;
 }
+a {
+  color: #aaf;
+  text-decoration: none;
+}
 canvas {
   user-select: none;
 }
@@ -417,11 +418,14 @@ input[type=checkbox]:checked:after {
   user-select: none;
 }
 .hide-tabs .tabs-header > div.active {
-  background-color: #222;
-  color: #ccc;
+  background-color: #333;
+  color: #bbb;
   border-bottom-color: #222;
   border-top-right-radius: 0px;
 }
+.hide-tabs .tabs-header > div.active:hover {
+  background-color: #333;
+}
 .hide-tabs .tabs-header > div:hover {
   background-color: #282828;
 }
@@ -435,6 +439,22 @@ input[type=checkbox]:checked:after {
   width: 100%;
   height: 100%;
 }
+.hide-tabs.tabs-bottom > .tabs-header {
+  width: 100%;
+  position: fixed;
+  bottom: 0px;
+  padding-top: 0px;
+  padding-bottom: 5px;
+  z-index: 1;
+}
+.hide-tabs.tabs-bottom > .tabs-header > div {
+  border-top: none;
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 5px;
+}
+.hide-tabs.tabs-bottom > .tabs-header > div.active {
+  border-radius: 0px;
+}
 .searchBox {
   display: none;
   width: 200px;

bin/style.less

@@ -6,10 +6,6 @@ body {
 
 //:focus { outline: none; }
 
-a {
-	text-decoration : none;
-}
-
 ul, li {
 	margin : 0;
 	padding : 0;
@@ -22,6 +18,11 @@ body, td, th, li, p, a, input, select, textarea, body .select2-dropdown {
 	color: #aaa;
 }
 
+a {
+	color : #aaf;
+	text-decoration : none;
+}
+
 canvas {
 	user-select: none;
 }
@@ -445,11 +446,14 @@ input[type=checkbox] {
 			border-top-right-radius: 5px;
 			user-select: none;
 			&.active {
-				background-color : #222;
-				color : #ccc;
+				background-color : #333;
+				color : #bbb;
 				border-bottom-color : #222;
 				border-top-right-radius: 0px;
 			}
+			&.active:hover {
+				background-color : #333;
+			}
 			&:hover {
 				background-color : #282828;
 			}
@@ -467,6 +471,25 @@ input[type=checkbox] {
 	}
 }
 
+.hide-tabs.tabs-bottom {
+	>.tabs-header {
+		width:100%;
+		position: fixed;
+		bottom : 0px;
+		padding-top : 0px;
+		padding-bottom : 5px;
+		z-index: 1;
+		&>div {
+			border-top : none;
+			border-top-right-radius: 0;
+			border-bottom-right-radius: 5px;
+			&.active {
+				border-radius: 0px;
+			}
+		}
+	}
+}
+
 
 .searchBox {
 	display : none;
@@ -1894,3 +1917,5 @@ div.sp-container {
 	max-height: 800px;
     min-width: 600px;
 }
+
+// CDB view

hide/comp/Tabs.hx

@@ -5,9 +5,10 @@ class Tabs extends Component {
 	public var currentTab(default, set) : Element;
 	var header : Element;
 
-	public function new(?parent,?el) {
+	public function new(?parent,?el,bottomTabs=false) {
 		super(parent,el);
 		element.addClass("hide-tabs");
+		if( bottomTabs ) element.addClass("tabs-bottom");
 		header = new Element("<div>").addClass("tabs-header").prependTo(element);
 		syncTabs();
 		var t = getTabs()[0];

hide/comp/cdb/Cursor.hx

@@ -79,14 +79,25 @@ class Cursor {
 			select = null;
 		else if( select == null )
 			select = { x : x, y : y };
-		if( dx < 0 && (table.displayMode == Table ? x >= 0 : x > 0) )
-			x--;
-		if( dy < 0 && y > 0 )
-			y--;
-		if( dx > 0 && x < table.sheet.columns.length - 1 )
-			x++;
-		if( dy > 0 && y < table.lines.length - 1 )
-			y++;
+		if( dx < 0 ) {
+			x += dx;
+			var minX = table.displayMode == Table ? -1 : 0;
+			if( x < minX ) x = minX;
+		}
+		if( dy < 0 ) {
+			y += dy;
+			if( y < 0 ) y = 0;
+		}
+		if( dx > 0 ) {
+			x += dx;
+			var max = table.sheet.columns.length;
+			if( x >= max ) x = max - 1;
+		}
+		if( dy > 0 ) {
+			y += dy;
+			var max = table.lines.length;
+			if( y >= max ) y = max - 1;
+		}
 		update();
 	}
 

hide/comp/cdb/Editor.hx

@@ -21,6 +21,7 @@ typedef EditorApi = {
 class Editor extends Component {
 
 	var base : cdb.Database;
+	var sheetName : String;
 	var sheet : cdb.Sheet;
 	var existsCache : Map<String,{ t : Float, r : Bool }> = new Map();
 	var tables : Array<Table> = [];
@@ -32,6 +33,7 @@ class Editor extends Component {
 		schema : Array<cdb.Data.Column>,
 	};
 	var changesDepth : Int = 0;
+	var currentFilter : String;
 	var api : EditorApi;
 	public var config : hide.Config;
 	public var cursor : Cursor;
@@ -43,6 +45,7 @@ class Editor extends Component {
 		this.api = api;
 		this.config = config;
 		this.sheet = sheet;
+		sheetName = sheet == null ? null : sheet.name;
 		if( api.undoState == null ) api.undoState = [];
 		if( api.editor == null ) api.editor = this;
 		if( api.currentValue == null ) api.currentValue = api.copy();
@@ -66,7 +69,7 @@ class Editor extends Component {
 		keys.addListener(onKey);
 		keys.register("search", function() {
 			searchBox.show();
-			searchBox.find("input").focus().select();
+			searchBox.find("input").val("").focus().select();
 		});
 		keys.register("copy", onCopy);
 		keys.register("paste", onPaste);
@@ -116,8 +119,16 @@ class Editor extends Component {
 		case K.TAB:
 			cursor.move( e.shiftKey ? -1 : 1, 0, false, false);
 			return true;
+		case K.PGUP:
+			cursor.move(0, -10, e.shiftKey, e.ctrlKey);
+			return true;
+		case K.PGDOWN:
+			cursor.move(0, 10, e.shiftKey, e.ctrlKey);
+			return true;
 		case K.SPACE:
 			e.preventDefault(); // prevent scroll
+		case K.ESCAPE:
+			if( currentFilter != null ) searchFilter(null);
 		}
 		return false;
 	}
@@ -126,7 +137,7 @@ class Editor extends Component {
 		if( filter == "" ) filter = null;
 		if( filter != null ) filter = filter.toLowerCase();
 
-		var lines = element.find("table.cdb-sheet > tr").not(".head");
+		var lines = element.find("table.cdb-sheet > tbody > tr").not(".head");
 		lines.removeClass("filtered");
 		if( filter != null ) {
 			for( t in lines ) {
@@ -138,6 +149,7 @@ class Editor extends Component {
 				lines.removeClass("filtered");
 			}
 		}
+		currentFilter = filter;
 	}
 
 	function onCopy() {
@@ -372,13 +384,13 @@ class Editor extends Component {
 
 		// swap sheet if it was modified
 		for( s in base.sheets )
-			if( s.name == this.sheet.name ) {
+			if( s.name == sheetName ) {
 				this.sheet = s;
 				break;
 			}
 	}
 
-	function refreshAll( ?state : UndoState ) {
+	final function refreshAll( ?state : UndoState ) {
 		api.editor.refresh(state);
 	}
 
@@ -393,7 +405,7 @@ class Editor extends Component {
 		element.addClass('cdb');
 
 		searchBox = new Element("<div>").addClass("searchBox").appendTo(element);
-		new Element("<input type='text'>").appendTo(searchBox).keydown(function(e) {
+		var txt = new Element("<input type='text'>").appendTo(searchBox).keydown(function(e) {
 			if( e.keyCode == 27 ) {
 				searchBox.find("i").click();
 				return;
@@ -404,6 +416,9 @@ class Editor extends Component {
 		new Element("<i>").addClass("fa fa-times-circle").appendTo(searchBox).click(function(_) {
 			searchFilter(null);
 			searchBox.toggle();
+			var c = cursor.save();
+			focus();
+			cursor.load(c);
 		});
 
 		if( sheet.columns.length == 0 ) {

hide/view/CdbTable.hx

@@ -8,10 +8,10 @@ class CdbTable extends hide.ui.View<{ path : String }> {
 
 	public function new( ?state ) {
 		super(state);
-		updateSheet();
+		updateSheets();
 	}
 
-	function updateSheet() {
+	function updateSheets() {
 		if( state.path == null )
 			sheets = [for( s in ide.database.sheets ) if( !s.props.hide ) s];
 		else {
@@ -28,6 +28,7 @@ class CdbTable extends hide.ui.View<{ path : String }> {
 	}
 
 	function setEditor(index:Int) {
+		updateSheets();
 		if( editor != null )
 			editor.remove();
 		editor = new hide.comp.cdb.Editor(sheets[index],config,ide.databaseApi,tabContents[index]);
@@ -41,20 +42,26 @@ class CdbTable extends hide.ui.View<{ path : String }> {
 			element.text("CDB sheet not found '" + state.path + "'");
 			return;
 		}
-		var tabs = sheets.length == 1 ? null : new hide.comp.Tabs(element);
-		if( tabs != null )
-			tabs.onTabChange = setEditor;
+		if( sheets.length == 0 ) {
+			element.html("No CDB sheet created, <a href='#'>create one</a>");
+			element.find("a").click(function(_) ide.error("TODO"));
+			return;
+		}
+		element.addClass("cdb-view");
+		var tabs = sheets.length == 1 ? null : new hide.comp.Tabs(element, true);
 		tabContents = [];
 		for( sheet in sheets ) {
 			var tab = tabs == null ? element : tabs.createTab(sheet.name);
 			var sc = new hide.comp.Scrollable(tab);
 			tabContents.push(sc.element);
 		}
+		if( tabs != null )
+			tabs.onTabChange = setEditor;
 		if( sheets.length > 0 )
 			setEditor(0);
 
 		watch(@:privateAccess ide.databaseFile, () -> {
-			updateSheet();
+			updateSheets();
 			rebuild();
 		});
 	}