2013-01-07 24 views
-2

我有這樣大的代碼:的YouTube API播放列表生成(僅標題)

function _buildPlaylist() { 
     //console.log('_buildPlaylist'); 

     _lastThumbOrientation=null;//important, make thumb holder every time on new playlist 
     _playlistOpened=false;//reset for bottom this._autoOpenPlaylist selection 

     var len = _videoProcessData.length, i = 0, thumb, div, _item, active_icon; 
     //console.log('len = ', len); 

     if(getDeeplinkData){ 
      dlink = baseURL + strict + firstLevel + '/'; 
      var str_to_filter, tempArr = categoryArr[activeCategory].mediaName; 
     } 

     for (i; i < len; i++) { 
      //console.log(_item.description); 

      _item = _videoProcessData[i]; 

      //deeplinks 
      if(useDeeplink && getDeeplinkData){ 
       str_to_filter = filterAllowedChars(_item.deeplink); 
       //console.log(str_to_filter); 
       tempArr.push(str_to_filter); 
      } 

      playlistLength+=1; 

      if(outputDeeplinkData){ 
       if(_item.type == 'local'){//aspect ratio always present 
        if(mp4Support){ 
         loc_path = _item.mp4Path; 
        }else if(vorbisSupport){ 
         loc_path = _item.ogvPath; 
        }else if(webmSupport){ 
         if(_item.webmPath)loc_path = _item.webmPath; 
        } 
        if(loc_path.lastIndexOf('/')){ 
         loc_name = loc_path.substr(loc_path.lastIndexOf('/')+1); 
        }else{ 
         loc_name = loc_path; 
        } 
        deeplinkData.push({'id': playlistLength, 'name': loc_name, 'type':_item.type ,'video-id': loc_path, 'deeplink': dlink+_item.deeplink}); 
       }else{ 
        deeplinkData.push({'id': playlistLength, 'name': _item.title?_item.title:'', 'type':_item.type ,'video-id': _item.id, 'deeplink': dlink+_item.deeplink}); 
       } 
      } 

      div = $('<div/>').addClass('thumbs').attr({'data-id': playlistLength-1, 'data-type': _item.type}); 
      if(thumbHolder)div.appendTo(thumbInnerContainer).bind('click', clickPlaylistItem); 

      if(_item.type == 'local'){//aspect ratio always present 
       div.attr({'mp4Path': _item.mp4Path, 'ogvPath': _item.ogvPath, 'webmPath': _item.webmPath?_item.webmPath:'', 'imagePath': _item.imagePath, 'data-aspectRatio': _item.aspectRatio}); 
      }else{ 
       div.attr('path', _item.id); 
       if(currentObj.ytSizeSet){//if we have width and height, aspect ratio always present 
        div.attr({'data-width': currentObj.mediaWidth, 'data-height': currentObj.mediaHeight, 'data-aspectRatio': currentObj.aspectRatio}); 
       } 
      } 

      if(thumbHolder){ 
       //create thumb 
       if(_item.thumbnail){ 
        thumb=$(new Image()).addClass('thumb_img').appendTo(div).attr('alt', _item.title?_item.title:'').css({ 
         cursor:'pointer', 
         opacity:0 
        }).load(function() { 
         //console.log($(this)) 
         $(this).stop().animate({ 'opacity':1}, {duration: 500, easing: 'easeOutSine'});//fade in thumb 
        }).error(function(e) { 
         //console.log("thumb error " + e); 
        }).attr('src', _item.thumbnail); 
       } 

       //active icon 
       active_icon = $(new Image()).appendTo(div).css({ 
        position: 'absolute', 
        display: 'none' 
       }).load(function() { 
        //console.log(width,height); 
        $(this).css({ 
         width: this.width, 
         height: this.height, 
         left: 50+'%', 
         top: 50+'%', 
         marginLeft: -this.width/2+'px', 
         marginTop: -this.height/2+'px' 
        }) 
       }).error(function(e) { 
        //console.log("error " + e); 
       }).attr('src', ic_active_thumb); 

       div.data('active_icon',active_icon); 
      } 

      _thumbHolderArr.push(div);//we need to have data to manipulate 
     } 

     checkPlaylistProcess(); 
    } 

