Mopidy-Simple-Webclient 0.1.1

简介

Mopidy音乐服务器 是一款出色的软件，提供与 MPD 协议兼容的无头音乐播放器，并能够从 Spotify 流式传输音乐。我在两台 Raspberry Pi 计算机上运行Mopidy，一台在我客厅，一台在我卧室。

我唯一缺少的是一款简单的客户端，具有播放控制、音量控制和播放列表选择功能，可以在我的智能手机、iPad和笔记本电脑上工作。尽管Mopidy文档中引用了大量的 HTTP客户端，并且任何 MPD客户端 应该都能工作，但我没有找到一款在所有提到的设备上都表现良好的客户端 :-(

在浪费了两天寻找简单易用的Mopidy客户端后，我决定承担Mopidy开发者的承诺，即Mopidy易于扩展，并开发自己的网页界面。经过三次迭代，我终于对结果感到满意。

第一迭代：服务器端PHP

第一个概念验证是一个简单的PHP脚本，使用了Mopidy的JSON-RPC API。一旦实现了播放控制，我就觉得编写PHP让我感到不愉快，所以我转向使用Python（以及Flask）。

第二次迭代：服务器端Python

第二个概念验证比第一个前进了很多：我实现了播放控制、音量控制和播放列表选择。在实现这个功能的过程中，我渐渐意识到，使用JavaScript客户端和异步HTTP连接可能会比任何服务器端实现更加响应迅速（而且可能更容易实现）。

第三次迭代：客户端JavaScript

JavaScript并不是我最喜欢的语言，但编写Mopidy网络客户端的经验并不那么糟糕。一旦一切运行起来，我就非常欣赏只需要HTML、CSS和JavaScript就可以构建一个简单但实用的Mopidy客户端！我甚至没有使用Mopidy.js，因为我最初是将基于Mopidy的JSON-RPC API构建的Python代码移植过来。

入门

如上所述，简单的Mopidy网络客户端是一个客户端JavaScript应用程序。尽管如此，客户端作为Python包发布。这个包包含客户端代码以及将客户端暴露为正确Mopidy HTTP扩展所需的最小粘合剂（18行Python代码:-）。这个Python包可在PyPI上找到，这意味着安装客户端非常简单。

$ sudo pip install Mopidy-Simple-Webclient

安装后，您需要重新启动Mopidy守护进程以加载新扩展。我运行Mopidy作为系统守护进程，所以我会使用以下命令

$ sudo service mopidy restart

访问网页界面

安装扩展并重新启动Mopidy守护进程后，Mopidy网络界面应类似于以下

点击“simple-webclient”链接以打开简单的Mopidy网络客户端。

播放列表选择界面

简单的Mopidy网络客户端没有播放列表/曲目列表编辑界面，也不提供浏览您的音乐库的方式。相反，您需要在功能更全面的Mopidy客户端或Spotify中创建一个播放列表，并在简单的Mopidy网络客户端中选择这个播放列表。选择播放列表看起来类似于以下

请注意，我仅使用Mopidy几天（在我撰写这篇文章的时候）所以我还正在了解Mopidy的工作方式，这意味着我只测试了Spotify播放列表的播放列表选择界面（而不是本地播放列表）。

播放控制界面

Mopidy曲目列表（即“当前播放列表”）包含一些曲目后，简单的Mopidy网络客户端将切换到播放控制界面，如下所示

以下是播放控制界面中主要元素的说明

• 顶部是曲目标题，然后是专辑名称和艺术家。

• 在曲目信息下方是播放控制按钮。当没有播放任何内容时，显示上一曲/播放/下一曲按钮。当曲目正在播放时，显示上一曲/暂停/停止/下一曲按钮。

• 蓝色/灰色点的线条是音量控制。HTML5有更复杂的滑块控件，但我的智能手机上的网络浏览器不够高级，无法支持这些控件，所以我创建了一个简单的触摸友好控件。

• “选择播放列表”按钮会将您带回到播放列表选择界面，其他两个按钮的功能如您所期望的那样。

未来改进

如果我有时间继续对这个客户端进行工作的想法

实时状态更改

希望能够启用即时服务器到客户端的通知，而不是10秒的轮询间隔。这看起来需要使用WebSocket。不确定这些是否能在我的智能手机上工作。即使不行，也许我可以添加可选的支持（优雅降级）？

启用封面艺术

我还不太清楚Mopidy中的封面艺术是如何工作的，但其他客户端可以做到，所以我应该也能做到 :-)

启用服务器端配置

Mopidy的扩展机制已经迫使我使用配置文件，为什么不添加一些有用的选项，比如更改页面标题的能力呢？这并非易事，因为它将涉及本项目中的第一个“服务器端”逻辑（另一方面，这也为纯JavaScript客户端不可用的功能打开了大门）。

升级jQuery/Bootstrap，打包文件

目前 jQuery 和 Bootstrap 是从Google和Bootstrap CDNs加载的，但迟早这些引用的版本将从网络上消失。为什么不升级到最新版本，并将文件打包在git仓库和Python源分布中呢？

联系

最新的简单Mopidy网页客户端可在 PyPI 和 GitHub 上获得。如有错误报告，请在 GitHub 上创建问题。如果您有任何问题、建议等，请随时通过peter@peterodding.com发送电子邮件。

许可证

本软件遵循 MIT许可协议。

© 2014 Peter Odding。

简单的Mopidy网页客户端使用了以下项目

Mopidy音乐服务器

遵循Apache许可证，请参阅Mopidy许可证文件。

jQuery

遵循MIT许可证，请参阅jQuery许可证文件。

Bootstrap

使用的版本遵循Apache许可证，请参阅Bootstrap许可证文件（较新版本遵循MIT许可证）。

sprintf.js

遵循BSD许可证，请参阅sprintf.js许可证文件（提示：我使用了what-license.com来识别许可证 :-）。

Humanity图标主题

遵循Creative Commons Attribution-ShareAlike 3.0许可证，请参阅Humanity许可证文件。我不太清楚使用这些图标并附上署名且不进行修改是否需要我的作品也遵循相同的许可证（我希望不是，我担心它是）。如果证明这是真的，我宁愿找到一个不同的图标集，因为为软件使用CC BY-SA许可证没有意义。