DBTreeView alternative?

Classic Servoy
41

Thanks Gabi, I will create a feature request, in the meantime I’m trying to use the setStyleSheet() but there are some problems:
1 - color (font and border) is honored in smart client but not in webclient
2 - font is not honored in webclient
3 - setRowHeight(100) is ignored in webclient
4 - on MacOS smart client font is not honored
5 - on Win SmartClient some labels are truncated until they receive focus (see the “Logout” label, the last one in the screenshot)

See the attached screenshot.

[attachment=0]treeBean.png[/attachment]

I will create an issue in servoyforge also for this.

treeBean.png
treeBean.png1048×1051 76.2 KB

42

Sorry, forgot to paste the code:

forms.nav_web2_tree.elements.bean_tree.setDataSet(_ds)
	forms.nav_web2_tree.elements.bean_tree.setColumnWidth('treeColumn', 280);
	forms.nav_web2_tree.elements.bean_tree.setHeaderVisible(false);
	forms.nav_web2_tree.elements.bean_tree.onNodeClicked(forms.nav_web2_tree.onNodeClick);
	forms.nav_web2_tree.elements.bean_tree.setColumnTextFormat('treeColumn', '<html>$text</html>');
	if(application.getApplicationType() == APPLICATION_TYPES.SMART_CLIENT)
	{
		var _myStyle = 'treeview { background-color: transparent; color: #2b3038; border-style: solid; font: 14pt "Lucida Grande", "Helvetica Neue", Helvetica, Arial, sans-serif, Verdana; }'
		forms.nav_web2_tree.elements.bean_tree.setRowHeight(20);
	}
	else // Webclient
	{
		var _myStyle = 'treeview { background-color: transparent; color: #2b3038; border-style: solid; font: 14pt "Lucida Grande", "Helvetica Neue", Helvetica, Arial, sans-serif, Verdana; }'
		forms.nav_web2_tree.elements.bean_tree.setRowHeight(100);
	}
	forms.nav_web2_tree.elements.bean_tree.setStyleSheet(_myStyle);
43

I don’t understand why there are two beans, anymore, one from Servoy and one from ServoyForge

In Servoy you can create now from a dataset a datasource, that can be used in the Servoy DBTreeView now…
So what’s the point, of maintaining two beans, with different feature set’s? Or why not merge them together?

44

Since when the default Servoy TreeViewBean can use datasets? I missed that one…
Having a quick look at it in servoy 7.1 I don’t see functions to load a dataset.

45

You can now create (from a dataset) a datasource as a temptable, and use that in the DBTreeview, look here: https://support.servoy.com/browse/SVY-3686

46

I see but I’d still prefer to use the alternative one, for navigation purposes it’s faster compared to the one based on foundsets (I guess all data is kept in memory and no query fired against the db). The default one has also some issue in webclient with the icons realoading too often.

47

[attachment=0]tree.png[/attachment]

tree.jpg
tree.jpg1040×1200 254 KB

48

Very cool David!
What is that exactly?

49

ngervasi:
Very cool David!
What is that exactly?

It’s Servoy’s web client going really really fast. And a lot of other cool things.

[attachment=0]slickgrid-servoy.png[/attachment]

slickgrid-servoy.png
slickgrid-servoy.png1160×1025 222 KB

50

Very cool! Any more info you can share about it?

51

Wow, looks great.

52

Hey, great work David.

How will you release this, as we’ve also planned to wrap SlickGrid into a module shortly.

Paul

53

pbakker:
Hey, great work David.

How will you release this, as we’ve also planned to wrap SlickGrid into a module shortly.

Thanks! Open to suggestions. We’ve tossed around the idea of trying something different and running it as a “Kickstarter” project:

  1. Enterprise contributor, $2,000 (target: 5)
  • access to project (wiki and forums)
  • access to SVN (with commit privileges if Troy likes your code)
  • voting on feature priorities
  • help setting up styles/css for your frameworks/apps
  1. Developer contributor, $500 (target: 10)
  • access to project (wiki and forums)
  • access to periodic builds (every 4-6 weeks)

