arno/lychee
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Updated api.js and build.js (ES2015)

Browse Source
This commit is contained in:
Tobias Reich 2015-07-11 14:16:11 +02:00
parent a0ea271bd6
commit bfe067cc71
5 changed files with 118 additions and 161 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
dist/main.js vendored
View File

Binary file not shown.

BIN
dist/view.js vendored
View File

Binary file not shown.

34
src/scripts/api.js
View File

@ -12,43 +12,39 @@ api = {
api.post = function(fn, params, callback) { api.post = function(fn, params, callback) {
var success, loadingBar.show()
error;
loadingBar.show(); params = $.extend({function: fn}, params)
params = $.extend({function: fn}, params); const success = (data) => {
success = function(data) { setTimeout(() => loadingBar.hide(), 100)
setTimeout(function() { loadingBar.hide() }, 100);
// Catch errors // Catch errors
if (typeof data==='string'&& if (typeof data==='string' && data.substring(0, 7)==='Error: ') {
data.substring(0, 7)==='Error: ') { api.onError(data.substring(7, data.length), params, data)
api.onError(data.substring(7, data.length), params, data); return false
return false;
} }
// Convert 1 to true and an empty string to false // Convert 1 to true and an empty string to false
if (data==='1') data = true; if (data==='1') data = true
else if (data==='') data = false; else if (data==='') data = false
// Convert to JSON if string start with '{' and ends with '}' // Convert to JSON if string start with '{' and ends with '}'
if (typeof data==='string' && if (typeof data==='string' &&
data.substring(0, 1)==='{' && data.substring(0, 1)==='{' &&
data.substring(data.length-1, data.length)==='}') data = $.parseJSON(data); data.substring(data.length-1, data.length)==='}') data = $.parseJSON(data)
// Output response when debug mode is enabled // Output response when debug mode is enabled
if (lychee.debugMode) console.log(data); if (lychee.debugMode) console.log(data)
callback(data); callback(data)
} }
error = function(jqXHR, textStatus, errorThrown) { const error = (jqXHR, textStatus, errorThrown) => {
api.onError('Server error or API not found.', params, errorThrown); api.onError('Server error or API not found.', params, errorThrown)
} }
@ -59,6 +55,6 @@ api.post = function(fn, params, callback) {
dataType: 'text', dataType: 'text',
success, success,
error error
}); })
} }

165
src/scripts/build.js
View File

