new documents section
This commit is contained in:
parent
3fcbd59525
commit
e1f35b1ec8
74 changed files with 6737 additions and 631 deletions
282
static/js/document.js
Normal file
282
static/js/document.js
Normal file
|
|
@ -0,0 +1,282 @@
|
|||
|
||||
// vim: et:ts=4:sw=4:sts=4:ft=javascript
|
||||
'use strict';
|
||||
|
||||
pandora.ui.document = function() {
|
||||
var $toolbar = Ox.Bar({size: 16})
|
||||
.bindEvent({
|
||||
doubleclick: function(e) {
|
||||
if ($(e.target).is('.OxBar')) {
|
||||
pandora.$ui.text && pandora.$ui.text.animate({scrollTop:0}, 250);
|
||||
}
|
||||
}
|
||||
}),
|
||||
$content = Ox.Element(),
|
||||
that = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: $toolbar,
|
||||
size: 16
|
||||
},
|
||||
{
|
||||
element: $content
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
})
|
||||
.bindEvent({
|
||||
pandora_showbrowser: function(data) {
|
||||
that.update();
|
||||
}
|
||||
}),
|
||||
item,
|
||||
$find,
|
||||
$nextButton,
|
||||
$currentButton,
|
||||
$previousButton;
|
||||
|
||||
pandora.api.getDocument({
|
||||
id: pandora.user.ui.document
|
||||
}, function(result) {
|
||||
if (pandora.user.ui.document != result.data.id) {
|
||||
return;
|
||||
}
|
||||
item = result.data;
|
||||
var documentTitle = pandora.getWindowTitle(item);
|
||||
document.title = pandora.getPageTitle(document.location.pathname) || documentTitle;
|
||||
pandora.$ui.itemTitle
|
||||
.options({title: '<b>' + (pandora.getDocumentTitle(item)) + '</b>'})
|
||||
.show();
|
||||
|
||||
if (pandora.user.ui.documentView == 'info') {
|
||||
$content.replaceWith(
|
||||
$content = pandora.ui.documentInfoView(result.data)
|
||||
);
|
||||
} else {
|
||||
setContent();
|
||||
}
|
||||
});
|
||||
|
||||
function setContent() {
|
||||
that.replaceElement(1, $content = (
|
||||
item.extension == 'pdf'
|
||||
? Ox.PDFViewer({
|
||||
height: that.height(),
|
||||
page: pandora.user.ui.documents[item.id]
|
||||
? pandora.user.ui.documents[item.id].position
|
||||
: 1,
|
||||
url: '/documents/' + item.id + '/'
|
||||
+ item.title + '.' + item.extension,
|
||||
width: that.width(),
|
||||
zoom: 'fit'
|
||||
})
|
||||
: item.extension == 'html'
|
||||
? pandora.$ui.textPanel = textPanel(item).css({
|
||||
})
|
||||
: Ox.ImageViewer({
|
||||
area: pandora.user.ui.documents[item.id]
|
||||
? pandora.user.ui.documents[item.id].position
|
||||
: [],
|
||||
height: that.height(),
|
||||
imageHeight: item.dimensions[1],
|
||||
imagePreviewURL: pandora.getMediaURL('/documents/' + item.id + '/256p.jpg?' + item.modified),
|
||||
imageURL: pandora.getMediaURL('/documents/' + item.id + '/'
|
||||
+ item.title + '.' + item.extension + '?' + item.modified),
|
||||
imageWidth: item.dimensions[0],
|
||||
width: that.width()
|
||||
}).css({
|
||||
//prevents image overflow on zoom, fixme: fix in Ox.ImageViewer
|
||||
position: 'absolute'
|
||||
})
|
||||
)
|
||||
.bindEvent({
|
||||
center: function(data) {
|
||||
pandora.UI.set(
|
||||
'documents.' + item.id,
|
||||
{position: $content.getArea().map(Math.round)}
|
||||
);
|
||||
},
|
||||
key_escape: function() {
|
||||
// ...
|
||||
},
|
||||
page: function(data) {
|
||||
pandora.UI.set(
|
||||
'documents.' + item.id,
|
||||
{position: data.page}
|
||||
);
|
||||
},
|
||||
zoom: function(data) {
|
||||
pandora.UI.set(
|
||||
'documents.' + item.id,
|
||||
{position: $content.getArea().map(Math.round)}
|
||||
);
|
||||
}
|
||||
})
|
||||
);
|
||||
if (item.extension == 'html') {
|
||||
that.css({
|
||||
'overflow-y': 'auto'
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function textPanel(text) {
|
||||
var textElement,
|
||||
embedURLs = getEmbedURLs(text.text),
|
||||
that = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: pandora.$ui.text = textElement = pandora.ui.textHTML(text)
|
||||
},
|
||||
{
|
||||
element: pandora.$ui.textEmbed = pandora.ui.textEmbed(),
|
||||
collapsed: !embedURLs.length,
|
||||
size: pandora.user.ui.embedSize,
|
||||
resizable: true,
|
||||
resize: [192, 256, 320, 384, 448, 512]
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
}),
|
||||
selected = -1,
|
||||
selectedURL;
|
||||
/*
|
||||
$find = Ox.Input({
|
||||
clear: true,
|
||||
placeholder: Ox._('Find in Texts'),
|
||||
value: pandora.user.ui.textFind,
|
||||
width: 188
|
||||
})
|
||||
.css({
|
||||
float: 'right',
|
||||
})
|
||||
.bindEvent({
|
||||
submit: function(data) {
|
||||
Ox.print('SUBMIT', data);
|
||||
}
|
||||
})
|
||||
.appendTo($toolbar);
|
||||
*/
|
||||
$nextButton = Ox.Button({
|
||||
disabled: embedURLs.length < 2,
|
||||
title: 'arrowRight',
|
||||
tooltip: Ox._('Next Reference'),
|
||||
type: 'image'
|
||||
})
|
||||
.css({
|
||||
'margin-right': (pandora.user.ui.embedSize + Ox.SCROLLBAR_SIZE) + 'px',
|
||||
float: 'right',
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
that.selectEmbed(
|
||||
selected < embedURLs.length - 1 ? selected + 1 : 0,
|
||||
true
|
||||
);
|
||||
}
|
||||
})
|
||||
.appendTo($toolbar);
|
||||
|
||||
$currentButton = Ox.Button({
|
||||
disabled: embedURLs.length < 1,
|
||||
title: 'center',
|
||||
tooltip: Ox._('Current Reference'),
|
||||
type: 'image'
|
||||
})
|
||||
.css({
|
||||
float: 'right',
|
||||
})
|
||||
.bindEvent({
|
||||
click: scrollToSelectedEmbed
|
||||
})
|
||||
.appendTo($toolbar);
|
||||
|
||||
$previousButton = Ox.Button({
|
||||
disabled: embedURLs.length < 2,
|
||||
title: 'arrowLeft',
|
||||
tooltip: Ox._('Previous Reference'),
|
||||
type: 'image'
|
||||
})
|
||||
.css({
|
||||
float: 'right',
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
that.selectEmbed(
|
||||
selected ? selected - 1 : embedURLs.length - 1,
|
||||
true
|
||||
);
|
||||
}
|
||||
})
|
||||
.appendTo($toolbar);
|
||||
|
||||
function getEmbedURLs(text) {
|
||||
var matches = text.match(/<a [^<>]*?href="(.+?)".*?>/gi),
|
||||
urls = [];
|
||||
if (matches) {
|
||||
matches.forEach(function(match) {
|
||||
var url = match.match(/"(.+?)"/)[1];
|
||||
if (pandora.isEmbedURL(url)) {
|
||||
urls.push(url);
|
||||
}
|
||||
});
|
||||
}
|
||||
return urls;
|
||||
}
|
||||
|
||||
function scrollToSelectedEmbed() {
|
||||
var scrollTop = Math.max(
|
||||
textElement[0].scrollTop + $('#embed' + selected).offset().top - (
|
||||
pandora.user.ui.showBrowser
|
||||
? pandora.$ui.documentContentPanel.options().elements[0].size
|
||||
: 0
|
||||
) - 48,
|
||||
0),
|
||||
position = 100 * scrollTop / Math.max(1, textElement[0].scrollHeight);
|
||||
textElement.scrollTo(position);
|
||||
window.text = textElement;
|
||||
}
|
||||
|
||||
that.selectEmbed = function(index, scroll) {
|
||||
if (index != selected) {
|
||||
selected = index;
|
||||
selectedURL = embedURLs[selected]
|
||||
$('.OxSpecialLink').removeClass('OxActive');
|
||||
selected > -1 && $('#embed' + selected).addClass('OxActive');
|
||||
pandora.$ui.textEmbed.update(selectedURL);
|
||||
scroll && scrollToSelectedEmbed();
|
||||
}
|
||||
};
|
||||
|
||||
that.update = function(text) {
|
||||
var index;
|
||||
embedURLs = getEmbedURLs(text);
|
||||
index = embedURLs.indexOf(selectedURL);
|
||||
if (embedURLs.length && (index == -1 || index >= embedURLs.length)) {
|
||||
index = 0;
|
||||
}
|
||||
selected = -1;
|
||||
that.selectEmbed(index);
|
||||
};
|
||||
|
||||
embedURLs.length && that.selectEmbed(0);
|
||||
return that;
|
||||
}
|
||||
|
||||
that.info = function() {
|
||||
return item;
|
||||
};
|
||||
|
||||
that.update = function() {
|
||||
$content.options({
|
||||
height: that.height(),
|
||||
width: that.width()
|
||||
});
|
||||
$nextButton && $nextButton.css({
|
||||
'margin-right': (pandora.user.ui.embedSize + Ox.SCROLLBAR_SIZE) + 'px',
|
||||
});
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
};
|
||||
Loading…
Add table
Add a link
Reference in a new issue