首页 > 默认 > On-Off-line混合模式应用实例-销售线索跟踪(Flex+Gears)

On-Off-line混合模式应用实例-销售线索跟踪(Flex+Gears)

salesbuilder.png

As a follow up to my previous post, here is the sample Sales Force Automation application I built to demonstrate the Flex/Google Gears integration, and that Kevin Lynch demonstrated during the Google Developer Day keynote last week in San Jose.

SalesBuilder uses the Google Gears Database API to save data to an embedded SQLite database, and the LocalServer API to enable offline access to the application.

 

In this hosted version, I removed the server component (to avoid having to watch all the bad things that can happen to a shared demo database). An XML document plays the role of server data. You work offline and the changes you make are saved to your local SQLite database. A simple data synchronization mechanism allows you to initially populate your local database, and to inform you of the changes that would be pushed to the server.

NOTE: Make sure you install Google Gears before running the application. Also, depending on the browser you use, make sure you check the security bar at the top of the content area: you may be required to explicitely allow Google Gears plugin (ActiveX in IE) to execute.

Part 1: Using the local database and simple data sync

  1. Click here to start the application.
  2. Click the Search button in the left drawer. Notice that there is no data (you haven’t populated your local database yet).
  3. Optionally start the SQLAdmin tool in another browser window/tab.
    • Enter “salesbuilder” as the database name
    • Click “New Query” in the menu bar
    • Type “select * from account” or “select * from contact”: no data
  4. In the SalesBuilder app, click the Sync button in the menu bar.
  5. Click the Search Button again: You now have data.
  6. If you started the SQLAdmin app, click the Execute button again and notice that your local database has been populated.
  7. In the SalesBuilder app, double-Click “Adobe” in the search results.
  8. Note that this is an MDI type of user interface. The list of open windows (panels) is available under “Open Items” in the drawer. You can click an item to restore it.
  9. Make some changes to the Adobe data (for example, change the phone number), and click “Save”.
  10. Click the Sync button again.
  11. On the Contacts tab, you can grab an org chart item with the mouse and move it around.
  12. To open the details view for a contact, either double-click an org chart item, or click “Show Grid” and double-click a contact in the datagrid.
  13. On the Market History tab, you can grab the chart with the mouse and move it left and right, adjust the time selection using the dividers in the bottom chart, etc.
  14. Continue to add and modify accounts and contacts, and click the Sync button to simulate data sync with the server.

Part 2: Accessing the application while offline

  1. Click here to access the application’s offline management page. Note that the options provided on this page could be integrated in the application itself.
  2. Click the Capture button. Wait a few seconds until the status message indicates that the application is available offline. The application has now been saved locally (in a Google Gears Managed Store).
  3. Disconnect from the network and disable your wireless connection.
  4. Clear your browser cache to make sure the application won’t be served from the cache
  5. Access the application again using its normal URL: http://coenraets.org/salesbuilder/salesbuilder.html
  6. You have access to the application and to your local database.

Source Code and Disclaimer

Click here to download the source code of the application.

It was definitely interesting to build this application and use some well known data access patterns at the client side of a web app. Look for example at the data access objects: AccountDAO and ContactDAO. In this application, I’m embedding SQL statements directly in the data access objects, but it is inevitable that layers of abstraction, ORM and data synchronization solutions will soon be available on top of the low level Gears API. In fact, the Flex Data Services provide a data synchronization API that could be integrated with Gears.

This application is a proof of concept and not a full featured application. Some modules of the application (like opportunities and activities) are not implemented in this version.

Apollo Version

Kevin also demonstrated an Apollo version of the same application. The Apollo version runs outside the browser just like a traditional desktop application. As such it also has additional features, like drag-and-drop between the app and the desktop, access to the file system, etc. I will make that version available as soon as the new Apollo beta goes public (very soon).

Credits to Mark Shepherd for the Springgraph component used for the org chart.

 

 

关于作者:

昵称:商云方
档案信息:顾问, HAND张江技术中心
联系方式:你可以通过yunfang.shang@hand-china.com联系作者
点击查看商云方发表过的所有文章...
本文永久链接: http://blog.retailsolution.cn/archives/2305

 

 

对本文的评价:

1 Star2 Stars3 Stars4 Stars5 Stars (No Ratings Yet)
Loading ... Loading ...

 

 

分类: 默认 标签:
  1. 2009年6月13日17:19 | #1

    http://report.retailsolution.cn:81/gearpad/
    这是Google Gears 提供的一个简单的在线离线混合应用。做了些测试,体验如下:
    问题:
    1)选择Retry ,而不是脱机工作。当我们网络再次连接的时候会自动同步?

    答:是的,可以自动侦测到联机,并自动同步,不过该死的IE会自动提醒脱机,很麻烦。听说Firefox 没有这个问题。

    2)如果直接update服务端数据,gearpad会如何处理?
    答:gearpad不会自动把客户端数据再次同步给服务器。也不会把服务器的内容覆盖客户端。因为它的原理是以客户端数据为最新数据,客户端更新后数据被标记为“dirty" ,一旦同步后,”dirty"标记即被去掉,直接更改服务器的内容,不会更改客户端的"dirty"标记。

    3)如果客户端应用需要用到数据库的事务功能怎么办?
    答:googlegear 使用的客户端数据库是sqllite,sqllite是支持事务的。

    4)要是IE的缓存被清掉怎么办?
    答:缓存被清,Gears内容不会被清。

    5)如何查看gears客户端数据库中的内容?
    答:可使用sqlitestudio-1.1.2(免费,绿色的,还不错)

    6)gears在各种浏览器上的兼容性如何?

    答:很遗憾,我在自己的电脑上测试没有问题,但是在另外两个同事电脑上测试都有问题,表现为本地的写受阻. 状态一直是saving 但没完成save.

  2. 2009年6月14日09:30 | #2

    Flex技术从本质上讲就是Plug-In技术,这种技术早在10多年前就开始使用。只不过Flex做出来的东西跟传统的Plug-In技术相比,界面可以做的很玄。
    公司 解释器 执行文件
    Flex技术 Adobo Flash Player swf
    Jinit技术 Oracle JVM jar

  3. Xiaoqing.He
    2009年6月20日10:14 | #3

    FLEX应用实例:http://www.airia.cn/FLEX_Apply/

    什么是RIA技术,RIA技术概览。
    转帖:http://www.airia.cn/RiaNews/RIATechnical_Summary/

  1. 本文目前尚无任何 trackbacks 和 pingbacks.
您必须在 登录 后才能发布评论.