Windjs应用
一个异步的js类库,应用价值不大,所以代码也没在维护了。在做h5特效或者游戏动画方面有点用处。
$await是Windjs的核心api。具体可以check 浅谈Jscex的$await语义及异步任务模型
具体使用demo:
var A = eval(Wind.compile("async", function () {
console.log("Start A");
$await(Wind.Async.sleep(3000));
console.log("Finish A");
}));
var B = eval(Wind.compile("async", function () {
console.log("Start B");
$await(Wind.Async.sleep(5000));
console.log("Finish B");
}));
var C = eval(Wind.compile("async", function () {
console.log("Start C");
console.log("Finish C");
}));
var run = eval(Wind.compile('async', function() {
$await(A());
$await(B());
$await(C());
}));
run().start();
简单地说就是将线程挂起了。我们可以试着用Windjs画一个圆,在大部分平台上编写这样的程序并没有太大困难,只要在绘制出图形之后短暂地阻塞线程就行了。可惜,在JavaScript中我们只能“一蹴而就”,要暂停的话,只能使用setTimeout进行回调了。不过,这也正是Windjs的用武之地,用Windjs编写的代码需要“暂停”,只需要简单地调用sleep异步方法,一切都很直接。js里$await方法一定要封装在eval中。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> </title>
<script src="http://files.cnblogs.com/files/zichi/wind-all-0.7.3.js"></script>
<script>
window.onload = function() {
var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var x = 250;
var y = 250;
var r = 100;
var frontX = x - r;
var frontY = y;
var drawAsync = eval(Wind.compile('async', function() {
for(var i = x - r; i <= x + r; i++) {
var tempY = Math.sqrt(r * r - (x - i) * (x - i));
ctx.beginPath();
ctx.lineWidth = 5;
ctx.moveTo(frontX, frontY);
ctx.lineTo(i, y+ tempY);
$await(Wind.Async.sleep(10));
ctx.stroke();
frontX = i;
frontY = y + tempY;
}
for(var i = x + r; i >= x - r; i--) {
var tempY = Math.sqrt(r * r - (x - i) * (x - i));
ctx.beginPath();
ctx.lineWidth = 5;
ctx.moveTo(frontX, frontY);
ctx.lineTo(i, y - tempY);
$await(Wind.Async.sleep(10));
ctx.stroke();
frontX = i;
frontY = y - tempY;
}
}));
drawAsync().start();
};
</script>
</head>
<body>
<canvas id='canvas' width=500 height=500 >
</canvas>
</body>
</html>
//
Windjs应用的更多相关文章
- observejs改善组件编程体验
传送门 observejs:https://github.com/kmdjs/observejs 本文演示:http://kmdjs.github.io/observejs/list/ 本文代码:ht ...
- AMD and CMD are dead之JS工程化终极解决方案KMD.js版本0.0.1发布
回顾 经过两天晚上疯狂的开发调试,伴随着大量掉落的头发和酸痛的颈椎,KMD.js赢来了第一个稳定版本.在此期间KMD规范也有所修改和完善. 这两天主要完成的功能有: 按需加载 版本控制 模块管理 便捷 ...
- 用nodejs,express,ejs,mongo,extjs实现了简单了网站后台管理系统
源代码下载地址:http://download.csdn.net/detail/guoyongrong/6498611 这个系统其实是出于学习nodejs的目的而改写的系统. 原来的系统前端使用了ex ...
- 用async 解放你的大脑
在js中,代码嵌套和代码回调非常常见,不仅编写麻烦而且异常反人类.让我等码农很是头痛 function () { function () { function () { ...
- Hive原理总结(完整版)
目录 课程大纲(HIVE增强) 3 1. Hive基本概念 4 1.1 Hive简介 4 1.1.1 什么是Hive 4 1.1.2 为什么使用Hive 4 1.1.3 Hive的特点 4 1.2 H ...
- matlab矢量场数值可视化(动态数值模拟)
https://blog.csdn.net/eric_e/article/details/81294092 D3.js实现数据可视化 三维可视化 风场可视化(数据插值):风场是动态变化的,实时刷新的, ...
- html5引擎开发 -- 引擎消息中心和有限状态机 - 初步整理 一
一 什么是有限状态机 FSM (finite-state machine),又称有限状态自动机,简称状态机,是表示有限个状态以及在这些状态之间的转移和动作等行为的数学模型.他对于逻辑以及 ...
随机推荐
- Mongodb Manual阅读笔记:CH4 管理
4 管理 Mongodb Manual阅读笔记:CH2 Mongodb CRUD 操作Mongodb Manual阅读笔记:CH3 数据模型(Data Models)Mongodb Manual阅读笔 ...
- mysql优化案例分析
本文总结了一些工作常见的sql优化例子,虽然比较简单,但很实用,希望对大家有所帮助.sql优化一般分为两类,一类是sql本身的优化,如何走到合适的索引,如何减少排序,减少逻辑读:另一类是sql本身没有 ...
- 这些web前端特效你造吗?
友情提示:所有特效效果均是GIF图片演示(均有源码下载),所以这个博文可能加载的比较慢,请谅解. 凛冬将至(Winter Is Coming),在上一篇博客凛冬将至,用几款特效暖暖身得到了比较好的响应 ...
- spring服务定位器类
此文章是基于 搭建SpringMVC+Spring+Hibernate平台 功能:通过持有的Spring应用场景ApplicationContext,可在任何地方获取bean. 1. 服务定位器类:S ...
- 省级联动(使用ajax实现)
在博客园学习了很多实用的东西,现在该慢慢开始自己写写博客文章, 由于本人水平有限,刚走出校园的小菜鸟,另外,文章在表述和代码方面如有不妥之处,欢迎批评指正.留下你 的脚印,欢迎评论! 有什么问题,可以 ...
- x01.os.1: BIOS 中断
这只是一点准备工作.为了显示字符串,需要调用中断:int 0x10 (AH=0x13).具体参数设置,参考我的归纳整理如下: INT 10 (AH = 0) -----------------功能: ...
- 【OpenWRT之旅】如何自定义一个配置文件的设置界面
作者:gnuhpc 出处:http://www.cnblogs.com/gnuhpc/ 1. 引言 OpenWRT中采用LuCI作为它的Web interface界面框架,采用Lua语言.在本文中将以 ...
- JAVA刷CSDN博客流量的思路
先来看看CSDN统计博客访问量的原理: 当客户端向服务器发起请求的时候,每个ip被统计一次,上图的三个客户端指的是三个不同的ip地址.并且在某段时间内,同以ip访问同一篇文章,只能算是一次访问量.同一 ...
- 使用百度UMeditor富文本编辑器,修改自定义图片上传,修改源码
富文本编辑器,不多说了,这个大家应该都用到过,至于用到的什么版本,那就分很多种 CKEditor:很早以前叫FCK,那个时候也用过,现在改名了,比较流行的一个插件,国外很多公司在用 UEDITOR:百 ...
- 第14章 位图和位块传输_14.4 GDI位图对象(3)
14.4.10 非矩形的位图图像 (1)“掩码”位图——单色位图,要显示的像素对应的掩码置1,不显示置0(2)光栅操作(点这里,见此文分析) (3)MaskBlt函数 ①MaskBlt(hdcDest ...