Archive for the ‘extjs’ Category

Ext JS 3.0 Released

Tuesday, July 7th, 2009

The Ext JS 3.0 was just released! To me, this is the best JavaScript library ever! And I’m glad that it’s open source.

The most important improvement of this release was a clear separation of the Widgets from the Core. The Ext Core provides object-oriented mechanisms for handling the DOM, Events and Ajax. The Widgets contemplate Windows, Layouts, Toolbars, Buttons, Menus, Trees, Grids and Forms. New to this release was support for Charts, which is done via Flash. There is no official support for Audio and Video, but many interesting Flash media players fill in the gap.

So congratulations to the Ext team! Thank you for the outstanding work! This is truly a step forward towards a richer Web!

Photos from FISL 10

Monday, June 29th, 2009

The 10th edition of FISL (Internation Free Software Forum) was a huge success, with over 8000 participants, including the presence of the president of Brazil, Luiz Inácio Lula da Silva!

Our presentation entitled ISS (Instant Syndicating Standards) was great! We gave a quick overview of ISS and many attendees got interested in our work. One of the highlights of the presentation was when we used tennis balls to explain how the information would travel in the social network. It was really fun to see the balls been thrown from one side of the room to the other. Some photos of the presentation are shown below:

Bruna Griebeler at FISL 10

Bruna Griebeler at FISL 10

Tiago Rosa da Silva at FISL 10

Tiago Rosa da Silva at FISL 10

Daniel Schmidt da Silva at FISL 10

Daniel Schmidt da Silva at FISL 10

Sharing Information, Services and Interactions in the Next Decade

Tuesday, June 16th, 2009

Introduction

In the 90s, after Tim Berners-Lee created the World Wide Web at CERN research center, scientists around the world were able to share information with their colleagues by setting up their own personal Websites. The key concept behind the Web was the hyperlink, which allowed users to browse Web pages across different networks.

With the popularization of the Web, browsing Web pages just wasn’t enough. So by the turn of the millennium, the advent of search engines came to people’s assistance, most notably from a search engine created by Larry Page and Sergey Brin while at Stanford University. Powered by complex algorithms, search engines would rank and present Web pages to users based on keywords.

With further popularization of the Web, searching again wasn’t enough. The top-down presentation of Web pages selected from a huge collection by an algorithm has created a very undemocratic way of sharing information. In this next decade, users will rely less on monolithic algorithms and more on their own personal social network for sharing information.

While the first decade of the Web was all about browsing and the second decade was about searching, the next decade will be about syndicating. Users will connect with their personal social network to receive and disseminate information in a bottom-up manner. Information, services and interactions will all be syndicated, allowing users to share not only information but also rich and profound experiences.

Sharing Information

As of today, there is no existing technology that allows individuals to share information in a bottom-up manner on a global scale. ISS (Instant Syndicating Standards) is a proposal to create just that: a distributed worldwide recommender system perfectly tuned to output a very personalized stream of information for each individual, where information flows from the personal social network towards the whole wide world. This is accomplished by allowing each individual to create their own broadcasting channels and to connect these channels with the ones created by their personal social network. This trustful and cascading network of syndicated streams filters out irrelevant information, while still letting good information pass through at each level.

The key concept behind ISS is the tagLink. The tagLink is a semantic link created by individuals showing how their friends’ channels are connected with their own channels. If a user becomes interested in a particular channel from a friend, he may subscribe to this channel and add it to his own channel. Thus, each individual receives exactly what he wants based on these subscriptions, and all information that reaches them goes through friends’ approval first.

Sharing Services

ISS is being developed as a set of services on top of Drupal. This service-oriented architecture promotes interoperability and allows individuals from different networks to share information with each other. The ISS services englobes user, channel and content management. These services together with services that provide file, language, search and session management will transform Drupal from a Content Management System into a Web Operating System.

