Merge pull request #416 from anaqreon/embedphotos

Add embed photos button with album browser to new post editor

5 files changed, 310 insertions, 0 deletions

diff --git a/Zotlabs/Module/Embedphotos.php b/Zotlabs/Module/Embedphotos.php
new file mode 100644
index 000000000..2cd420664
--- /dev/null
+++ b/Zotlabs/Module/Embedphotos.php
@@ -0,0 +1,180 @@
+<?php
+namespace Zotlabs\Module;
+
+/**
+ *
+ * This is the POST destination for the embedphotos button
+ *
+ */  
+
+
+class Embedphotos extends \Zotlabs\Web\Controller {
+
+	function get() {
+		
+	}
+
+	function post() {
+		
+    if (argc() > 1 && argv(1) === 'album') {
+        // API: /embedphotos/album
+        $name = (x($_POST,'name') ? $_POST['name'] : null );
+        if (!$name) {
+            json_return_and_die(array('errormsg' => 'Error retrieving album', 'status' => false));
+        }
+        $album = $this->embedphotos_widget_album(array('channel' => \App::get_channel(), 'album' => $name));
+        json_return_and_die(array('status' => true, 'content' => $album));
+
+    }
+    if (argc() > 1 && argv(1) === 'albumlist') {
+        // API: /embedphotos/albumlist
+        $album_list = $this->embedphotos_album_list($a);
+        json_return_and_die(array('status' => true, 'albumlist' => $album_list));
+
+    }
+    if (argc() > 1 && argv(1) === 'photolink') {
+        // API: /embedphotos/photolink
+        $href = (x($_POST,'href') ? $_POST['href'] : null );
+        if (!$href) {
+            json_return_and_die(array('errormsg' => 'Error retrieving link ' . $href, 'status' => false));
+        }
+        $resource_id = array_pop(explode("/", $href));
+        $r = q("SELECT obj from item where resource_type = 'photo' and resource_id = '%s' limit 1",
+			dbesc($resource_id)
+		);
+        if(!$r) {
+            json_return_and_die(array('errormsg' => 'Error retrieving resource ' . $resource_id, 'status' => false));
+        }
+        $obj = json_decode($r[0]['obj'], true);
+        if(x($obj,'body')) {
+            $photolink = $obj['body'];
+        } elseif (x($obj,'bbcode')) {
+            $photolink = $obj['bbcode'];
+        } else {
+            json_return_and_die(array('errormsg' => 'Error retrieving resource ' . $resource_id, 'status' => false));
+        }
+        json_return_and_die(array('status' => true, 'photolink' => $photolink));
+
+    }
+	}
+	
+	
+/**
+ * Copied from include/widgets.php::widget_album() with a modification to get the profile_uid from
+ * the input array as in widget_item()
+ * @param type $name
+ * @return string
+ */
+function embedphotos_widget_album($args) {
+
+    $channel_id = 0;
+    if(array_key_exists('channel',$args))
+            $channel = $args['channel'];
+            $channel_id = intval($channel['channel_id']);
+    if(! $channel_id)
+            $channel_id = \App::$profile_uid;
+    if(! $channel_id)
+            return '';
+		$owner_uid = $channel_id;
+    require_once('include/security.php');
+    $sql_extra = permissions_sql($channel_id);
+
+    if(! perm_is_allowed($channel_id,get_observer_hash(),'view_storage'))
+            return '';
+
+    if($args['album'])
+            $album = $args['album'];
+    if($args['title'])
+            $title = $args['title'];
+
+		/** 
+		 * This may return incorrect permissions if you have multiple directories of the same name.
+		 * It is a limitation of the photo table using a name for a photo album instead of a folder hash
+		 */
+
+		if($album) {
+			$x = q("select hash from attach where filename = '%s' and uid = %d limit 1",
+				dbesc($album),
+				intval($owner_uid)
+			);
+			if($x) {
+				$y = attach_can_view_folder($owner_uid,get_observer_hash(),$x[0]['hash']);
+				if(! $y)
+					return '';
+			}
+		}
+
+		$order = 'DESC';
+
+		$r = q("SELECT p.resource_id, p.id, p.filename, p.mimetype, p.imgscale, p.description, p.created FROM photo p INNER JOIN
+				(SELECT resource_id, max(imgscale) imgscale FROM photo WHERE uid = %d AND album = '%s' AND imgscale <= 4 AND photo_usage IN ( %d, %d ) $sql_extra GROUP BY resource_id) ph 
+				ON (p.resource_id = ph.resource_id AND p.imgscale = ph.imgscale)
+			ORDER BY created $order",
+			intval($owner_uid),
+			dbesc($album),
+			intval(PHOTO_NORMAL),
+			intval(PHOTO_PROFILE)
+		);
+
+		$photos = array();
+			if(count($r)) {
+				$twist = 'rotright';
+				foreach($r as $rr) {
+	
+					if($twist == 'rotright')
+						$twist = 'rotleft';
+					else
+						$twist = 'rotright';
+					
+					$ext = $phototypes[$rr['mimetype']];
+	
+					$imgalt_e = $rr['filename'];
+					$desc_e = $rr['description'];
+	
+					$imagelink = (z_root() . '/photos/' . \App::$data['channel']['channel_address'] . '/image/' . $rr['resource_id']
+					. (($_GET['order'] === 'posted') ? '?f=&order=posted' : ''));
+	
+					$photos[] = array(
+						'id' => $rr['id'],
+						'twist' => ' ' . $twist . rand(2,4),
+						'link' => $imagelink,
+						'title' => t('View Photo'),
+						'src' => z_root() . '/photo/' . $rr['resource_id'] . '-' . $rr['imgscale'] . '.' .$ext,
+						'alt' => $imgalt_e,
+						'desc'=> $desc_e,
+						'ext' => $ext,
+						'hash'=> $rr['resource_id'],
+						'unknown' => t('Unknown')
+					);
+				}
+			}
+
+		$tpl = get_markup_template('photo_album.tpl');
+		$o .= replace_macros($tpl, array(
+			'$photos' => $photos,
+			'$album' => (($title) ? $title : $album),
+			'$album_id' => rand(),
+			'$album_edit' => array(t('Edit Album'), $album_edit),
+			'$can_post' => false,
+			'$upload' => array(t('Upload'), z_root() . '/photos/' . \App::$profile['channel_address'] . '/upload/' . bin2hex($album)),
+			'$order' => false,
+			'$upload_form' => $upload_form,
+			'$usage' => $usage_message
+		));
+
+		return $o;
+}
+
+
+function embedphotos_album_list($a) {
+    $o = '';
+    require_once('include/photos.php');
+    $p = photos_albums_list(\App::get_channel(), \App::get_observer());
+    if ($p['success']) {
+        return $p['albums'];
+    } else {
+        return null;
+    }
+}
+
+}
diff --git a/include/conversation.php b/include/conversation.php
index 518193b08..bf29048b6 100644
--- a/include/conversation.php
+++ b/include/conversation.php
@@ -1143,6 +1143,8 @@ function status_editor($a, $x, $popup = false) {
 	$weblink = (($mimetype === 'text/bbcode') ? t('Insert web link') : false);
 	if(x($x, 'hide_weblink'))
 		$weblink = false;
+	
+	$embedPhotos = t('Embed image from photo albums');
 
 	$writefiles = (($mimetype === 'text/bbcode') ? perm_is_allowed($x['profile_uid'], get_observer_hash(), 'write_storage') : false);
 	if(x($x, 'hide_attach'))
@@ -1178,6 +1180,12 @@ function status_editor($a, $x, $popup = false) {
 		'$whereareu' => t('Where are you right now?'),
 		'$editor_autocomplete'=> ((x($x,'editor_autocomplete')) ? $x['editor_autocomplete'] : ''),
 		'$bbco_autocomplete'=> ((x($x,'bbco_autocomplete')) ? $x['bbco_autocomplete'] : ''),
+		'$modalchooseimages' => t('Choose images to embed'),
+		'$modalchoosealbum' => t('Choose an album'),
+		'$modaldiffalbum' => t('Choose a different album...'),
+		'$modalerrorlist' => t('Error getting album list'),
+		'$modalerrorlink' => t('Error getting photo link'),
+		'$modalerroralbum' => t('Error getting album'),
 	));
 
 	$tpl = get_markup_template('jot.tpl');
