Electronic Joint Business

Solution for E-Business

jquery

编写 Google Chrome 浏览器扩展 — CodeProject Reputation Watcher

本文将探讨如何利用 jQuery 和 jQuery UI 来构建 Chrome 浏览器扩展,并将之集成到 Chrome 中。文中讨论的扩展会读取 CodeProject 的会员信息,并查看荣誉值,它会将这些信息存储在本地,日后再查询 CodeProject 时会将这些变化呈现到表格中。该扩展还可以读取并显示会员的荣誉值走势图。1

背景
编写 Chrome 扩展所需的文档可以在 Google Chrome Externsion 上找到。用到的 javascript 类库可参见jQueryjQuery UI

Chrome 浏览器扩展
Chrome 扩展本质上是一些嵌入 JavaScript 和 CSS 的 HTML 文件。为了让 Chrome 知道该如何处理这些文件并呈现给用户,必须在项目的根目录中的清单文件(manifest)中加以规定。该清单文件的文件名固定为:“manifest.json”。

我们先来看看本范例的清单文件:

{
  "manifest_version": 2,
  "name": "CodeProject Reputation Watcher",
  "short_name": "CPRepWatcher",
  "version": "2.0",
  "content_security_policy": "script-src ‘self’ https://ssl.google-analytics.com ‘unsafe-eval’; object-src ‘self’ ",
  "description": "Extension to retrieve a CodeProject accounts reputation points.",
  "icons": {
      "48":"images/bob48.png",
      "128":"images/bob128.png"
  },
  "browser_action": {
    "default_icon": "images/bob.png",
    "default_popup": "cprepwatch.html"
  },
  "options_page": "options.html",
  "permissions": [
    "http://*.codeproject.com/"
  ]
}

开始的一些基本属性比如:“name”、 “version” 和 “description” 含义相当直观无需解释。“icons” 属性定义了扩展可以使用的多个图标文件,安装扩展后,这些图标会显示在 Chrome 扩展页及工具栏上。

>>> 阅读全文

 

, , , , ,

利用 ASP.NET MVC 4 开发 Web 应用 (一)

文章评价:
现在几乎所有的网站都不停地扩张,一旦它开始增长,你就会发现无论是编写、组织和维护一个站点都十分地困难。当我们往项目中添加新功能或添加新开发人员的时候,任何设计拙劣的大型的 Web 应用都可能会去控制。因此本文隐藏的设计思想是任何一个网站的设计,无论是对网页设计师(初级到中级)还是搜索引擎而言,其架构必须是简单、易于理解的。在这篇文章中,我想要设计一个用于维护个人联系方式的站点。任何一个大型社区都可以重用该程序及其附加功能和模块。因此,设计必须很容易适应未来的业务增长。

在这篇文章中,我将讨论如何创建和设计用户界面(UI)的方式,该方式将把 UI 将从业务逻辑分离,可以由独立的设计师/开发人员负责创建。我们将会用到的框架包括 ASP.NET MVC、Knockout、Jquery 和 Bootstrap。

在后续文章中,我们会更多地谈到有关数据库设计以及如何利用 SQL Server 2008 、Entity Framework 、Castle Windsor 依赖注入框架来实现商业逻辑。

分离关注点:主要目标
关键概念是如何剥离大部分或全部商业逻辑。商业逻辑不应和页面捆绑,否则在需要重用另一个页面里的逻辑就会难以处理。很多人会忍不住对代码进行复制粘贴。一旦这样做了,项目就变得难以维护。另一个重要概念是将业务逻辑从数据存取层剥离出来,由于我们将考虑使用 Entity Framework ,这应该不成为问题。我们可以轻松地将所有 EF 的文件放到另一个 Assembly 中,然后添加该 Assembly 的引用即可。顶层设计概念如下所示:

将这一概念贯彻到 Visual Studio 开发工具中,我们得到了最后的解决方案:

>>> 阅读全文

 

, , , , , , , ,

Windows Runtime中的异步模式

文章评价: 原文
Windows Runtime 提供了一套一致的模式来创建和管理异步操作。

下面的内容介绍了 Windows Runtime 中的异步编程(asynchronous programming),例子包括了 Javascript,C#,Visual Basic 和 Visual C++。

异步编程的好处
由于从 Windows Runtime 的异步编程模型中获益,Metro风格应用总是能对用户的输入及时做出响应。你可以运行费时的任务而不需阻塞 UI 线程,你可以在稍后才获得任务返回的结果。你可以取消任务,也可以当任务在后台运行时获得进度通知。你无需显示地管理线程或者直接和底层的并发(concurrence)实现打交道。

Windows Runtime 的许多特性以异步函数的形式呈现,比如 MediaCapture 和 StorageFile。作为约定,异步函数的名称以“Async”结尾,表明其执行可能发生在调用返回之后。

在 Metro 风格应用中使用异步API,代码可用一致的方法使用非阻塞调用。如果在用户的 API 里实现了异步模式,调用者就可以理解并按预知的形式使用你的代码。Windows Runtime 以贴近每种语言自身的方式提供了异步模式。见下表:

