Skip to content
This repository has been archived by the owner on Aug 27, 2022. It is now read-only.

Allow custom index, add new index layout by Mathias Fiege #159

Merged
merged 14 commits into from
Dec 21, 2020
Merged

Allow custom index, add new index layout by Mathias Fiege #159

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
82706c2
Initial new layout by Mathias Fiege
andi34 Dec 20, 2020
afdbd99
new index: add some border to buttons, add radial-gradiant color tran…
andi34 Dec 20, 2020
3a409f8
new index: don't conflict with rounded style
andi34 Dec 20, 2020
59c7881
Add option to switch between index styles
andi34 Dec 20, 2020
800b02c
new index: adjust & improve style handling, fix CUPS- and FS-Buttons
andi34 Dec 20, 2020
1f91ff4
new index: adjust fs-button, fix overlaying admin shortcut
andi34 Dec 20, 2020
0a3cd63
style (default): adjust Buzzer message size
andi34 Dec 20, 2020
c14e6f2
style (modern): adjust button size
andi34 Dec 20, 2020
6a71d2d
cleanup: remove unused new index
andi34 Dec 20, 2020
e9e7753
feature (style): allow to use a custom style
andi34 Dec 20, 2020
47dbcf5
template (modern): fix missing gallery button
andi34 Dec 20, 2020
3a2cc79
template (modern): adjust gallery and CUPS icons
andi34 Dec 20, 2020
8d5be2b
style: rename "default" to "classic", switch to "modern" style by def…
andi34 Dec 21, 2020
4636272
lang (en): fix typo
andi34 Dec 21, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,9 @@ package-lock.json
private/
resources/css/
resources/js/
src/sass/custom_style.scss
stats
template/custom.template.php
trash
vendor/simple-translator/
.sass-cache
Expand Down
6 changes: 6 additions & 0 deletions api/admin.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -97,6 +97,12 @@
$newConfig['previewCamTakesPic'] = false;
}

if ($newConfig['index_style'] === 'custom') {
if (!is_readable('../template/custom.template.php') || !is_readable('../resources/css/custom_style.css')) {
$newConfig['index_style'] = 'default';
}
}

if ($os === 'windows') {
$newConfig['remotebuzzer_enabled'] = false;
}
Expand Down
2 changes: 2 additions & 0 deletions config/config.inc.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,8 @@


// U S E R I N T E R F A C E
// possible index_style values: "classic", "modern", "custom"
$config['index_style'] = 'modern';
$config['font_size'] = '16px';
$config['background_image'] = null;
$config['background_admin'] = null;
Expand Down
66 changes: 2 additions & 64 deletions index.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@
<link rel="stylesheet" href="node_modules/font-awesome/css/font-awesome.css" />
<link rel="stylesheet" href="vendor/PhotoSwipe/dist/photoswipe.css" />
<link rel="stylesheet" href="vendor/PhotoSwipe/dist/default-skin/default-skin.css" />
<link rel="stylesheet" href="resources/css/style.css" />
<link rel="stylesheet" href="resources/css/<?php echo $config['index_style']; ?>_style.css" />
<?php if ($config['gallery_bottom_bar']): ?>
<link rel="stylesheet" href="resources/css/photoswipe-bottom.css" />
<?php endif; ?>
Expand All @@ -47,70 +47,8 @@
<body class="deselect">
<div id="wrapper">
<?php if( !$config['login_enabled'] || (isset($_SESSION['auth']) && $_SESSION['auth'] === true || !$config['protect_index'])): ?>
<!-- Start Page -->
<div class="stages" id="start">
<?php if ($config['show_gallery']): ?>
<a class="gallery-button btn" href="#"><i class="fa fa-th"></i> <span data-i18n="gallery"></span></a>
<?php endif; ?>

<div class="startInner">
<?php if ($config['is_event']): ?>
<div class="names">
<hr class="small" />
<hr>
<div>
<h1><?=$config['event']['textLeft']?>
<i class="fa <?=$config['event']['symbol']?>" aria-hidden="true"></i>
<?=$config['event']['textRight']?>
<br>
<?=$config['start_screen_title']?>
</h1>
<h2><?=$config['start_screen_subtitle']?></h2>
</div>
<hr>
<hr class="small" />
</div>
<?php else: ?>
<div class="names">
<hr class="small" />
<hr>
<div>
<h1><?=$config['start_screen_title']?></h1>
<h2><?=$config['start_screen_subtitle']?></h2>
</div>
<hr>
<hr class="small" />
</div>
<?php endif; ?>

