课程讲解流程

知识点概览：

应用核心结构介绍

效果：

show 么

DDF2434

12345

改了滑槽滑块，和左栏，上栏的自适应。

圆形不能自适应，这里优化一下

然后模糊化

小帽子 降速递减，碰到柱子反向

给draw函数绑定一个属性。

draw.type = this.getAttribute("data-type");绑定属性。

ctx.fillStyle要在圆形和矩形部分分别赋值。

x和y随窗口改变

v函数一直变

visualizer()单独调用。

requestAnimationFrame()动画函数，有兼容性问题。

通常一秒60次，更流畅

第一首load ，切到第二首的时候没有切掉上一首。

var source = null;

加载完的位置加一句

source = bufferSource;

加载开始部位加

source && source[source.stop ? "stop" : "noteOff"]();

但如果三首都加载时就切换，还是同时播放。

在回调函数中解码buffer数组。

ajax的open方法。responseType，arraybuffer二进制缓冲区。

onload方法。

在public/javascripts下建一个index.js

在views下的index.ejs引用这个文件。

我们需要点击列表时，显示点击，点击后发起ajax请求，获取到音频数据

routes下的index.js里router.get()方法里获取歌曲列表，返回给前端的数组。

引入fs，fs里有一个函数readdir()是专门读取文件的。异步读取，也可以同步。

li的CSS选择器中list-style: none；可以去掉小圆点。

box-sizing:border-box;

元素宽度包括填充区域和边框宽度。更好的控制元素的宽和高。

主要关注views, routes, public

routes里的index.js是控制路由的。

静态资源都在public下

npm install -g express-generator

选好路径之后

express -e music

cd music/

进入项目

关闭后重新开，cd到项目文件，npm start 就跑起来了。

npm install

安装依赖

npm install -g supervisor

安装全局监听

suprevisor bin/www

当它有变化的时候这个服务会重启。

然后访问127.0.0.1:3000

express默认3000端口

destination, currentTime