@ -3,67 +3,39 @@
* @copyright 2015 by Tobias Reich * @copyright 2015 by Tobias Reich
*/ */
window.build = {} build = {}
build.iconic = function(icon, classes) { build.iconic = function(icon, classes = '') {
var html = ''; return `<svg class='iconic ${ classes }'><use xlink:href='#${ icon }' /></svg>`
classes = classes || '';
html = `
<svg class='iconic ${ classes }'>
<use xlink:href='#${ icon }' />
</svg>
`
return html;
} }
build.divider = function(title) { build.divider = function(title) {
var html = ''; return `<div class='divider'><h1>${ title }</h1></div>`
html = `
<div class='divider'>
<h1>${ title }</h1>
</div>
`
return html;
} }
build.editIcon = function(id) { build.editIcon = function(id) {
var html = ''; return `<div id='${ id }' class='edit'>${ build.iconic('pencil') }</div>`
html = `<div id='${ id }' class='edit'>${ build.iconic('pencil') }</div>`
return html;
} }
build.multiselect = function(top, left) { build.multiselect = function(top, left) {
var html = ''; return `<div id='multiselect' style='top: ${ top }px; left: ${ left }px;'></div>`
html = `<div id='multiselect' style='top: ${ top }px; left: ${ left }px;'></div>`
return html;
} }
build.album = function(data) { build.album = function(data) {
if (data===null||data===undefined) return ''; if (data==null) return ''
var html = ''; let { path: thumbPath, hasRetina: thumbRetina } = lychee.retinize(data.thumbs[0])
var {path: thumbPath, hasRetina: thumbRetina} = lychee.retinize(data.thumbs[0]); let html = `
html = `
<div class='album' data-id='${ data.id }'> <div class='album' data-id='${ data.id }'>
<img src='${ data.thumbs[2] }' width='200' height='200' alt='thumb' data-retina='false'> <img src='${ data.thumbs[2] }' width='200' height='200' alt='thumb' data-retina='false'>
<img src='${ data.thumbs[1] }' width='200' height='200' alt='thumb' data-retina='false'> <img src='${ data.thumbs[1] }' width='200' height='200' alt='thumb' data-retina='false'>
@ -76,48 +48,46 @@ build.album = function(data) {
if (lychee.publicMode===false) { if (lychee.publicMode===false) {
if (data.star==='1') html += `<a class='badge icn-star'>${ build.iconic('star') }</a>`; if (data.star==='1') html += `<a class='badge icn-star'>${ build.iconic('star') }</a>`
if (data.public==='1') html += `<a class='badge icn-share'>${ build.iconic('eye') }</a>`; if (data.public==='1') html += `<a class='badge icn-share'>${ build.iconic('eye') }</a>`
if (data.unsorted==='1') html += `<a class='badge'>${ build.iconic('list') }</a>`; if (data.unsorted==='1') html += `<a class='badge'>${ build.iconic('list') }</a>`
if (data.recent==='1') html += `<a class='badge'>${ build.iconic('clock') }</a>`; if (data.recent==='1') html += `<a class='badge'>${ build.iconic('clock') }</a>`
if (data.password==='1') html += `<a class='badge'>${ build.iconic('lock-locked') }</a>`; if (data.password==='1') html += `<a class='badge'>${ build.iconic('lock-locked') }</a>`
} }
html += '</div>' html += '</div>'
return html; return html
} }
build.photo = function(data) { build.photo = function(data) {
if (data===null||data===undefined) return ''; if (data==null) return ''
var html = ''; let { path: thumbPath, hasRetina: thumbRetina } = lychee.retinize(data.thumbUrl)
var {path: thumbPath, hasRetina: thumbRetina} = lychee.retinize(data.thumbUrl); let html = `
html = `
<div class='photo' data-album-id='${ data.album }' data-id='${ data.id }'> <div class='photo' data-album-id='${ data.album }' data-id='${ data.id }'>
<img src='${ thumbPath }' width='200' height='200' alt='thumb'> <img src='${ thumbPath }' width='200' height='200' alt='thumb'>
<div class='overlay'> <div class='overlay'>
<h1 title='${ data.title }'>${ data.title }</h1> <h1 title='${ data.title }'>${ data.title }</h1>
` `
if (data.cameraDate==='1') html += `<a><span title='Camera Date'>${ build.iconic('camera-slr') }</span>${ data.sysdate }</a>`; if (data.cameraDate==='1') html += `<a><span title='Camera Date'>${ build.iconic('camera-slr') }</span>${ data.sysdate }</a>`
else html += `<a>${ data.sysdate }</a>`; else html += `<a>${ data.sysdate }</a>`
html += '</div>'; html += '</div>'
if (lychee.publicMode===false) { if (lychee.publicMode===false) {
if (data.star==='1') html += `<a class='badge iconic-star'>${ build.iconic('star') }</a>`; if (data.star==='1') html += `<a class='badge iconic-star'>${ build.iconic('star') }</a>`
if (data.public==='1'&&album.json.public!=='1') html += `<a class='badge iconic-share'>${ build.iconic('eye') }</a>`; if (data.public==='1' && album.json.public!=='1') html += `<a class='badge iconic-share'>${ build.iconic('eye') }</a>`
} }
html += '</div>'; html += '</div>'
return html return html
@ -125,127 +95,118 @@ build.photo = function(data) {
build.imageview = function(data, size, visibleControls) { build.imageview = function(data, size, visibleControls) {
if (data===null||data===undefined) return ''; if (data==null) return ''
var html = ''; let html = `
html = `
<div class='arrow_wrapper arrow_wrapper--previous'><a id='previous'>${ build.iconic('caret-left') }</a></div> <div class='arrow_wrapper arrow_wrapper--previous'><a id='previous'>${ build.iconic('caret-left') }</a></div>
<div class='arrow_wrapper arrow_wrapper--next'><a id='next'>${ build.iconic('caret-right') }</a></div> <div class='arrow_wrapper arrow_wrapper--next'><a id='next'>${ build.iconic('caret-right') }</a></div>
` `
if (size==='big') { if (size==='big') {
if (visibleControls===true) if (visibleControls===true) html += `<div id='image' style='background-image: url(${ data.url })'></div>`
html += `<div id='image' style='background-image: url(${ data.url })'></div>`; else html += `<div id='image' style='background-image: url(${ data.url });' class='full'></div>`
else
html += `<div id='image' style='background-image: url(${ data.url });' class='full'></div>`;
} else if (size==='medium') { } else if (size==='medium') {
if (visibleControls===true) if (visibleControls===true) html += `<div id='image' style='background-image: url(${ data.medium })'></div>`
html += `<div id='image' style='background-image: url(${ data.medium })'></div>`; else html += `<div id='image' style='background-image: url(${ data.medium });' class='full'></div>`
else
html += `<div id='image' style='background-image: url(${ data.medium });' class='full'></div>`;
} else if (size==='small') { } else if (size==='small') {
if (visibleControls===true) if (visibleControls===true) html += `<div id='image' class='small' style='background-image: url(${ data.url }); width: ${ data.width }px; height: ${ data.height }px; margin-top: -${ parseInt(data.height/2-20) }px; margin-left: -${ data.width/2 }px;'></div>`
html += `<div id='image' class='small' style='background-image: url(${ data.url }); width: ${ data.width }px; height: ${ data.height }px; margin-top: -${ parseInt(data.height/2-20) }px; margin-left: -${ data.width/2 }px;'></div>`; else html += `<div id='image' class='small' style='background-image: url(${ data.url }); width: ${ data.width }px; height: ${ data.height }px; margin-top: -${ parseInt(data.height/2) }px; margin-left: -${ data.width/2 }px;'></div>`
else
html += `<div id='image' class='small' style='background-image: url(${ data.url }); width: ${ data.width }px; height: ${ data.height }px; margin-top: -${ parseInt(data.height/2) }px; margin-left: -${ data.width/2 }px;'></div>`;
} }
return html; return html
} }
build.no_content = function(typ) { build.no_content = function(typ) {
var html; let html = `
html = `
<div class='no_content fadeIn'> <div class='no_content fadeIn'>
${ build.iconic(typ) } ${ build.iconic(typ) }
` `
switch (typ) { switch (typ) {
case 'magnifying-glass': html += '<p>No results</p>'; case 'magnifying-glass':
break; html += '<p>No results</p>'
case 'eye': html += '<p>No public albums</p>'; break
break; case 'eye':
case 'cog': html += '<p>No configuration</p>'; html += '<p>No public albums</p>'
break; break
case 'question-mark': html += '<p>Photo not found</p>'; case 'cog':
break; html += '<p>No configuration</p>'
break
case 'question-mark':
html += '<p>Photo not found</p>'
break
} }
html += '</div>'; html += '</div>'
return html; return html
} }
build.uploadModal = function(title, files) { build.uploadModal = function(title, files) {
var html = '', let html = `
i = 0,
file = null;
html = `
<h1>${ title }</h1> <h1>${ title }</h1>
<div class='rows'> <div class='rows'>
` `
let i = 0
while (i<files.length) { while (i<files.length) {
file = files[i]; let file = files[i]
if (file.name.length>40) file.name = file.name.substr(0, 17) + '...' + file.name.substr(file.name.length-20, 20); if (file.name.length>40) file.name = file.name.substr(0, 17) + '...' + file.name.substr(file.name.length-20, 20)
html += ` html += `
<div class='row'> <div class='row'>
<a class='name'>${ lychee.escapeHTML(file.name) }</a> <a class='name'>${ lychee.escapeHTML(file.name) }</a>
` `
if (file.supported===true) html += `<a class='status'></a>`; if (file.supported===true) html += `<a class='status'></a>`
else html += `<a class='status error'>Not supported</a>`; else html += `<a class='status error'>Not supported</a>`
html += ` html += `
<p class='notice'></p> <p class='notice'></p>
</div> </div>
` `
i++; i++
} }
html += '</div>'; html += '</div>'
return html; return html
} }
build.tags = function(tags) { build.tags = function(tags) {
var html = '', let html = ''
editTagsHTML = '';
if (tags!=='') { if (tags!=='') {
tags = tags.split(','); tags = tags.split(',')
tags.forEach(function(tag, index, array) { tags.forEach(function(tag, index, array) {
html += `<a class='tag'>${ tag }<span data-index='${ index }'>${ build.iconic('x') }</span></a>` html += `<a class='tag'>${ tag }<span data-index='${ index }'>${ build.iconic('x') }</span></a>`
}); })
} else { } else {
html = `<div class='empty'>No Tags</div>`; html = `<div class='empty'>No Tags</div>`
} }
return html; return html
} }