说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

变身音乐控制器!开源JavaScript库NexusUI

HTML文档下载 WORD文档下载 PDF文档下载
NexusUI是一款开源JavaScript库,可以在Web浏览器和移动App上实现音乐控制器。且,NexusUI对移动设备友好且兼容多点触控,可以通过浏览器分配音乐界面来进行大型合作表演,让音乐控制器在任意Web浏览器中都可使用。

NexusUI是音频接口组件的一个开源免费的JavaScript库,可以在Web浏览器和移动App上实现音乐控制器。而且,它并不是一个固定的解决方案,是可以构建自定义界面的组件集。能够直接被用来与浏览器中的Web Audio API集成,或是通过服务器程序传输OSC数据到类似Max、SuperCollider或Chuck应用中去。


NexusUI对移动设备友好且兼容多点触控,可以通过浏览器分配音乐接口来进行大型合作表演,让音乐控制器在任意Web浏览器中都可使用。

NexusUI的使用

创建元素

  • Nexus需要连接到jquery.js和nexusUI.js库。
  • 通过<canvas>添加元素。
  • 使用有效的NexusUI元素,可以通过NexusUI API进行查看。

<head>		<script src="filepath/jquery.js"></script>	<script src="filepath/nexusUI.js"></script>	</head><body>	<canvas nx="toggle"></canvas>	<canvas nx="button"></canvas>	<canvas nx="multislider"></canvas></body>

在JavaScript中处理Nexus

  • nx:JavaScript中是以nx来全局实例化NexusUI。

<script>	nx.onload {			  matrix1.row = 2;	  matrix1.col = 2;	  matrix1.draw();	  	  beatmatrix5.matrix = [ [1,0,0],[0,1,0],[0,0,1] ];	  beatmatrix5.draw();	  	}	</script>						<canvas nx="matrix"></canvas><canvas nx="matrix" id="beatmatrix5"></canvas>


发送数据至Max

NexusUI包含一个nexusOSCRelay.php PHP文件,从接口转发数据到制定的IP和端口(默认IP 127.0.0.1,端口为7475)。