>>> 阅读全文

 

, , , , , , ,

面向文档的数据库 CouchDB (四) 视图

视图是 CouchDB 中用来查询和呈现文档的。完成视图的定义之后,视图的运行由专门的视图服务器来完成。 CouchDB 中默认的视图定义语言是 JavaScript 。 CouchDB 中的视图运行使用的是 MapReduce 编程模型。每个视图的定义中至少需要提供 Map 方法,Reduce 方法是可选的。

视图的 MapReduce
Map 方法的参数只有一个,就是当前的文档对象。 Map 方法的实现需要根据文档对象的内容,确定是否要输出结果。如果需要输出的话,可以通过emit来完成。emit方法有两个参数,分别是key和 value,分别表示输出结果的键和值。使用什么样的键和值应该根据视图的实际需要来确定。当希望对文档的某个字段进行排序和过滤操作的时候,应该把该字段作为键(key)或是键的一部分;value的值可以提供给 Reduce 方法使用,也可能会出现在最终的结果中。可以作为键的不仅是简单数据类型,也可以是任意的 JSON 对象。比如emit([doc.title, doc.price], doc)中,使用数组作为键。

通过 Map 方法输出的结果称为中间结果。中间结果可以通过 Reduce 方法来进一步做聚集操作。聚集操作是对结果中键(key)相同的数据集合来进行的。 Reduce 方法的输入不仅是 Map 方法输出的中间结果,也可以是上一次 Reduce 方法的结果,后面这种情况称为 reReduce 。 Reduce 方法的参数有三个:key、values和rereduce,分别表示键、值和是否是 reReduce 。由于 reReduce 情况的存在,Reduce 方法一般需要处理两种情况:

  • * 传入的参数rereduce的值为false:这表明 Reduce 方法的输入是 Map 方法输出的中间结果。参数key的值是一个数组,对应于中间结果中的每条记录。该数组的每个元素都是一个包含两个元素的数组,第一个元素是在 Map 方法中通过emit输出的键(key),第二个元素是记录所在的文档 ID 。参数values的值是一个数组,对应于 Map 方法中通过emit输出的值(value)。
  • * 传入的参数rereduce的值为true:这表明 Reduce 方法的输入是上次 Reduce 方法的输出。参数key的值为null。参数values的值是一个数组,对应于上次 Reduce 方法的输出结果。

下面通过一个实例来说明视图 Map 和 Reduce 的用法。该视图要解决的问题是对图书简介中出现的字符进行计数,这也是一个经典的 MapReduce 编程模型的实例。代码清单 12中给出了该视图的定义。

清单 12. 对图书简介中的字符计数的视图定义

>>> 阅读全文

 

, , , ,

面向文档的数据库 CouchDB (三) 开发Web应用

CouchDB 不仅是一个数据库服务器,同时也是一个应用服务器。在前面对 REST API 的介绍中,说明了如何把 CouchDB 作为一个数据库服务器来使用。下面将介绍如何将 Web 应用运行在 CouchDB 上。

由于 CouchDB 的 REST API 使用 JSON 作为展现形式,因此使用 CouchDB 的 Web 应用只需要编写浏览器端的代码就可以使用 JavaScript 与 CouchDB 进行交互;而 CouchDB 所支持的附件功能,又使得浏览器端的 HTML、JavaScript 和 CSS 代码可以直接存放在 CouchDB 中。这样 CouchDB 中不但保存了 Web 应用的数据,也保存了 Web 应用的逻辑。也就是说,只需要 CouchDB 就可以构建一个完整的 Web 应用运行环境。

在 CouchDB 中,一个 Web 应用对应的是一个设计文档。这个 Web 应用可以操作 CouchDB 中保存的文档型数据。当需要创建新的 Web 应用的时候,只需要创建新的设计文档即可。 CouchDB 使得 Web 应用的部署和管理变得非常简单,只需要通过 REST API 管理设计文档即可。从更大的角度来说,CouchDB 有可能创造一种新的 Web 应用开发模式。在这种模式中,CouchDB 中保存的文档型数据可以为每个应用开发者所使用,开发者在数据之上创建满足各种需求的 Web 应用。

本文中将以一个具体的小型网站作为实例来介绍使用 CouchDB 开发 Web 应用中的细节。该网站是一个类似“豆瓣”的用户点评网站。在该网站中用户可以对图书进行编辑和评价。

使用 CouchApp
CouchApp 是一个开发使用 CouchDB 的 Web 应用的小型框架。它的主要功能是可以把一个文件系统的目录转换成 CouchDB 中的一个设计文档。在开发的时候,可以按照一般 Web 应用的结构来组织文件系统,当需要测试和部署的时候,只需要一条命令就可以把该目录保存到 CouchDB 中。 CouchApp 目前有 Python 和 Ruby 两种语言的版本,本文中使用的是 Python 版本。由于目前 CouchApp 正在开发中,所以最好是从源代码安装。代码清单 7 中给出了 CouchApp 的安装脚本。

>>> 阅读全文

 

, , , ,