summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--apps/gallery/appinfo/info.xml2
-rw-r--r--apps/gallery/css/styles.css16
-rw-r--r--apps/gallery/img/delete.pngbin0 -> 275 bytes
-rw-r--r--apps/gallery/img/rename.pngbin0 -> 310 bytes
-rw-r--r--apps/gallery/img/share.pngbin0 -> 377 bytes
-rw-r--r--apps/gallery/js/album_cover.js105
-rw-r--r--apps/gallery/js/albums.js11
-rw-r--r--apps/gallery/templates/index.php20
-rw-r--r--apps/gallery/templates/view_album.php13
9 files changed, 117 insertions, 50 deletions
diff --git a/apps/gallery/appinfo/info.xml b/apps/gallery/appinfo/info.xml
index c275f39bb25..9aecb0c781d 100644
--- a/apps/gallery/appinfo/info.xml
+++ b/apps/gallery/appinfo/info.xml
@@ -2,7 +2,7 @@
<info>
<id>gallery</id>
<name>Gallery</name>
- <version>0.2</version>
+ <version>0.3</version>
<licence>AGPL</licence>
<author>Bartek Przybylski</author>
<require>2</require>
diff --git a/apps/gallery/css/styles.css b/apps/gallery/css/styles.css
index bb8d0607f8c..7872b6445ca 100644
--- a/apps/gallery/css/styles.css
+++ b/apps/gallery/css/styles.css
@@ -1,12 +1,14 @@
-div#gallery_list { margin: 90pt 20pt; }
+div#gallery_list { margin: 70pt 20pt 0 20pt; }
div#gallery_list.leftcontent { padding-top: 15pt; margin: 0; position: absolute; bottom:0px; text-align: center; overflow: auto; }
-div.gallery_album_box { width: 200px; text-align: center; border: 0; display: inline-block; margin: 5pt; vertical-align: top; padding: 10px; position: relative; overflow: hidden; color: #999; }
-div.gallery_album_box:hover { color: black; }
-.leftcontent div.gallery_album_box { margin: 5px; }
+div.gallery_album_box { width: 200px; position:relative; text-align: center; border: 0; display: inline-block; margin: 5pt; vertical-align: top; padding: 20px 5px 5px 5px; position: relative; -webkit-transition: color 0.5s ease-in-out; -o-transition: color 0.5s ease-in-out; -moz-transition: color 0.5s ease-in-out;color: #BBB;}
div.gallery_album_box h1 { font-size: 9pt; font-family: Verdana; }
-div.gallery_album_cover { width: 199px; height: 199px; border: solid 1pt #999; padding: 0; }
-div.gallery_control_overlay { border: 0; position:absolute; right: 10pt; background-color: #333; opacity: 0; padding: 0 5pt; }
+div.gallery_album_decoration { width: 200px; position: absolute; border: 0; height: 20px; top: 20px; text-align:right; vertical-align:middle; background-color: #eee; opacity: 0; -webkit-transition: opacity 0.5s ease-in-out; -moz-transition: opacity 0.5s ease-in-out; -o-transition: opacity 0.5s ease-in-out; border-bottom-right-radius: 7px; border-bottom-left-radius: 7px; -moz-border-radius-bottomright: 7px; -moz-border-radius-bottomleft:7px;}
+div.gallery_album_box:hover { color: black; }
+div.gallery_album_box:hover div.gallery_album_decoration { opacity: 0.7;}
+div.gallery_album_decoration a {padding: 0 4pt; cursor: pointer;}
+div.gallery_album_cover { width: 200px; height: 200px; border: 0; padding: 0; position:relative;}
div.gallery_album_box:hover div.gallery_control_overlay { opacity:0.5 }
div.gallery_control_overlay a { color:white; }
#gallery_images.rightcontent { padding:10px 5px; bottom: 0px; overflow: auto; right:0px}
-
+#scan { position:absolute; right:13.5em; top:0em; }
+#scan #scanprogressbar { position:relative; display:inline-block; width:10em; height:1.5em; top:.4em; }
diff --git a/apps/gallery/img/delete.png b/apps/gallery/img/delete.png
new file mode 100644
index 00000000000..bc0c782882d
--- /dev/null
+++ b/apps/gallery/img/delete.png
Binary files differ
diff --git a/apps/gallery/img/rename.png b/apps/gallery/img/rename.png
new file mode 100644
index 00000000000..9993a092df1
--- /dev/null
+++ b/apps/gallery/img/rename.png
Binary files differ
diff --git a/apps/gallery/img/share.png b/apps/gallery/img/share.png
new file mode 100644
index 00000000000..62c4627f317
--- /dev/null
+++ b/apps/gallery/img/share.png
Binary files differ
diff --git a/apps/gallery/js/album_cover.js b/apps/gallery/js/album_cover.js
index 513dd47d351..e78db221cff 100644
--- a/apps/gallery/js/album_cover.js
+++ b/apps/gallery/js/album_cover.js
@@ -10,6 +10,10 @@ $(document).ready(function() {
if (targetDiv) {
$(targetDiv).html('');
Albums.display(targetDiv);
+ $('#gallery_list').sortable({revert:true});
+ $('.gallery_album_box').each(function(i, e) {
+ $(e).draggable({connectToSortable: '#gallery_list', handle: '.dummy'})
+ });
} else {
alert('Error occured: no such layer `gallery_list`');
}
@@ -37,9 +41,6 @@ var totalAlbums = 0;
function scanForAlbums() {
var albumCounter = 0;
var totalAlbums = 0;
- $('#notification').text(t('gallery',"Scanning directories"));
- $("#notification").fadeIn();
- $("#notification").slideDown();
$.getJSON('ajax/galleryOp.php?operation=filescan', function(r) {
if (r.status == 'success') {
@@ -48,7 +49,7 @@ function scanForAlbums() {
$('#notification').text(t('gallery', "No photos found")).fadeIn().slideDown().delay(3000).fadeOut().slideUp();
return;
}
- $('#notification').text(t('gallery',"Creating thumbnails")+' ... ' + Math.floor((albumCounter/totalAlbums)*100) + "%");
+ $('#scanprogressbar').progressbar({ value: (albumCounter/totalAlbums)*100 }).fadeIn();
for(var a in r.paths) {
$.getJSON('ajax/galleryOp.php?operation=partial_create&path='+r.paths[a], function(r) {
@@ -57,10 +58,9 @@ function scanForAlbums() {
}
albumCounter++;
- $('#notification').text(t('gallery',"Creating thumbnails")+' ... ' + Math.floor((albumCounter/totalAlbums)*100) + "%");
+ $('#scanprogressbar').progressbar({ value: (albumCounter/totalAlbums)*100 });
if (albumCounter == totalAlbums) {
- $("#notification").fadeOut();
- $("#notification").slideUp();
+ $('#scanprogressbar').fadeOut();
var targetDiv = document.getElementById('gallery_list');
if (targetDiv) {
targetDiv.innerHTML = '';
@@ -78,36 +78,71 @@ function scanForAlbums() {
}
function galleryRemove(albumName) {
- if (confirm(t('gallery',"Do you wan't to remove album")+' ' + albumName + "?")) {
- $.getJSON("ajax/galleryOp.php", {operation: "remove", name: albumName}, function(r) {
- if (r.status == "success") {
- $(".gallery_album_box").filterAttr('data-album',albumName).remove();
- Albums.remove(albumName);
- } else {
- alert("Error: " + r.cause);
- }
- });
- }
+ // a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore!
+ $( "#dialog:ui-dialog" ).dialog( "destroy" );
+ $('#albumName', $("#dialog-confirm")).text(albumName);
+
+ $( '#dialog-confirm' ).dialog({
+ resizable: false,
+ height:150,
+ buttons: [{
+ text: t('gallery', 'OK'),
+ click: function() {
+ $.getJSON("ajax/galleryOp.php", {operation: "remove", name: albumName}, function(r) {
+ if (r.status == "success") {
+ $(".gallery_album_box").filterAttr('data-album',albumName).remove();
+ Albums.remove(albumName);
+ } else {
+ alert("Error: " + r.cause);
+ }
+ $('#dialog-confirm').dialog('close');
+ });
+ }},
+ {
+ text: t('gallery', 'Cancel'),
+ click: function() {
+ $( this ).dialog( 'close' );
+ }}]
+ });
}
function galleryRename(name) {
- var result = window.prompt(t('gallery',"Input new gallery name"), name);
- if(result=='' || result==name){
- return;
- }
- if (result) {
- if (Albums.find(result)) {
- alert("Album named '" + result + "' already exists");
- return;
- }
- $.getJSON("ajax/galleryOp.php", {operation: "rename", oldname: name, newname: result}, function(r) {
- if (r.status == "success") {
- Albums.rename($(".gallery_album_box").filterAttr('data-album',name), result);
- } else {
- alert("Error: " + r.cause);
- }
- });
-
- }
+ $('#name', $('#dialog-form')).val(name);
+ $( "#dialog-form" ).dialog({
+ height: 140,
+ width: 350,
+ modal: false,
+ buttons: [{
+ text: t('gallery', 'Change name'),
+ click: function() {
+ var newname = $('#name', $('#dialog-form')).val();
+ if (newname == name || newname == '') {
+ $(this).dialog("close");
+ return;
+ }
+ if (Albums.find(newname)) {
+ alert("Album ", newname, " exists");
+ $(this).dialog("close");
+ return;
+ }
+ $.getJSON("ajax/galleryOp.php", {operation: "rename", oldname: name, newname: newname}, function(r) {
+ if (r.status == "success") {
+ Albums.rename($(".gallery_album_box").filterAttr('data-album',name), newname);
+ } else {
+ alert("Error: " + r.cause);
+ }
+ $('#dialog-form').dialog("close");
+ });
+
+ }
+ },
+ {
+ text: t('gallery', 'Cancel'),
+ click: function() {
+ $( this ).dialog( "close" );
+ }
+ }
+ ],
+ });
}
diff --git a/apps/gallery/js/albums.js b/apps/gallery/js/albums.js
index 6150b0daa1e..59efb5b5659 100644
--- a/apps/gallery/js/albums.js
+++ b/apps/gallery/js/albums.js
@@ -41,16 +41,16 @@ Albums={
// displays gallery in linear representation
// on given element, and apply default styles for gallery
display: function(element) {
- var displayTemplate = '<div class="gallery_album_box"><div class="gallery_control_overlay"><a href="#" class="rename">rename</a> | <a href="#" class="remove">remove</a></div><a class="view"><div class="gallery_album_cover"></div></a><h1></h1></div></div>';
+ var displayTemplate = '<div class="gallery_album_box"><div class="dummy"></div><a class="view"><div class="gallery_album_cover"></div></a><h1></h1><div class="gallery_album_decoration"><a><img src="img/share.png" title="Share"></a><a class="rename"><img src="img/rename.png" title="Rename"></a><a class="remove"><img src="img/delete.png" title="Delete"></a></div></div>';
for (var i in Albums.albums) {
var a = Albums.albums[i];
var local=$(displayTemplate);
local.attr('data-album',a.name);
- $(".gallery_control_overlay a.rename", local).click(function(name,event){
+ $(".gallery_album_decoration a.rename", local).click(function(name,event){
event.preventDefault();
galleryRename(name);
}.bind(null,a.name));
- $(".gallery_control_overlay a.remove", local).click(function(name,event){
+ $(".gallery_album_decoration a.remove", local).click(function(name,event){
event.preventDefault();
galleryRemove(name);
}.bind(null,a.name));
@@ -66,8 +66,9 @@ Albums={
if (albumMetadata == undefined) {
return;
}
- var x = Math.min(Math.floor((e.layerX - this.offsetLeft)/(this.offsetWidth/albumMetadata.numOfCovers)), albumMetadata.numOfCovers-1);
- x *= this.offsetWidth-1;
+ var x = Math.floor((e.layerX - this.offsetLeft)/(this.offsetWidth/albumMetadata.numOfCovers));
+ x *= this.offsetWidth;
+ if (x < 0) x=0;
$(this).css('background-position', -x+'px 0');
});
$(element).append(local);
diff --git a/apps/gallery/templates/index.php b/apps/gallery/templates/index.php
index eb6ebd1bb7b..4c2fbcfe6c6 100644
--- a/apps/gallery/templates/index.php
+++ b/apps/gallery/templates/index.php
@@ -7,8 +7,24 @@ $l = new OC_L10N('gallery');
<div id="notification"><div id="gallery_notification_text">Creating thumbnails</div></div>
<div id="controls">
- <input type="button" value="<?php echo $l->t('Rescan');?>" onclick="javascript:scanForAlbums();" />
- <br/>
+ <div id="scan">
+ <div id="scanprogressbar"></div>
+ <input type="button" value="<?php echo $l->t('Rescan');?>" onclick="javascript:scanForAlbums();" />
+ </div>
</div>
<div id="gallery_list">
</div>
+
+<div id="dialog-confirm" title="<?php echo $l->t('Remove confirmation');?>" style="display: none">
+ <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span><?php echo $l->t('Do you want to remove album');?> <span id="albumName"></span>?</p>
+</div>
+
+<div id="dialog-form" title="<?php echo $l->t('Change album name');?>" style="display:none">
+ <form>
+ <fieldset>
+ <label for="name"><?php echo $l->t('New album name');?></label>
+ <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" />
+ </fieldset>
+ </form>
+</div>
+
diff --git a/apps/gallery/templates/view_album.php b/apps/gallery/templates/view_album.php
index 55a2ee09e4a..6b513a672d5 100644
--- a/apps/gallery/templates/view_album.php
+++ b/apps/gallery/templates/view_album.php
@@ -32,3 +32,16 @@ foreach ($_['photos'] as $a) {
}
?>
</div>
+
+<div id="dialog-confirm" title="<?php echo $l->t('Remove confirmation');?>" style="display: none">
+ <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span><?php echo $l->t('Do you want to remove album');?> <span id="albumName"></span>?</p>
+</div>
+
+<div id="dialog-form" title="<?php echo $l->t('Change album name');?>" style="display:none">
+ <form>
+ <fieldset>
+ <label for="name"><?php echo $l->t('New album name');?></label>
+ <input type="text" name="name" id="name" class="text ui-widget-content ui-corner-all" />
+ </fieldset>
+ </form>
+</div>
generated by cgit v1.2.3 (git 2.39.1) at 2025-01-24 21:17:04 +0000