The key concept behind the Drupal WebOS is the serviceLink, which is a structured format that links services together, including services from different networks. For example: a user may browse his way to a friend’s profile and become aware of her interests by visualizing her channels. If there is a common interest, the user may subscribe to a channel and create a taglink that connects her remote channel with his local channel. The fact that the friend is from another network is totally transparent to the user. This is possible when these systems follow a set of open standards called IOS (Instant Operating System). Users will be served by multiple WebOS.

Sharing Interactions

The services provided by the Drupal WebOS can be accessed through a Webtop, i.e. a Desktop Environment that works on top of the Web. The Ext Webtop is a Webtop created using the Ext JavaScript Library following a set of open standards called ITOP (Instant Desktop Environment). From this Webtop, users can share interactions with each other.

The key concept behind the Ext Webtop is the sessionLink. The sessionLink is a service that follows the publish/subscribe pattern and provides users and applications with (almost) real-time updates for subscribed services. For example, when a chat application is loaded in the Ext Webtop, the Webtop subscribes to the user.im service to be kept aware of any updates. More sophisticated interactions may also be shared, including sharing the whole Desktop Environment (this is called an Instant Session). In an Instant Session, when a user opens a window in the Webtop, his friend sees the window being opened. Likewise, when his friend closes a window, the user sees the window being closed.

Conclusion

In this text, we have presented ISS (Instant Syndicating Standards), an open set of standards that challenges the top-down model of information-sharing and gives place to a bottom-up model, where each person has a unique voice and equal opportunity to contribute and benefit. In this way, we hope to bring people closer together to discuss common interests and share information in a more open and democratic manner.

Also, we have presented the IOS and ITOP open standards, which we believe will help people to have more rich and profound experiences. We want to bring the Instant from Instant Messaging to the Web. And by Instant, the most important aspect that we want to exploit is not so much the When, but the Who. We want to empower individuals to “exchange” their Operating Systems and Desktop Environments with friends much the same way that they exchange Messages with friends when using Instant Messaging applications.

Along these two decades, the Web has evolved tremendously. The Web’s influence in democratizing access to information is evident. Yet, there is still a long way to go before reaching a truly democratic Web, where information flows freely in all directions. Also, there is still a long way to go before reaching a truly interactive Web, where people can connect with each other to create rich and profound experiences. We hope that the work here presented will help shape the way we share information, services and interactions in the next decade, as we believe that this will fundamentally shape us into better individuals and into a better society as a whole.

Acknowledgements

I would like to thank the following organizations for sponsoring my work:

  • The GIMSCOP research group from UFRGS university for sponsoring the development of the Drupal WebOS and Ext Webtop. Special regards to my mentor Dr. Jorge Otávio Trierweiler.
  • The PPGC (Computer Graduate Program) from UFRGS university and the CAPES brazilian federal agency, who provided me with a scholarship to develop ISS. Special regards to my mentor Dr. José Valdeni de Lima.
  • The Knight Foundation, for sponsoring the development of ISS on top of Drupal. Special regards to the UFRGSWeb team for helping me out and for giving me the opportunity to mentor them.

I would also like to thank the following open source communities for their contributions:

  • Dries Buytaert and the Drupal community. Special regards to Scott Nelson for the Services Module and Dmitri Gaskin for the JSON Server Module.
  • Jack Slocum and the ExtJS Community. Special regards to Todd Murdock for the Web Desktop extension and Thorsten Suckow-Homberg for the LiveGrid extension.

Further Information

References

The sessionLink

Wednesday, June 3rd, 2009

The Drupal WebOS provides several services to the Ext Webtop. The structure of these services are well described and they can either be static or dynamic in nature. The difference between static and dynamic services is that the dynamic services can be seem more as a stream of information and they can be used to provide users with (almost) real-time updates. If there is a great number of dynamic services being requested at a given time, however, the performance of the application can suffer substantially. To solve this issue, we present the sessionLink.

