diff options
author | Jacob Schatz <jschatz1@gmail.com> | 2017-04-08 10:36:42 -0400 |
---|---|---|
committer | Luke "Jared" Bennett <lbennett@gitlab.com> | 2017-04-10 14:56:43 +0100 |
commit | e1b0ed391fcbd1c622b6e3c866674b85ccd0edea (patch) | |
tree | 8d6e0a8a168b00d4cf242775d5d72bc7dbd89d89 | |
parent | ef07200cd0f059a2e0493779263aa526a2ade2e3 (diff) | |
download | gitlab-ce-e1b0ed391fcbd1c622b6e3c866674b85ccd0edea.tar.gz |
Show thumbnails and their titles.
-rw-r--r-- | app/assets/javascripts/blob/balsamiq/index.js | 22 |
1 files changed, 18 insertions, 4 deletions
diff --git a/app/assets/javascripts/blob/balsamiq/index.js b/app/assets/javascripts/blob/balsamiq/index.js index 04201366897..61f4631b423 100644 --- a/app/assets/javascripts/blob/balsamiq/index.js +++ b/app/assets/javascripts/blob/balsamiq/index.js @@ -8,19 +8,33 @@ export default class BalsamiqViewer { } - loadSqlFile() { var xhr = new XMLHttpRequest(); - console.log(this.el) + var self = this; xhr.open('GET', this.el.dataset.endpoint, true); xhr.responseType = 'arraybuffer'; xhr.onload = function(e) { + var list = document.createElement('ul'); var uInt8Array = new Uint8Array(this.response); var db = new SQL.Database(uInt8Array); var contents = db.exec("SELECT * FROM thumbnails"); - console.log(contents) - // contents is now [{columns:['col1','col2',...], values:[[first row], [second row], ...]}] + var previews = contents[0].values.map((i)=>{return JSON.parse(i[1])}); + previews.forEach((prev) => { + var li = document.createElement('li'); + var title = db.exec(`select * from resources where id = '${prev.resourceID}'`) + var template = + `<div class="panel panel-default"> + <div class="panel-heading">${JSON.parse(title[0].values[0][2]).name}</div> + <div class="panel-body"> + <img class="img-thumbnail" src="data:image/png;base64,${prev.image}"/> + </div> + </div>`; + li.innerHTML = template; + list.appendChild(li); + }); + list.classList += 'list-inline'; + self.el.appendChild(list); }; xhr.send(); } |