javascript time sorting algorithm to achieve active seckill countdown effect

Make one active list page down the page Need a time sorting algorithm of his own ideas to all kinds of algorithm also didn't make out a long time, then ask the next one background php classmate He showed me, wrote a algorithm when the beginning think this is a pure algorithm, cannot be converted into page dom effect, but look at the two times can be found, so I changed change, implementation, to share with you.

The page requirement is: 1 seckill every hour from 11:00 to 20:00. If it is the current time, the item before the seckill will be displayed in the last row, and so on

Similar to the first 11 order is 11,12,13,14,15,16,17,18,19,20 (or points);
To the order of the 12 o 'clock is 12,13,14,15,16,17,18,19,20,11 (or points)
The order to 13,14,15,16,17,18,19,20, 12,11.
.
The final order is 20,19,18,17,16,15,13,12,11.

This is the pure algorithm of the backstage student

function show_test(hour)
 {
  p = ['13 dian','14 dian','15 dian ','16 dian','17 dian','18 dian','19 dian','20 dian'];
  console.log(' The original order is ');
  console.log(p);
  date = new Date();
  curHour = date.getHours();
  pos = curHour - 13;
  //pos = hour;
  s = ' activity '+ p[pos]+" The ongoing ";
  console.log(s);
  desc = ' The current order should be ';
  p.reverse();
  console.log(pos);
 
  tmp = []
  for(i = 0 ; i<pos; i++){
  tmp.push(p.pop());
  }
  p.reverse();
  p = p.concat(tmp.reverse());
  console.log(desc);
  console.log(p);
  console.log("\n\n");
 }

call

var curHour=new Date().getHours();
show_test(curHour);

This algorithm is the perfect implementation of the need to express the kind of requirements but the problem came how to really convert into the page, so after thinking about it I will be perfect implementation;

// First of all define 1 That contains the goods for each seckill id And an array of images  img1 It's a picture of the product.  img2 It's seckill time  img3 It's the description of the product 

var data=[
 { id:1,
 time:11,
 img1:"1.jpg",
 img2:"11.jpg",
 img3:"111.jpg"
 
 },
 { id:2,
 time:12,
 img1:"2.jpg",
 img2:"22.jpg",
 img3:"222.jpg"
 
 },
 { id:3,
 time:13,
 img1:"3.jpg",
 img2:"33.jpg",
 img3:"333.jpg"
 
 },
 { id:4,
 time:14,
 img1:"4.jpg",
 img2:"44.jpg",
 img3:"444.jpg"
 },
 { id:5,
 time:15,
 img1:"5.jpg",
 img2:"55.jpg",
 img3:"555.jpg"
 },
 { id:6,
 time:16,
 img1:"6.jpg",
 img2:"66.jpg",
 img3:"666.jpg"
 },
 { id:7,
 time:17,
 img1:"7.jpg",
 img2:"77.jpg",
 img3:"777.jpg"
 },
 { id:8,
 time:18,
 img1:"8.jpg",
 img2:"88.jpg",
 img3:"888.jpg"
 },
 { id:9,
 time:19,
 img1:"9.jpg",
 img2:"99.jpg",
 img3:"999.jpg"
 },
 { id:10,
 time:20,
 img1:"10.jpg",
 img2:"101.jpg",
 img3:"1010.jpg"
 }

 ];

// Object array sorting  
function compare(propertyName) { 
 return function (object1, object2) { 
 var value1 = object1[propertyName]; 
 var value2 = object2[propertyName]; 
 if (value2 < value1) { 
 return -1; 
 }else if (value2 > value1) { 
 return 1; 
 }else { 
 return 0; 
 } 
 } 
} 
// Because now my array is going to be 1 It's a complex array   So sort is going to use sort by some property of the object 
// This method is used in javascript This is mentioned in Advanced Programming  

 function itemShow(hour)
 {
  p=data;
  // The current time 
  curHour = hour; 
  // The array index corresponding to the time 

  pos = curHour - 11;
  if(pos<=0){ // If you don't have to 11 The dot shows the original order 
  pos=0;
  }else if(pos>=9){// If more than 20 point   It's going to be in reverse order 
  pos=9
  }
  s = ' activity '+ p[pos]+" The ongoing ";
  console.log(s);
  // Based on what's in the array   The time property is sorted in reverse 
  p.reverse(compare("time"));
  console.log(pos);
  console.log(p);
  // define 1 A temporary array to hold out-of-date items 
  tmp = []
  for(i = 0 ; i<pos; i++){
  tmp.push(p.pop());
  }
  // And then sort the rest in reverse order 
  p.reverse(compare("time"));
  // Links item items that have not reached the seckill time to an array that has expired 
  p = p.concat(tmp.reverse(compare("time"))); //
  console.log(desc);
  console.log(p);

  for(var i=0;i<data.length;i++){
  if(i==0){// Is kill  
  $(".item").eq(0).append("<img src='"+p[i].img1+"' id="+p[i].id+">")
  $(".item").eq(0).append("<img src='"+"killsecond_now.jpg"+"'>")
  $(".item").eq(0).append("<img src='"+p[i].img3+"'>")
  }else{
  $(".item").eq(i).append("<img src='"+p[i].img1+"' id="+p[i].id+">")
  $(".item").eq(i).append("<img src='"+p[i].img2+"'>")
  $(".item").eq(i).append("<img src='"+p[i].img3+"'>")
  }
  } 

  
 }

In this way, the algorithm is displayed on the page. I hope you can gain something and understand the javascript time sorting algorithm.