<?php if ($config['force_buzzer']): ?>
<div id="useBuzzer">
<span data-i18n="use_button"></span>
</div>
<?php else: ?>
<?php if ($config['use_collage']): ?>
<a href="#" class="btn takeCollage"><i class="fa fa-th-large"></i> <span
data-i18n="takeCollage"></span></a>
<?php endif; ?>

<a href="#" class="btn takePic"><i class="fa fa-camera"></i> <span data-i18n="takePhoto"></span></a>
<?php endif; ?>
<button hidden class="closeGallery"></button>
<button hidden class="triggerPic"></button>
<button hidden class="triggerCollage"></button>
</div>

<?php if ($config['show_fork']): ?>
<a href="https://github.com/andi34/photobooth" class="github-fork-ribbon" data-ribbon="Fork me on GitHub">Fork me on GitHub</a>
<?php endif; ?>

<?php if($config['cups_button']): ?>
<a id="cups-button" class="btn cups-button" href="#" target="newwin"><span>CUPS</span></a>
<?php endif; ?>
<?php if($config['toggle_fs_button']): ?>
<a href="#" id="fs-button" class="btn btn--small fs-button"><i class="fa fa-arrows-alt"></i> <span data-i18n="toggleFullscreen"></span></a>
<?php endif; ?>
</div>
<?php include('template/' . $config['index_style'] . '.template.php'); ?>

<!-- image Filter Pane -->
<?php if ($config['use_filter']): ?>
Expand Down
11 changes: 11 additions & 0 deletions lib/configsetup.inc.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -436,6 +436,17 @@
]
],
'user_interface' => [
'index_style' => [
'type' => 'select',
'name' => 'index_style',
'placeholder' => $defaultConfig['index_style'],
'options' => [
'classic' => 'classic',
'modern' => 'modern',
'custom' => 'custom'
],
'value' => $config['index_style']
],
'font_size' => [
'type' => 'input',
'name' => 'font_size',
Expand Down
2 changes: 2 additions & 0 deletions resources/lang/en.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -282,6 +282,7 @@
"manual_user_interface_background_chroma": "CSS Style for background on chromakeying page.",
"manual_user_interface_background_image": "CSS Style for background on start-, login- and slideshow pages.",
"manual_user_interface_font_size": "Enter the default font size used for the Photobooth interface.",
"manual_user_interface_index_style": "Choose a start page styling. To use custom styling please create and use \"/template/custom.template.php\" and \"/resources/css/custom_style.css\", if one of these files is not readable we will fallback to default theme.",
"milliseconds": "milliseconds",
"newCollage": "New Collage",
"newPhoto": "New Picture",
Expand Down Expand Up @@ -415,5 +416,6 @@
"user_interface_colors_secondary": "Secondary color",
"user_interface_colors_start_font": "Start screen font color",
"user_interface_font_size": "Default font size",
"user_interface_index_style": "Styling",
"using_latest_version": "You are using the latest version of photobooth."
}
9 changes: 8 additions & 1 deletion src/sass/style.scss → src/sass/classic_style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -430,8 +430,15 @@ hr.small {
}

#useBuzzer {
font-size: 2em;
font-size: 1.75em;
margin-top: 1em;
margin-bottom: 0.5em;
}

@media (max-width: 1024px) {
#useBuzzer {
font-size: 1.25em;
}
}

