Configurable level editor - language-agnostic

I am looking after a level editor easy to use and configurable, so I can use for my own application/engine. Is there something like that?

Check out Nitro Level Editor - it's XML based and fit for virtually any 2D game or application. http://code.google.com/p/nle/

Related

HTML / CSS - Tree Layout / Flowchart Options

I have looked at the available libraries that are available and none seem to do exactly what I want.
I want to be able to produce a tree layout/flow chart which is horizontal.
Here is a very basic image:
Each box will have a parent and it needs to be able to flow automatically as I provide the data.
Another sample is this:
Automatic layouts is a strong domain of the (commercial) yFiles Graph Drawing Libraries.
Specifically yFiles for HTML provides the feature you are looking for in the browser:
You can customize the layout - in your case I suggest to use GenericTreeLayouter with layoutOrientation set to LEFT_TO_RIGHT and with a socalled DefaultNodePlacer configured for your nodes. Set the rootAlignment to LEADING and configure the preferred routing style. (documentation)
You can incrementally add new elements to the graph and have it animate smoothly
You can style the visualization to your exact requirements.
I believe this interactive demo shows many of the requirements, but there are also more complex demos that show the flow-charting aspect of your question.
Disclosure: I work for the company that creates that library, but I do not represent my employer on SO. My posts and thoughts are my own.
I would take a look at the following libraries:
JSPlumb
This has a hierarchy option that I think is what you're looking for. Here is the Demo.
mxgraph
that's a screenshot of pyhole!
That was done using KineticJS, a defunct project that provides abstraction on top of HTML canvas. Each oval was positioned manually/absolutely by doing a little math on the layout of the map/chain.

VB.NET: WYSIWYG page maker tutorial

