kalipso/racalmas
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rewrite image editor, make images editable at projects and studios

Browse Source
This commit is contained in:
Milan
2018-05-14 23:11:32 +02:00
parent b97fe15f7a
commit 41d209f05a
47 changed files with 1152 additions and 393 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
website/agenda/planung/audio_recordings.cgi
View File

@@ -298,6 +298,7 @@ sub showAudioRecordings {
event_id => $params->{event_id},
}
);
#print Dumper($audioRecordings);
for my $recording (@$audioRecordings) {
$recording->{size} =~ s/(\d)(\d\d\d)$/$1\.$2/g;
$recording->{size} =~ s/(\d)(\d\d\d\.\d\d\d)$/$1\.$2/g;
@@ -531,6 +532,7 @@ sub getEventDuration{
},
config => $config
};
$request->{params}->{checked}->{published}='all';
my $events = events::get( $config, $request );
if (scalar @$events == 0){
print STDERR "getEventDuration: no event found with event_id=$eventId\n";

8
website/agenda/planung/calendar.cgi
View File

@@ -399,7 +399,9 @@ sub showCalendar {
$date->{title} .= $format if defined $format;
$date->{title} .= '<b>library</b>: ' . ( $date->{writing_library} || '' ) . '<br>' if defined $date->{'writing_library'};
$date->{title} .= '<b>path</b>: ' . ( $date->{file} || '' ) . '<br>' if defined $date->{file};
$date->{title} .= '<b>updated_at</b>: ' . ( $date->{updated_at} || '' ) . '<br>' if defined $date->{updated_at};
$date->{title} .= '<b>modified_at</b>: ' . ( $date->{modified_at} || '' ) . '<br>' if defined $date->{modified_at};
#print STDERR Dumper($date) if $date->{file}=~/180503/;
#$date->{title}.= '<b>rms_image</b>: ' .($date->{rms_image}||'').'<br>' if defined $date->{rms_image};
$date->{rms_image} = uri_unescape( $date->{rms_image} ) if defined $date->{rms_image};
@@ -496,9 +498,9 @@ sub showCalendar {
for my $event (@$events){
next unless defined $event->{uploaded_at};
#print STDERR "uploadAt=$event->{uploaded_at}, playoutModified:$event->{playout_modified_at}, playoutUpdatedAt:$event->{playout_updated_at}\n";
print STDERR "uploadAt=$event->{uploaded_at}, playoutModified:$event->{playout_modified_at}, playoutUpdatedAt:$event->{playout_updated_at}\n";
next if (defined $event->{playout_updated_at}) && ( $event->{uploaded_at} lt $event->{playout_updated_at} );
#print STDERR Dumper($event);
print STDERR Dumper($event);
$event->{upload} ='pending' ;
#$event->{title}.='<br>pending';
}

26
website/agenda/planung/css/admin.css
View File

@@ -235,25 +235,26 @@ li.ui-menu-item{
color:green;
}
#content div.ok,
#content div.warn,
#content div.error{
font-weight:bold;
margin:0.5rem;
padding:1rem;
}
div.ok{
border:2px solid #aca;
background:#cfc;
background: linear-gradient(to right, #cfc, white);
opacity:0.8;
color:white;
background:#0c0;
}
div.warn{
border:2px solid #ff0;
background:#ff0;
background: linear-gradient(to right, #ff3, white);
opacity:0.8;
}
div.error{
border:2px solid #f99;
background:#fcc;
background: linear-gradient(to right, #fcc, white);
opacity:0.8;
color:white;
background:#d00;
}
#content button,
@@ -435,3 +436,6 @@ input[type='checkbox']{
clear:both;
}
#content input[readonly] {
border: 0;
}

53
website/agenda/planung/css/image_manager.css
View File

@@ -1,3 +1,7 @@
input.field{
width:30em;
}
#content div.image{
display:inline-block;
vertical-alignment:top;
@@ -11,11 +15,6 @@
vertical-align:bottom;
}
#content .image_detail{
width:150px;
height:150px;
}
#content .close{
text-align:right;
padding:0;
@@ -24,25 +23,51 @@
float:right;
}
form table{
width:100%;
height:100%;
#content div.image:hover{
cursor:pointer;
background-color:#39a1f4;
font-weight:bold;
opacity:0.9;
filter:contrast(120%);
box-shadow: 0 5px 11px 0 rgba(0,0,0,.18),0 4px 15px 0 rgba(0,0,0,.15);
}
input.field{
width:30em;
}
#content div.image .label{
text-align:center;
background-color:#333;
color:#fff;
vertical-align:bottom;
opacity:0.8;
opacity:0.9;
padding:6px;
width:138px;
margin:0;
}
#content div.image.active .label{
background-color:#39a1f4;
font-weight:bold;
}
#content div.image.active{
border:1px solid #39a1f4;
box-shadow: 0 5px 11px 0 rgba(0,0,0,.18),0 4px 15px 0 rgba(0,0,0,.15);
}
#imageEditor{
min-height:800px;
height:100%;
}
#content #imageEditor input,
#content #imageEditor select,
#content #imageEditor textarea{
margin-left:0;
margin-bottom:1rem;
padding:1rem;
}
#content label{
margin-top:1rem;
text-transform: uppercase;
color:#333;
}

5
website/agenda/planung/css/projects.css
View File

@@ -17,11 +17,6 @@
clear:both;
}
#content div.view img{
max-width:50px;
max-height:50px;
}
#content div.editor div.right{
float:right;
padding:0;

2
website/agenda/planung/image.cgi
View File

