main.js 4.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. // @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later
  2. window._coliberatorURL = 'http://localhost/coliberator/';
  3. window.Coliberator = {
  4. data: {},
  5. templates: {
  6. speaker: function (data){
  7. return '<li data-id="'+data.id+'" class="participant-item"><a href="#" class="participant" title="Click for more details"><img src="'+data.imageURL+'" alt="'+data.name+'"/><span class="participant-details">'+data.name+'</span></a></li>';
  8. },
  9. speakerDescription: function (data){
  10. var presentations = '<div class="presentations"><span class="category">Talks about:</span><ul>',
  11. i, l, v;
  12. for (i = 0, l = data.presentations.length; i < l; i ++) {
  13. v = data.presentations[i];
  14. presentations += '<li>' + v.title + '</li>';
  15. }
  16. presentations += '</ul></div>';
  17. return '<div class="pop-up"><div class="details"><img src="'+data.imageURL+'" alt="'+data.name+'"/><h2>'+data.name+'</h2><h5>'+data.occupation+'</h5><span class="description">'+data.description+'</span>'+presentations+'<button class="close-btn" title="Close the description panel"></button></div></div>';
  18. },
  19. presentation: function (data){
  20. var separator = '';
  21. var desc = '';
  22. if (data.name.length != 0) {
  23. separator = ' de ';
  24. }
  25. if (data.description.length != 0) {
  26. desc = '<p>' + data.description + '</p>';
  27. }
  28. if (data.description == 'separator') {
  29. return '<li style="border-bottom: 1px solid gray; margin-top: 20px;"><span class="title">'+data.when+'</span> (<span style="">'+data.title+'</span>)<span class="details">'+separator+data.name+'</span>'+desc+'</li>';
  30. }
  31. return '<li><span class="when">'+data.when+'</span><span class="title">'+data.title+'</span><span class="details">'+separator+data.name+'</span>'+desc+'</li>';
  32. }
  33. },
  34. build: {
  35. presentations: function (data) {
  36. var el = $('#presentations'),
  37. i, l, v = '';
  38. for (i = 0, l = data.length; i < l; i ++) {
  39. v += Coliberator.templates.presentation(data[i]);
  40. }
  41. el.append(v);
  42. el.on('click','li', Coliberator.build.showPresentationDescription);
  43. },
  44. speakers: function (data) {
  45. var el = $('#speakers'),
  46. i, l, v = '';
  47. for (i = 0, l = data.length; i < l; i ++) {
  48. v += Coliberator.templates.speaker(data[i]);
  49. }
  50. el.append(v);
  51. el.on('click','li', Coliberator.build.speakerDescription);
  52. },
  53. speakerDescription: function (ev) {
  54. var $this = $(this),
  55. data,
  56. $descrEl,
  57. closeFunction = function () {
  58. var $el = $(this);
  59. $el.animate({
  60. top: '100%'
  61. },'fast', function() {
  62. $el.parent().remove();
  63. $el.remove();
  64. $el.blur();
  65. $this.focus();
  66. $('body').off();
  67. });
  68. };
  69. $this.blur();
  70. ev.preventDefault();
  71. data = Coliberator.data.speakers[$this.data('id')];
  72. $descrEl = $(Coliberator.templates.speakerDescription(data));
  73. // ... event participants .append
  74. $('body').prepend($descrEl);
  75. var $details = $descrEl.find('.details').animate({
  76. top: '25%'
  77. },'fast').on('click','.close-btn', function(){
  78. $el = $(this.parentElement);
  79. closeFunction.call($details);
  80. });
  81. $('body').keypress(function(e){
  82. // bind escape to the close modal functionality
  83. if (e.keyCode == 27) {
  84. closeFunction.call($details);
  85. }
  86. });
  87. // set focus on the close button: fixes a bug where you could press
  88. // enter multiple times on participant and helps ux
  89. $details.find('.close-btn').focus();
  90. },
  91. showPresentationDescription: function (ev) {
  92. var $this = $(this),
  93. data,
  94. $descrEl;
  95. ev.preventDefault();
  96. $this.find('p').stop().slideToggle();
  97. }
  98. }
  99. }
  100. $(document).ready(function() {
  101. Coliberator.build.speakers(Coliberator.data.speakers);
  102. Coliberator.build.presentations(Coliberator.data.presentations);
  103. $('.header-container').on('click','a',function (){
  104. //scrollTop: $(this).offset().top + 'px'
  105. var el = $($(this).attr('href')), top;
  106. if (el.length) {
  107. top = el.offset().top - $('.header-container').outerHeight();
  108. } else {
  109. top = 0;
  110. }
  111. $('body').animate({
  112. scrollTop: top + 'px'
  113. }, 'fast');
  114. });
  115. });
  116. // @license-end