I have a course work for which I have to make a (as advanced as possible) WYSIWYG web page editor in VB.NET (2010). It should have a visual editor with drag-drop support for several elements such as anchors, images, tables etc., and it should generate HTML based on that structure.
I don't know where to begin though.. I have some experience with vb.net, I made a tabbed notepad vaguely following a tutorial, but I don't know how to make this drag-drop thingy in a richtextbox.
I've searched for a tutorial, but most of them are just too simple - a text editor with browser control rendering the HTML.. I found one really nice and advanced, but it's in german :-|
So, if anyone knows any resources / tutorials I could use to start things I'll appreciate it.
I won't start with a richtextbox. Do you want to realize it in WPF or Forms (I would recommend WPF)?
In WPF there is relative simple a Drag-And-Drop behavior for elements (see http://msdn.microsoft.com/en-en/library/ms742859.aspx).
I would start with some simple elements (e.g. TextBoxes) and drag-drop them from some sort of toolbox onto a grid with fixed columns and rows (and later use a canvas). And then generate the HTML-Code from that.
In general, most of the WYSIWYG browser based editors are written in Javascript using an editable DIV.
A good example is tinymce:
http://www.tinymce.com/
Download, including full source code, is available here:
http://www.tinymce.com/download/download.php
You can use CKEditor. Its one of the best WYSIWYG editor i have worked with. Its highly customizable and opensource.
Given below is the URL for the website:
http://ckeditor.com/

Object relation graphical control that generates HTML

I am planning to create a small research web application, that will have a graphical data representation control as a main data layout mechanism. The following sketch shows a primitive layout for a part of a web page:
Since it will be a part of a web app displayed in browser, I want to have some logic that allows me to create, edit and render such "maps" or you can call it "hierarchical trees" into HTML markup to sent to the browser.
Maybe one of you knows a good and elegant way to create such visual elements in plain html.
If not - I am a .Net developer, so I can, as a last resort, reduce to using a silverlight to render such visuals, but than I will have a huge visitor loss on a first visit, since most of them, I suppose, won't be willing to install Silverlight Plugin, just to get acquainted with my web site.
Anyways, a plain HTML generator for such visual trees, or a Silverlight analog will be great. Thanks for the tip in advance.
P.S. I need the element to be interactive, so generating a simple image on a server is not the solution.
The JavaScript vector engine Raphael is a great option.
But if you just want to render the map and display the result on your page, then I recommend GraphViz which takes in a description of your graph in a simple language and outputs the graph in a few different formats.

track and display changes in html

I am looking for a tool to display/track changes in text a little bit like it is done on stackoverflow when a question is edited. Does anybody know of a tool to achieve that?
You may want to use diff for that.
If you can use PHP on your server there's a handy pear package to perform the task you require. Here's an example :
https://web.archive.org/web/1/http://articles.techrepublic%2ecom%2ecom/5100-10878_11-6174867.html
There's actually a actually Javascript implementations outhere as well, not tested though:
http://ejohn.org/projects/javascript-diff-algorithm/
http://aignes.net/
Commercial tool though. I have no idea of a F/OSS alternative.
A copy of my own answer from here.
What about DaisyDiff (Java and PHP vesions available).
Following features are really nice:
Works with badly formed HTML that can be found "in the wild".
The diffing is more specialized in HTML than XML tree differs. Changing part of a text node will not cause the entire node to be changed.
In addition to the default visual diff, HTML source can be diffed coherently.
Provides easy to understand descriptions of the changes.
The default GUI allows easy browsing of the modifications through keyboard shortcuts and links.

What are the "must have" features for a XML based GUI language

Summary for the impatient:
What I want to know is what you want to have in a new gui language. About the short answers mentioning $your_favorite_one; I assume you mean that, such a language should look like $your_favorite_one. These are not helpful. Resist the temptation.
I'm thinking on the user friendliness of XML based languages such as XHTML (or HTML, although not XML they are very similar), XUL, MXML and others ("others" in this context means that, I am aware of the existence of other languages and their implementations alternative to their original ones, and the purpose of the mentioning only these languages by name is, to give an idea of what I am talking about and I don't feel like mentioning any others and also, I see no point in trying to make a comprehensive list anyway.). I have some opinions about what features should such a language have;
The language should be "human writable" such that, an average developer should be able to code a good amount without constantly referring which tags have which properties, what is allowed inside what. XHTML/HTML is the best one in this regard.
There should be good collection of controls built-in for common tasks. XHTML/HTML just sucks here.
It should be able to be styled with css-like language (with respect to functionality). It should be easy to separate concerns about the structure and eye-candy. Layout algorithm of this combined whole should be simple and intuitive. Why the hell float removes the element from the layout? Why there is not a layout:not-included or something similar instead?
I know that I don't even mention very important design considerations like interaction with rendering engine and other general purpose languages, data binding, strict XML compliance (ability to define new tags? without namespaces?) but these are the points that I would like to ask what you consider important for such a language?
There will always be a tradeoff between ability and simplicity.
Personally I'm happy with the features of WPF (which uses XAML) for MS development. I dont find its complexity to be a barrier to developement at all.
However if your going to target your toolkit/language to a demographic that requires a higher degree of simplicity, you could possibly get away with leveraging an existing framework and provide the end user with a DSL specific to their needs.
Writing a new framework for the dev community as a whole is a mammoth undertaking though, and I suspect you will find that due to the wide range of features required that you will have to deal with a large degree of complexity at some point. Best of luck.
Most recent XML GUI language (not only for GUI actually) is called XAML. It has all that candies: styles, layout definition, objects initialization, etc. But it's a pain to write more or less large XAML files. Auto-completion helps but the core problem - forest of angle brackets - is not solved. Another problem with advanced XML-based GUI langs - they try to serve to several purposes at once, but XML syntax is not suitable for all situations. For example XAML supports data-binding, but why the hell I should write it in attribute string? It's first class feature and should have proper support.
IMO all modern XML-based langs suck terribly. Language intended for humans must not force it's users to write tons of brackets or do deep tags nesting. It must be user friendly, not computer friendly. My dream it to have GUI language with Python-like syntax.
In conclusion I want to say:
Dear XML-based langs authors, please be humane, don't create another language based on XML. Read some good book on Domain Specific Languages and please, don't make me type < and > symbols ever again.
You should have specified whether you mean web or rich client, but either way take a look at XAML/WPF. If you're anti-MS, then look at Moonlight, the Mono implementation of SilverLight.
I would like it to be easy to connect to any database, perform queries that return a recordset, and be able to parse and iterate easily said recordset to display its data in graphic controls, for example pie-charts, bar-charts, timeline charts (stock options like), node graphs with animation effects, all this at run time.
Easy mouse events catching, to implement any action on rollovers, mouseins, mouseouts, clicks, drag and drops, clipboard management, etc. A good infinite zooming capability would be great too.
I don't want to set a "datasource" that establishes a fixed connection between some column in my SQL query and some displayable element at design time, I want to perform any query that I want and show elements tied to any query field, anytime, in run time. I don't want to be only able to bind a datasource and displayable elements at design time.
css style capability for everything. Or something as simple and easy.
resize and layout taken care of automatically. Easy access to local files, to parse, play, display. Easy classes for image management, supporting transparency, resizing, etc. Basic and advanced classes for drawing in the screen: lineTo, rectangle, circle, animations. Even 3D.
Embedded fonts functionality. I don't want to worry about "will the user have this font installed?" Also I don't want to worry about DPI or screen resolutions.
Basic widgets: treeviews, etc.
A good designer. I don't want to add widgets writing the code. I want to place them visually in the screen.
Also, it would be good if it could connect to dlls made in C++ or COM objects in general.