@@ -188,7 +188,7 @@ sub show_image {
if ( $params->{template} =~ /edit/ ) {
my $result = $results->[0];
$result->{missing_licence}=1 unless $result->{licence}=~/\S/;
$result->{missing_licence}=1 if (! defined $result->{licence} ) || ( $result->{licence}!~/\S/);
$results = [ $result ] ;
}

BIN
website/agenda/planung/image/chess.gif
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 161 B

After

Width:  |  Height:  |  Size: 103 B

7
website/agenda/planung/js/datetime.js
View File

@@ -135,6 +135,11 @@ function showYearPicker(selector, options){
function parseDateTime(datetime){
if (! datetime){
console.log("datetime.js parseDateTime() is undefined or null");
return null;
}
var dateTime = datetime.split(/[ T]+/);
var date = dateTime[0].split("-");
@@ -207,6 +212,8 @@ function addDays(datetime, days){
var weekdays=['Mo','Di','Mi','Do','Fr','Sa','So'];
function getWeekday(date){
if (!date) return '?';
if (loc['weekday_Mo']!=null) weekdays[0]=loc['weekday_Mo'];
if (loc['weekday_Tu']!=null) weekdays[1]=loc['weekday_Tu'];
if (loc['weekday_We']!=null) weekdays[2]=loc['weekday_We'];

23
website/agenda/planung/js/edit_image.js
View File

@@ -1,25 +1,6 @@
function editImage(filename){
$("#img_editor").load('image.cgi?show='+filename+'&template=image_edit.html',
function(){
$('#img_editor').dialog({
width:920,
height:330
});
}
);
}
function showImage(url){
$("#img_image").html('<img src="'+url+'" onclick="$(\'#img_image\').dialog(\'close\');return false;"/>');
$("#img_image").dialog({
width:640,
height:640
});
}
/*
function hideImageDetails(id,filename){
try{$('#img_editor').dialog('close');}catch(e){}
try{$('#img_image').dialog("close");}catch(e){}
$("#"+id).load('image.cgi?show='+filename+'&template=image_single.html');
return false;
@@ -61,4 +42,4 @@ function showImageUrl(id){
return false;
}
*/

32
website/agenda/planung/js/fileUploader.js
View File

@@ -115,18 +115,30 @@
var formId = "pxupload" + itr;
var iframeId = "pxupload" + itr + "_frame";
var inputId = "pxupload" + itr + "_input";
var contents =
'<form method="post" id="'+ formId +'" action="'+ px.formAction +'" enctype="multipart/form-data" target="'+ iframeId +'">'
+'<br/>'+loc['label_name']+'<br /><input name="name" />'
+'<br/>'+loc['label_description']+'<br /><textarea name="description" rows="3" cols="40"></textarea>'
;
var contents = ''
contents += '<form method="post" id="'+ formId +'" action="'+ px.formAction +'" enctype="multipart/form-data" target="'+ iframeId +'">'
if (studio_id != null) contents+='<input type="hidden" name="studio_id" value="'+studio_id+'">';
if (project_id != null) contents+='<input type="hidden" name="project_id" value="'+project_id+'">';
contents+=
'<input type="file" name="'+ config.inputName +'" id="'+ inputId +'" class="pxupload" size="'+ config.inputSize +'" onchange="$.fileUploader.change(this);" />'
+'<input name="action" value="upload" type="hidden"/>'
+'</form>'
+'<iframe id="'+ iframeId +'" name="'+ iframeId +'" src="about:blank" style="display:none"></iframe>';
contents += '<label>'+loc['label_name']+'</label><br>'
contents += '<input name="name" /><br />'
contents += '<label>'+loc['label_description']+'</label><br>'
contents += '<textarea name="description" rows="3" cols="40"></textarea><br />'
contents += '<label>'+loc['label_author']+'/'+loc['label_licence']+'</label><br>'
contents += '<input name="licence" /><br />'
contents += '<label>'+loc['label_public']+'</label><br>'
contents += '<input type="checkbox" name="public"><br />'
contents += '<label>'+loc['label_file']+'</label><br>'
contents += '<input type="file" name="'+ config.inputName +'" id="'+ inputId +'" class="pxupload" size="'+ config.inputSize +'" onchange="$.fileUploader.change(this);" />'
contents += '<input name="action" value="upload" type="hidden"/>'
contents += '</form>'
contents += '<iframe id="'+ iframeId +'" name="'+ iframeId +'" src="about:blank" style="display:none"></iframe>';
$("#pxupload_form").append( contents );
},

235
website/agenda/planung/js/image.js
View File

@@ -2,70 +2,44 @@
var windowOffsetX=32;
var windowOffsetY=32;
// choose action depending on selected tab
function imageAction(filename){
if(selectedImageTab=='select'){
selectThisImage(filename);
return false;
}
if(selectedImageTab=='edit'){
editImage(filename);
return false;
}
}
// get current selected tab by tabs-id
function getSelectedTab(id){
var selector='#'+id+" li.ui-tabs-active a";
var tabValue=$(selector).attr("value");
var selector = '#'+id+" li.ui-tabs-active a";
var tabValue = $(selector).attr("value");
return tabValue;
}
//select image load into selectImage box
function selectImage(project_id, studio_id, id, value, imageUrl, series_id){
selectImageId=id;
value=value.replace(/[^a-zA-Z0-9]/g,'%');
var url="image.cgi?search="+encodeURIComponent(value)+'&project_id='+project_id+'&studio_id='+studio_id;
if((series_id!=null)&&(series_id != '')){
url+='&series_id='+series_id;
function setActiveImage(elem){
$('div.image').removeClass("active");
if (elem){
$(elem).addClass("active");
}else{
$('div.image').first().addClass("active");
}
}
if(imageUrl!=null){
var filename=imageUrl.split('%2F').pop();
url+='&filename='+filename;
}
var x=$(window).width() - windowOffsetX;
var y=$(window).height() - windowOffsetY;
hideContent();
$('#selectImage').load(url);
$('#selectImage').dialog({
appendTo: "#content",
title:"select image",
width:x,
height:y,
close: function( event, ui ) {
showContent();
}
});
return false;
// open dialog to show or edit image properties
function updateImageEditor(filename, elem){
var url='image.cgi?show='+filename+'&template=image_edit.html&project_id='+project_id+'&studio_id='+studio_id
console.log("updateImageEditor "+url);
$("#img_editor").load(
url,
function(){
setActiveImage(elem);
}
);
}
// set editor image and image url to selected image
function selectThisImage(filename){
$('#'+selectImageId).val(filename);
var url = 'showImage.cgi?project_id='+project_id+'&studio_id='+studio_id+'&filename=' + filename;
console.log(url);
console.log("select image "+url);
$('#imagePreview').prop('src',url);
try{
$('#selectImage').dialog('close');
}catch(e){
$('#selectImage').parent().remove();
$('html').append('<div id="selectImage"></div>');
};
showContent();
return false;
}
@@ -77,15 +51,18 @@ function searchImage(){
value=value.replace(/[^a-zA-Z0-9]/g,'%');
if (value!=null) url+='&search='+encodeURIComponent(value)
value=$('#image_manager input[name=filename]').val();
if (value!=null) url+='&filename='+encodeURIComponent(value);
var filename=$('#image_manager input[name=filename]').val();
var filename = filename.replace(/^.*[\\\/]/, '')
if (filename!=null) url+='&filename='+encodeURIComponent(filename);
if(selectedImageTab=='edit'){
url+='#image-tabs-edit'
if(selectedImageTab!='upload'){
url+='#image-tabs-select'
}
updateContainer('selectImage',url, function(){
console.log("searchImage(), load url="+url)
updateContainer('selectImage', url, function(){
$( "#image-tabs" ).tabs();
$( "#image-tabs" ).tabs( "option", "active", 1 );
if (filename!=null) updateImageEditor(encodeURIComponent(filename));
});
return false;
}
@@ -97,92 +74,62 @@ function hideContent(){
'width': $(window).width() - windowOffsetX,
'height': $(window).height() - windowOffsetY,
'left': windowOffsetX/2+'px',
'top': windowOffsetY/2+'px'
'top': windowOffsetY/2+'px',
modal: true
});
}).resize();
/*
$('.editor').each(
function(){
$(this).hide();
}
);
*/
return false;
}
function showContent(){
/*
$('.editor').each(
function(){
$(this).show();
}
);
*/
$('#selectImage').remove();
return false;
}
// open dialog to edit image properties
function editImage(filename){
$("#img_editor").load(
'image.cgi?show='+filename+'&template=image_edit.html&project_id='+project_id+'&studio_id='+studio_id,
function(){
var x=$(window).width() - windowOffsetX;
var y=$(window).height() - windowOffsetY;
hideContent();
$('#img_editor').dialog({
appendTo: "#content",
width:x,
height:y,
close: function( event, ui ) {
showContent();
}
});
}
);
}
// open dialog to show image preview
function showImage(url){
$("#img_image").html('<img src="'+url+'" onclick="$(\'#img_image\').dialog(\'close\');return false;"/>');
var x=$(window).width() - windowOffsetX;
var y=$(window).height() - windowOffsetY;
hideContent();
$("#img_image").dialog({
appendTo: "#content",
width:x,
height:y,
close: function( event, ui ) {
showContent();
}
});
}
// save image
function saveImage(id, filename) {
$('#imageEditor #status').html('');
console.log("save image "+id);
var url='image.cgi?save_image='+filename+'&project_id='+project_id+'&studio_id='+studio_id;
//remove error field
if($('#image-tabs .error').length>0){
$('#image-tabs div.error').remove();
}
if (url!='') $.post(
$.post(
url,
$("#save_img_"+id).serialize(),
function(data){
var errorFound=0;
var lines=data.split(/\n/);
for (index in lines){
var line=lines[index];
if(contains(line,'ERROR:')){
//add error field
if( $('#image-tabs .error').length==0 ){
$('#image-tabs').append('<div class="error"></div>');
if( $('#imageEditor #status .error').length==0 ){
$('#imageEditor #status').append('<div class="error"></div>');
}
$('#image-tabs div.error').append(line);
$('#imageEditor #status div.error').append(line);
errorFound++;
}
};
//console.log(data);
console.log("save "+id);
if (errorFound==0){
$('#imageEditor #status').append('<div class="ok">saved</div>');
}
hideImageDetails('img_'+id, filename);
}
);
@@ -191,7 +138,11 @@ function saveImage(id, filename) {
// delete image
function askDeleteImage(id, filename) {
commitAction("delete image", function(){ deleteImage(id, filename) } );
commitAction("delete image",
function(){
deleteImage(id, filename)
}
);
}
// delete image
@@ -204,28 +155,12 @@ function deleteImage(id, filename) {
}
// close all open dialogs
function hideImageDetails(id,filename){
function hideImageDetails(id, filename){
try{$('#img_editor').dialog('close');}catch(e){}
try{$('#img_image').dialog("close");}catch(e){}
$("#"+id).load('image.cgi?show='+filename+'&template=image_single.html&project_id='+project_id+'&studio_id='+studio_id);
return false;
}
// show image url
function showImageUrl(id){
var el=document.getElementById(id);
var input_id=id+'_input';
var text='<input id="'+input_id+'" value="{{'+id+'|title}}" title="3fach-Klick zum Markieren!">';
if (el.innerHTML==text){
el.innerHTML='';
}else{
el.innerHTML=text;
var input=document.getElementById(input_id);
input.focus();
input.select();
input.createTextRange().execCommand("Copy");
}
var url='image.cgi?show='+filename+'&template=image_single.html&project_id='+project_id+'&studio_id='+studio_id;
console.log("hideImageDetails, load url="+url)
$("#"+id).load(url);
return false;
}
@@ -254,3 +189,49 @@ function decreaseImageSize(){
}
//select image load into selectImage box
function selectImage(project_id, studio_id, imageId, searchValue, imageUrl, series_id){
selectImageId = imageId;
searchValue = searchValue.replace(/[^a-zA-Z0-9]/g,'%');
var url="image.cgi?search="+encodeURIComponent(searchValue)+'&project_id='+project_id+'&studio_id='+studio_id;
if( (series_id!=null) && (series_id != '') ){
url+='&series_id='+series_id;
}
if(imageUrl!=null){
var filename=imageUrl.split('%2F').pop();
url+='&filename='+filename;
}
var x=$(window).width() - windowOffsetX;
var y=$(window).height() - windowOffsetY;
console.log("selectImage(), load url="+url)
$('#selectImage').remove();
$('body').append('<div id="selectImage"></div>');
$('#selectImage').load(
url,
function(){
hideContent();
$('#selectImage').dialog({
appendTo: "#content",
title:"select image",
width:x,
height:y,
close: function( event, ui ) {
showContent();
$('.ui-dialog').remove();
}
});
updateImageEditor(filename);
}
);
return false;
}

6
website/agenda/planung/pot/de/image.po
View File

@@ -61,6 +61,12 @@ msgstr "Lizenz"
msgid "label_public"
msgstr "veröffentlicht"
msgid "label_file"
msgstr "Datei"
msgid "label_licence_missing"
msgstr "bitte eintragen"
msgid "select_image"
msgstr "Dieses Bild zuweisen"

5
website/agenda/planung/pot/de/projects.po
View File

@@ -25,6 +25,9 @@ msgstr "Studio entfernen"
msgid "button_edit"
msgstr "Bearbeiten"
msgid "button_change"
msgstr "Ändern"
msgid "button_create"
msgstr "Anlegen"
@@ -44,7 +47,7 @@ msgid "label_assign_studio"
msgstr "Studio hinzufügen"
msgid "label_name"
msgstr "Name"
msgstr "ID"
msgid "label_title"
msgstr "Titel"

3
website/agenda/planung/pot/de/studios.po
View File

@@ -34,6 +34,9 @@ msgstr "Beschreibung"
msgid "label_location"
msgstr "ID"
msgid "label_image"
msgstr "Logo"
msgid "label_stream"
msgstr "Stream-URL"

6
website/agenda/planung/pot/en/image.po
View File

@@ -61,6 +61,12 @@ msgstr "author"
msgid "label_public"
msgstr "published"
msgid "label_file"
msgstr "file"
msgid "label_licence_missing"
msgstr "please fill in"
msgid "select_image"
msgstr "select this image"

5
website/agenda/planung/pot/en/projects.po
View File

@@ -43,8 +43,11 @@ msgstr "assign studio"
msgid "button_edit"
msgstr "edit"
msgid "button_change"
msgstr "change"
msgid "button_show_changes"
msgstr "changes"
msgstr "show changes"
msgid "label_name"
msgstr "name"

3
website/agenda/planung/pot/en/studios.po
View File

@@ -34,6 +34,9 @@ msgstr "description"
msgid "label_location"
msgstr "id"
msgid "label_image"
msgstr "image"
msgid "label_stream"
msgstr "stream"

1
website/agenda/planung/series.cgi
View File

@@ -1091,6 +1091,7 @@ sub show_series {
series_id => $serie->{series_id}
}
);
uac::print_warn( "There is no user assigned, yet. Please assign a user!" ) if scalar @{$serie->{series_users}} ==0;
#add events
$serie->{events} = series::get_events(

2
website/agenda/planung/studios.cgi
View File

@@ -222,7 +222,7 @@ sub check_params {
}
}
for my $param ( 'name', 'description', 'location', 'stream', 'google_calendar' ) {
for my $param ( 'name', 'description', 'location', 'stream', 'google_calendar', 'image' ) {
if ( defined $params->{$param} ) {
$checked->{$param} = $params->{$param};
}

14
website/agenda/planung/templates/edit_event.html
View File

@@ -43,15 +43,22 @@
);
}
});
<TMPL_IF edit_lock>
$( "#edit_event input" ).prop( "disabled", true );
$( "#edit_event textarea" ).prop( "disabled", true );
$( "#edit_event select" ).prop( "disabled", true );
</TMPL_IF>
}
);
</script>
</head>
<body>
<TMPL_IF edit_lock>
<div class="ok head"><TMPL_VAR loc.label_edit_lock></div>
<div class="warn head"><TMPL_VAR loc.label_edit_lock></div>
</TMPL_IF>
<!-- edit -->
@@ -208,6 +215,7 @@
</TMPL_UNLESS>
<!-- header buttons -->
<TMPL_UNLESS edit_lock>
<div class="buttons" style="text-align:center;clear:both">
<TMPL_IF show_new_event_from_schedule>
<TMPL_IF .allow.create_event_from_schedule>
@@ -236,7 +244,7 @@
</TMPL_UNLESS>
</TMPL_IF>
</div>
</TMPL_UNLESS>
<!-- download output -->
<TMPL_IF download>
<textarea type="hidden" name="event_id" ><TMPL_VAR download></textarea>
@@ -490,6 +498,7 @@
</table>
<!-- buttons -->
<TMPL_UNLESS edit_lock>
<table>
<tr>
<td colspan="2">
@@ -524,6 +533,7 @@
</td>
</tr>
</table>
</TMPL_UNLESS>
</form>
</div>

2
website/agenda/planung/templates/edit_series.html
View File

@@ -138,7 +138,7 @@
>
<img id="imagePreview" src="showImage.cgi?project_id=<TMPL_VAR .project_id>&studioId=<TMPL_VAR .studio_id>&filename=<TMPL_VAR image>&type=icon">
</button>
<input id="image_<TMPL_VAR .series_id>" name="image" value="<TMPL_VAR image>" class="image" placeholder="<TMPL_VAR .loc.template_image>">
<input id="image_<TMPL_VAR .series_id>" name="image" value="<TMPL_VAR image>" class="image" placeholder="<TMPL_VAR .loc.template_image>" readonly="readonly">
</TMPL_IF>
</td></tr>
<tr> <td class="label"><TMPL_VAR .loc.template_duration></td>

106
website/agenda/planung/templates/image.html
View File

@@ -1,6 +1,21 @@
<!--
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/jquery-ui.min.js" type="text/javascript"></script>
<script src="js/admin.js" type="text/javascript"></script>
<script src="js/history.js" type="text/javascript"></script>
<script src="js/localization.js" type="text/javascript"></script>
<script src="js/localization-datetime.js" type="text/javascript"></script>
<script src="js/event.js" type="text/javascript"></script>
<script src="js/datetime.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/admin.css" type="text/css" />
<link rel="stylesheet" href="css/jquery-ui.min.css" type="text/css" />
<link rel="stylesheet" href="css/series.css" type="text/css" />
-->
<link type="text/css" href="css/image_manager.css" rel="stylesheet"/>
<link type="text/css" href="css/fileUploader.css" rel="stylesheet"/>
<script src="js/fileUploader.js" type="text/javascript"></script>
<script src="js/image.js" type="text/javascript"></script>
<TMPL_IF .allow.create_image>
@@ -23,15 +38,16 @@
selectedImageTab = getSelectedTab('image-tabs');
<TMPL_IF .allow.create_image>
if(selectedImageTab=="upload"){
initUploadDialog();
$('#imageList').hide();
return
}else{
closeImageUpload();
$('#imageList').show();
}
if(selectedImageTab=="upload"){
initUploadDialog();
$('#imageList').hide();
return;
}
</TMPL_IF>
// show images by default
closeImageUpload();
$('#imageList').show();
}
});
// get initially selected tab
@@ -45,41 +61,38 @@
<div id="image-tabs">
<ul>
<li><a href="#image-tabs-select" value="select"><TMPL_VAR .loc.tab_select></a></li>
<TMPL_IF .allow.update_image>
<li><a href="#image-tabs-edit" value="edit"><TMPL_VAR .loc.tab_edit></a></li>
</TMPL_IF>
<li>
<a href="#image-tabs-select" value="select">
<TMPL_VAR .loc.tab_select>
<TMPL_IF .allow.update_image> / <TMPL_VAR .loc.tab_edit> </TMPL_IF>
</a>
</li>
<TMPL_IF .allow.create_image>
<li><a href="#image-tabs-upload" value="upload"><TMPL_VAR .loc.tab_upload></a></li>
<li>
<a href="#image-tabs-upload" value="upload"><TMPL_VAR .loc.tab_upload></a>
</li>
</TMPL_IF>
</ul>
<!-- select image -->
<div id="image-tabs-select">
</div>
<!-- select image -->
<div id="image-tabs-select">
</div>
<!-- edit image -->
<TMPL_IF .allow.update_image>
<div id="image-tabs-edit">
</div>
</TMPL_IF>
<!-- upload images -->
<TMPL_IF .allow.create_image>
<div id="image-tabs-upload">
<div id="img_upload">
<div id="img_upload_result"></div>
<form id="image_upload" method="post" action="imageUpload.cgi" enctype="multipart/form-data">
<input type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR .studio_id>">
<input id="uploader" type="file" name="image" value="<TMPL_VAR image escape=0>" accept="text/*" maxlength="1000000" size="10"/> </td>
<button type="submit" name="action" value="upload" id="pxUpload" ><TMPL_VAR .loc.button_upload></button>
</form>
</div>
</div>
</TMPL_IF>
<!-- tabs -->
<!-- upload images -->
<TMPL_IF .allow.create_image>
<div id="image-tabs-upload">
<div id="img_upload">
<div id="img_upload_result"></div>
<form id="image_upload" method="post" action="imageUpload.cgi" enctype="multipart/form-data">
<input type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR .studio_id>">
<input id="uploader" type="file" name="image" value="<TMPL_VAR image escape=0>" accept="text/*" maxlength="1000000" size="10"/> </td>
<button type="submit" name="action" value="upload" id="pxUpload" ><TMPL_VAR .loc.button_upload></button>
</form>
</div>
</div>
</TMPL_IF>
</div>
<div id="imageList">
@@ -87,6 +100,7 @@
<button onclick="decreaseImageSize();return false;" title="<TMPL_VAR .loc.button_zoom_out>">-</button>
<button onclick="increaseImageSize();return false;" title="<TMPL_VAR .loc.button_zoom_in>">+</button>
</div>
<form id="image_manager" action="image.cgi">
<input name="search" value="<TMPL_VAR search escape=0>" style="width:20em;">
<input type="hidden" name="filename" value="<TMPL_VAR filename escape=0>">
@@ -94,26 +108,28 @@
<input type="hidden" name="studio_id" value="<TMPL_VAR .studio_id>">
<button onclick="searchImage();return false;"><TMPL_VAR .loc.button_search></button>
</form>
<div style="clear:both;">
<TMPL_VAR count> <TMPL_VAR .loc.label_search_hits><br />
<div class="images">
<TMPL_VAR count> <TMPL_VAR .loc.label_search_hits><br />
<div style="clear:both;display: flex; flex-direction: row;">
<div class="images" style="height:1000px;overflow-y:scroll">
<TMPL_LOOP images>
<div class="image"
id="img_<TMPL_VAR id>"
style="background-image:url('showImage.cgi?project_id=<TMPL_VAR project_id>&studioId=<TMPL_VAR .studio_id>&type=icon&filename=<TMPL_VAR filename>')"
title="<TMPL_VAR description>"
onclick="imageAction('<TMPL_VAR filename>');return false;"
onclick="updateImageEditor('<TMPL_VAR filename>', this);return false;"
>
<div class="label"><TMPL_VAR name></div>
</div>
</TMPL_LOOP>
</div>
<div id="img_editor" >
</div>
</div>
</div>
<div id="img_editor" style="display:none"></div>
<div id="img_image" style="display:none"></div>
</TMPL_IF>
<!-- content -->
</div>

8
website/agenda/planung/templates/imageUpload.html
View File

@@ -30,6 +30,14 @@
<td>Beschreibung: </td>
<td><textarea name="description" cols="50" rows=5><TMPL_VAR description escape=0></textarea></td>
</tr>
<tr>
<td><label><TMPL_VAR .loc.label_author>/<TMPL_VAR .loc.label_licence></label></td>
<td><input name="licence" value="<TMPL_VAR licence>" placeholder="<TMPL_VAR .loc.label_licence_missing>"/></td>
</tr>
<tr>
<td><label><TMPL_VAR .loc.label_public></label></td>
<td><input type="checkbox" name="public"/></td>
</tr>
<tr>
<td colspan="2" style="text-align:right">
<input type="submit" name="action" value="Hochladen!" />

104
website/agenda/planung/templates/image_edit.html
View File

@@ -1,9 +1,10 @@
<html>
<head>
<link type="text/css" href="css/admin.css" rel="stylesheet"/>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script>
<link type="text/css" href="css/admin.css" rel="stylesheet"/>
<link type="text/css" href="css/image_manager.css" rel="stylesheet"/>
</head>
<script>
function updateCheckBox(selector, value){
$(selector).attr('value', value)
if (value==1){
@@ -40,66 +41,51 @@ $(document).ready(
);
</script>
</head>
<body>
<TMPL_LOOP images>
<form id="save_img_<TMPL_VAR id>"
method="post"
action="image.cgi"
onsubmit="saveImage('<TMPL_VAR id>','<TMPL_VAR filename>');return false;"
style="float:left"
>
<input type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR .studio_id>">
<TMPL_IF filename>
<div id="imageEditor">
<button onclick="selectThisImage('<TMPL_VAR filename escape=0>'); return false"><TMPL_VAR .loc.select_image></button/>
<hr>
<table>
<tr>
<td><TMPL_VAR .loc.label_name></td>
<td><input value="<TMPL_VAR name escape=0>" name="update_name" class="field"></td>
<td rowspan="99"><a href="<TMPL_VAR image_url>" onclick="showImage('<TMPL_VAR image_url>');return false;"
><img src="showImage.cgi?project_id=<TMPL_VAR project_id>&studioId=<TMPL_VAR .studio_id>&type=icon&filename=<TMPL_VAR filename>" /></a></td>
</tr>
<tr>
<td><TMPL_VAR .loc.label_description></td>
<td><textarea name="update_description" cols="50" rows=5><TMPL_VAR description escape=0></textarea></td>
</tr>
<tr>
<td><TMPL_VAR .loc.label_created_at></td>
<td><TMPL_VAR created_at> <TMPL_VAR .loc.label_created_by> <TMPL_VAR created_by></td>
</tr>
<tr>
<td><TMPL_VAR .loc.label_modified_at></td>
<td><TMPL_VAR modified_at> <TMPL_VAR .loc.label_modified_by> <TMPL_VAR modified_by></td>
</tr>
<tr>
<td><TMPL_VAR .loc.label_editor_link></td>
<td><input value="{{<TMPL_VAR filename escape=0>|<TMPL_VAR name>}}" class="field" /></td>
</tr>
<tr>
<td><TMPL_VAR .loc.label_author>/<TMPL_VAR .loc.label_licence></td>
<td><input name="licence" value="<TMPL_VAR licence>" class="field<TMPL_IF missing_licence> error</TMPL_IF>" placeholder="<TMPL_VAR .loc.label_licence_missing>"/></td>
</tr>
<tr>
<td><TMPL_VAR .loc.label_public></td>
<td><input type="checkbox" name="public" <TMPL_IF public>checked="checked" value="1"<TMPL_ELSE>value="0"</TMPL_IF> /></td>
</tr>
<tr>
<td />
<td>
<TMPL_IF name="update_image">
<input type="hidden" name="save_image" value="<TMPL_VAR filename escape=0>" />
<button onclick="this.submit"><TMPL_VAR .loc.button_save></button/>
</TMPL_IF>
<form id="save_img_<TMPL_VAR id>"
method="post"
action="image.cgi"
onsubmit="saveImage('<TMPL_VAR id>','<TMPL_VAR filename>');return false;"
>
<TMPL_IF name="delete_image">
<button onclick="askDeleteImage('img_<TMPL_VAR id escape=0>','<TMPL_VAR filename escape=0>');return false;"><TMPL_VAR .loc.button_delete></button>
</TMPL_IF>
</td>
</tr>
</table>
<input type="hidden" name="project_id" value="<TMPL_VAR .project_id>">
<input type="hidden" name="studio_id" value="<TMPL_VAR .studio_id>">
</form>
<label><TMPL_VAR .loc.label_name></label><br>
<input value="<TMPL_VAR name escape=0>" name="update_name" class="field" placeholder="<TMPL_VAR .loc.label_name>"><br>
<label><TMPL_VAR .loc.label_description></label><br>
<textarea class="field" name="update_description" cols="50" rows=5 placeholder="<TMPL_VAR .loc.label_description>"><TMPL_VAR description escape=0></textarea><br>
<label><TMPL_VAR .loc.label_author>/<TMPL_VAR .loc.label_licence></label><br>
<input name="licence" value="<TMPL_VAR licence>" class="field<TMPL_IF missing_licence> error</TMPL_IF>" placeholder="<TMPL_VAR .loc.label_licence_missing>"/><br>
<label><TMPL_VAR .loc.label_public></label>
<input type="checkbox" name="public" <TMPL_IF public>checked="checked" value="1"<TMPL_ELSE>value="0"</TMPL_IF> /><br>
<TMPL_IF name="update_image">
<input type="hidden" name="save_image" value="<TMPL_VAR filename escape=0>" />
<button onclick="this.submit"><TMPL_VAR .loc.button_save></button/>
</TMPL_IF>
<TMPL_IF name="delete_image">
<button onclick="askDeleteImage('img_<TMPL_VAR id escape=0>','<TMPL_VAR filename escape=0>');return false;"><TMPL_VAR .loc.button_delete></button>
</TMPL_IF>
<div id="status" ></div>
<TMPL_VAR .loc.label_created_at> <TMPL_VAR created_at> <TMPL_VAR .loc.label_created_by> <TMPL_VAR created_by><br>
<TMPL_VAR .loc.label_modified_at> <TMPL_VAR modified_at> <TMPL_VAR .loc.label_modified_by> <TMPL_VAR modified_by><br>
<TMPL_VAR .loc.label_link>: {{<TMPL_VAR filename escape=0>|<TMPL_VAR name>}}<br>
</form>
</div>
</TMPL_IF>
</TMPL_LOOP>
</body>

31
website/agenda/planung/templates/projects.html
View File

@@ -1,5 +1,7 @@
<link href="css/jquery-ui-timepicker.css" type="text/css" rel="stylesheet" />
<script src="js/jquery-ui-timepicker.js" type="text/javascript"></script>
<link href="css/jquery-ui-timepicker.css" type="text/css" rel="stylesheet" />
<script src="js/jquery-ui-timepicker.js" type="text/javascript"></script>
<script src="js/image.js" type="text/javascript"></script>
<link href="css/image-manager.css" type="text/css" rel="stylesheet" />
<script type="text/javascript">
var region='<TMPL_VAR loc.region>';
@@ -21,7 +23,6 @@
<tr><td class="label"><TMPL_VAR .loc.label_subtitle></td> <td><input name="subtitle"> </td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_start_date></td> <td><input name="start_date" class="date"> </td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_end_date></td> <td><input name="end_date" class="date"> </td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_image></td> <td><input name="image"> </td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_email></td> <td><input name="email"> </td></tr>
<tr>
<td></td>
@@ -42,7 +43,7 @@
<div class="card project">
<!-- buttons -->
<div>
<div class="title"><TMPL_VAR name></div>
<div class="title"><TMPL_VAR title></div>
<TMPL_IF .allow.update_project>
<button onclick="edit_project('<TMPL_VAR project_id>')"
><TMPL_VAR .loc.button_edit></button>
@@ -52,12 +53,11 @@
<!-- view project -->
<div id="view_<TMPL_VAR project_id>" class="view">
<table>
<tr><td class="label"><TMPL_VAR .loc.label_image></td> <td colspan="2"><img src="showImage.cgi?project_id=<TMPL_VAR .project_id>&studioId=<TMPL_VAR .studio_id>&filename=<TMPL_VAR image>&type=thumbs"> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_name></td> <td colspan="2"><TMPL_VAR name> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_title></td> <td colspan="2"><TMPL_VAR title> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_subtitle></td> <td colspan="2"><TMPL_VAR subtitle> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_start_date></td> <td colspan="2"><TMPL_VAR start_date> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_end_date></td> <td colspan="2"><TMPL_VAR end_date> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_image></td> <td colspan="2"><img src="<TMPL_VAR image>"> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_email></td> <td colspan="2"><TMPL_VAR email> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_studios></td>
<td>
@@ -68,7 +68,7 @@
<TMPL_IF .allow.update_project>
<button onclick="edit_project_assignments('<TMPL_VAR project_id>')"
style="float:left"
><TMPL_VAR .loc.button_edit></button>
><TMPL_VAR .loc.button_change></button>
</TMPL_IF>
</td></tr>
@@ -87,13 +87,24 @@
<input type="hidden" name="studio_id" value="<TMPL_VAR .studio_id>">
<input type="hidden" name="pid" value="<TMPL_VAR pid>">
<table>
<tr><td class="label"><TMPL_VAR .loc.label_name></td> <td><input name="name" value="<TMPL_VAR name>"></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_title></td> <td><input name="title" value="<TMPL_VAR title>"></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_name></td> <td><input name="name" value="<TMPL_VAR name>"></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_subtitle></td> <td><input name="subtitle" value="<TMPL_VAR subtitle>"></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_start_date></td><td><input class="date" name="start_date" value="<TMPL_VAR start_date>"></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_end_date></td> <td><input class="date" name="end_date" value="<TMPL_VAR end_date>"></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_image></td> <td><input name="image" value="<TMPL_VAR image>"></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_email></td> <td><input name="email" value="<TMPL_VAR email>"></td></tr>
<tr><td class="label">
<TMPL_VAR .loc.label_image></td>
<td>
<button onclick="selectImage('<TMPL_VAR .project_id>','<TMPL_VAR .studio_id>','image_<TMPL_VAR pid>','<TMPL_VAR series_name escape=HTML>','<TMPL_VAR image escape=URL>','<TMPL_VAR series_id>');return false;"
style="padding:0;float:left"
>
<img id="imagePreview" src="showImage.cgi?project_id=<TMPL_VAR .project_id>&studioId=<TMPL_VAR .studio_id>&filename=<TMPL_VAR image>&type=thumbs">
</button>
<!-- <input name="image">-->
<input id="image_<TMPL_VAR pid>" name="image" value="<TMPL_VAR image>" class="image" placeholder="<TMPL_VAR .loc.template_image>">
</td>
</tr>
<tr>
<td></td>
<td class="buttons">
@@ -166,5 +177,7 @@
</TMPL_LOOP>
</div>
<div id="selectImage"> </div>
</body>
</html>

18
website/agenda/planung/templates/studios.html
View File

@@ -1,3 +1,6 @@
<script src="js/image.js" type="text/javascript"></script>
<link href="css/image-manager.css" type="text/css" rel="stylesheet" />
<h2><TMPL_VAR .loc.title></h2>
<TMPL_IF .allow.update_studio>
@@ -12,7 +15,6 @@
<tr><td class="label"><TMPL_VAR .loc.label_description></td> <td><input name="description" ></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_location></td> <td><input name="location" ></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_stream></td> <td><input name="stream" ></td></tr>
<!-- <tr><td class="label"><TMPL_VAR .loc.label_google_calendar></td> <td><input name="google_calendar" ></td></tr> -->
<tr>
<td></td>
<td class="buttons">
@@ -45,11 +47,11 @@
<!-- view studio -->
<div id="view_<TMPL_VAR id>" class="view">
<table>
<tr><td class="label"><TMPL_VAR .loc.label_image></td> <td><img src="showImage.cgi?project_id=<TMPL_VAR .project_id>&studioId=<TMPL_VAR .studio_id>&filename=<TMPL_VAR image>&type=thumbs"> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_name></td> <td><TMPL_VAR name> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_description></td> <td><TMPL_VAR description> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_location></td> <td><TMPL_VAR location> &nbsp;</td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_stream></td> <td><TMPL_VAR stream> &nbsp;</td></tr>
<!--<tr><td class="label"><TMPL_VAR .loc.label_google_calendar></td> <td><TMPL_VAR google_calendar> &nbsp;</td></tr>-->
</table>
</div>
@@ -65,7 +67,17 @@
<tr><td class="label"><TMPL_VAR .loc.label_description></td> <td><input name="description" value="<TMPL_VAR description>"></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_location></td> <td><input name="location" value="<TMPL_VAR location>"></td></tr>
<tr><td class="label"><TMPL_VAR .loc.label_stream></td> <td><input name="stream" value="<TMPL_VAR stream>"></td></tr>
<!--<tr><td class="label"><TMPL_VAR .loc.label_>google calendar</td> <td><input name="google_calendar" value="<TMPL_VAR google_calendar>"></td></tr> -->
<tr><td class="label">
<TMPL_VAR .loc.label_image></td>
<td>
<button onclick="selectImage('<TMPL_VAR .project_id>','<TMPL_VAR .studio_id>','image_<TMPL_VAR id>','<TMPL_VAR series_name escape=HTML>','<TMPL_VAR image escape=URL>','<TMPL_VAR series_id>');return false;"
style="padding:0;float:left"
>
<img id="imagePreview" src="showImage.cgi?project_id=<TMPL_VAR .project_id>&studioId=<TMPL_VAR .studio_id>&filename=<TMPL_VAR image>&type=thumbs">
</button>
<input id="image_<TMPL_VAR id>" name="image" value="<TMPL_VAR image>" class="image" placeholder="<TMPL_VAR .loc.template_image>">
</td>
</tr>
<tr>
<td></td>
<td class="buttons">

10
website/agenda/planung/templates/upload_audio_recordings.html
View File

@@ -58,6 +58,8 @@
<tr>
<th>action</th>
<th>name</th>
<th>uploaded by</th>
<th>uploaded at</th>
<th>size in bytes</th>
<th>event duration in seconds</th>
<th>audio duration in seconds</th>
@@ -65,13 +67,14 @@
<th>RMS R</th>
<th>processed</th>
<th>mastered</th>
<th>uploaded by</th>
<th>uploaded at</th>
<th>modified at</th>
</tr>
<TMPL_LOOP audio_recordings>
<tr>
<td><button onclick="playAudio('<TMPL_VAR path>');return false">play</button></td>
<td><TMPL_VAR path></td>
<td><TMPL_VAR created_by></td>
<td><TMPL_VAR created_at></td>
<td><TMPL_VAR size></td>
<td><TMPL_VAR eventDuration></td>
<td><TMPL_VAR audioDuration></td>
@@ -79,8 +82,7 @@
<td><TMPL_VAR rmsRight></td>
<td><TMPL_VAR processed></td>
<td><TMPL_VAR mastered></td>
<td><TMPL_VAR created_by></td>
<td><TMPL_VAR created_at></td>
<td><TMPL_VAR modified_at></td>
<TMPL_IF .allow.delete_audio_recordings>
<td>
<form method="post">