archiveviewer.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. /*
  2. * Git HTML Archive Viewer
  3. *
  4. * Benedikt Bieringer <benedikt.b@wwu.de>
  5. * https://nuserv.uni-muenster.de:8443/bbieringer/statusarchiveviewer
  6. */
  7. class ArchiveCommit {
  8. constructor(message, time, sha) {
  9. this.message = message
  10. this.time = time
  11. this.sha = sha
  12. }
  13. }
  14. function replace_urls(text, url_before, url_after) {
  15. for(const key of ["src=\""]) {
  16. segments = text.split(key)
  17. result_text = segments[0]
  18. for(const segment of segments.slice(1)) {
  19. var index = segment.indexOf('"')
  20. var first = segment.substring(0, index)
  21. var second = segment.substring(index)
  22. var new_url = url_before + encodeURIComponent(first) + url_after
  23. result_text += key + new_url + second
  24. }
  25. text = result_text
  26. }
  27. return text
  28. }
  29. class ArchiveView {
  30. constructor(dateselector, commitsSelect, content, token, url, project_id, branch, page_path, index) {
  31. this.token = token
  32. this.url = url
  33. this.project_id = project_id
  34. this.branch = branch
  35. this.dateselector = dateselector
  36. this.dateselector.value = ""
  37. this.dateselector.max = new Date().toLocaleDateString('en-ca')
  38. // Alternative, doesn't allow selecting today in first two hours of day:
  39. // this.dateselector.max = new Date().toISOString().split("T")[0]
  40. this.dateselector.addEventListener("input",((event) => this.on_date_selected(event)))
  41. this.commitsSelect = commitsSelect
  42. this.commitsSelect.addEventListener("input",((event) => this.on_commit_selected(event)))
  43. this.content = content
  44. this.page_path = page_path
  45. this.index = index
  46. const blobContent = new Blob([`
  47. <!doctype html><html><head>
  48. <style>
  49. body {
  50. min-height: 100vh;
  51. display: flex;
  52. align-items: center;
  53. justify-content: space-around;
  54. }
  55. h1,h2 {
  56. display: flex;
  57. align-items: center;
  58. justify-content: center;
  59. }
  60. </style>
  61. </head>
  62. <body style="background:#aaa; color:#fff;">
  63. <div>
  64. <h1>Welcome to the archive viewer!</h1>
  65. <h2>Select a date and version to start!</h2>
  66. </div>
  67. </body>
  68. </html>
  69. `], {type: "text/html"})
  70. this.content.src = URL.createObjectURL(blobContent)
  71. }
  72. add_commits(commits) {
  73. commits.map(commit => {
  74. var elem = document.createElement("option")
  75. elem.innerHTML = commit.message
  76. elem.value = commit.sha
  77. this.commitsSelect.appendChild(elem)
  78. })
  79. }
  80. on_date_selected(event) {
  81. if (!event.target.value)
  82. return
  83. var page = 1
  84. var date = event.target.value
  85. // Clean commits list
  86. this.commitsSelect.innerHTML = ""
  87. this.commitsSelect.appendChild(document.createElement("option"))
  88. this.load_pages_recursive(page, date)
  89. }
  90. on_commit_selected(event) {
  91. var sha = event.target.value
  92. var url_before = 'https://' + this.url + '/api/v4/projects/' + this.project_id + '/repository/files/' + encodeURIComponent(this.page_path + "/")
  93. var url_after = '/raw?ref=' + sha + '&private_token=' + this.token
  94. var url = url_before + encodeURIComponent(this.index) + url_after
  95. fetch(url)
  96. .then(response => response.text())
  97. .then(text => {
  98. console.log(text)
  99. var cleaned_text = replace_urls(text, url_before, url_after)
  100. console.log(cleaned_text)
  101. const blobContent = new Blob([cleaned_text], {type: "text/html"})
  102. this.content.src = URL.createObjectURL(blobContent)
  103. })
  104. }
  105. load_pages_recursive(page, date) {
  106. var commits_url = 'https://' + this.url + '/api/v4/projects/' + this.project_id + '/repository/commits?ref_name=' + this.branch + '&private_token=' + this.token + "&since="+date+"T00:00&until="+date+"T24:00&per_page=100&page=" + page;
  107. var length_promise = fetch(commits_url)
  108. .then(response => response.json())
  109. .then(
  110. // Translate response to commits
  111. json => json.map(
  112. gitlab_commit => new ArchiveCommit(
  113. gitlab_commit.message,
  114. gitlab_commit.created_at,
  115. gitlab_commit.id
  116. )
  117. )
  118. ).then((commits) => {
  119. // Skip if new date is selected
  120. if (date != this.dateselector.value) {
  121. return 0;
  122. }
  123. this.add_commits(commits)
  124. return commits.length
  125. }
  126. ).then((length) => {
  127. if (length > 0) {
  128. this.load_pages_recursive(page+1, date)
  129. }
  130. })
  131. }
  132. }