Plato on Github
Report Home
space/music/_music_list.js
Maintainability
60.64
Lines of code
1567
Difficulty
61.94
Estimated Errors
15.34
Function weight
By Complexity
By SLOC
/*global Y, window, YUI, SM2_DEFER */ /** * <p>JavaScript for #music-list Module</p> * ~/miiicasa/static/space/music/_music_list.js * * Spec: http://produce.corp.miiicasa.com/spec/music/20120627/ * Mockup: http://produce.corp.miiicasa.com/ued/charming/music_sub_g.png * * @author Mei Lin * @author Vivian Huang * @module space * @submodule #music-list * @modified 2012/05/03 */ YUI.add("space/music/_music_list", function (Y) { var _api, _node, _sideNode, // side node (cover, setting link, etc...) _processNode, // process node (uploading cover) _activeSong = null, // holding the song which is being playing _cantPlayList = [], // cannot play songs lists _deviceInfo, // holding deviceInfo _deviceConnector, _dialogAttrList = [], _featureSupport, // holding flags those feature support or not, true is for support _fetchId3Index = -1, _fileList, // files in current folder _hasCover, _hasId3 = false, // indicates if there's any ID3 data found _isUploading = false, // True if new cover file is uploading. _lang = {}, // L10N language strings _musicList = [], // holding music list _musicIndex = -1, _player, // holding the music player instance _playingSong = -1, // holding the song id which is playing _soundManagerState = 0, // 0: waiting, 1: loaded, -1: failed _uploader, _uploaderReadyCallback, // holding callback when uploader ready _folderDescEditable, // Y.Editable //=========================== // Shortcut //=========================== MIIICASA = window.MIIICASA || {}, PAGE, currentPath, isLan, isWanShare, soundManager = window.soundManager, util, Lang, UPLOAD_URL, UA, _viewer, //=========================== // Constants //=========================== MODULE_ID = "#music-list", CONST, VISIBLE_CLASS = "status-visible", //=========================== // Private Events //=========================== _checkAllHandler, _deleteButtonHandler, _downloadButtonHandler, _itemPlayHandler, _itemSelectHandler, _moveUploaderHandler, _mouseEnterListHandler, _mouseLeaveListHandler, _playAlbumHandler, _playButtonHandler, _playErrorHandler, _playFinishHandler, _pickerButtonHandler, _uploadCover, _uploaderRollOver, _uploaderRollOut, _uploaderContentReadyHandler, _uploaderFileSelectHandler, _uploaderGenId3CompleteHandler, _uploaderGenId3ErrorHandler, _uploaderThumbnailUploadError, _uploaderUploadCoverCompleteHandler, //=========================== // Private Methods //=========================== _blockUploadButtons, _canPlayUrl, _doDeleteFiles, _expandViewer, _fetchDesc, _fetchId3, _formatPlaytime, _genId3FromOrigin, _getDescFilename, _getFileList, _initEmptyUI, _initSoundManager, _initUI, _play, _searchYoutubeByFoldername, _searchYoutubeById3, _setCoverURL, _stickTaskRow, _stopMusicPlayer, _syncSelectedItem, _syncCheckAllBox, _updateId3Info, _uploadDesc, //=========================== // Public Methods //=========================== init, onviewload, onmessage; //=========================== // Private Events //=========================== /** * When user click checkall box * @event _checkAllHandler * @private */ _checkAllHandler = function (e) { var isChecked = e.currentTarget.get("checked"); if (isChecked) { _node.all("span.miii-checkbox a").addClass("miii-checkbox-checked"); _node.all("tbody input, #selectall").set("checked", "checked"); _node.all("tbody tr").addClass("selected"); } else { _node.all("span.miii-checkbox a").removeClass("miii-checkbox-checked"); _node.all("tbody input, #selectall").set("checked", ""); _node.all("tbody tr").removeClass("selected"); } }; /** * When user click delete button. * * @event _deleteButtonHandler * @private * @param e {Y.Event} The event instance * @return void */ _deleteButtonHandler = function (e) { var filesArray = [], okHandler, selectedNodes = _node.all("input[name=list-item]:checked"); if (selectedNodes._nodes.length === 0) { _api.alert({ title : _lang.oops, content : _lang.noFileSelected }); return; } okHandler = function (result) { if (result) { Y.each(selectedNodes, function (node) { var fileInfo = node.get("id").split("-"); filesArray.push('"' + currentPath + "/" + _musicList[fileInfo[3]].name + '"'); }); _api.broadcast("show-main-loading"); _doDeleteFiles(filesArray); } }; _api.confirm({ title : _lang.deleteTitle, content : _lang.deleteDesc }, okHandler); e.preventDefault(); }; /** * When user click download button. * * @event _downloadButtonHandler * @private * @param e {Y.Event} The event instance * @return void */ _downloadButtonHandler = function (e) { _api.log("_downloadButtonHandler() is executed.", "info", MODULE_ID); var fileCnt = 0, filesArray = [], folderCnt = 0, selectedNodes = _node.all("input[name=list-item]:checked"), targetname = ""; if (!_featureSupport.download) { _api.alert({ title : _lang.oops, content : _lang.featureNotSupported }); return; } if (selectedNodes._nodes.length === 0) { _api.alert({ title : _lang.oops, content : _lang.noFileSelected }); return; } // downloadFiles Y.each(selectedNodes, function (node) { var fileInfo = node.get("id").split("-"), theFile = _musicList[fileInfo[3]]; filesArray.push('"' + theFile.name + '"'); if (theFile.type === CONST.FILE_TYPE_FILE) { fileCnt += 1; } else { folderCnt += 1; } targetname = theFile.name; }); // target filename if (fileCnt === 0 && folderCnt === 1) { targetname += ".zip"; } else if (fileCnt + folderCnt > 1) { targetname = 'miiiCasa_' + Y.DataType.Date.format(new Date(), {format: "%Y-%m-%d"}) + '.zip'; } _deviceConnector.downloadFilesByPost({ base_path : currentPath, targetname : targetname, filenames : "[" + filesArray.join(",") + "]" }); e.preventDefault(); }; /** * When user click on single song. * * @event _itemPlayHandler * @private * @param e {Y.Event} The event instance * @return void */ _itemPlayHandler = function (e) { if (_soundManagerState < 1) { return; } var attr = {}, url = "", dialogAttr = { // The dialog attribute object. title : _lang.oops, content : _lang.cannotPlay + " " + _lang.getHelp }, currentTarget = e.currentTarget, checkboxNode = currentTarget.previous().one("input"), canPause = currentTarget.hasClass("pause-button"), musicInfo = checkboxNode.get("id").split("-"), musicId = musicInfo[3], durationTest = function (self, musicId) { if (_playingSong === -1) { _api.log("Skip music: " + musicId + ", since the previous song has been stopped", "warn"); return; } if (musicId !== _playingSong) { _api.log("Skip music: " + musicId + ", since this song is not the current one", "warn"); return; } if (!_canPlayUrl(url) || (self.duration === 0 && Y.Array.indexOf(_cantPlayList, musicId) === -1)) { _cantPlayList.push(musicId); _api.alert(dialogAttr); _playFinishHandler(); } }; if (Y.Array.indexOf(_cantPlayList, musicId) !== -1) { _api.alert(dialogAttr); return; } url = util.encodeURIForDa(_musicList[musicId].uri, false); if (Lang.isUndefined(_musicList[musicId].obj)) { attr = { id : musicInfo[3], url : url, onfinish : _playFinishHandler, ondataerror : _playErrorHandler, onload : function (isSuccess) { if (!isSuccess) { _api.alert( _lang.cannotPlay, function () { window.location.reload(); }); } durationTest(this, musicId); }, onplay : function () { durationTest(this, musicId); } }; if (attr.url.indexOf(".m4a") !== -1) { if (Y.UA.ie && Y.UA.ie >= 9) { attr.type = "audio/mp4a-latm"; } else { attr.type = "audio/m4a"; } } _musicList[musicId].obj = soundManager.createSound(attr); } if (_playingSong !== -1) { if (_playingSong === musicId) { if (canPause) { _musicList[musicId].obj.pause(); currentTarget.removeClass("pause-button"); } else { currentTarget.addClass("pause-button"); _musicList[musicId].obj.resume(); _stopMusicPlayer(); } } else { _musicList[_playingSong].obj.stop(); _node.one("#list-item-0-" + _playingSong).ancestor("td").next().removeClass("pause-button"); _playingSong = musicId; currentTarget.addClass("pause-button"); _musicList[musicId].obj.play(); _stopMusicPlayer(); } } else { // re-organize actions: _playingSong = musicId; // 1. set current playing song currentTarget.addClass("pause-button"); // 2. change style before play _musicList[musicId].obj.play(); // 3. play the song at last _stopMusicPlayer(); // 4. stop music player if required } _api.log("Now playing: " + _playingSong); }; /** * When user select an item by checkbox * @event _itemSelectHandler * @private */ _itemSelectHandler = function (e) { _syncSelectedItem(e.currentTarget); _syncCheckAllBox(e.currentTarget); }; /** * When user mouse over thumb and change cover link, move and resize the * uploader to the proper position * * @event _saveHandler * @private * @param e {Y.Event} The event instance * @return void */ _moveUploaderHandler = function (e) { // Prevent user to select file when uploading is processing. if (!_isUploading) { util.moveAndResizeTo(_uploader.get("container"), e.currentTarget); } }; /** * Handles when the user mouseenters any music file. * * @method _mouseEnterListHandler * @private * @param e {Y.Event} The event instance * @return void */ _mouseEnterListHandler = function (e) { var trNode = e.currentTarget, checkboxNode = trNode.one("input"); if (!checkboxNode.get("checked")) { trNode.addClass("hover"); } }; /** * Handles when the user mouseleaves any music file. * * @method _mouseLeaveListHandler * @private * @param e {Y.Event} The event instance * @return void */ _mouseLeaveListHandler = function (e) { var trNode = e.currentTarget, checkboxNode = trNode.one("input"); if (!checkboxNode.get("checked")) { trNode.removeClass("hover"); } }; /** * When user click Play this album. * * @event _playAlbumHandler * @private * @param e {Y.Event} The event instance * @return void */ _playAlbumHandler = function (e) { var songs = []; e.preventDefault(); if (_musicIndex === -1) { _api.alert({ title : _lang.oops, content : _lang.emptyAlbumDesc1 + "<br><br>" + _lang.emptyAlbumDesc2 }); return; } Y.each(_musicList, function (music) { var id3 = music.id3 || {}, url = music.uri; url = util.encodeURIForDa(url, false); songs.push({ album : id3.album, artist : id3.artist, length : id3.playtime > 0 ? id3.playtime : null, title : id3.title || music.name, url : url }); }); _play(songs); }; /** * When user click Play button, play selected songs. * * @event _playButtonHandler * @private * @param e {Y.Event} The event instance * @return void */ _playButtonHandler = function (e) { var songs = [], selectedNodes = _node.all("input[name=list-item]:checked"); if (selectedNodes._nodes.length === 0) { _api.alert({ title : _lang.oops, content : _lang.noFileSelected }); return; } Y.each(selectedNodes, function (node) { var fileInfo = node.get("id").split("-"), music = _musicList[fileInfo[3]], id3 = music.id3 || {}, url = util.encodeURIForDa(music.uri, false); songs.push({ album : id3.album, artist : id3.artist, length : id3.playtime > 0 ? id3.playtime : null, title : id3.title || music.name, url : url }); }); _play(songs); }; /** * When Flash encounters a security error when trying to call computeSpectrum() internally. * @event _playErrorHandler * @private */ _playErrorHandler = function () { _api.log("_onPlayErrorHandler"); _node.one("#list-item-0-" + _playingSong).ancestor("td").next().removeClass("pause-button"); _playingSong = -1; }; /** * When a song finish * @event _playFinishHandler * @private */ _playFinishHandler = function () { _api.log("_onPlayFinishHandler: " + _playingSong); _node.one("#list-item-0-" + _playingSong).ancestor("td").next().removeClass("pause-button"); _playingSong = -1; }; _pickerButtonHandler = function (e) { _api.log("_pickerButtonHandler() is executed."); var type = e.target.getAttribute("name").split("-")[0]; Y.FilePicker.show(type, { nodes : _node.all("input[name=list-item]:checked"), files : [_musicList], path : currentPath, mediaType : CONST.SPACE_MEDIA_TYPE_FOLDERS.music, type : type }, _api); }; /** * Upload album cover to storage. * It prepares necessary parameters and call Uploader component. * Also updates UI so that user understands it's uploading. * * @method _uploadCover * @private * @return void */ _uploadCover = function () { _api.log("_uploadCover() is executed.", "info", MODULE_ID); var data, options; // Prepare required information and upload. data = { "tok" : _deviceInfo.token, "path" : currentPath + "/.miiithumbs" }; if (!isLan) { data.cp = Y.Cookie.get("p"); data.cs = Y.Cookie.get("s"); data.did = _deviceInfo.did; } options = { "fileVar" : "uploadedfile", "uploadTo" : UPLOAD_URL, "coverSize" : { "cover.jpg": { "w": CONST.COVER_SIZE_240, "h": CONST.COVER_SIZE_240 }, "cover_100.jpg": { "w": CONST.COVER_SIZE_240, "h": CONST.COVER_SIZE_240 } } }; _uploader.uploadCover(data, options); // Update UI so that user knows it's uploading. _processNode.addClass(VISIBLE_CLASS); // Set uploading flag. _isUploading = true; _uploader.get("container").setStyles({ "top" : "10px", "left" : "20px" }); }; /** * Handles when the user mouseenters the cover. * * @method _uploaderRollOver * @private * @return void */ _uploaderRollOver = function () { _api.log("_uploaderRollOver is executed.", "info", MODULE_ID); _sideNode.one(".cover").addClass("cover-hover"); }; /** * Handles when the user mouseleaves the cover. * * @method _uploadRollOut * @private * @return void */ _uploaderRollOut = function () { _api.log("_uploaderRollOut is executed.", "info", MODULE_ID); _sideNode.one(".cover").removeClass("cover-hover"); }; /** * Uploader is contentReady. * * @method _uploaderContentReadyHandler * @private * @return void */ _uploaderContentReadyHandler = function () { _api.log("_uploaderContentReadyHandler() is executed.", "info", MODULE_ID); if (Lang.isFunction(_uploaderReadyCallback)) { _uploaderReadyCallback(); _uploaderReadyCallback = null; } // for upload cover Y.later(1, this, function () { _uploader.setFileFilters([{description : "Images", extensions : "*.jpg;*.png;*.gif;*.jpeg"}]); }); }; /** * Handles when user select any file to upload. * * @method _uploaderFileSelectHandler * @private * @param event {Y.Event} The event instance * @return void */ _uploaderFileSelectHandler = function (event) { _api.log("_uploaderFileSelectHandler() is executed.", "info", MODULE_ID); if (!event.hasOwnProperty("fileList") || event.fileList === null) { return; } _uploadCover(); }; /** * @method _uploaderGenId3CompleteHandler * @private * @param e {Y.Event} The event instance * @return void */ _uploaderGenId3CompleteHandler = function (e) { _api.log("_uploaderGenId3CompleteHandler() is executed.", "info", MODULE_ID); var id3 = e.id3; if (id3) { _musicList[_fetchId3Index].id3 = id3; _updateId3Info(id3, _fetchId3Index); if (!_hasId3 && (id3.album || id3.artist)) { _hasId3 = true; // perform async youtube search Y.later(0, this, function () { _searchYoutubeById3(id3); }); } } if (!_hasCover && e.cover) { _hasCover = true; } _fetchId3(); }; /** * @method _uploaderGenId3ErrorHandler * @private * @param e {Y.Event} The event instance * @return void */ _uploaderGenId3ErrorHandler = function (e) { _api.log("_uploaderGenId3ErrorHandler() is executed.", "error", MODULE_ID); _fetchId3(); }; /** * @method _uploaderThumbnailUploadError * @private * @param e {Y.Event} The event instance * @return void */ _uploaderThumbnailUploadError = function (e) { _api.log("_uploaderThumbnailUploadError() is executed.", "error", MODULE_ID); _uploader.clearFileList(); // Hide processing overlay and indicator. _processNode.removeClass(VISIBLE_CLASS); // Unset uploading flag. _isUploading = false; }; /** * @method _uploaderUploadCoverCompleteHandler * @private * @param e {Y.Event} The event instance * @return void */ _uploaderUploadCoverCompleteHandler = function (e) { _api.log("_uploaderUploadCoverCompleteHandler() is executed.", "info", MODULE_ID); // Update cover. _setCoverURL(); // Hide processing overlay and indicator. _processNode.removeClass(VISIBLE_CLASS); // Unset uploading flag. _isUploading = false; }; //=========================== // Private Methods //=========================== /** * Block upload buttons if user's device not support upload */ _blockUploadButtons = function () { var uploadLink = _node.one("span.upload-link"), dialogAttr = { //object about dialog attribute title : _lang.oops, conyent : _lang.featureNotSupported }; if (uploadLink) { uploadLink.on("click", function (e) { _api.alert(dialogAttr); e.halt(); }); } // NOTE: since listStorages using async render, so use delegate event attach here Y.delegate("click", function (e) { _api.alert(dialogAttr); e.halt(); }, _node, "span.allnew-upload-link"); }; /** * Enhance SoundManager2's .canPlayURL() method. * In real world, both *.ogg and *.wav can't play in latest Firefox and Opera. * * @method _canPlayUrl * @param url {String} The URL * @return {Boolean} false if this URL is not playable. */ _canPlayUrl = function (url) { if (!soundManager.canPlayURL(url)) { return false; } if ( (Y.UA.opera || Y.UA.gecko) && (url.indexOf("ogg") !== -1 || url.indexOf("wav") !== -1) ) { return false; } return true; }; /** * Call device api to delete files * @method _doDeleteFiles * @private */ _doDeleteFiles = function (filesArray) { var afterDeleteFiles, failureHandler, timeoutHandler; afterDeleteFiles = function (o) { _api.log("afterDeleteFiles()"); util.pageReload(); }; failureHandler = function () { _api.log("failureHandler()", "error"); }; timeoutHandler = function () { _api.log("timeoutHandler()", "error"); }; _deviceConnector.deleteFiles({ fullfilenames : "[" + filesArray.join(",") + "]" }, { on: { success: afterDeleteFiles, failure: failureHandler, timeout: timeoutHandler }, timeout: CONST.CLIENT_TIMEOUT }); }; /** * Expand the viewer. * * @method _expandViewer * @param queryString {String} The space query string. */ _expandViewer = function (queryString) { _api.log("_expandViewer(e) is executed."); var href, segments, media; if (!queryString) { href = window.location.href; if (href.indexOf("#") !== -1) { href = href.slice(0, href.indexOf("#")); } queryString = href.split("?")[1]; segments = href.split("?")[0].split("/"); media = segments[segments.length - 2]; queryString += "&type=" + media; if (queryString.indexOf("&viewer") === -1) { queryString += "&viewer"; } } if (!_viewer) { _viewer = new Y.Viewer(); _viewer.render(); } _viewer.expand(queryString); }; /** * Upload folder description. * * @method _uploadDesc * @param desc {String} Folder Description * @private * @return void */ _uploadDesc = function (desc) { var data, opt; data = { tok : _deviceInfo.token, path : currentPath + "/.miiithumbs" }; if (!isLan) { data.cp = Y.Cookie.get("p"); data.cs = Y.Cookie.get("s"); data.did = PAGE.did; } opt = { fileVar : "uploadedfile", uploadTo : UPLOAD_URL, desc : desc, filename : "desc.txt" }; _uploader.uploadDesc(data, opt); }; /** * Performing download text file for folder desc. * * @method _fetchDesc * @private * @return void */ _fetchDesc = function () { _api.log("_fetchDesc() is executed.", "info", MODULE_ID); var afterDownloadDesc, failureHandler, timeoutHandler, tooltip; afterDownloadDesc = function (o) { var txt = "", tooltip = ""; if (!Lang.isUndefined(o.data)) { txt = util.nl2br(util.htmlspecialchars(o.data)); txt = UA.gecko ? util.wbr(txt) : txt; if (PAGE.permission >= CONST.PERMISSION_MANAGE) { tooltip = o.data ? _lang.edit_desc_tooltip : ""; } } _sideNode.one(".desc").set("innerHTML", txt); _sideNode.one(".desc").set("title", tooltip); if (PAGE.permission >= CONST.PERMISSION_MANAGE) { _folderDescEditable = new Y.Editable({ "inputType" : "textarea", "selector" : ".desc", "node" : _sideNode, "emptyDefault" : _lang.edit_desc_tooltip, "tooltip" : tooltip, "validateRule" : "max_length[300]", "sync" : true }); _folderDescEditable.on("submit", function (e) { txt = e.details[0].value; _uploadDesc(txt); tooltip = txt ? _lang.edit_desc_tooltip : ""; _folderDescEditable.set("tooltip", tooltip); }); } _fetchId3(); }; failureHandler = function () { _api.log("failureHandler() is executed.", "error", MODULE_ID); _fetchId3(); }; timeoutHandler = function () { _api.log("timeoutHandler() is executed.", "error", MODULE_ID); _fetchId3(); }; _deviceConnector.downloadTextFile({ fullfilename : (isWanShare ? "" : currentPath) + "/.miiithumbs/desc.txt" }, { on: { success: afterDownloadDesc, failure: failureHandler, timeout: timeoutHandler }, timeout: CONST.CLIENT_TIMEOUT }); }; /** * Performing download Id3 text file of each song. * * @method _fetchId3 * @private * @return void */ _fetchId3 = function () { _fetchId3Index += 1; _api.log("_fetchId3: " + _fetchId3Index, "info", MODULE_ID); var afterDownloadDesc, descFilename, failureHandler, song, timeoutHandler; if ((_fetchId3Index + 1) > _musicList.length) { _api.log("_fetchId3() done!"); if (!_hasId3 && _musicIndex > -1) { _searchYoutubeByFoldername(util.basename(currentPath)); } return; } song = _musicList[_fetchId3Index]; descFilename = _getDescFilename(song); if (Lang.isUndefined(song.desc) || song.desc === 0) { if (song.ext.toLowerCase() === "mp3") { _genId3FromOrigin(); } else { // make empty object _musicList[_fetchId3Index].id3 = { album : "", artist : null, playtime : 0, title : null, track_number : "" }; _fetchId3(); } return; } afterDownloadDesc = function (o) { var desc = Y.Lang.trim(o.data), id3 = null; if (!Lang.isUndefined(desc) && desc.substr(0, 1) === "{" && desc.substr(desc.length - 1, 1) === "}") { try { id3 = Y.JSON.parse(desc); _musicList[_fetchId3Index].id3 = id3; if (!_hasId3 && (id3.album || id3.artist)) { _hasId3 = true; // perform async youtube search Y.later(0, this, function () { _searchYoutubeById3(id3); }); } } catch (e) { _api.log("json parse error:" + desc, "error", MODULE_ID); } _updateId3Info(id3, _fetchId3Index); } _fetchId3(); }; failureHandler = function () { _api.log("failureHandler() is executed.", "error", MODULE_ID); _fetchId3(); }; timeoutHandler = function () { _api.log("timeoutHandler() is executed.", "error", MODULE_ID); _fetchId3(); }; _deviceConnector.downloadTextFile({ fullfilename : (isWanShare ? "" : currentPath) + "/.miiithumbs/" + descFilename }, { on: { success: afterDownloadDesc, failure: failureHandler, timeout: timeoutHandler }, timeout: CONST.CLIENT_TIMEOUT }); }; /** * Performing getFileList to show music of the album. * * @method _getFileList * @private * @return void */ _getFileList = function () { _api.log("_getFileList() is executed.", "info", MODULE_ID); var afterGetFileList, failureHandler, timeoutHandler, getFileListArgvs = {}; afterGetFileList = function (o) { _api.log("afterGetFileList() is executed.", "info", MODULE_ID); var okHandler, html, totalCount, trans = "", template, allFiles = []; if (o.label_name && MIIICASA.env.label !== o.label_name) { util.showLabelName(o.label_name); } _hasCover = (o.cover !== 0); if (Lang.isUndefined(o.status) || o.status !== "ok") { okHandler = function (e) { window.location.href = "/"; }; if (o.errno === 6001) { _api.broadcast("show-access-fail-request", {isShare: Y.MiiiCasa.isShare}); return; } else if (!Lang.isUndefined(_lang.deviceMessage[o.errno])) { _api.alert({ title : _lang.oops, content : _lang.deviceMessage[o.errno] }, okHandler); } else { _api.alert({ title : _lang.oops, content : _lang.deviceMessage["5001"] }, okHandler); } _api.broadcast("hide-main-loading"); return; } if (Lang.isUndefined(o.count) || o.count === 0) { //empty _initEmptyUI(); return; } //has file(s) _fileList = o.files; Y.each(_fileList, function (file, i) { if (!util.isMusic(file)) { return; } _musicList.push(file); _musicIndex += 1; _fileList[i].musicIndex = _musicIndex; //file -> music allFiles.push({ checkboxId : ["list-item", 0, _musicIndex].join("-"), fileName : util.htmlspecialchars(file.name), playtimeId : "playtime-" + _musicIndex }); }); if (_musicIndex === -1) { // no proper music file to show _initEmptyUI(); return; } // It doesn't work in IE8/IE7 //template = Y.one("#list-template").get("text"); template = Y.one("#list-template").get("innerHTML"); html = Y.Handlebars.render(template, {allFiles: allFiles}); _node.one("#storage-box").append(html); // show total songs if (_musicIndex >= 0) { trans = ((_musicIndex + 1) > 1) ? _lang.songTotalPlural : _lang.songTotalSingular; } totalCount = Y.substitute(trans, { song_total : _musicIndex + 1 }); _sideNode.one(".count").set("innerHTML", totalCount); _initUI(); }; failureHandler = function () { _api.log("failureHandler()", "error", MODULE_ID); }; timeoutHandler = function () { _api.log("timeoutHandler()", "error", MODULE_ID); _api.broadcast("show-access-fail-request", {isShare: Y.MiiiCasa.isShare}); }; if (isWanShare) { getFileListArgvs = { subpath : PAGE.subpath, sortby : PAGE.sort }; } else { getFileListArgvs = { path : currentPath, sortby : PAGE.sort }; } _deviceConnector.getFileList(getFileListArgvs, { on: { success: afterGetFileList, failure: failureHandler, timeout: timeoutHandler }, timeout: CONST.CLIENT_TIMEOUT }); }; /** * Transfer seconds to mm:ss * @method _formatPlaytime * @private */ _formatPlaytime = function (playtime) { if (!/^\d+$/.test(playtime)) { return ""; } playtime = parseInt(playtime, 10); var minutes = Math.floor(playtime / 60), seconds = playtime - minutes * 60; if (minutes < 10) { minutes = "0" + minutes; } if (seconds < 10) { seconds = "0" + seconds; } return minutes + ":" + seconds; }; /** * Get desc filename * @method _getDescUrl * @private */ _genId3FromOrigin = function () { if (!_uploader.get("isReady")) { _api.log("Uploader not ready yet", "warn"); _uploaderReadyCallback = _genId3FromOrigin; return; } var data, daUrl, opt, song = _musicList[_fetchId3Index]; data = { tok : _deviceInfo.token, path : currentPath + "/.miiithumbs" }; if (!isLan) { if (isWanShare) { data.fid = PAGE.fid; data.subpath = PAGE.subpath; data.path = "/.miiithumbs"; } else { data.did = _deviceInfo.did; } data.cp = Y.Cookie.get("p"); data.cs = Y.Cookie.get("s"); } daUrl = util.getDaUrl([isWanShare ? PAGE.subpath : currentPath, '/', song.name].join("")); //source file opt = { filename: song.name, fileVar : "uploadedfile", from : daUrl, uploadTo: Y.MiiiCasa.uploadURL, mtime : song.mtime, size : song.size }; if (!isLan && CONST.P2P_UPLOAD) { opt.getUploadUri = CONST.API_URL + "ws/device/getUploadParam?alt=1"; } if (!_hasCover) { opt.coverSize = { "cover.jpg": { "w": CONST.COVER_SIZE_240, "h": CONST.COVER_SIZE_240 }, "cover_100.jpg": { "w": CONST.COVER_SIZE_240, "h": CONST.COVER_SIZE_240 } }; _uploader.setGenCover(true, data, opt); } else { _uploader.setGenCover(false); } _uploader.setParseId3(true); _uploader.genId3FromOriginal(data, opt); _api.log("[_genId3FromOrigin] running..."); }; /** * Get desc filename * @method _getDescUrl * @private */ _getDescFilename = function (file) { return [file.name, ".txt"].join(""); }; /** * Initialize empty UI. * * @method _initEmptyUI * @private * @return void */ _initEmptyUI = function () { _node.one(".sort-row").setStyle("display", "none"); _node.one(".task-row-container").remove(); _node.one(".empty").setStyle("display", "block"); _initUI(); }; /** * Initialize sound manager. * * @method _initSoundManager * @private * @return void */ _initSoundManager = function () { _api.log("_initSoundManager"); if (typeof SM2_DEFER !== 'undefined' && SM2_DEFER) { soundManager = window.soundManager = new window.SoundManager(); } soundManager.url = window.MIIICASA.CONST.STATIC_URL + "lib/soundmanager2/swf/soundmanager2_flash_xdomain/"; soundManager.flashLoadTimeout = 5000; soundManager.flashVersion = 9; soundManager.useFlashBlock = false; soundManager.useHTML5Audio = true; // this cause IE8 to load a wrong url of m4a soundManager.onready(function () { _api.log("_initSoundManager() - SoundManager2 has loaded."); _soundManagerState = 1; }); soundManager.ontimeout(function () { if (_soundManagerState !== 1) { _api.log("_initSoundManager() - SoundManager2 could not start.", "error"); _soundManagerState = -1; } }); if (typeof SM2_DEFER !== 'undefined' && SM2_DEFER) { soundManager.beginDelayedInit(); } }; /** * Initialize main UI / binding events * * @method _initUI * @private * @return void */ _initUI = function () { _api.log("_initUI() is executed.", "info", MODULE_ID); // Bind events for task buttons. Y.one(".play-album-link").on("click", _playAlbumHandler); if (!Lang.isNull(_node.one("table"))) { // Bind events for stick buttons. _node.one("input[name=play-button]").on("click", _playButtonHandler); if (!Lang.isNull(_node.one("input[name=delete-button]"))) { _node.one("input[name=delete-button]").on("click", _deleteButtonHandler); } if (!Lang.isNull(_node.one("input[name=download-button]"))) { _node.one("input[name=download-button]").on("click", _downloadButtonHandler); } // Bind events for music table list. Y.delegate("mouseenter", _mouseEnterListHandler, _node, "tbody tr"); Y.delegate("mouseleave", _mouseLeaveListHandler, _node, "tbody tr"); Y.delegate("click", _itemPlayHandler, _node, "td.play-button"); Y.delegate("click", _itemSelectHandler, _node, "table input[name=list-item]"); _node.all("input[name=copyto-button]").on("click", _pickerButtonHandler); _node.all("input[name=moveto-button]").on("click", _pickerButtonHandler); } if (_hasCover) { _setCoverURL(); } // makes taskrow stick inside viewport Y.later(100, this, _stickTaskRow); // attach event for devices not support upload if (!_featureSupport.canTryUpload) { _blockUploadButtons(); } // fetch desc _fetchDesc(); if (_featureSupport.upload && !Y.MiiiCasa.isShare) { Y.one(".cover img").on("mouseenter", _moveUploaderHandler); } _api.broadcast("hide-main-loading"); }; /** * Call music player to play prepared list * @event _play * @private */ _play = function (songs) { if (!_player) { _player = new Y.MusicPlayer(); } if (_player.get("isOpen")) { _player.update("songs", songs); } else { if (Y.Object.size(_player.get("playlist.songs"))) { _player.update("songs", songs); } else { _player.add("songs", songs); } _player.open(); } }; /** * Search youtube by foldername * @method _searchYoutubeByFoldername * @private * @param foldername {String} folder name */ _searchYoutubeByFoldername = function (foldername) { _api.broadcast("search-youtube-request", { keywords: foldername }); }; /** * Search youtube by id3 * @method _searchYoutubeById3 * @private * @param id3 {Object} id3 attributes */ _searchYoutubeById3 = function (id3) { var queryString = ""; // compose queryString (album + artist) if (id3.album) { queryString = id3.album; } if (id3.artist) { if (queryString !== "") { queryString += " "; } queryString += id3.artist; } _api.broadcast("search-youtube-request", { keywords: [queryString, util.basename(currentPath)] }); }; /** * Set cover url * * @method _setCoverURL * @private * @return void */ _setCoverURL = function () { _api.log("_setCoverURL() is executed.", "info", MODULE_ID); var file, path, src; file = { type : CONST.FILE_TYPE_DIRECTORY, thumb : new Date().getTime(), name : "" }; path = isWanShare ? PAGE.subpath : currentPath; src = util.getThumbURL(file, path, CONST.COVER_SIZE_180, "music"); Y.one(".cover img").set("src", src); }; /** * Makes the taskrow stick inside viewport * @event _stickTaskRow * @private */ _stickTaskRow = function () { var firstTaskRowNode = _node.one("div.task-row-container"); if (firstTaskRowNode) { firstTaskRowNode.plug(Y.Plugin.NodeStickViewport); firstTaskRowNode.stickViewport.setDistance("top", 75); firstTaskRowNode.stickViewport.clone(); } }; /** * Stop music player * @method _stopMusicPlayer * @private */ _stopMusicPlayer = function () { if (_player && _player.get("isOpen")) { _player.pause(); } }; /** * Check/Uncheck "Select All" check box according to other check boxes' * check status. If one of the check boxes is not checked, "Select All" * check box shouldn't be checked then. * @method _syncCheckAllBox * @private * @return void */ _syncCheckAllBox = function (node) { var isChecked = node.get("checked"), checkNodes, i, j; if (isChecked) { checkNodes = _node.all("tbody input"); for (i = 0, j = checkNodes.size(); i < j; i += 1) { if (!checkNodes.item(i).get("checked")) { return; } } _node.all("#selectall").set("checked", "checked"); _node.all("#selectall-miii-checkbox").addClass("miii-checkbox-checked"); } else { _node.all("#selectall").set("checked", ""); _node.all("#selectall-miii-checkbox").removeClass("miii-checkbox-checked"); } }; /** * Sync checkbox status with miii-checkbox * @method _syncSelectedItem * @private */ _syncSelectedItem = function (node) { var isChecked = node.get("checked"), tr = node.get("parentNode").get("parentNode").get("parentNode"); if (isChecked) { tr.addClass("selected"); } else { tr.removeClass("selected"); } }; _updateId3Info = function (id3, idx) { var playtimeTdNode = _node.one("#playtime-" + idx), artistTdNode = playtimeTdNode.next(), albumTdNode = artistTdNode.next(); if (!Lang.isUndefined(id3.playtime) && id3.playtime > 0) { playtimeTdNode.set("innerHTML", _formatPlaytime(id3.playtime)); } if (!Lang.isUndefined(id3.artist) && !Lang.isNull(id3.artist)) { artistTdNode.one("span").set("innerHTML", id3.artist).set("title", id3.artist); } if (!Lang.isUndefined(id3.album) && !Lang.isNull(id3.album)) { albumTdNode.one("span").set("innerHTML", id3.album).set("title", id3.album); } }; //=========================== // Public Methods //=========================== /** * Module initialization. * * @event init * @param api {Y.Sandbox} Module API * @public * @return void */ init = function (sandbox) { _api = sandbox; _api.log("init() is executed."); _lang = { cancel : _api.getTrans("cancel_button", "Cancel"), cannotPlay : _api.getTrans("can_not_play", "The song could not be played."), deleteDesc : _api.getTrans("delete_desc", "Are you sure to delete these selected files?"), deleteTitle : _api.getTrans("delete_title", "Confirm delete?"), discardChanges : _api.getTrans("discard_changes", "Discard all changes you made?"), emptyAlbumDesc1 : _api.getTrans("empty_album_desc1", "There is no music in this album."), emptyAlbumDesc2 : _api.getTrans("empty_album_desc2", "You should add some music to this album first."), featureNotSupported : _api.getTrans("feature_not_supported", "This feature is not supported for your device!"), getHelp : _api.getTrans("get_help", "Get Help"), noFileSelected : _api.getTrans("no_file_selected", "You don't select any files."), ok : _api.getTrans("ok_button", "Ok"), oops : _api.getTrans("oops", "Oops"), songTotalSingular : _api.getTrans("song_total_singular", "{song_total} song"), songTotalPlural : _api.getTrans("song_total_plural", "{song_total} songs"), edit_desc_tooltip : _api.getTrans("edit_desc_tooltip", "Edit Description"), cant_move_files_cross_media : _api.getTrans("cant_move_files_cross_media", "You can't move files cross different media types.") }; _lang.getHelp = "<a href=\"" + window.MIIICASA.CONST.HELP_URL + "question/133\" target=\"_blank\">" + _lang.getHelp + "<a>"; _api.broadcast("get-device-message", { callback : function (msg) { _lang.deviceMessage = msg; _api.lang = _lang; } }); _api.listen("expand-viewer", function () { _expandViewer(); }); _initSoundManager(); }; /** * Module content ready. * * @method onviewload * @public * @return void */ onviewload = function () { if (!_lang.deviceMessage) { Y.later(50, this, onviewload); return; } _api.log("onviewload() is executed."); _api.listen("youtube-mv-displayed"); _node = _api.getViewNode(); _sideNode = Y.one("#sidebar"); _processNode = Y.one("#process"); var MiiiCasa = Y.MiiiCasa, hashes, queryString, href, segments, media, params; _deviceInfo = MiiiCasa.deviceInfo; PAGE = MIIICASA.PAGE.musicList; currentPath = PAGE.currentPath; isLan = MIIICASA.env.isLan; isWanShare = !isLan && Y.MiiiCasa.isShare; util = MiiiCasa.util; CONST = MiiiCasa.CONST; Lang = Y.Lang; UPLOAD_URL = Y.MiiiCasa.uploadURL; UA = Y.UA; // If viewer exists, expand the viewer. queryString = window.location.href.split("?")[1]; if (queryString.indexOf("#") !== -1) { queryString = queryString.substring(0, queryString.indexOf("#")); } queryString += "&type=music"; params = Y.QueryString.parse(queryString); hashes = Y.QueryString.parse(window.location.hash.substr(window.location.hash.indexOf("?") + 1)); if (!Y.Lang.isUndefined(params.viewer)) { _expandViewer(Y.QueryString.stringify(params)); } else if (!Y.Lang.isUndefined(hashes.viewer)) { _expandViewer(Y.QueryString.stringify(hashes)); } // create device connector instance and performs getFileList _deviceConnector = new Y.DeviceConnector({ wsip : isLan ? _deviceInfo.wsip : CONST.API_URL, did : _deviceInfo.did, isLan : isLan, isShare : Y.MiiiCasa.isShare, fid : PAGE.fid, tok : _deviceInfo.token }); _getFileList(); // init uploader (swf) _featureSupport = util.featureDetect(); if (_featureSupport.upload) { _uploader = new Y.Uploader({ containerID : "uploader-container", swfURL : CONST.STATIC_URL + "lib/mui/uploader/assets/uploader.swf?" + CONST.VER_UPLOADER, bindings : { contentReady : _uploaderContentReadyHandler, fileSelect : _uploaderFileSelectHandler, genId3Complete : _uploaderGenId3CompleteHandler, genId3Error : _uploaderGenId3ErrorHandler, thumbnailUploadError : _uploaderThumbnailUploadError, uploadCoverComplete : _uploaderUploadCoverCompleteHandler, rollOver : _uploaderRollOver, rollOut : _uploaderRollOut } }); } // Track page view for open link (non-login). if (!MIIICASA.env.is_login) { _api.trackEvent("music", "View"); } // uncheck "checkall" - for chrome _node.all("#selectall").set("checked", ""); // checkall _node.all("#selectall").on("click", _checkAllHandler); }; _api = new Y.Module({ selector: MODULE_ID, langModule: "space", init: init, on: { viewload: onviewload } }); }, "0.0.1", { "group" : "space", "js" : "space/music/_music_list.js", "css" : "space/music/_music_list.css", "requires": [ "module", "module-intl", "module-analytics", "module-popup", "editable", "datatype-date-format", "cookie", "selector-css3", "event-delegate", "viewer", "json-parse", "space", "node-base", "handlebars", "substitute", "music-player", "node-stickviewport", "querystring-parse", "device-connector", "space/filepicker", "uploader" ] });