big picture mode
This commit is contained in:
parent
868bbcdd41
commit
d25d2b3398
4 changed files with 20 additions and 5 deletions
|
@ -144,7 +144,7 @@ View.Fullscreen = function (wardrobe) {
|
||||||
preview_swf = $('#preview-swf'), sidebar_el = $('#preview-sidebar'),
|
preview_swf = $('#preview-swf'), sidebar_el = $('#preview-sidebar'),
|
||||||
sidebar_content_el = $('#preview-sidebar-content'),
|
sidebar_content_el = $('#preview-sidebar-content'),
|
||||||
sidebar_navbar_el = $('#preview-sidebar-navbar'), footer = $('#footer'),
|
sidebar_navbar_el = $('#preview-sidebar-navbar'), footer = $('#footer'),
|
||||||
jwindow = $(window), overrideFull = false;
|
container = $('#container'), jwindow = $(window), overrideFull = false;
|
||||||
|
|
||||||
function fit() {
|
function fit() {
|
||||||
if(!overrideFull) {
|
if(!overrideFull) {
|
||||||
|
@ -162,10 +162,13 @@ View.Fullscreen = function (wardrobe) {
|
||||||
|
|
||||||
if(full) {
|
if(full) {
|
||||||
preview_swf = $('#preview-swf'); // swf replaced
|
preview_swf = $('#preview-swf'); // swf replaced
|
||||||
|
var searchTop = footer.offset().top;
|
||||||
|
if (search_el.is(':visible')) searchTop -= search_el.outerHeight(true);
|
||||||
|
var sidebarWidth = sidebar_el.is(':visible') ?
|
||||||
|
sidebar_el.outerWidth(true) : 0;
|
||||||
var available = {
|
var available = {
|
||||||
height: search_el.offset().top -
|
height: searchTop - preview_el.offset().top,
|
||||||
parseInt(search_el.css('marginTop'), 10) - preview_el.offset().top,
|
width: preview_el.innerWidth() - sidebarWidth
|
||||||
width: preview_el.innerWidth() - sidebar_el.outerWidth() - 12 // 12px margin
|
|
||||||
}, dim = {}, margin = {}, size = {
|
}, dim = {}, margin = {}, size = {
|
||||||
old: {height: preview_swf.height(), width: preview_swf.width()},
|
old: {height: preview_swf.height(), width: preview_swf.width()},
|
||||||
next: {}
|
next: {}
|
||||||
|
@ -203,6 +206,12 @@ View.Fullscreen = function (wardrobe) {
|
||||||
|
|
||||||
win.resize(fit).load(fit);
|
win.resize(fit).load(fit);
|
||||||
fit();
|
fit();
|
||||||
|
|
||||||
|
$('#toggle-big-picture').click(function(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
$(document.body).toggleClass('big-picture');
|
||||||
|
fit();
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
View.Hash = function (wardrobe) {
|
View.Hash = function (wardrobe) {
|
||||||
|
|
|
@ -168,7 +168,7 @@ body.outfits-edit
|
||||||
button
|
button
|
||||||
font-size: 75%
|
font-size: 75%
|
||||||
width: 100%
|
width: 100%
|
||||||
#preview-mode-note, #report-broken-image
|
#toggle-big-picture, #preview-mode-note, #report-broken-image
|
||||||
display: block
|
display: block
|
||||||
font-size: 75%
|
font-size: 75%
|
||||||
margin-top: .5em
|
margin-top: .5em
|
||||||
|
@ -337,6 +337,9 @@ body.outfits-edit
|
||||||
.possible-error
|
.possible-error
|
||||||
@extend .error
|
@extend .error
|
||||||
display: none
|
display: none
|
||||||
|
&.big-picture
|
||||||
|
#preview-toolbar, #preview-sidebar, #preview-search
|
||||||
|
display: none
|
||||||
&.fullscreen
|
&.fullscreen
|
||||||
$fullscreen-search-border: 1px 1px 0
|
$fullscreen-search-border: 1px 1px 0
|
||||||
height: 100%
|
height: 100%
|
||||||
|
|
|
@ -34,6 +34,8 @@
|
||||||
%ul#preview-mode-toggle
|
%ul#preview-mode-toggle
|
||||||
%li#preview-mode-flash.active= t '.preview.mode.flash.name'
|
%li#preview-mode-flash.active= t '.preview.mode.flash.name'
|
||||||
%li#preview-mode-image= t '.preview.mode.image.name'
|
%li#preview-mode-image= t '.preview.mode.image.name'
|
||||||
|
= link_to t('.preview.big_picture'), 'javascript:void(0)',
|
||||||
|
id: 'toggle-big-picture'
|
||||||
= link_to t('.preview.mode.image.faq'), image_mode_path,
|
= link_to t('.preview.mode.image.faq'), image_mode_path,
|
||||||
:id => 'preview-mode-note', :target => '_blank'
|
:id => 'preview-mode-note', :target => '_blank'
|
||||||
= link_to t('.preview.mode.image.report_broken'), '#',
|
= link_to t('.preview.mode.image.report_broken'), '#',
|
||||||
|
|
|
@ -551,6 +551,7 @@ en:
|
||||||
preview:
|
preview:
|
||||||
requirements:
|
requirements:
|
||||||
Flash and Javascript (but not Java!) are required to preview outfits.
|
Flash and Javascript (but not Java!) are required to preview outfits.
|
||||||
|
big_picture: Big Picture
|
||||||
mode:
|
mode:
|
||||||
flash:
|
flash:
|
||||||
name: Flash
|
name: Flash
|
||||||
|
|
Loading…
Reference in a new issue