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),又称有限状态自动机,简称状态机,是表示有限个状态以及在这些状态之间的转移和动作等行为的数学模型.他对于逻辑以及 ...
随机推荐
- .Net Attribute详解(上)-Attribute本质以及一个简单示例
Attribute的直接翻译是属性,这和Property容易产生混淆,所以一般翻译成特性加以区分.Attribute常常的表现形式就是[AttributeName], 随意地添加在class, met ...
- 编写Java应用程序。首先,定义一个时钟类——Clock,它包括三个int型 成员变量分别表示时、分、秒,一个构造方法用于对三个成员变量(时、分、秒) 进行初始化,还有一个成员方法show()用于显示时钟对象的时间。其次,再定义 一个主类——TestClass,在主类的main方法中创建多个时钟类的对象,使用这 些对象调用方法show()来显示时钟的时间。
package com.hanqi.test; public class Clock { int hh; int mm; int ss; String time; Clock(int h,int m, ...
- c++双字符常量
ascii表中 A是65,B是66,16706是A乘256+B 一些双字符的汉字也可以通过此方法转为int数字
- 列表list
Python是一种面向对象的语言,但它不像C++一样把标准类都封装到库中,而是进行了进一步的封装,语言本身就集成一些类和函数,比如print,list,dict etc. 给编程带来很大的便捷 Pyt ...
- Android 的提权 (Root) 原理是什么?
作者:Kevin链接:https://www.zhihu.com/question/21074979/answer/18176410来源:知乎著作权归作者所有,转载请联系作者获得授权. Android ...
- WinMain与wWinMain,win32的字符集问题
刚接触win32开发的会发现,用vs新建一个win32项目默认代码里面的入口函数并不是WinMain而是_tWinMain或者wWinMain,这些都有什么区别呢? WinMain对应的是多字节字符集 ...
- Azure 删除VHD时报错:There is currently a lease on the blob and no lease ID was specified in the request
可下载:http://clumsyleaf.com/products/cloudxplorer 然后在Accounts中新建一个Account,账号与Key,可在相应的storage Manage A ...
- Java方法区和运行时常量池溢出问题分析
运行时常量池是方法区的一部分,方法区用于存放Class的相关信息,如类名.访问修饰符.常量池.字段描述.方法描述等. String.intern()是一个native方法,它的作用是:如果字符串常量池 ...
- CSS样式----图文详解(二):css属性
主要内容 CSS的单位 字体属性 文本属性 背景属性 列表属性 盒子模型 定位属性:position.float.overflow.z-index等 导航栏的制作 鼠标的属性cursor 滤镜的介绍 ...
- SWT使用注意点
出现这个错: java.lang.UnsatisfiedLinkError: no swt-win32-3139 in java.library.path 解决方法: 将swt-win32-3139导 ...