big picture mode

This commit is contained in:
Emi Matchu 2014-04-04 14:36:35 -05:00
parent 868bbcdd41
commit d25d2b3398
4 changed files with 20 additions and 5 deletions

View file

@ -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) {

View file

@ -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%

View file

@ -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'), '#',

View file

@ -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