The sessionLink is a service that follows the publish/subscribe pattern and provides users and applications with updates for subscribed services. For example, when a chat application is loaded in the Ext Webtop, the Webtop subscribes to the user.im service to be kept aware of any updates.

The following is a simplified description of the user.im service:

{"method": "user.im",
"args": [
{"name": "uid", type: "int", "desc": "User ID", "required": "1"},
{"name": "msg", type: "string", "desc": "Message", "required": "1"}
],
“type”: “data”,
"sessionlink": "payload",
"time": "2000",
"sid": "14"
}

The “sessionlink” can either be set to none, payload or timestamp. Services by default are static and there is no need to define sessionlink. A dynamic service on the other hand must have “sessionlink” set to payload or timestamp. When payload is set, the session.link service will return the payload for the subscribed method. Otherwise, if timestamp is set, it will only return a (unix) timestamp, thus requiring the Webtop to make an additional call to receive the update. For applications like chat, where speed is essential and the content is small, it’s recommended to set sessionlink to payload.

The time can also be set. This will help determine how often the Webtop will have to poll the session.link service. The lowest time of the current set of subscribed services is used. For example, if the Webtop is calling session.link every 30 seconds and the user loads the chat application, then the Webtop will start polling session.link every 2 seconds (2000 milliseconds).

The subscriptions are managed automatically by the Webtop by calling the session.subscribe service:

http://webos.iss.im/services/json
method=session.subscribe
sid=14

The user.im service has a sid (Service ID) of 14. The session.subscribe service actually handles sid as a string, thus enabling the Webtop to subscribe to several services at the same time (just use a comma to separate the sids).

To unsubscribe, there is the session.unsubscribe service that works the same way. If the user closes the chat application and he or she is not talking to anyone else, the Webtop can unsubscribe from the user.im service:

http://webos.iss.im/services/json
method=session.unsubscribe
sid=14

In conclusion, the sessionLink is a key component that helps the Webtop to be kept aware of any updates in an easy and straight-forward way. This component will help developers create applications that provide real-time collaboration and offer users a more seamless experience.

Ext Webtop Overview

Wednesday, March 25th, 2009

The Ext Webtop offers a familiar desktop environment that allows users to access services and applications over the Web. The interconnected nature of the Web has inspired the creation of a  distributed desktop, where users can easily share data and services with their contacts. The figure below is a screenshot taken from this environment.

The Drupal WebOS serving the Ext Webtop

The Drupal WebOS serving the Ext Webtop.

The Ext Webtop provides the following features:

  • Browse & Scroll: Browse linked services. Go back and forth. Fetch live data as you scroll;
  • Search & Filter: Search as you type. Show extra fields inline. Rank and filter large data sets;
  • View & Open: Select multiple items and perform actions. View media. Open new instances;
  • Contacts: List contacts. View profiles. Keep aware of updates. Share and interact with users;
  • Channels: Discover and subscribe to channels. Syndicate new entries or recommend others;
  • Networks: Access a new set of services by connecting to different networks securely;
  • Search: Search for both structured and unstructured data in multiple networks;
  • Sessions: Save sessions for later. Handle saved, recorded and instant sessions.

Ext Webtop and Drupal WebOS

Monday, March 23rd, 2009

The Web is evolving rapidly and Web applications are starting to reach the same level of functionality of desktop applications. Perhaps we can even risk to say that Web applications will soon surpass desktop applications in functionality given the interconnected and ubiquitous nature of the Web. Despite the differences among Web browsers, there has been an increasing convergence of standards and practices, mostly promoted by the W3C (World Wide Web Consortium) and the Ecma International. The emergence of powerful JavaScript frameworks has also tremendously helped developers to abstract beyond these differences and create rich internet applications easier and faster. Soon, users will be able to access Web applications much like they access desktop applications by using a Webtop, i.e. a desktop that runs on top of the Web browser.