@media (max-width: 767px) {
Expand Down
110 changes: 110 additions & 0 deletions src/sass/modern_style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,110 @@
@import 'classic_style';

html,
body {
height: 100%;
background: #ffffff;
margin: 0px;
}

.round-btn {
width: 5em;
height: 5em;
border-radius: 50%;
border: 2px solid $borderColor;
background: radial-gradient(grey, $mainColor, $hoverColor);
display: inline-block;
color: $buttonFontColor;
text-decoration: none;
margin: auto;
text-align: center;
font-size: 1em;
position: relative;
z-index: 10;
span {
display: none;
}
&:active,
&:focus,
&:hover {
background: $hoverColor;
}
.fa {
font-size: 1.5em;
margin: 0;
position: absolute;
top: 50%;
left: 50%;
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
}

.btn:active,
.btn:focus,
.btn:hover {
opacity: 0.6;
}

#start {
.startInner {
height: 100%;
width: 100%;
position: relative;
background: none;
.btn {
margin-top: 3px;
width: auto;
}
}

.fs-button {
position: relative;
top: auto;
bottom: 0px;
left: 0px;
}

.gallery-button {
position: relative;
top: auto;
bottom: 0px;
left: auto;
}
}

.divaussen {
height: 100%;
position: relative;
}

.divinnen {
float: right;
}

.divinnen2 {
position: absolute;
bottom: 0;
right: 0;
padding: 10px;
}

@media (orientation: portrait) {
.divinnen2 {
margin-left: auto;
margin-right: auto;
}
.round-btn {
width: 4em;
height: 4em;
}
}

.transparenz {
opacity: 0.4;
}

hr,
hr.small {
display: none;
}
11 changes: 11 additions & 0 deletions src/sass/rounded.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,13 @@
position: absolute;
left: 5px;
bottom: 5px;
&.round-btn {
position: fixed;
left: 0px;
top: 0px;
bottom: auto;
margin: 20px;
}
}
}

Expand Down Expand Up @@ -47,6 +54,10 @@
.fs-button {
margin-top: 5px;
margin-left: 5px;
&.round-btn {
margin-top: auto;
margin-left: auto;
}
}

.admin-panel,
Expand Down
64 changes: 64 additions & 0 deletions template/classic.template.php
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,64 @@
<!-- Start Page -->
<div class="stages" id="start">
<?php if ($config['show_gallery']): ?>
<a class="gallery-button btn" href="#"><i class="fa fa-th"></i> <span data-i18n="gallery"></span></a>
<?php endif; ?>

<div class="startInner">
<?php if ($config['is_event']): ?>
<div class="names">
<hr class="small" />
<hr>
<div>
<h1><?=$config['event']['textLeft']?>
<i class="fa <?=$config['event']['symbol']?>" aria-hidden="true"></i>
<?=$config['event']['textRight']?>
<br>
<?=$config['start_screen_title']?>
</h1>
<h2><?=$config['start_screen_subtitle']?></h2>
</div>
<hr>
<hr class="small" />
</div>
<?php else: ?>
<div class="names">
<hr class="small" />
<hr>
<div>
<h1><?=$config['start_screen_title']?></h1>
<h2><?=$config['start_screen_subtitle']?></h2>
</div>
<hr>
<hr class="small" />
</div>
<?php endif; ?>

<?php if ($config['force_buzzer']): ?>
<div id="useBuzzer">
<span data-i18n="use_button"></span>
</div>
<?php else: ?>
<?php if ($config['use_collage']): ?>
<a href="#" class="btn takeCollage"><i class="fa fa-th-large"></i> <span
data-i18n="takeCollage"></span></a>
<?php endif; ?>

<a href="#" class="btn takePic"><i class="fa fa-camera"></i> <span data-i18n="takePhoto"></span></a>
<?php endif; ?>
<button hidden class="closeGallery"></button>
<button hidden class="triggerPic"></button>
<button hidden class="triggerCollage"></button>
</div>

<?php if ($config['show_fork']): ?>
<a href="https://github.com/andi34/photobooth" class="github-fork-ribbon" data-ribbon="Fork me on GitHub">Fork me on GitHub</a>
<?php endif; ?>

<?php if($config['cups_button']): ?>
<a id="cups-button" class="btn cups-button" href="#" target="newwin"><span>CUPS</span></a>
<?php endif; ?>
<?php if($config['toggle_fs_button']): ?>
<a href="#" id="fs-button" class="btn btn--small fs-button"><i class="fa fa-arrows-alt"></i> <span data-i18n="toggleFullscreen"></span></a>
<?php endif; ?>
</div>
Loading