JavaScript – 第9页电视电影小迷妹 TVco.cn

第36天/ MVP

班轮注意事项：星期五：真的很好。星期五有一些食品卡车，在工作样机上做了很多工作。星期六：这是我们将要从旧演播室播出的最后一部节目，然后再搬进去。和往常一样，度过了愉快的时光。您可以在这里查看：https://kNOwBETTERHIPHOP.com。星期日：由于星期一是个假期（旁注：感谢所有退伍军人为保护我们所有人做出了最大的牺牲。）我决定结束并启动过去几周一直在进行的附带项目。一直工作到周一清晨。我什至向提供我所使用的音乐流的人发送了一条消息。我创建的演示是一个超级最小可行产品。并没有应用太多的样式，只是使其实用。我希望，如果与我打交道的人不能进行合作，那么我们可以一起进行样式设计，以便更适合该品牌。如果您想了解到目前为止我做了什么，请查看https://chillhop.dwane.io。让我知道您的想法。星期一：由于我熬夜很晚才完成辅助项目，所以起床时间比平常晚了一点。这仍然是一个非常轻松而富有成效的一天。研究并审查了一堆日语。我什至为工作模型增加了一些代码。…

第146天

班轮注意事项：专业：更多的小部件工作。在向客户展示以获取反馈之前，与公司中的其他人进行了预演示。一切进展顺利。个人：因为我想在自己的个人网站上工作，所以跳过参加任何聚会的机会。我几乎已经编码了网站的主要组件，并且CSS动画正常工作（仍然需要微调时间）。超级早起。观看一些有关我想在个人网站上使用的技术的视频。这就像我第七次观看它。哈哈，我想了解视频中所做的所有事情，以便在将想法实现到我的网站时，可以满足我的需求。今天晚些时候与团队进行了演示/演示。我们才刚刚开始，完成的大部分工作是设置系统，因此在浏览器中没有太多显示。我有一个拖放到页面上的小部件。哈哈当我回到家时，一切都准备好明天的广播节目并在我的个人网站上工作。那是我的格斗歌！另外，我下周下班，所以没有博客帖子！…

如何创建与Howler.js一起使用的AudioSprites

在这篇文章中，我们将检查什么是音频精灵，以及如何通过howler.js音频库创建它们以在我们的项目中使用。什么是AudioSprite 音频精灵是一个包含多个声音的音频文件，一个包含定义每个音频开始时间及其长度的对象的json文件。它与带有图像的Spritesheet或Atlas具有相同的概念，但在音频环境中。面向声音艺术家的JavaScript：学习使用Web Audio API进行编码了解如何在使用JavaScript为声音艺术家创建交互式音频应用程序的同时对JavaScript进行编程：学习… www.amazon.com 我什么时候应该使用AudioSprites 如果您的项目中包含一堆很小的声音（例如1到5秒钟的声音效果），并且将它们打包在一起不会产生很大的文件大小，则可以考虑使用audiosprite。这样，当用户访问网站并由浏览器下载它们时，它与服务器的连接较少，并且可能节省了一些时间。但是，正如我之前说的，请注意最终Audiosprite文件的大小，否则文件会变大，然后下载速度变慢。如何生成AudioSprite 通过使用tonistiigi https://github.com/tonistiigi/audiosprite的’audiosprite’库，我们可以生成一个包含所有声音效果和json的mp3的完整过程，其中包括声音长度和适应于howler.js格式的开始时间需要。 AudioSprite库设置 1.）安装Node…

第118天

班轮注意事项：专业人士：因此我们在客户办公室进行了演示。每个人回答他们的问题都做得很好。我们几乎没有时间了，但是有一个快速演示的时间，我有一个工作机会，但是我的热点没有。我能够完成演示的一部分，因为它在我的计算机中是本地的，但是在显示后端内容时遇到了麻烦。整个早晨一切都正常，但是当我真的需要它工作时……不！我感觉很不好。之后，我们去吃了午饭，很高兴与一直在从事该项目的团队一起出去玩。完成这些后，我们中的一些人就去了机场。我很早就起床，因为我认为自从我前一天没有吃午饭以来，就去做我上次就诊时要求医生完成的实验室工作。回到家，忘记了我还没有发布博客，所以我在这里。得到了团队的一些电子邮件，说该演示文稿受到了好评，并获得了良好的积极反馈。那很好。要多休息一下并开始工作。祝你有美好的一天！和平片 Dwane…

第194天/太阳在我的脸上

班轮注意事项：专业人士：在我的工作上确实没有什么可做的，所以我花了一整天的时间来帮助后端人员为即将到来的客户演示做好准备。个人：参加了OrlandoJS聚会，在我等待开始时，我参与了我的副项目。我重构了一些代码，以便现在可以从数据库中提取以前经过硬编码的文本。一旦页面变成一个页面应用程序，我在渲染文本时会遇到一些问题，但这是时候开始聚会了。度过了非常愉快的时光。演讲真的很好。喊德语！闪电谈话也很好。去看看其他人对什么感兴趣并正在努力。我要谈谈我在一周中发现的一些东西。一如既往的美好时光！醒来晚了一点。绝对以为我病了。今天获得了我们的客户演示。我认为团队齐心协力，有很多实质性的东西可以展示，尤其是在使用我们提供的软件的情况下。我想修复遇到的渲染错误。…

第36天-移动B…。