@@ -1219,6 +1227,10 @@ function status_editor($a, $x, $popup = false) {
 		'$code' => t('Code'),
 		'$attach' => t('Attach file'),
 		'$weblink' => $weblink,
+		'$embedPhotos' => $embedPhotos,
+		'$embedPhotosModalTitle' => t('Embed an image from your albums'),
+		'$embedPhotosModalCancel' => t('Cancel'),
+		'$embedPhotosModalOK' => t('OK'),
 		'$setloc' => $setloc,
 		'$voting' => t('Toggle voting'),
 		'$feature_voting' => $feature_voting,
diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index 30b0cebb4..c9c85daa3 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -2020,3 +2020,9 @@ dl.bb-dl > dd > li {
 .help-searchlist a {
 	font-size: 130%;
 }
+
+.embed-photo-selected-photo {
+    border-color: blue;
+    border-style: solid;
+    border-width: 5px;
+}
diff --git a/view/tpl/jot-header.tpl b/view/tpl/jot-header.tpl
index 43df2e175..f3dd8cafe 100755
--- a/view/tpl/jot-header.tpl
+++ b/view/tpl/jot-header.tpl
@@ -364,6 +364,89 @@ function enableOnUser(){
 
 	{{$geotag}}
 
+    var initializeEmbedPhotoDialog = function () {
+        $('.embed-photo-selected-photo').each(function (index) {
+            $(this).removeClass('embed-photo-selected-photo');
+        });
+        getPhotoAlbumList();
+        $('#embedPhotoModalBodyAlbumDialog').off('click');
+        $('#embedPhotoModal').modal();
+    };
+
+    var choosePhotoFromAlbum = function (album) {
+        $.post("embedphotos/album", {name: album},
+            function(data) {
+                if (data['status']) {
+                    $('#embedPhotoModalLabel').html('{{$modalchooseimages}}');
+                    $('#embedPhotoModalBodyAlbumDialog').html('\
+                            <div><ul class="nav">\n\
+                                <li><a href="#" onclick="initializeEmbedPhotoDialog();return false;">\n\
+                                    <i class="fa fa-chevron-left"></i>&nbsp\n\
+                                    {{$modaldiffalbum}}\n\
+                                    </a>\n\
+                                </li>\n\
+                            </ul><br></div>')
+                    $('#embedPhotoModalBodyAlbumDialog').append(data['content']);
+                    $('#embedPhotoModalBodyAlbumDialog').click(function (evt) {
+                        evt.preventDefault();
+                        var image = document.getElementById(evt.target.id);
+                        if (typeof($(image).parent()[0]) !== 'undefined') {
+                            var imageparent = document.getElementById($(image).parent()[0].id);
+                            $(imageparent).toggleClass('embed-photo-selected-photo');
+                        }
+                    });
+                    $('#embedPhotoModalBodyAlbumListDialog').addClass('hide');
+                    $('#embedPhotoModalBodyAlbumDialog').removeClass('hide');
+                    $('#embed-photo-OKButton').click(function () {
+                        $('.embed-photo-selected-photo').each(function (index) {
+                            var href = $(this).attr('href');
+                            $.post("embedphotos/photolink", {href: href},
+                                function(ddata) {
+                                    if (ddata['status']) {
+                                        addeditortext(ddata['photolink']);
+                                    } else {
+                                        window.console.log('{{$modalerrorlink}}' + ':' + ddata['errormsg']);
+                                    }
+                                    return false;
+                                },
+                            'json');
+                        });
+                        $('#embedPhotoModalBodyAlbumDialog').html('');
+                        $('#embedPhotoModalBodyAlbumDialog').off('click');
+                        $('#embedPhotoModal').modal('hide');
+                    });
+                } else {
+                    window.console.log('{{$modalerroralbum}} ' + JSON.stringify(album) + ':' + data['errormsg']);
+                }
+                return false;
+            },
+        'json');
+    };
+
+    var getPhotoAlbumList = function () {
+        $.post("embedphotos/albumlist", {},
+            function(data) {
+                if (data['status']) {
+                    var albums = data['albumlist']; //JSON.parse(data['albumlist']);
+                    $('#embedPhotoModalLabel').html('{{$modalchoosealbum}}');
+                    $('#embedPhotoModalBodyAlbumList').html('<ul class="nav"></ul>');
+                    for(var i=0; i<albums.length; i++) {
+                        var albumName = albums[i].text;
+                        var albumLink = '<li>';
+                        albumLink += '<a href="#" onclick="choosePhotoFromAlbum(\'' + albumName + '\');return false;">' + albumName + '</a>';
+                        albumLink += '</li>';
+                        $('#embedPhotoModalBodyAlbumList').find('ul').append(albumLink);
+                    }
+                    $('#embedPhotoModalBodyAlbumDialog').addClass('hide');
+                    $('#embedPhotoModalBodyAlbumListDialog').removeClass('hide');
+                } else {
+                    window.console.log('{{$modalerrorlist}}' + ':' + data['errormsg']);
+                }
+                return false;
+            },
+        'json');
+    };
+    
 </script>
 
 <script>
diff --git a/view/tpl/jot.tpl b/view/tpl/jot.tpl
index 685706026..490349a04 100755
--- a/view/tpl/jot.tpl
+++ b/view/tpl/jot.tpl
@@ -79,6 +79,11 @@
 						<i id="profile-link" class="fa fa-link jot-icons"></i>
 					</button>
 					{{/if}}
+					{{if $embedPhotos}}
+                    <button id="embed-photo-wrapper" class="btn btn-default btn-sm" title="{{$embedPhotos}}" onclick="initializeEmbedPhotoDialog();return false;">
+                        <i id="embed-photo" class="fa fa-file-image-o jot-icons"></i>
+                    </button>
+                    {{/if}}
 				</div>
 				<div class="btn-group hidden-xs hidden-sm">
 					{{if $setloc}}
@@ -225,6 +230,30 @@
 </div><!-- /.modal -->
 {{/if}}
 
+{{if $embedPhotos}}
+<div class="modal" id="embedPhotoModal" tabindex="-1" role="dialog" aria-labelledby="embedPhotoLabel" aria-hidden="true">
+  <div class="modal-dialog">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+        <h4 class="modal-title" id="embedPhotoModalLabel">{{$embedPhotosModalTitle}}</h4>
+      </div>
+     <div class="modal-body" id="embedPhotoModalBody" >
+         <div id="embedPhotoModalBodyAlbumListDialog" class="hide">
+            <div id="embedPhotoModalBodyAlbumList"></div>
+         </div>
+         <div id="embedPhotoModalBodyAlbumDialog" class="hide">
+         </div>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-default" data-dismiss="modal">{{$embedPhotosModalCancel}}</button>
+        <button id="embed-photo-OKButton" type="button" class="btn btn-primary">{{$embedPhotosModalOK}}</button>
+      </div>
+    </div><!-- /.modal-content -->
+  </div><!-- /.modal-dialog -->
+</div><!-- /.modal -->
+{{/if}}
+
 {{if $content || $attachment || $expanded}}
 <script>initEditor();</script>
 {{/if}}