摘要：使用 require("MyAapp.DepTree", function (DepTree) { DepTree(({ renderTo: "holder", width: "820", height: "580", data: [ { "name": "System" }, { "nam... 阅读全文
AMD and CMD are dead之KMD规范
2014-06-20 09:26 by 【当耐特】, 2859 阅读, 1 推荐, 收藏, 编辑
摘要：What’s KMD? 乱世出英雄，KMD名字的由来充满了杀气。 Kill AMD and CMD KMD为替代混乱的AMD和CMD世界而生，一统天下。或者让这个混乱的世界更加混乱，导致： KMD AMD CMD三分天下 KMD的目标从来都是远大的： JS工程化终极解决方案 使用KMDjs的工程师从来都是： 尼玛，什么东西，这么NB？ KMD规范 0.KMD只暴露两个关键字，一个是def... 阅读全文
AMD and CMD are dead之js模块化黑魔法
2014-06-16 09:28 by 【当耐特】, 6643 阅读, 8 推荐, 收藏, 编辑
摘要：缘由 在2013-03-06 13:58的时候，曾甩下一片文章叫：《为什么不使用requirejs和seajs》，并放下豪言说发布一款完美的模块化库，再后来就把那篇文章删了，再然后就没有然后。该用seajs还用seajs，甚至我码的SCJ都是用requirejs组织起来的。 时光飞逝，岁月流... 阅读全文
码农干货系列【20】--add gtTime to Promise.js
2013-06-20 15:46 by 【当耐特】, 1632 阅读, 2 推荐, 收藏, 编辑
摘要：使用场景 在一些时候,希望一件task不能太快完成,需要大于多少时间才可以执行,就可以使用Promise的gtTime方法. 使用方式 Promise.gtTime(f1(), 5000).then(f2); function f1() { var promise = Promise(); setTimeout(fun... 阅读全文
码农干货系列【19】--Promise.js with AJAX
2013-05-05 10:12 by 【当耐特】, 3520 阅读, 2 推荐, 收藏, 编辑
摘要：更新 新增Promise.timeout方法，检测task执行超时并且自动reject使用 Promise.timeout(f1(), 2000).then(f2, function () { alert("timeout"); }).wait(5000).then(f3); function f1() { var promise = Promise(); setTimeout(function () { console.... 阅读全文
码农干货系列【18】--getting started with Promise.js（总）
2013-05-03 15:30 by 【当耐特】, 4327 阅读, 2 推荐, 收藏, 编辑
摘要：引用Promise.js 你可以点击这里下载。ps：如果使用了SCJ Framework，请使用SCJ.createPromise代替下面的Promisedone/resolvepromise.js提供了done和resolve方法，done负责注册成功的回调函数，resolve负责触发。 function cb() { alert('success') } var prms = Promise() prms.done(cb) setTimeout(function() { ... 阅读全文
码农干货系列【17】--Wind.js与Promise.js
2013-05-01 12:01 by 【当耐特】, 2292 阅读, 0 推荐, 收藏, 编辑
摘要：示例 先引入wind.js与promise.js: <script src="wind-all-0.7.3.js"></script> <script src="promise.js"></script>然后create: Wind.Promise.create = function (fn) { var prms = Pro... 阅读全文
码农干货系列【10】--光线追踪进阶:javascript玩转3D纹理映射
2013-03-18 07:59 by 【当耐特】, 7367 阅读, 13 推荐, 收藏, 编辑
摘要：简介 本文在光线追踪的基础之上，为了追求渲染速度和效率，去除了光线的反射、去除了透视投影（如我前面两篇干货8和干货9，所以渲染虽然是3D场景，其实不是真实看到的，但不影响实验），进行了一些有趣的尝试。此文将分享这两天尝试的成果：3D雕刻。 3D雕刻，顾名思义--在... 阅读全文
码农干货系列【9】--javascript光线追踪基础
2013-03-12 16:31 by 【当耐特】, 3655 阅读, 4 推荐, 收藏, 编辑
摘要：简介 光线追踪(ray tracing)（也叫raytracing或者光束投射法)是一个在二维(2D)屏幕上呈现三维(3D)图像的方法。为了尝试光线追踪算法，并且尽可能得保证javascript代码精炼，我做了一些尝试。 射线与球体相交检测 最开始尝试了射线与球体的相交检测（不计算交点），只判断相交还是未相交。代码如下所示: var Vector3 = function (x, y, z)... 阅读全文
码农干货系列【8】--世界上最简单的3D渲染(no webgl)
2013-03-10 21:02 by 【当耐特】, 4651 阅读, 4 推荐, 收藏, 编辑
摘要：简介 进行上图所示的3D格子地板的渲染，需要进行Canvas的像素级别操作，从视点连接屏幕（屏幕就是canvas）中的所有像素点，形成大量的射线，倘若射线与地板相交，把交点以及交点的颜色反馈给屏幕(canvas)。如下图所示: 像素操作 在进行3D渲染之前，必须了解Canvas的像素操作相关概念。在给定了width和height的canvas上，在坐标(x ,y)上的像素的inde... 阅读全文
码农干货系列【6】--javascript异步编程之:世界上最短的Promise库
2013-02-24 21:12 by 【当耐特】, 6624 阅读, 2 推荐, 收藏, 编辑
摘要：类库源码 var Promise = function () { this.thens = []; }; Promise.prototype = { resolve: function () { var t = this.thens.shift(), n; t && (n = t.apply(null, ... 阅读全文
码农干货系列【5】--lambda in js：lambda.js 1.0.0发布
2012-12-27 21:55 by 【当耐特】, 6565 阅读, 9 推荐, 收藏, 编辑
摘要：lambda.js的由来 作为一个当耐特程序员，对lambda一定不陌生。随着当耐特版本的更新迭代，C#也由委托==〉匿名委托==〉lambda表达式。由于javascript语言的约束，没有提供相应的lambda的机制，所以就有了lambda.js，让广大jser也可以 (a,b)=>a.xx==”yyy”&&b>11 一把！ Query Operator 而lambda最常用的地方就是... 阅读全文
码农干货系列【4】--图像识别之矩形区域搜索
2012-07-23 07:37 by 【当耐特】, 9457 阅读, 10 推荐, 收藏, 编辑
摘要：简介 定位某个图片的矩形区域是非常有用的，这个可以通过手动的选择某个区域来实现定位，图片相关的软件都提供了这个功能；也可以像本篇一个通过程序来实现智能定位。前者会有误差，效率低下；后者选区精度高，效率高。 应用场景 1.精灵编辑器或者css sprites辅助工具（当我们需要逆着TexturePacker行事的时候），如下图所示： 2.手写识别输入 因为我们不能保证用户输入... 阅读全文
赠书:血战HTML5消除游戏,赢《HTML5实验室:Canvas世界》
2012-07-03 08:00 by 【当耐特】, 10995 阅读, 33 推荐, 收藏, 编辑
摘要：简介近日，《HTML5实验室:Canvas世界》已经出版了。欲赠送园友，思来想去，还是以游戏比拼的方式赠送园友,既然是一本HTML5的书（其实是本跨平台的书），那就用一款HTML5游戏作为竞技游戏,所以就花了几个小时的时间做了一款消除游戏（新浪小游戏总排名第一的那款）。暂时定为3---7本（个人赠送）。如果出版社支持的话,将赠送更多更多。赠送的标准是：分数从高至低排序,取排名靠前的几位园友。如果某个园友很厉害，占据了榜单前几名怎么办？没有关系，同一个博客园ID只赠送一本。所以记得先登录哦！！ps1:如果随机数被破解,园友保存好高分截图备用有关本书本书使用HTML5的Canvas作为实验平台，J 阅读全文
码农干货系列【3】--割绳子(cut the rope)制作点滴:旋转(rotation)
2012-06-11 07:44 by 【当耐特】, 6354 阅读, 13 推荐, 收藏, 编辑
摘要：旋转 在大量的游戏开发过程当中，旋转是经常被开发者使用的，通常需要得到旋转后目标点的坐标。旋转分很多种类：2D游戏世界中，以某一点为旋转目标；3D游戏世界中，以轴为旋转目标。所以本文将旋转分为四类，涵盖所有旋转的情况： 绕点旋转（2D） 绕坐标轴（x/y/z）旋转（3D） 绕坐标轴的平行轴旋转（3D） 绕任意轴旋转（3D） 绕点旋转 在绕点旋转的时候，需... 阅读全文
码农干货系列【2】--由关节(Joint)说到割绳子(cut the rope)
2012-06-08 08:03 by 【当耐特】, 4988 阅读, 22 推荐, 收藏, 编辑
摘要：简介 关节是相互连结且互相约束的物体，常见于各类物理引擎当中。关节的运用非常广泛，例如人体模拟、动物行走模拟、器材、绳子、机关、链桥等都可以灵活利用关节去模拟。 普通的关节分两种，一种是有固定点，一种没有固定点。本文分别对两种关节进行计算并且输出图片进行模拟。 关节 关节通常用下面这种表达方式： (function (window) { var Joint = functi... 阅读全文
码农干货系列【1】--方向包围盒(OBB)碰撞检测
2012-06-07 11:40 by 【当耐特】, 33637 阅读, 36 推荐, 收藏, 编辑
摘要：干货 最近一直在删文章，不是要关博洗手什么的，而是被删的文章没有达到“干货”的标准。干货的反义词是水货，比如我们经常吃的注水猪肉，它就是水货，非干货。什么是“干货”。？经过一番搜寻，标准的描述是：实用性比较强的，不含任何吹嘘水分，也没有虚假的成分，所以业内人士通常把这一类分享活动称之为“干货”。 文章是否是干货做如下几点要求： 必备条件： 1.整体样式风格整齐美观； 2.实... 阅读全文
HTML5 OO实践
2012-03-29 08:42 by 【当耐特】, 8181 阅读, 24 推荐, 收藏, 编辑
摘要：简介人工智能(Artificial Intelligence) ，英文缩写为AI。它是研究、开发用于模拟、延伸和扩展智能的理论、方法、技术及应用系统的一门新的技术科学。本篇从严格意义上说属于人工智能的范畴，但也是基础中的基础。本篇的目的是要赋予小球解散和集合两项基本指令（智商），本篇内容中相关算法适用于子弹追踪等塔防类游戏当中。基础类二维向量(2D vector)可谓2D游戏或是动画里最常用型别了。这里二维向量用Vector2类实现，用(x, y)表示。 Vector2亦用来表示空间中的点(point)，而不另建类。先看代码：1 (function(window){2varVector2=fu 阅读全文
HTML5 Canvas【所见===所得】编程工具正式发布
2012-03-28 08:28 by 【当耐特】, 11386 阅读, 34 推荐, 收藏, 编辑
摘要：+ - 使用指南 基本使用： var c=document.getElementById("myCanvas");var cxt=c.getContext("2d");cxt.fillStyle="#FF0000";cxt.beginPath();cxt.arc(70,18... 阅读全文
HTML5 Canvas开发者和读者的福音
2012-03-27 12:25 by 【当耐特】, 5359 阅读, 5 推荐, 收藏, 编辑
摘要：演示今天看到可见即可得的编程 ，其中是在svg中实现的。理所当然，它可以搬到 canvas当中，而且支持canvas动画播放，而不是仅仅是静态的svg。效果如下所示: Your browser does not support the canvas element. 修改颜色(fillsStyle)或者count或者angle等值试试！var canvas = document.getElementById('myCanvas');var ctx = canvas.getContext("2d");function taiji(x, y, radius, a 阅读全文
HTML5 【IE9割绳子】制作教程来袭····
2012-03-26 08:04 by 【当耐特】, 8445 阅读, 24 推荐, 收藏, 编辑
摘要：回顾 与“Angry Birds”一样，2010年发布的“割绳子”是一款火爆的手机游戏，首先推出的是iOS版，于去年6月份推出Android版。它的游戏内容是：一个叫Om Nom的绿怪兽饿了，你必须喂他糖果，而要得到糖果，你要先割断绳子以及操纵安全气袋和泡泡，过程中还要收集星星来获取额外积分。 为了进一步宣传IE9和华丽的Web应用程序，微软与该款游戏的开发商ZeptoLab联合推出了HTML... 阅读全文
HTML5热门游戏制作---没有99美元的Impact也行
2012-03-06 08:38 by 【当耐特】, 8784 阅读, 13 推荐, 收藏, 编辑
摘要：Impact 简介Impact is a JavaScript Game Engine that allows you to develop stunning HTML5 Games for desktop and mobile browsers.Impact 一款让开发者在桌面浏览器和移动终端浏览器开发优秀的HTML5游戏的javascript游戏引擎。官网地址：http://impactjs.com/售价：99美元其中的最受欢迎且耳熟能详的莫过于下面这款：这是一个打字射击游戏，该游戏被国外很多网站评选为二十款优秀游戏之一。综合分析了一下该款游戏，总体感觉----注重细节。游戏技术要素1.资 阅读全文
repeater 模拟器 in winform
2012-02-08 17:27 by 【当耐特】, 2985 阅读, 3 推荐, 收藏, 编辑
摘要：需求 有一个这样的需求，根据给定的数据源和html模板生成html，强大的All in one code中的代码不能满足需求，所以就有了RepeaterSimulate. 其中涉及：反射、泛型、正则表达式等基础知识。 RepeaterSimulate使用 RepeaterSimulate r = new RepeaterSimulate(); ... 阅读全文
ProgressForm
2012-01-16 19:00 by 【当耐特】, 3100 阅读, 3 推荐, 收藏, 编辑
摘要：简介 在winform项目中，我们常常需要弹出一个窗体显示处理的进度，All in one code中的progress不能满足我们的需求，所以就有了ProgressForm. ProgressForm对外开放了一个DoExecute抽象方法，以便使用者override . public abstract class Action<TResult> { ... 阅读全文
绕中心旋转
2011-12-12 07:33 by 【当耐特】, 22933 阅读, 17 推荐, 收藏, 编辑
摘要：一.简介 本文告诉读者在Canvas中怎么绕中心旋转，通过此方法模拟出一个2D平面内的水珠，涉及的知识点和技巧包括：Jscex基础知识，贝塞尔曲线的绘制，合理利用CanvasRenderingContext2D的translate和rotate等API。 二.绘制椭圆 在模拟水滴之前，我们先思考一下怎么在canvas当中绘制一个椭圆。 大家可以很容易想到 下面几种方案： 1.根据椭圆笛卡尔坐标系方程绘制 2.根据椭圆极坐标方程绘制 3.根据椭圆曲率变化绘制 4.利用四条贝塞尔曲线绘制 第四中，也是性能最好的一种，这样可以避免复杂的计算，充分利用Ca... 阅读全文
HTML5游戏制作完全指南
2011-12-08 18:28 by 【当耐特】, 19136 阅读, 23 推荐, 收藏, 编辑
摘要：简介 创建画布 游戏循环 Hello world 创建player 键盘控制 a:使用jQuery Hotkeys b:移动player 添加更多游戏元素 炮弹 敌人 使用图片 碰撞检测 声音 简介 你想使用HTML5的Canvas制作一款游戏吗？跟着这个教程，你将立刻上道儿。 阅读该教程需要至少熟悉javascript相关知识。 你可以先玩这款游戏或者直接阅读文章并且下载游戏源码。 创建画布 在画任何东西之前，我们必须创建一个画布。因... 阅读全文
怎么把CanvasLoading插件嵌入你的游戏
2011-12-07 17:01 by 【当耐特】, 3465 阅读, 3 推荐, 收藏, 编辑
摘要：一.简介 CanvasLoading插件适用于任何基于Canvas游戏的loading过程展示。 二.插件源码 Loading = function (text, fontSize,baseFontSize, color, position, interval, font, bolder) { this.text = text; this.fontSize = fontSize; this.baseFontSize=baseFontSize; this.color = colo... 阅读全文
Jscex版Loading插件V11.12.05发布
2011-12-05 17:22 by 【当耐特】, 2988 阅读, 4 推荐, 收藏, 编辑
摘要：一.简介 本插件适用于基于Canvas的游戏loading过程中的显示。 更新内容： a.loading显示的文字可配置 b.文字大小可配置 c.文字位置可配置 d.文字与文字的间距可配置 e.文字颜色、字体、是否加粗可配置 二.插件源码 Vector2 = function (x, y) { this.x = x || 0; this.y = y || 0; }; Loading = function (text, fontSize, color, pos... 阅读全文
Jscex版Loading插件预览版本抢先看
2011-12-04 17:30 by 【当耐特】, 2808 阅读, 5 推荐, 收藏, 编辑
摘要：一.简介 在大量游戏制作过程当中，必不可少的一个重要元素就是Loading.在大量的flash游戏当中我们经常可以看到，比如《XXX》的Loading 一个好的Loading,可以给用户不错... 阅读全文
借来的创意
2011-12-01 08:54 by 【当耐特】, 4214 阅读, 9 推荐, 收藏, 编辑
摘要：一.简介 计数是一种最简单基本的运算，计数器就是实现这种运算的逻辑电路，计数器在数字系统中主要是对脉冲的个数进行计数，以实现测量、计数和控制的功能，同时兼有分频功能，计数器是由基本的计数单元和一些控制门所组成，计数单元则由一系列具有存储信息功能的各类触发器构成，这些触发器有RS触发器、T触发器、D触发器及JK触发器等。计数器在数字系统中应用广泛，如在电子计算机的控制器中对指令地址进行计数，以便顺序取出下一条指令，在运算器中作乘法、除法运算时记下加法、减法次数，又如在数字仪器中对脉冲的计数等等。计数器可以用来显示产品的工作状态，一般来说主要是用来表示产品已经完成了多少份的折页配页工作。它主... 阅读全文
你必须知道的10个提高Canvas性能技巧
2011-11-29 17:07 by 【当耐特】, 24250 阅读, 13 推荐, 收藏, 编辑
摘要：你还在抱怨自己写的canvas demo徘徊在10帧以下吗？你还在烦恼打开自己写的应用就听见CUP风扇转吗？你正在写一个javascript Canvas库吗？那么下面九点就是你必须知道的！ 一.预渲染 错误代码： var canvas = document.getElementById("myCanvas"); var context = this.canvas.getContext('2d'); var drawAsync = eval(Jscex.compile("async", function () { while (true) 阅读全文
Text Particle Systems
2011-11-25 08:41 by 【当耐特】, 2937 阅读, 7 推荐, 收藏, 编辑
摘要：一.简介 在一些企业广告或者网站需要一些动态文字特效的时候,往往有下面这几种选择： 1.Flash制作的文字特效 2.制作一个动态的GIF 3.Javascript+dom+css 4.SVG 二.javascript+Canvas文字特效 这篇我为大家介绍第五种，也是最强大的一种，上面四种都有局限性。 我使用的是javascript+Canvas,当然我们依然用Jscex,为什么Canvas制作文字特效最强大?? 因为Canvas支持像素级别操作，它不仅可以宏观上制作一些文字特效，也可以深入实现文字粒子系统特效----Text Particle Systems。 当然... 阅读全文
每周优秀代码赏析—Jscex内核【一】
2011-11-24 08:49 by 【当耐特】, 5231 阅读, 8 推荐, 收藏, 编辑
摘要：一.简介 Jscex is JavaScript implementation of F#'s Computation Expressions. 它的灵感的源于F#，它为JavaScript语... 阅读全文
参赛作品
2011-11-22 07:29 by 【当耐特】, 6335 阅读, 9 推荐, 收藏, 编辑
摘要：一.简介 3D贪吃蛇是贪吃蛇游戏的3D版本。通过摄取食物，累积数量来通关，随着摄取食物的增加，蛇身体会慢慢变长变肥大。游戏开放了许多快捷键，方便玩家操作。游戏一共七个关卡，一关比一关难。最后一关的随机障碍物更加是玩家的噩梦。为了获取更好的游戏体验，推荐使用谷歌浏览器或者枫树浏览器。 二.游戏框架和开发团队 这个游戏是使用Jscex作为动画引擎，使用Three.js框架作为3D引擎开发的HTML5游戏. 使用到的HTML5特性主要包括Canvas, CSS3 （按钮），没有使用WebGL。后期打算加入localStorage存储关卡信息。 在游戏中, 控制小蛇躲避前方的障碍物... 阅读全文
Canvas+Video打造酷炫播放体验
2011-11-21 08:32 by 【当耐特】, 17268 阅读, 14 推荐, 收藏, 编辑
摘要：一.简介 直到现在，仍然不存在一项旨在网页上显示视频的标准。 今天，大多数视频是通过插件（比如 Flash）来显示的。然而，并非所有浏览器都拥有同样的插件。 HTML5 规定了一种通过 video 元素来包含视频的标准方法。如： <video src="movie.ogg" controls="controls"></video>二.Canvas+VideoHTML5中引入新的元素canvas，其drawImage 方法允许在 canvas 中插入其他图像( img 和 canvas 元素) 。 drawImage函数有三种函数原 阅读全文
Jscex没有xxxAsync().stop()怎么办？
2011-11-17 22:09 by 【当耐特】, 2626 阅读, 1 推荐, 收藏, 编辑
摘要：今天一同事问我Jscex怎么没有stop啊？ 异步任务就像断线的风筝，我们没法让它说停就停，但是我们在放飞它之前，可以装个定时炸弹。 通常我们可以这样退出一个异步任务： va... 阅读全文
令人震撼的表白,你hold住吗？
2011-11-15 09:02 by 【当耐特】, 17299 阅读, 18 推荐, 收藏, 编辑
摘要：一.简介 为什么程序员单身的多呢？因为面向对象的编程中，经常会遇到一个错误：找不到对象。 本文也属于单身程序员的福音范畴，让单身程序员勇敢示爱·····，但是老天保佑你的示爱对象不要用IE678~~ 本文动画效果全部基于Jscex，然后结合一些函数、粒子系统、重力场实现。下一篇带来作品讲解，本篇先饱饱眼福。 二.作品一：心碎 <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> </head& 阅读全文
爱♥曲线,单身程序猿福音
2011-11-07 08:41 by 【当耐特】, 10351 阅读, 28 推荐, 收藏, 编辑
摘要：一.笛卡尔♥ 笛卡尔（René Descartes）是17 世纪著名的法国哲学家、数学家，有着“现代哲学之父”的称号。笛卡尔对数学的贡献也是功不可没，他创造了解析几何，开创了数学、物理学、天文学、地质学等诸多学科的新时代。 传闻，笛卡尔曾流落到瑞典，邂逅美丽的瑞典公主克里斯蒂娜（Christina）。笛卡尔发现克里斯蒂娜公主聪明伶俐，便做起了 公主的数学老师， 于是两人完全沉浸在了数学的世界中。国王知道后，认为笛卡尔配不上自己的女儿，不但强行拆散他们，还没收了之后笛卡尔写给公主的所有信件。后来，笛卡尔染上黑死病，在临死前给公主寄去了最后一封信，信中只有一行字：r=a(1-sinθ)。 阅读全文
再说AutoComplete
2011-11-04 12:16 by 【当耐特】, 5395 阅读, 6 推荐, 收藏, 编辑
摘要：一.简述 昨天support一同事，帮她的客户做类似下面的效果（自动完成）： 以前在搜房的时候，弄过这个，调用楼盘字典： 这是一个小功能，也是一个大功能。因为它可以做大，也可以做小。 二.搜房的AutoComplete 比如上面我们看到搜房的这个就做大了，你要看到这样一个效果，其实搜房做了这么几件事： 1.数据库作业。把每天的楼盘字典存入XML,每个城市的对应一个X... 阅读全文
锥
2011-11-01 13:57 by 【当耐特】, 3889 阅读, 5 推荐, 收藏, 编辑
摘要：一.简介 圆锥，数学领域术语，有两种定义。 解析几何定义：圆锥面和一个截它的平面（满足交线为圆）组成的空间几何图形叫圆锥。 立体几何定义：以直角三角形的一条直角边所在直线为旋转轴，其余两边旋转形成的面所围成的旋转体叫做圆锥。该直角边叫圆锥的轴 。 二.圆锥模拟 通过以上两个定义，我可以模拟出圆锥上所有的点： var pointPositions = []; for (var i = -100; i < 200; i += 10) { var xTemp = getRandomNumber(-i, i); ... 阅读全文