Commit 380398887f6e6d74be6649f9d2fc1b4db6e58593

Improve and integrate the search component

  - Minor code changes to search component to work with the new routing.
  - New mark feature when clicking on resulting image in OCD search.
  
5050 margin-bottom: 10px;
5151}
5252
53.ocd-item.col-md-4 {
54 width: 32.3333%;
55}
5356.ocd-item {
5457 padding-bottom: 4px;
5558 border: 1px solid #ddd;
5659 border-radius: 4px;
57 margin-bottom: 20px;
60 margin: 0 5px 20px 5px;
5861 text-align: center;
62}
63.ocd-item-cover {
64 position: absolute;
65 border: 1px solid #ddd;
66 box-shadow: 1px 1px 3px #ccc;
67 width: 100%;
68 padding: 12px;
69 background: #fff;
70 height: 60px;
71 margin-left: -15px;
72}
73.ocd-item .text{
74 margin-top: 3px;
5975}
6076
6177.thumb-image {
  
466466 el: $('#ocd-view'),
467467 events: {
468468 'click .ocd-item a': 'onImgClick',
469 'click .ocd-item-cover .close': 'onCoverCloseClick',
470 'click .ocd-item-mark': 'onMarkClick',
469471 'click .pager li': 'onPagerClick'
470472 },
471473 initialize: function(opts) {
477477 this.page = 0;
478478 this.item_template = _.template($('#ocd-item-template').html());
479479 this.base_template = _.template($('#ocd-view-base-template').html());
480 this.cover_template = _.template($('#ocd-item-cover-template').html());
480481 this.render();
481482 },
482483 render: function() {
498498 $row_el.append(this.item_template({
499499 title: item._source.title,
500500 media_url: item._source.media_urls[0].url,
501 authors: item._source.authors
501 authors: item._source.authors,
502 description: item._source.description
502503 }));
503504 }, this);
504505 this.resolveOCDURLs();
561561 return false;
562562 },
563563 onImgClick: function(event) {
564 //console.log('onImgClick');
564565 event.preventDefault();
565566 // TODO: init the image anno
566 var url = $(event.currentTarget).find('img').attr('src');
567 this.highlightImg(event);
567568 //swtr.appView.loadURL(url, 'image');
568569 return false;
570 },
571 highlightImg: function(event) {
572 //console.log('highlightImg');
573 var elem = $(event.currentTarget).parent().parent();
574 // if .ocd-item-cover exists return
575 if(elem.find('.ocd-item-cover').length) {
576 return;
577 }
578 //console.log(elem);
579 elem.prepend(this.cover_template());
580 $(elem.find('.ocd-item-cover')[0]).slideDown('slow');
581 },
582 onCoverCloseClick: function(event) {
583 var elem = $(event.currentTarget).parent();
584 elem.slideUp('slow');
585 elem.remove();
586 },
587 onMarkClick: function(event) {
588 var url = $(event.currentTarget).parent().parent().
589 find('img').attr('src');
590 console.log('load image anno', url);
569591 },
570592 search: function(data, cb) {
571593 swtr.appView.$overlay.show();
  
262262 <img src="" class="responsive thumb-image">
263263 </a>
264264 </div>
265 <div>Authors: <%= authors %> </div>
265 <div class="text">Authors: <%= authors %> </div>
266 <div class="text">Description: <%= description %> </div>
267 </div>
268 </script>
269 <script type="text/template" id="ocd-item-cover-template">
270 <div class="ocd-item-cover">
271 Mark and load this image to annotate
272 <button class="btn btn-xs btn-default pull-left ocd-item-mark">Mark</button>
273 <a class="close">&times;</a>
274 <div class="clearfix"></div>
266275 </div>
267276 </script>
268277 <script type="text/template" id="filter-users">