`

水果忍者代码理解-timeline

 
阅读更多


 我们可以先看代码

图片显示代码的结构

 

<!DOCTYPE HTML>
<html>
<head>
	<title>timeline脚本</title>
	<script type="text/javascript" src="sea.js"></script>
	<script type="text/javascript">
		seajs.use("main",function(main){
			main.start();
		});
	</script>
</head>
<body>
	<canvas id="myview">您的浏览器不支持,请更换现代浏览器</canvas>
</body>
</html>

 这里使用sea.js调用程序的入口,不是重点

 

define("main",function(require, exports, module){
	var timeline = require("timeline");
	
	exports.start = function(){
		timeline.init();
		//this.show();
		this.hide();
	};
	
	exports.anims = [];
	
	exports.show = function( start ){
	    timeline.createTask({
			start: start, 
			duration: 1000, 
			data: [ 1e-5, 1, "show" ],
			object: this, 
			onTimeUpdate: this.onZooming, 
			onTimeStart: this.onZoomStart, 
			onTimeEnd: this.onZoomEnd,
			recycle: this.anims
		});
	};
	
	exports.hide = function( start ){
	    timeline.createTask({
			start: start, 
			duration: 500, 
			data: [ 1, 1e-5, "hide" ],
			object: this, 
			onTimeUpdate: this.onZooming, 
			onTimeStart: this.onZoomStart, 
			onTimeEnd: this.onZoomEnd,
			recycle: this.anims
		});
	};
	
	// 显示/隐藏 相关
	
	exports.onZoomStart = function(){
		console.info("开始缩放");
	};
	
	exports.onZooming = function(){
		console.info("正在缩放");
	};
	
	exports.onZoomEnd = function(){
		console.info("结束缩放");
	};
	
	
	
});

 这里面只是做了一个方法的调用

 

define("timeline",function(require, exports, module){
//初始化,使用timeline就必须进行初始化操作
	exports.init = function(){
		var me = this;
		me.startTime = now();
		me.count = 0;
		var time = 1;
		//这里每隔1毫秒进行一次更新操作
		setInterval(function(){
			me.count++;
//这里的更新方法是关键,就好比是汽车的发动机
			update(now());
		}, time);
	};
	
	exports.createTask = function(conf){
		/* e.g. createTask({
			start: 500, duration: 2000, data: [a, b, c,..],
			object: module, onTimeUpdate: fn(time, a, b, c,..), onTimeStart: fn(a, b, c,..), onTimeEnd: fn(a, b, c,..),
			recycle: []
		}); */
		var task = createTask(conf);
		addingTasks.unshift(task);
		adding = 1;
		if(conf.recycle){
			this.taskList(conf.recycle, task);
		}
		return task;
	};
	//当前模块运行的任务,以及停止并清除所有正运行的任务
	exports.taskList = function(queue, task){
		if(!queue.clear){
			queue.clear = function(){
				for(var task, i = this.length - 1; i >= 0; i--){
					task = this[i];
					task.stop();
					this.splice(i, 1);
					return this;
				}
			}
		}
		if(task){
			queue.unshift(task);
		}
		return queue;
	};
	
	exports.getFPS = function(){
		var t = now();
		var fps = this.count / ( t - this.startTime ) * 1e3;
		if(this.count > 1e3){
			this.count = 0;
			this.startTime = t;
		}
		return fps;
	};
	
	var tasks = [];
	var addingTasks = [];
	var adding = 0;
	
	var now = function(){
		return new Date().getTime();
	};
	
	var createTask = function(conf){
		var object = conf.object || {};
		conf.start = conf.start || 0;
		return {
			start: conf.start + now(),
			duration: conf.duration == -1 ? 864000000 : conf.duration,
			data: conf.data ? [0].concat(conf.data) : [0],
			started: 0,
			object: object,
			onTimeStart: conf.onTimeStart || object.onTimeStart || function(){ return null; },
			onTimeUpdate: conf.onTimeUpdate || object.onTimeUpdate || function(){ return null; },
			onTimeEnd: conf.onTimeEnd || object.onTimeEnd || function(){ return null; },
			stop: function(){ this.stopped = 1; }
		};
	};
	//进行任务的更新操作,
	var updateTask = function(task, time){
		var data = task.data;
		data[0] = time;
//运行更新方法,更新方法的作用域是task.object,参数是data
		task.onTimeUpdate.apply(task.object, data);
	};
	
	var checkStartTask = function(task){
		if(!task.started){
			task.started = 1;
//运行开始方法,开始方法的作用域是task.object,参数是task.data数组删除第一个元素,因为第一个元素是动态添加的
			task.onTimeStart.apply(task.object, task.data.slice(1));
			updateTask(task, 0);
		}
	};
	
	var update = function(time){
		var i = tasks.length, t, task, start, duration, data;
		while(i--){
			task = tasks[i];
			start = task.start;
			duration = task.duration;
			if(time >= start){
				if(task.stopped){
					tasks.splice(i, 1);
					continue;
				}
				checkStartTask(task);
				if((t = time - start ) < duration){
					updateTask(task, t);
				}else{
					updateTask(task, duration);
					task.onTimeEnd.apply(task.object, task.data.slice(1));
					tasks.splice(i, 1);
				}
			}
		}
		//任务的添加
		if(adding){
			tasks.unshift.apply(tasks, addingTasks);
			addingTasks.length = adding = 0;
		}
	};
	
});

 

  • 大小: 11.1 KB
分享到:
评论

相关推荐

    FruitNinja.zip

    《基于CocosCreator的“水果忍者”小游戏开发详解》 在移动设备上,"水果忍者"是一款深受玩家喜爱的休闲游戏。本项目通过CocosCreator引擎,使用JavaScript编程语言,实现了一个基本的切水果小游戏,涵盖了游戏的...

    TinyYolo2实时视频流物体检测ONNX模型

    TinyYolo2实时视频流物体检测ONNX模型 运行 ONNX 模型,并结合 OpenCV 进行图像处理。具体流程包括: 1. 加载并初始化 ONNX 模型。 2. 从摄像头捕获实时视频流。 3. 对每一帧图像进行模型推理,生成物体检测结果。 4. 在界面上绘制检测结果的边界框和标签。

    chromedriver-linux64-134.0.6998.23(Beta).zip

    chromedriver-linux64-134.0.6998.23(Beta).zip

    Web开发:ABP框架4-DDD四层架构的详解

    Web开发:ABP框架4-DDD四层架构的详解

    chromedriver-linux64-135.0.7029.0(Canary).zip

    chromedriver-linux64-135.0.7029.0(Canary).zip

    (参考项目)MATLAB人脸门禁系统.zip

    实现人脸识别的考勤门禁系统可以分为以下步骤: 1. 采集人脸图像数据集:首先需要采集员工的人脸图像数据集,包括正面、侧面等多个角度的图像。可以使用MATLAB中的图像采集工具或者第三方库进行采集。 2. 预处理人脸图像数据:对采集到的人脸图像数据进行预处理,包括人脸检测、人脸对齐、人脸裁剪等操作。MATLAB提供了相关的图像处理工具箱,可以用于实现这些处理步骤。 3. 特征提取与特征匹配:使用人脸识别算法提取人脸图像的特征,比如使用人脸识别中常用的特征提取算法如Eigenfaces、Fisherfaces或者基于深度学习的算法。然后将员工的人脸数据与数据库中的人脸数据进行匹配,判断是否为注册员工。 4. 考勤记录与门禁控制:如果人脸匹配成功,系统可以记录员工的考勤时间,并且控制门禁系统进行开启。MATLAB可以与外部设备进行通信,实现门禁控制以及考勤记录功能。

    rdtyfv、ijij

    yugy

    企业IT治理体系规划.pptx

    企业IT治理体系规划.pptx

    基于Nutz、SSH、SSM的新闻管理系统.zip(毕设&课设&实训&大作业&竞赛&项目)

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行,功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    基于多目标粒子群算法的冷热电联供综合能源系统优化调度与运行策略分析,基于多目标粒子群算法的冷热电联供综合能源系统优化调度与运行策略分析,MATLAB代码:基于多目标粒子群算法冷热电联供综合能源系统运行

    基于多目标粒子群算法的冷热电联供综合能源系统优化调度与运行策略分析,基于多目标粒子群算法的冷热电联供综合能源系统优化调度与运行策略分析,MATLAB代码:基于多目标粒子群算法冷热电联供综合能源系统运行优化 关键词:综合能源 冷热电三联供 粒子群算法 多目标优化 参考文档:《基于多目标算法的冷热电联供型综合能源系统运行优化》 仿真平台:MATLAB 平台采用粒子群实现求解 优势:代码注释详实,适合参考学习,非目前烂大街的版本,程序非常精品,请仔细辨识 主要内容:代码构建了含冷、热、电负荷的冷热电联供型综合能源系统优化调度模型,考虑了燃气轮机、电制冷机、锅炉以及风光机组等资源,并且考虑与上级电网的购电交易,综合考虑了用户购电购热冷量的成本、CCHP收益以及成本等各种因素,从而实现CCHP系统的经济运行,求解采用的是MOPSO算法(多目标粒子群算法),求解效果极佳,具体可以看图 ,核心关键词: 综合能源系统; 冷热电三联供; 粒子群算法; 多目标优化; MOPSO算法; 优化调度模型; 燃气轮机; 电制冷机; 锅炉; 风光机组; 上级电网购售电交易。,基于多目标粒子群算法的CCHP综合

    DSP28379D串口升级方案:单核双核升级与Boot优化,C#上位机开发串口通信方案,DSP28379D串口升级方案:单核双核升级与Boot优化,C#上位机开发实现串口通信,DSP28379D串口升

    DSP28379D串口升级方案:单核双核升级与Boot优化,C#上位机开发串口通信方案,DSP28379D串口升级方案:单核双核升级与Boot优化,C#上位机开发实现串口通信,DSP28379D串口升级方案 单核双核升级,boot升级,串口方案。 上位机用c#开发。 ,DSP28379D; 串口升级方案; 单核双核升级; boot升级; 上位机C#开发,DSP28379D串口双核升级方案:Boot串口升级技术使用C#上位机开发

    基于ASP.NET MVC+三层架构和EntityFramework的微博门户网站项目.zip(毕设&课设&实训&大作业&竞赛&项目)

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行,功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    基于PLC的双层自动门控制:光电传感触发,有序开关与延时功能实现,附程序、画面及参考文档 ,基于PLC的双层自动门控制系统:精准控制,保障无尘环境;门间联动,智能安防新体验 ,基于plc的双层自动门控

    基于PLC的双层自动门控制:光电传感触发,有序开关与延时功能实现,附程序、画面及参考文档。,基于PLC的双层自动门控制系统:精准控制,保障无尘环境;门间联动,智能安防新体验。,基于plc的双层自动门控制系统,全部采用博途仿真完成,提供程序,画面,参考文档,详情见图。 实现功能(详见上方演示视频): ① 某房间要求尽可能地保持无尘,在通道上设置了两道电动门,门1和门2,可通过光电传感器自动完成门的打开和关闭。 门1和门2 不能同时打开。 ② 第 1 道门(根据出入方向不同,可能是门 1 或门 2),是由在通道外的开门者通过按开门按钮打开的,而第 2 道门(根据出入方向不同,可能是门 1 或门 2 )则是在打开的第 1 道门关闭后自动地打开的(也可以由通道内的人按开门按钮来打开第2 道门)。 这两道门都是在门开后,经过 3s 的延时而自动关闭的。 ③ 在门关闭期间,如果对应的光电传感器的信号被遮断,则门立即自动打开。 如果在门外或者在门内的开门者按对应的开门按钮时,立即打开。 ④ 出于安全方面的考虑,如果在通道内的某个人经过光电传感器时,对应的门已经打开,则通道外的开门者可以不按开门按钮。

    黑马程序员Java品达通用权限项目,基于SpringCloud SpringBoot 的微服务框架的权限管理解决方案.zip

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行,功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    DeepSeek+DeepResearch-让科研像聊天一样简单

    DeepSeek+DeepResearch——让科研像聊天一样简单 (1)DeepSeek如何做数据分析? (2)DeepSeek如何分析文件内容? (3)DeepSeek如何进行数据挖掘? (4)DeepSeek如何进行科学研究? (5)DeepSeek如何写综述? (6)DeepSeek如何进行数据可视化? (7)DeepSeek如何写作润色? (8)DeepSeek如何中英文互译? (9)DeepSeek如何做降重? (10)DeepSeek论文参考文献指令 (11)DeepSeek基础知识。

    基于springboot+uniapp实现的蛋糕商城小程序.zip(毕设&课设&实训&大作业&竞赛&项目)

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行,功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    jdepend-demo-2.9.1-10.el7.x64-86.rpm.tar.gz

    1、文件内容:jdepend-demo-2.9.1-10.el7.rpm以及相关依赖 2、文件形式:tar.gz压缩包 3、安装指令: #Step1、解压 tar -zxvf /mnt/data/output/jdepend-demo-2.9.1-10.el7.tar.gz #Step2、进入解压后的目录,执行安装 sudo rpm -ivh *.rpm 4、更多资源/技术支持:公众号禅静编程坊

    关爱儿童公益网站 web 项目.zip

    项目工程资源经过严格测试运行并且功能上ok,可实现复现复刻,拿到资料包后可实现复现出一样的项目,本人系统开发经验充足(全栈全领域),有任何使用问题欢迎随时与我联系,我会抽时间努力为您解惑,提供帮助 【资源内容】:包含源码+工程文件+说明等。答辩评审平均分达到96分,放心下载使用!可实现复现;设计报告也可借鉴此项目;该资源内项目代码都经过测试运行;功能ok 【项目价值】:可用在相关项目设计中,皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面,可借鉴此优质项目实现复刻,设计报告也可借鉴此项目,也可基于此项目来扩展开发出更多功能 【提供帮助】:有任何使用上的问题欢迎随时与我联系,抽时间努力解答解惑,提供帮助 【附带帮助】:若还需要相关开发工具、学习资料等,我会提供帮助,提供资料,鼓励学习进步 下载后请首先打开说明文件(如有);整理时不同项目所包含资源内容不同;项目工程可实现复现复刻,如果基础还行,也可在此程序基础上进行修改,以实现其它功能。供开源学习/技术交流/学习参考,勿用于商业用途。质量优质,放心下载使用

    MATLAB实现WOA-LSTM鲸鱼算法优化长短期记忆网络数据分类预测(含模型描述及示例代码)

    内容概要:本文档详细介绍了如何利用 MATLAB 实现鲸鱼优化算法 (WOA) 和长短期记忆网络 (LSTM) 相结合的技术——WOA-LSTM,在数据分类和预测领域的应用。文章首先概述了LSTM在网络训练中超参数依赖的问题以及WOA作为一种新颖的全局优化算法的优势。接着阐述了该项目的研究背景、目的及其重要意义,并深入讨论了项目面临的六大主要挑战,从模型优化到超参数空间管理。文档特别强调WOA-LSTM融合所带来的性能提升、降低计算复杂度的能力及其实现自动化的超参数优化流程。除此之外,文中展示了模型的应用广泛性,覆盖了从金融市场的股票预测到智能制造业的各种实际场景,并提供了具体的模型架构细节和代码实例,以帮助理解模型的工作原理和技术要点。 适合人群:具有一定编程技能的研究人员、工程师和科学家们,尤其是对深度学习技术和机器学习感兴趣的专业人士。 使用场景及目标:该文档的目标是向用户传授使用MATLAB实现WOA-LSTM进行复杂数据分类和预测的方法论,旨在指导读者理解和掌握如何利用WOA进行超参数寻优,从而改善LSTM网络性能。 其他说明:通过阅读这份文档,使用者不仅能够获得有关WOA-LSTM技术的具体实现方式的知识,而且还可以获取关于项目规划和实际部署过程中的宝贵经验。

    tomcat安装及配置教程.md

    tomcat安装及配置教程.md

Global site tag (gtag.js) - Google Analytics