2

我正在尝试为交互式 Web 应用程序选择一个技术堆栈。

项目要求:

1)应用程序实际上是一个全屏板,包含许多相互交互的矩形对象。

2) 一位主要用户(演示者)能够将新对象添加到板上,并确定它们的位置、角度、朝向和大小。一个理想的方法是,如果用户可以在板上的空白区域拖动一个简单的左键单击选择,同时能够在按下右键的同时旋转该选择。释放鼠标后,矩形对象将被绘制在选定的表面上。

3) 演示者可以调整对象的大小、旋转对象以及通过拖动对象来移动对象(如果还按下右键则可以在移动的同时旋转对象)。如果我可以测量物体在过程中移动了多少(以任意测量单位),那就太好了。

4) 多个观察者/用户/客户可以加入演示室并观察:

  • 我希望他们实时观察物体的移动。如果不,

  • 我希望他们可以看到将对象从其先前位置转换为新位置的动画。如果不,

  • 如果对象只是瞬间移动到它的新位置,那将是可以接受的。

5) 支持的观察者数量:

  • 我需要无缝支持 50。

  • 我想支持多达一千。

  • 请建议技术堆栈可以在启动时使用廉价的非专用服务器支持的任意数量(但可以选择稍后升级,以及它将如何随着支持的客户端数量而扩展)。

6) 演示者可以指定其他用户为“助理演示者”并获得完全权限,但权限不同(不能移动演示者的对象,只能添加/移动/删除自己的对象)

7) 它必须能够在没有安装 Flash 或 Java 的情况下工作(这实际上将它们排除在外)。

奖励积分:

1) 可扩展性(响应式设计)以及它如何影响画布(“分辨率”应该保持不变,像素大小应该调整,同时保持相同的 16:9 纵横比)

2) 移动设备支持 - 能够在较新的移动设备和平板电脑上正常工作(可能没有一些高级方面)

3) 观察者还可以选择移动对象(仅在客户端,在他们的浏览器中),同时能够恢复(同步)到实际(当前)状态。

我想到了什么:

我首先想到的是:

  • HTML5 Canvas 和一个用于在其上绘制和操作对象的 JS 库(fabricjs似乎很有希望)

  • 具有合适框架的 node.js(Meteor 目前似乎正在如火如荼,并且能够处理与大量客户端的实时同步)

但我对两者都不是很熟悉,也无法判断它们是否是开发这个项目的最佳堆栈。

你有什么建议?我有使用 jQuery / PHP / AJAX 的经验,并且没有在它们之外冒险,但我毫不犹豫地学习新东西,特别是如果它相当现代和有趣的话。

PS:我不知道如何标记这个问题,所以随意标记它你认为合适的。

4

1 回答 1

1

也许CollabSketch Vaadin 插件 https://github.com/Mazku/collabsketch_vaadin以及此处提供的源代码可能会给您一个起点。Vaadin 提供推送和移动支持,所需的技术知识可能是 Java + Vaadin(GWT) + Maven + Tomcat

于 2013-09-17T12:36:47.717 回答