0x2620/pandora
2
1
Fork 1
Code Issues 1.3k Pull requests Releases Wiki Activity

update help dialog (image elements) and api dialog (widths)

Browse source
This commit is contained in:
rolux 2013-03-07 07:58:25 +00:00
parent 088807202e
commit cce51fa4db
2 changed files with 31 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
static/js/pandora/apiDialog.js
View file

@ -50,10 +50,10 @@ pandora.ui.apiDialog = function() {
keys: {escape: 'close'}, keys: {escape: 'close'},
maximizeButton: true, maximizeButton: true,
minHeight: 256, minHeight: 256,
minWidth: 544 + Ox.UI.SCROLLBAR_SIZE, minWidth: 544 + 2 * Ox.UI.SCROLLBAR_SIZE,
removeOnClose: true, removeOnClose: true,
title: 'API Documentation', title: 'API Documentation',
width: 672 + Ox.UI.SCROLLBAR_SIZE width: 672 + 2 * Ox.UI.SCROLLBAR_SIZE
}) })
.bindEvent({ .bindEvent({
close: function() { close: function() {
@ -116,7 +116,7 @@ pandora.ui.apiDialog = function() {
$panel = Ox.SplitPanel({ $panel = Ox.SplitPanel({
elements: [ elements: [
{element: $list, size: 128}, {element: $list, size: 128 + Ox.UI.SCROLLBAR_SIZE},
{element: $text} {element: $text}
], ],
orientation: 'horizontal' orientation: 'horizontal'

42
static/js/pandora/helpDialog.js
View file

@ -21,7 +21,7 @@ pandora.ui.helpDialog = function() {
}) })
), ),
$panel, $list, $text, $panel, $list, $text, $image,
that = Ox.Dialog({ that = Ox.Dialog({
buttons: [ buttons: [
@ -49,18 +49,16 @@ pandora.ui.helpDialog = function() {
keys: {escape: 'close'}, keys: {escape: 'close'},
maximizeButton: true, maximizeButton: true,
minHeight: 256, minHeight: 256,
minWidth: 544 + Ox.UI.SCROLLBAR_SIZE, minWidth: 544 + 2 * Ox.UI.SCROLLBAR_SIZE,
removeOnClose: true, removeOnClose: true,
title: 'Help', title: 'Help',
width: 672 + Ox.UI.SCROLLBAR_SIZE width: 672 + 2 * Ox.UI.SCROLLBAR_SIZE
}) })
.bindEvent({ .bindEvent({
close: function() { close: function() {
pandora.user.ui.page == 'help' && pandora.UI.set({page: '', 'hash.anchor': ''}); pandora.user.ui.page == 'help' && pandora.UI.set({page: '', 'hash.anchor': ''});
}, },
resize: function() { resize: resize,
$list.size();
},
'pandora_help': function(data) { 'pandora_help': function(data) {
if (pandora.user.ui.page == 'help') { if (pandora.user.ui.page == 'help') {
that.select(data.value == '' ? 'help' : data.value); that.select(data.value == '' ? 'help' : data.value);
@ -119,16 +117,15 @@ pandora.ui.helpDialog = function() {
$text = Ox.Element() $text = Ox.Element()
.css({ .css({
padding: '16px', padding: '16px',
// fontSize: '12px',
lineHeight: '16px', lineHeight: '16px',
overflowY: 'auto', overflowY: 'scroll',
MozUserSelect: 'text', MozUserSelect: 'text',
WebkitUserSelect: 'text' WebkitUserSelect: 'text'
}); });
$panel = Ox.SplitPanel({ $panel = Ox.SplitPanel({
elements: [ elements: [
{element: $list, size: 128}, {element: $list, size: 128 + Ox.UI.SCROLLBAR_SIZE},
{element: $text} {element: $text}
], ],
orientation: 'horizontal' orientation: 'horizontal'
@ -139,13 +136,30 @@ pandora.ui.helpDialog = function() {
}); });
function getImageSize() {
var width = that.options('width') - 160 - 2 * Ox.UI.SCROLLBAR_SIZE,
height = Math.round(width * 5/8);
return {width: width, height: height};
}
function resize(data) {
$list.size();
$image && $image.options(getImageSize());
}
that.select = function(id) { that.select = function(id) {
var img, $img;
$text.html(text[id || 'help']).scrollTop(0); $text.html(text[id || 'help']).scrollTop(0);
$text.find('img') img = $text.find('img');
.css({ if (img) {
width: '100%', $img = $(img);
borderRadius: '8px' $img.replaceWith(
}); $image = Ox.ImageElement(
Ox.extend(getImageSize(), {src: $img.attr('src')})
)
.css({borderRadius: '8px'})
);
}
$text.find('td:first-child') $text.find('td:first-child')
.css({ .css({
height: '16px', height: '16px',