班轮注意事项：多么周末。让我们从星期五开始。我们得到了周末的作业，在ReactJS中建立了一个照相馆，并实现了刚刚学到的Routing。得到它了。使用ReactJS（超级简单）创建了我的入门应用程序，使用MaterializeCSS格式化了我的布局，并使我的硬编码照片可以工作。大。我什至以为我可以合并身份验证，因为无论如何我都想使用Firebase。周末甚至会有时间实施Cloudinary提供的某些服务。那就是我的想法……哈哈在离开开始我的周末之前，我决定开始在路由器上工作，因为它确实非常快，对吗？不。由于某些原因，当我路由到另一个状态时，它将失去物料箱（灯箱）和模态箱的功能。我以为也许我错过了一些东西，这将是广播节目播出前的一个简单解决方法。又错了。哈哈星期六早上…。我到处搜寻答案。问题是我没有在控制台中收到错误，所以我没有要搜索的特定内容。…

如何使用Google Daydream和WebAudio构建星际VR CommLink

最近，我有机会设计了一个小型音频模块，用于以空间为主题的WebVR仿真。许多人不知道浏览器是否支持一套出色的工具来创建和转换音频文件。我们希望我们的太空模拟尽可能地身临其境。用户体验全都与沟通有关。我们需要沉浸式音频来匹配我们的VR。让我们看看如何仅使用浏览器为星际无线电传输创建沉浸式音频！这就是我们原始，干净的音频听起来像的。这就是我们完成后的声音！在本文中，我们将重点关注正确的音频。稍后，我将分享如何使用Google Daydream控制器来创建出色的身临其境的体验，使玩家感到自己正在使用真正的科幻Commlink！增加延迟首先，我们需要使音频感觉像是经过了很长一段距离。毕竟，您在太空中。一个明显的选择是WebRTC（实时通信），我最初尝试过。 WebRTC可能很挑剔。对于无线电传输来说，这也感觉太迫切了。连接后，浏览器将向其他用户发送连续的音频流。…

用React渲染ASCII和弦图

几周前，我勉强决定我的Chord项目需要基于Web的前端。在权衡各种选择之后，我决定将前端的核心实现为基于React的ASCII和弦图表渲染器。经过一些初步的代码草绘，我有了一个可以正常工作的原型，后来进行了一些修订，我发现自己对最终的代码感到满意。让我们深入研究吧！在开始研究代码之前，让我们看一下要构建的内容。我们的和弦后端将和弦视为代表在特定琴弦上弹奏的琴弦的可选数字列表，或代表代表所弹奏的琴弦和用于弹奏该琴弦的手指的可选两元组数字列表。例如，在后端，我们将使用以下列表代表经典的开放C大调和弦： [nil，3，2，0，1，nil] 并以普通的指法： [nil，{3，3}，{2，2}，{0，nil}，{1，1}，nil] 不幸的是，Javascript没有“元组”类型，因此我们不得不将和弦表示为一维或二维数字数组。在我们的前端，这些相同的和弦将像这样表示： [null，3，2，0，1，null] [null，[3，3]，[2，2]，[0，null]，[1，1]，null] 我们的目标是将该表示形式转换为以下和弦图：让我们开始吧！我们将从创建一个新的React组件开始，以渲染通过给定chord道具传递的chord ，并渲染一个样式化的pre元素，以保存我们即将成为的和弦图表：…

使用Connect端点在Spotify上进行协作侦听

这是一篇有关我最近正在从事的黑客项目的文章，我想分享一些有关为什么以及如何构建它的信息。 tl; dr这是GitHub上的演示和项目。协同聆听这个想法是基本的。您会转到一个页面，在其中可以提议要听的歌曲，其他人也可以做同样的事情。回放将为该时刻连接的所有用户同步。这些页面称为“房间”，通常基于某些类型，以指导用户提出歌曲。您不希望在“ 80年代经典精选”房间中的最新摇滚专辑中听到“ Despacito”的声音。队列中接下来要播放的歌曲也可以被选中（有时也可以被选中）。如果您不想提议新歌，但是在提议的歌曲中看到自己喜欢的歌，那就太好了。就像我说的那样，这根本不是什么新鲜事，实际上，自2011年底以来，它作为Spotify应用程序已成为Spotify桌面应用程序的一部分： Apps API是我在2012年加入Spotify时从事的第一个项目。我将审查提交的内容，支持对如何使用它有疑问的开发人员，并创建示例应用程序。…

Phonograph.js：可容忍的移动网络音频

同步音量变化非常容易，因为Web音频API允许我们将诸如音量变化之类的时间安排到1千万分之一秒。（真的！这是十亿分之一的百万分之一。当然，您的硬件可能无法达到这种精度，但这意味着在同一时间安排的两个事件肯定会同时发生。）但是我们的问题才刚刚开始。一段音频多长时间？当您使用context.decodeAudioData（…）解码音频块时，所得的AudioBuffer具有duration属性，该属性表示剪辑的长度（以秒为单位）。我们需要知道，以便安排后续块的回放。问题是，持续时间很可能是一部完整的小说。 Safari会根据mp3文件声称的持续时间（而不是实际解码的时间），根据duration属性读取第一个块的文件标题，而不是帧标题。在那之后，它做得更好，但是如果第二个块开始播放几分钟又太迟了，那对我们没有帮助。同时，Chrome本质上会吐出随机数。对于CBR文件（以恒定比特率（例如128kbps）编码的文件）来说，这很好，但是对于可变比特率（VBR）文件，它可能会被低估。当浏览器API失败时，我们只有一种选择：用JavaScript的硬方法实现逻辑。 mp3文件的剖析为了做到这一点，我们需要了解我们正在处理的数据在1和0级别。有用的是，尽管mp3规范受版权保护（如果您愿意为之付费，则可以获取该文件；我不会），但是善良而聪明的人们对它进行了反向工程，并免费提供了他们的发现。（如果您对此东西感兴趣，让我们来构建比约恩·埃德斯特罗姆（BjörnEdström）的MP3解码器也是必不可少的阅读材料，尽管它与我们使用留声机的工作并不完全相关。）…