Initial build out the gate will include implementations for:

• formatters
• CRUD methods
• validation methods
• example: million row grid (Servoy table)
• example: tree view

Of course, we should throw in the all important T-shirts for everyone! :)

In all seriousness, we’d be glad to MIT open source this project given a little bit of help. As we all know, there’s a significant gap between developing something for internal use and something for everyone to use. In the end, it’s easier for us to put that extra effort into something else and keep this as a Data Sutra customer feature unless convinced otherwise.

In the meantime, our clients are freaking out about this stuff and we’re working furiously to get into production systems as fast as possible. As in…next week. I can confirm that this is absolutely the way to go if serious about web client.

54

Million rows in tree view with data type specific inline data entry:

55

wow! Look at the performance of this: http://mleibman.github.io/SlickGrid/exa … aview.html

That would give Servoy (webclient) a boost!!

56

Side note: the data broadcasting technique we came up with for this Slickgrid component can be used with any client-side component – calendars, schedulers, gantt, Trello mashups, time keeping UI’s, interactive “what-if” charts, shared controllers, etc. Takes some client-side coding skills to wire things up the first time but the end results sure beats creating these kinds of high level components with servoy design-time objects or solution model.

The technique hooks directly into Servoy’s broadcast method and only sends changes (as JSON). End result is components stay in sync with non-client-side data and very lightweight on the network.

57

Troy and I just posted a demo of the Slickgrid component for Servoy. Covering Servoy IDE integration, amazing client-side performance, and some geek-mode on the magic sauce going on making it all work transparently to the developer:

http://www.youtube.com/watch?v=nBASQTuO … VummJC7kpQ

58

Looking very promising David & Troy!

59

Harjo:
Looking very promising David & Troy!

Thanks Harjo :)

If someone on the Europe side of the pond is available for testing tomorrow, I could use some quick testing help. We have a full app running all slickgrids on a server here in the U.S.—would like to look over your shoulder while you click around to see how it performs.

It’s screaming here. In fact we’re probably going to have to put in a click throttler for grids that load up servoy forms so the user doesn’t get too far ahead of themselves.

skype: soltexdw

60

Servoy’s tree bean restyled:

[attachment=0]dbtreeview sutra style.png[/attachment]

Checkbox is all done with CSS and even has a cool “depressed” state. CSS for this trick (put in “…/servoy-webclient/templates/default/servoy_web_client_default.css” file:

table.wicket-tree-content table.icon-panel input[type=checkbox] {
	font-size: 16px;
	position: relative;
	border: 1px solid #262626;
	display: inline-block;
	margin-right: 5px;
	padding: 0;
	width: 14px;
	height: 14px;
	vertical-align: text-top;
	background: -webkit-linear-gradient(
		top, rgba(255,255,255,0.4), rgba(255,255,255,0.1)
	);
	-webkit-appearance: none;
	-webkit-box-shadow: 0 1px 0 rgba(255,255,255, 0.1),
		inset 0 0 1px rgba(255,255,255, 0.4);
	-webkit-border-radius: 3px;
}

table.wicket-tree-content table.icon-panel input[type=checkbox]:active {
	background: -webkit-linear-gradient(
		top, rgba(255,255,255,0.05), rgba(255,255,255,0.2)
	);
}

table.wicket-tree-content table.icon-panel input[type=checkbox]:checked::after {
	position: absolute;
	content: '';
	left: 15%;
	top: -10%;
	height: 35%;
	width: 90%;
	border-bottom: 2px solid #bbb;
	border-left: 2px solid #bbb;
	-webkit-box-shadow: -1px 1px 0 rgba(0,0,0,0.8);
	-webkit-transform: rotate(-45deg);
}

The images for open folder, closed folder, and file are our own creations and use the url rewrite technique (described here) to divert Servoy’s default path for the tree graphics.

In other news, Sutra CMS is going completely web client…

dbtreeview sutra style.jpg
dbtreeview sutra style.jpg1280×798 173 KB