We are working on a Mind map based webapp as our final year college project. It will be a website where users will be able to create mind maps collaboratively. The user interface will be very similar to what https://bubbl.us/beta/ and hxxp://www.mindmeister.com/ have.
In a nutshell, the users will have access to whiteboard and drawing tools to create mind maps on a whiteboard. The changes made by one user will be visible to other session users. e.g. A session has three users A, B and C. If A changes mind map, it will be visible on whiteboards of B and C.
We were considering Flex, Openlaszlo few days ago but having limited time (about 3 months) for project completion, we binned those. For Flex we will have to learn Actionscript3 and for Openlaszlo there is no IDE support. So both of them won't be good choices.
We have shortlisted Silverlight and Vaadin frameworks as viable choices but we are confused as we don't have any experience with either of them. We need to take these points into consideration while selecting a framework:
Time frame for project - about 3 months, give or take 2-3 weeks
Learning curve for framework - should be easy (Very relative term indeed..In the context, we are familiar with VB6, PHP, Javascript and Core Java)
Necessary graphics related features supported - such as whiteboard, drag-drop widgets, animations(need not be fancy stuff) etc.
Availability of tutorials and good documentation
There are 2 open source mind mapping applications that can be useful for this webapp.
Silverlight - hxxp://silverdraw.codeplex.com/ (a webapp) - More like a POC design.
Java - hxxp://www.xmind.net/ (a desktop app) - Most of the mindmapping features we need are present. If we use Vaadin, we can re-use some code which is a huge plus point.
We are open to other suitable frameworks. Which framework would you choose?
P.S.: Excuse for obscure URLs'. New users are limited to only one hyperlink.
Disclaimer: I'm a member of the Vaadin Team, and do not know Silverlight very well.
I believe both Silverlight and Vaadin would be good candidates for your application, and for both the biggest challenge will be the client-side implementation of the visual mind-map component.
I took a quick look at XMind and it seems to be Swing based, so I'm afraid that the only way to re-use that would be to wrap the mapping component into an applet. You can easily do this with Vaadin, but it will require the Java plugin in the browser.
If you consider implementing the mindmap component without plugins, you have the following options:
Use the Vaadin core components (eg. the Tree, live example here) to visualize the mind map. Vaadin supports drag & drop, so this would be very fast to implement, and you would need to work with only server side Java stuff.
Create a HTML5 component with Vaadin integration for the mind-map. You can do this with the HTML5 canvas, and wrapping it in a Vaadin component is easy, but it'll require that you code the component with GWT. There are several examples on how to manipulate the canvas with Vaadin and GWT.
Create a SVG component with Vaadin integration for the mind-map. As far as I know SVG supports interactive stuff a little better than Canvas, and there are examples on how to interact with SVG using GWT and Vaadin. Note that the support for SVG is lacking especially with the older IE versions.
All of these options are feasible to implement within your timeframe (depending on what extra functionality you want). The first option is by far the easiest to do, but it might not be fancy enough for your requirements.
We have strived to make Vaadin as easy to learn and use as possible, and I daresay that our documentation is very good. In addition we have a very lively community filled with helpful experts. If you need more information on Vaadin just come over to our forums and we'll help you out.
You are kind off answering your own question. Use vaadin it will be a little extra work but then your saving huge amount of time on the mindmap coding.
Related
I'm trying to develop a hybrid app which will deliver a range of simple teaching material to the user. I am planning on using Telerik App Builder in conjunction with Cordoba 3 to create the app. What I cannot decide is how best to package the actual content into the application. I'd like to achieve a separation of the content from the code, and just combine the two when building the delivery packages. (The content is being prepared by a subject matter expert.)
Is there a way I can use Cordova or Telerik AppBuilder to pre-populate a SQLite database as part of the app install process? Or am going about this in completely the wrong way? I have been researching this in the Telerik documentation but without success so far. If someone could point me towards a suitable example or even the correct places in the Telerik or Cordova docs I'd be very grateful!
I recently ran a techie webinar on the topic. The main idea is that you need a centralized system to host this content and this system needs to expose some kind of a service layer that will feed content to your app. To me this seems like a very growing market opportunity, but feels kinda the same as the web 1.0 days where all of us were trying to figure out how to feed cotnent to websites and everybody was building their own CMS in a way.
Telerik Backend Services provides an editing interface, so it can fit some requirements, but it's not a publishing system, plus you may not want to pay developer licenses to your back-end users or provide them with access. The premise of the webinar I am talking about was that we discussed how to integrate with another telerik product - Sitefinity to do this job for you instead. The first 20-25 minutes are an overview of the platfrom, so if you have seen it already, you can certainly jump to ~;0:25 to see the rest
http://www.sitefinity.com/campaigns/webinars/build-content-driven-mobile-apps
Now certainly it doesn't have to be Sitefinity or CMS for that matter, Sitefinity provides a bunch of App Builder related features that are handy, but you technically have a few options:
- Build your own applicaiton and back-end.
- Use any type of CMS or platform that will give your SMEs the back-end interface to publish and the service layer to expose to the app. In the webinar I also go through some neat tricks such as using push notifications upon publishing.
This way you get a clear separation of content and code - you can even get a separation of content structure and code, which is an idea i talk about in greater detail.
I hope this helps!
Svetla
I am new to Sencha ExtJS and Architect MVC, but I know MVC and some other JQuery libraries in general.
I want to ask when building a real-world system, what is the proper approach to layout an Sencha app structure in Architect 2?
For example, we have the following departments in our app, they have distinct functionalities:
Accounting, Controlling, Quality Assurance, Customer Services, Human Resources, Logistics, Purchasing, Sales, Records Management ...
Approach 1: Write them in different Sencha Architect projects. Stitch up with master layout page + main area + header/footer + side bar pages. (using MVC.NET in our case)
--- Pros:
Multiple programmers can work on different sub-projects in an agile
environment.
Each project is smaller and easier to be upgraded or replaced.
--- Cons:
We have different Sencha Architect projects for, e.g. main areas, side bar, header, footer. How do they collaborate with each other? We now only use JQuery to pass information between them, but it feels kind of hacky.
Approach 2: Write them all in one big Sencha Architect project. So, it sarts up in a single app.html page with everything in it.
--- Pros:
Now every component in the project can collaborate with each other.
A true Single-Page-App All-in-One app.html looks nice.
--- Cons:
Having hard time if multiple programmers are working on one Sencha Architect project.
It is one big complicated piece of app. Although it is seperated into simple App, Store, M, V, C categories, but we can have name crash on components in a larger project.
Loading speed may be an issue? I am just guessing here because we don't know if Sencha Architect MVC design loads relevant windows and compoents part by part or everything together.
Question is, if we take 1st approach how do we make communications between different projects? If we take 2nd approach, is Sencha Architech 2 designed to build real-world projects that way? stacking everything in one big project?
First I'll say that your thinking about this problem in all the right ways. Your pros and cons are spot on.
Second for full disclosure I'm an engineer on the Sencha Architect team.
My suggestion is to have separate projects that are more loosely coupled and perhaps connected by a portal/dashboard application. The glue app can be written in anything including Ext JS in Architect.
The reason I say this is simply that I don't like putting all my eggs in one basket and if you've built single page apps you'll know that when they're working they really hum. But when an uncaught javascript exception occurs it can force that user to have to do a full refresh to get back to a happy state. Of course if you're perfect this will never happen :p Who's perfect?
I build Architect which is in fact a very large single page application. As a team we all do our best to keep each system able to work with as little dependency on any other system(s) as possible. We use things like eventing, pub/sub, adapter and plugin patterns, etc...
These systems are very much broken into separate namespaces and directories which like all software helps developers compartmentalize. Architect doesn't fully support this idea today. However with convention you can get close. e.g. HRController, HRNewEmployeeForm, HREmployeeGrid
Having HR as a separate app however, affords you HR.EmployeeController, HR.NewEmployeeForm assuming your app name is HR. Each app being a separate project also allows for the dev team to be more agile in how it deploys!! Major win.
Other users have taken this approach and one such user graphs all his projects together using a managed iframe approach
http://www.sencha.com/forum/showthread.php?243179
Asp.Net MVC is another good approach and might afford you some features like user auth etc...
Hopefully this helps!
The web based application I am working on currently is a port from a windows application. This application is very data intensive. There are scores of modules and each of these modules have number of forms (data entry screens) and reports whereas the forms have many many fields and likewise the reports.
I have been trying to identify the most suitable architecture for the presentation tier. There are many functions that are not very easily portable, for example printing (this too is very complex). For most of the others, I am planning to us "Ext JS" library which looks like capable of handling about 70% of complexity out of the box while for the remaining I would be custom coding or extending Ext JS.
Having said that (sorry for being so descriptive), I wonder, if this is an Intranet application, why not port the entire application to SilverLight? While I am good at .Net, I'm somewhat alien to SilverLight. Considering I know my target audience and that the software will be used per seat license, would it be better to ride on SilverLight or is it better to stick to conventional web (XHTML, JS, CSS, etc)? Further, I have to support multiple devices in future and considering that SilverLight plug-ins for many devices are yet not out, would it be a risk?
IMO, if you are developing a web application, then yes, develop it as an RIA.
The choice of technology is up to you. I prefer jQuery and have never used ExtJS. But I've taken a look at it, and if your aplication is a port of a windows application and has a lot of conventional UI elements like forms, input boxes, toolbars, menus, button etc, then go for ExtJS.
As for some controls that are not available in ExtJS, you can easily extend ExtJS.
Regarding .NET: ExtJS is completely server-technology agnostic, so you can develop your application in .NET and still use an ExtJS UI. In fact, I would prefer to do such an implementation.
Regarding Silverlight: I am slightly against using silverlight, primarily because it requires a plugin to be installed that is not available on all platforms. But since your application is an intranet application, your user base will be in your control. But you should make sure that any future decision regarding the workstation platform will not affect your application's working.
Cheers
Whether to use Silverlight over HTML/JS etc. in this case would depend on 2 key factors.
What are you familar with already
What type and range of devices you need to reach.
If you are already comfortable with HTML + ExtJS then that has to be huge pro in its favor.
The range of devices that Silverlight is possibly going to be available (Windows Phone 7 for example as well as Moonlight, I've even heard that there may be port for Andriod and Symbian) is growing. However its really early days for that and not all may materialise in a form useful to you.
Having said that it should be acknowledged that a UI designed for use on desktop does not work well on a small device. Hence you would need to develop some task specific UI for other devices regardless of the technology you use. This in turn means that there is no reason for you to try to stick with single technology for all devices.
I think you should look very carefully into WCF, REST and OData first. Good layering of the application into useful models using these would more easily enable the use of a variety of front-end technologies for the client.
If you are into .NET and other Microsoft tech then you should seriously consider using JQuery and ASP.NET MVC as another potential front end technology.
I think that you need to ponder the inconveniences of a solution based solely in Silverlight. Like Flash it needs a plugin to be installed in every station, so it loses some of the premises of web applications (run everywhere with the only requirement of a browser). Besides although Silverlight has taken great advances, it is not yet a widely supported standard, and it is in control of a company who later may decide for you in very important matters regarding the platform you use, and made it outdated or useless (in the worst case).
Ext JS is a great library developed entirely in Javascript, so you can touch anything that suits your needs. If the Windows applications you are basing on is well-layered, then your work may not be that hard.
If you are an asp.net developer you could take a look on asp.net mvc, a great set of tools that implements MVC pattern to web applications using the same old C# or VB. Besides the developers behind asp.net mvc, have taken a lot of work to make it suitable to work with javascript libraries like jQuery
Happy coding!!!
I absolutely have no idea about Silverlight except that it is a Microsoft technology.
Having nearly completed a Computer Science degree, having programmed in C# for a few years in a work environment - have a good knowledge of Java and OO techniques - how hard is the road of average Silverlight programming? I've been offered some work DAMN IT!
I've mucked around with PHP, HTML and nearly no CSS..
Would I need a strong web programming background in order to pick it up?
I like Ben's answer, and he's right that a huge bonus of learning Silverlight is that you don't have to worry about the stateless model. However, there are a few parts of Silverlight that are less easy to learn:
Styling & control templates - These concepts look like CSS at first but there's a good bit more that you can do with them such as completely overriding the visual aspects of the control. Also, modifying the styles of existing controls is one thing and learning how to create your own control that can be easily styled is quite another.
Database connectivity - If you're anything like me the first thing you'll want to do after you write a "hello world" test is hook up to a Db and pull down some data. Since Silverlight can't directly connect to a Db you'll have to learn one of 3 techniques to move data between the browser and server: 1. WCF + your custom service methods + LINQ to SQL or LINQ to EF or whatever data access you choose. 2. ADO.NET Data Services (great way to start out) 3. .NET RIA Services (once you've realized that you need your data access technology to play nice with data binding and honor biz rules).
Security - You need to learn another part of the MS technology stack to get this working properly, ASP.NET Application Services. It should take more than a few hours to hook things up but it is another technology to learn.
Browser navigation, search engine friendliness & deep linking - Things you take for granted writing a traditional web app will take a bit more work in SL. You can use .NET RIA Services to handle browser navigation & deep linking, others have written about making your site friendly to search engines (and I don't know how ;).
What I'm trying to highlight here is that while learning the basics of Silverlight is easy, you'll probably run into other parts of the MS technology stack that you'll need to learn to get your work done. The beautiful thing here is that all of the technologies come from 1 vendor with a single focus and they work really well together. I shudder when I think about all the different technologies you'd need to pull off my current SL app in the open source domain.
Pick up the book "Silverlight Unleashed" and go to http://silverlight.net/GetStarted to start learning. Scott Gu's 8 part blog posting (#3 on that Getting Started web page) was one of the first things I read about Silverlight and is hugely helpful.
Unless your Silverlight app has to interact with a traditional web page, you don't need to know anything about traditional web UI technologies.
If you've done any desktop UI development you'll find Silverlight much easier to pick up than any web UI paradigm. Compared to the unholy mess that is css + html + javascript combined with ever-changing browsers and fourteen other hundred-author web "standards", Silverlight is a walk in the park.
Couple of year ago I when to work for company as web developer. It has my first Sirius web development job, (ASPx/C#) so it has very exciting and I learned a lot about that world, from the developer point of view.
In that group we had a concept for the pages where loaded in the page UC’s (User controls), I don’t know if it’s the same in every web development team with every language, I’ll assume it is so.
The contract ended and I came back to develop win32 “winForm” application.
But since them I have tried to apply the same principle for my win32 development I learn there, meaning having bunch of UC’s (Visual User controls) that I load in the form.
They are regular visual components, not loaded in the toolbox, code is available in the project, but the component is not developed in the form, they are loaded there.
I would like to know opinions about this approach, what other are doing similar or better to this And improvements that can help us to speed up development and increase code reuse, because that is what this is all about.
If you're using the layout components in Winforms, this might be an acceptable approach although I think the thing that distinguishes the web and Windows Forms (note: NOT WPF!) is that in the former you do a lot of "compositing" which is why the UserControl concept is so useful whereas in the latter you operate on very sophisticated controls (e.g. 3rd party - in my last gig we used an incredible grid control via a small company called Infralution)
The main problem I would see is with layouts since the rendering model is a little different than the web. I know nothing about your application but if it "works" that is what is most important. I assume in this case you use things like the FlowLayoutPanel and the TableLayoutPanel properly.
If you want to go a more canonical route, take a look beyond simply creating components at how you can use the inheritance model to composite your application in a more robust way - having a base Form class that has containers for where your "UserControl" type components go and then using some kind of interface based dependency injection to swap them out while the application is running.
Finally, take a look at some of the open source Windows Forms applications out there to see if you're being too hard on yourself since common UI and reusable components are a goal in every application. Even though I've always thought Microsoft's Patterns & Practices stuff teetered towards being bloated, there are some good ideas and you should study some of the approaches of the Composite UI Application Block they put out.
Okay, not finally, there's one more thing I'd like to add: take a long hard look at WPF which will bring back a lot of the concepts from your web development days and give you that kind of power in a desktop application.