In the server-side, we have seen a consolidation of the LAMP stack and its derivatives, which consists of an Operating System, a Web Server, a Scripting Language and a Database. On top of this stack we have seen the emergence of Web frameworks for managing content, users, applications and services. Notice that traditionally the management of these has been the responsibility of Operating Systems. However, this responsibility is being delegated up the stack so that it can benefit from the key aspects of the Web. This trend will ultimately lead to a WebOS, i.e. an Operating System that runs on top of the Web server.

The figure below illustrates this evolving architecture. The main goal of this publication is to explain how to develop Web services and applications following this architectural design. More specifically, the objective of this publication is to to explain how to develop Web services and applications using the ExtJS framework as a Webtop and the Drupal framework as a WebOS.

Web Architecture - towards the Webtop ad WebOS.

Web Architecture - towards the Webtop and WebOS.

Learning Ext JS

Tuesday, February 24th, 2009

The book Learning Ext JS, written by Shea Frederick, Colin Ramsay and Steve ‘Cutter’ Blades, is a good source for newbies to become familiar with the Ext JS framework, as well as for advanced developers to fill in the gap from the official documentation.

The book covers Windows, Layouts, Toolbars, Buttons, Menus, Trees, Grids and Forms. Throughout the examples, a good emphasis in given to show how the data is acquired and manipulated: from reading the data in JSON, recording it, mapping it in a grid or a form, to formatting it using templates or renderers. It also explains how to find, filter and sort data both in the client-side and in the server-side,

Adding Effects and Drag-and-Drop functionality is well explained. However, DOM manipulation, Object-Oriented programming and the Event-Driven model is only briefly mentioned. This is where a book tailored for more advanced developers could pick up from.

I strongly recommend this book for anyone interested in creating Rich Internet Applications.

Web Desktop with Drupal and Ext

Wednesday, November 28th, 2007

There has been some interesting developments combining Drupal and Flex. Drupal is an excellent CMS (Content Management System), while Flex is a great technology for building RIA (Rich Internet Applications). Using Drupal as a backend and Flex as a frontend, it’s possible to achieve outstanding results.

An alternative to Flex is AJAX. JavaScript libraries are becoming mature, and since JavaScript interpretation is native to browsers, the use of AJAX is an attractive solution. One fine example of what can be accomplished with AJAX is the Ext JS library. With Ext, it’s possible to emulate quite nicely a Desktop on the Web.

To create a Web Desktop using Drupal as a backend and Ext as a frontend, we need to use the Services module. The Services module allows a Drupal site to provide Web services via multiple interfaces while using the same callback code. The AMFPHP module may be used by Flex applications, while the JSON server module may be used by Ext applications.

Web Desktop Shared Session

Tuesday, November 20th, 2007

I’ve been working at UFRGS building the next generation Web Desktop to help chemical engineers work collaboratively.

During my research, it was a pleasant surprise for me to stumble upon Ext from Jack Slocum, and notably the work done by Todd Murdock concerning the Start Menu.

Another remarkable work is from my friend Massimiliano Mirra called SamePlace, and notably the concept of XML Sync Islands created by Domenico De Felice.

Currently, the concept of XML Sync Islands has been developed to work over XMPP, but the same concept may work over the Web with the help of AJAX. What this means is that all the cool stuff being built by Massimiliano may find their way into the Web.

I’m building the idea of “Shared Session” into the system. From Todd’s menu I’m calling different services. Each service is loaded in a window. A user may save a session for later retrieval or he might share a session with another user. When a user shares a session, this is what happens: he closes a window, his colleague sees the window being closed. His colleague opens a service, he sees the window being opened. And using the concept of XML Sync Islands, the interaction between the users are even richer. In fact, they are the same ones experienced by users using SamePlace.

Of course SamePlace makes everything just more beautiful and responsive since it brings XMPP to the Firefox browser. It would be neat if browsers had native support for XMPP. Perhaps some day the Mozilla Foundation will recognize Massimilano’s work and other browsers will follow.