(這是一個YouTube的API,JavaScript代碼 它的作用是產生與ALT縮略圖屬性的視頻標題

我想是要生成的視頻的標題。沒有縮略圖。

的代碼產生下面的HTML(帶縮覽圖)

<div class="thumbInnerContainer" style="top: 0px; left: 0px; width: 3500px;"> 

<div class="thumbs playlistSelected" data-id="0" data-type="youtube" path="tRe8JfAQmpI" data-width="640" data-height="360" data-aspectratio="2"><img class="thumb_img" alt="Accelerator after effects project file" style="cursor: pointer; opacity: 1;" src="http://i.ytimg.com/vi/tRe8JfAQmpI/hqdefault.jpg"><img style="position: absolute; display: block; width: 37px; height: 37px; left: 50%; top: 50%; margin-left: -18.5px; margin-top: -18.5px;" src="data/icons/active_item.png"> 
</div> 
<div class="thumbs" data-id="1" data-type="youtube" path="QeusWQ4LFmY" data-width="640" data-height="360" data-aspectratio="2"><img class="thumb_img" alt="After Effects Template Platform" style="cursor: pointer; opacity: 1;" src="http://i.ytimg.com/vi/QeusWQ4LFmY/hqdefault.jpg"><img style="position: absolute; display: none; width: 37px; height: 37px; left: 50%; top: 50%; margin-left: -18.5px; margin-top: -18.5px;" src="data/icons/active_item.png"> 
</div> 
<div class="thumbs" data-id="2" data-type="youtube" path="srGUFQwONXc" data-width="640" data-height="360" data-aspectratio="2"><img class="thumb_img" alt="Photo Album - After Effects Template" style="cursor: pointer; opacity: 1;" src="http://i.ytimg.com/vi/srGUFQwONXc/hqdefault.jpg"><img style="position: absolute; display: none; width: 37px; height: 37px; left: 50%; top: 50%; margin-left: -18.5px; margin-top: -18.5px;" src="data/icons/active_item.png"> 
</div> 
</div> 

現在,這是我想要生成的。(圖片的alt標題ATTR,而無需使用縮略圖。)

<div class="thumbInnerContainer" style="top: 0px; left: 0px; width: 3500px;"> 

<div class="thumbs playlistSelected" data-id="0" data-type="youtube" path="tRe8JfAQmpI" data-width="640" data-height="360" data-aspectratio="2"> 
    Accelerator after effects project file 
</div> 
<div class="thumbs" data-id="1" data-type="youtube" path="QeusWQ4LFmY" data-width="640" data-height="360" data-aspectratio="2"> 
    After Effects Template Platform 
</div> 
<div class="thumbs" data-id="2" data-type="youtube" path="srGUFQwONXc" data-width="640" data-height="360" data-aspectratio="2"> 
    Photo Album - After Effects Template 
</div> 
</div> 

注意:查找這些行,看看它是如何生成的HTML

//create thumb 
       if(_item.thumbnail){ 
        thumb=$(new Image()).addClass('thumb_img').appendTo(div).attr('alt', _item.title?_item.title:'').css({ 
         cursor:'pointer', 
         opacity:0 
        }).load(function() { 
         //console.log($(this)) 
         $(this).stop().animate({ 'opacity':1}, {duration: 500, easing: 'easeOutSine'});//fade in thumb 
        }).error(function(e) { 
         //console.log("thumb error " + e); 
        }).attr('src', _item.thumbnail); 
       } 

我怎樣才能改變只生成標題,沒有縮略圖。?

+0

什麼問題? (注意這是一個修辭問題) – Alexander

+0

會發生什麼是生成縮略圖,我想要做的只是生成標題。我怎麼能做到這一點? OMG! – Genial

回答

0

您需要修改此行。

div = $('<div/>').text(_item.title ? _item.title : '').... 

和DROP所有if子句低於其產生兩個<img/>的元件,並且它們div附加到新創建的<div/>元件。既然你不想要它,那麼你可以放下它所有的東西。

if (thumbHolder) { 
    ... 
} 
+0

這是解決方案!!!迅速和驚人的。真棒> D謝謝亞歷山大,'很棒。 – Genial