@@ -46,7 +46,19 @@
 <script>
 const bands = ['The Plot in You', 'The Devil Wears Prada', 'Pierce the Veil', 'Norma Jean', 'The Bled', 'Say Anything', 'The Midway State', 'We Came as Romans', 'Counterparts', 'Oh, Sleeper', 'A Skylit Drive', 'Anywhere But Here', 'An Old Dog'];
 
+function delPrefix(item){
+  return item.replace(/^(The|A|An)\s{1}/,'');
+}
 
+function displayArray(arr){
+  document.getElementById('bands').innerHTML = '<li>'+arr.join('</li><li>')+'</li>';
+}
+
+bands.sort(function(a,b){
+  return delPrefix(a) > delPrefix(b) ? 1 : -1;
+});
+
+displayArray(bands);
 </script>
 
 </body>
 
@@ -5,6 +5,7 @@
   <title>Videos</title>
 </head>
 <body>
+  <p>total time：<span id="totaltime"></span></p>
   <ul class="videos">
     <li data-time="5:43">
       Video 1
@@ -182,6 +183,26 @@
     </li>
   </ul>
 <script>
+function getTime(){
+  let times = [];
+  let lists = document.getElementsByTagName('li');
+  for(let i=0; i<lists.length; i++){
+    let itemTime = lists[i].dataset['time'].split(':');
+    times.push(parseInt(itemTime[0],10)*60 + parseInt(itemTime[1],10));
+  }
+  return times.reduce(function(a,b){return a+b},0);
+}
+
+function formatTime(seconds){
+  let sec = seconds % 60;
+  let hour = Math.floor(seconds/3600);
+  let min = (seconds - 3600*hour - sec)/60;
+  document.getElementById('totaltime').innerHTML = `${hour}:${min}:${sec}`;
+}
+
+let totalTime = getTime();
+formatTime(totalTime);
+
 </script>
 </body>
 </html>