nx.onload = function() {	  nx.sendsTo("ajax");  nx.usesScript("nexusPHP/nexusOSCRelay.php");    // or set an element individually    dial1.sendsTo("ajax");  }
JS中集成Web Audio(或HTML5图形等其他)

<script>	nx.onload = function() {			  nx.sendsTo("js");	  	  // set individual receiver	  	  dial1.response = function(data) {	    dial2.val = data;	    dial2.draw();	  }			}</script><canvas nx="dial"></canvas><canvas nx="dial"></canvas>


样式设定

<script>	nx.onload {			  nx.colorize("#00CCFF"); // sets accent (default)	  nx.colorize("border", "#222222");	  nx.colorize("fill", "#222222");			  dial3.colors.accent = "#FF00CC";	  dial3.draw();	}</script><canvas nx="dial" height="150" width="150"></canvas><canvas nx="dial" height="100" width="100"></canvas><canvas nx="dial" height="75" width="75"></canvas><canvas nx="dial" height="50" width="50"></canvas>

传送门:NexusUI官网、mobilehub主页

(编译/刘璐璐 责编/唐小引)

机智云完成2亿元B轮融资 将围绕信息安全与机器学习创建“机智云联合实验室” 【CTO讲堂】深度?广度?浅析技术人员的职业发展之路 详解React Flux架构工作方式 专访Tiny框架创始人悠然:好的软件设计是“品”出来的 开发移动应用的7大设计要点 历时一年半 现代Web框架Phoenix 1.0正式发布 【七问七答】对话Erlang核心成员Eric Merritt 分布式文档数据库MongoDB开发版本3.1.7发布 年末巨献!SDCC 2015中国软件开发者嘉年华全面开启 Qualcomm中国2015高峰论坛:新品牌与5G技术展望 福利!MDCC 2015 免费展位等你来申请! 《近匠》Gamegou:多些坚持,瞄准海外的小团队也有春天 细说JavaScript异步函数发展历程 YoMail创始人Albert Yang:我与Email交织的程序人生 TIOBE 2015年9月编程语言排行榜:时髦语言Rust进前50 50张999元限量特惠票!SDCC2015软件开发嘉年华 首批讲师名单公布 百度安全:XcodeGhost大爆发可能只是冰山一角 北京市计算中心云计算转型:缘定OpenStack MDCC 2015移动开发者大会 八大技术专场首批议题剧透 Apple TV指南:从零开始用Swift开发个tvOS应用 React Native、开源:MDCC平台与技术Android专场全揭秘! 相约MDCC 2015 首批免费展位破茧而出 MDCC 2015召开在即,平台与技术iOS专场大咖来了! 一个iOS开发者对tvOS SDK的初探 前Twitter iOS技术团队负责人:使用第三方库的四大准则 【SDCC讲师专访】巨杉数据库创始人兼CTO王涛:SequoiaDB为何要开源? 对话函数式编程语言Roy之父Brian Mckenna GitLab获400万美元A轮融资,GitLab 8.0将很快到来 【CTO讲堂】如何构建高可用和可伸缩的架构? 未来程序员会被机器取代吗? React Native实战(一):配置和起步 问一个数据库公式的问题! 一个IP发布两个网站的问题(在线等待) 怎样改变资源文件里字体的颜色???菜单里的字体颜色我不会改?有专家指点吗? Python 网络教室采用多播好还是广播好? 下载的问题! 如何新建一个文件夹? 将html文件存放在备注字段中,然后再输出可以吗? 如何控制一个文本框的内容随另一个文本框的内容变化而同步变化? 一个关于窗口的小问题!!!小弟初学DELPHI请多多指教!! 求助 excel导入数据时出错.高手进 请问role是干嘛的? 自动生成图片 datawind如何与window联系起来啊 存储过程同时调用和数据库异地备份问题? 在xsl中如何调用javascript 误删系统盘,救命!!! 请问ACCP和高程考试相比哪个更有份量? 求LeapFTP V2.7.3.600的注册码 5月6日我来CSDN的二周年,散分,纪念。。。。 listbox (湖南)今年非典搞得这样,会耽误报高程吗?今年有人报了吗?怎样报的? ComboBoxEx在 SetImageList 时出错 在DBComboBox中脸上数据库后,为什么进行选择时会出现“违反了Primary 约束“ 关于传递多值的问题 如何从recordset得到数据库的行号 用<%@ include file="xxx.jsp"%>出现的怪问题!求教 有关server.mappath()的问题 J2EE基础问题两三问,追加200分。 问题很简单,但我很急,请帮忙各位。 可用的UDDI 急救!自动隐藏Panel 帮忙 哪里有数据库系统开发的文档下载 急待解决的问题 请问从socket发信息,连续发送几个小数据包出错的情况!! 紧急问题,在线等待! 救命——存取违例 请问在VB中使用DAO控件怎样打开ACCESS数据库? 请问装vc6的sp5主要有什么作用啊 双网卡的局域网,如何让 CSocket 使用指定的网卡与另一电脑通讯? SQL删除不了相同的记录 JBuilder7中的中文问题 谁知道计算机的本地时间与系统时间有什么区别? 请问如何实现垂直显示文字?` JDOM高手看过来! 请问怎么在vb中调用纯c接口的api并实现多线程 如何实现任意长整数的运算? 程序移植,有多大的工作量??? 哪里有InstallShield Express的中文包D6自带的那个。 日民主党前干事长年内成立新团体 被疑日本拟在多个城市开设赌场 年收入可达美国十岁男孩弑父案即将宣判 孩子去处贝卢斯科尼女友否认系同性恋 索赔千万杭州市市管领导干部任前公示通告俄外交官被指在美国招募间谍 美联邦调法国研究员:想象力丰富者比较能拒绝眼韩军警在韩日争议岛演练登陆 旨在抵御伊核问题引美以分歧 美同意合法保留以贝卢斯科尼女友否认系同性恋 索赔千万法德寻求与美就窃听丑闻展开对话中国三大舰队首汇西太平洋 联演常态化中国转型\"旅游输出大国\" 放宽对联合国日中国赴刚果(金)维和官兵展风泰国僧王百岁圆寂英村庄半夜传神秘怪声 专家称是鱼求偶奥巴马医改法案成美国会听证会上“箭靶韩军警在韩日争议岛演练登陆 旨在抵御美刊:中国富人国外买房欲圆“西方梦”乌克兰传奇拳王参选总统 支持率高于现普京对乌克兰放狠话 入欧便不可能加入北京:麦当劳薯条供应商排污被罚391天安门广场10条公交绕行安倍想让自卫队成为“美国卫队”吗校园“国际”运动会我国7003.1万人吃低保最高检:严处“围猎”干部行贿犯罪公安部打击网上黄赌枪爆■彩票开奖公告18:30与石景山摩天轮说再见电力公司开通应急服务“重奖拆建”释放双重危险信号求职者可微信“导航”岗位北京倡导家门口完成15年教育慈善教育拟进入中小学德育课程北京千余劳模先进获表彰东城孩子去哪儿上学可网上查15种不合格食品曝光下架全国农民工近2.74亿 总增量连续三从受理到答复 信访实现一网通国台办:对台商优惠政策不变今日挥别摩天轮
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn 说三道四技术文摘