Using FusePhotoController

From FuseWiki

Jump to: navigation, search

Contents

[edit] Introduction

The FusePhotoController makes it easy to upload, manage, and resize pictures, then associate them with a row in the database. The class is suited for such tasks as photo albums, user profiles with pictures, or any scenario where pictures need to be uploaded alongside your data.

This article will discuss using the FusePhotoController to manage a group of photo albums.

[edit] Naming Conventions

If you use the following conventions, your PhotoController will function automatically.

  • Your photo controller class should be named the same as your referenced controller, but with PhotoController as the suffix instead of just Controller (e.g. 'UserProfileController' and 'UserProfilePhotoController')
  • Your model should be named in a similar fashion, with the model for the photos table the same as the referenced model (e.g. 'User' and 'UserPhoto'
  • Your database schema for the photos table should contain the same fields as the example below (it can also contain more, but needs at least those)

[edit] FusePhotoController Example

[edit] Database Schema

photo_albums
album_id
album_name
photos
photo_id
photo_filename (Make sure I can be NULL!)
album_id

[edit] Setting up the Controller

Controller setup is extremely simple when using the default settings. All you need to do is extend the base FusePhotoController and set up your routes.

controllers/PhotoAlbumPhotoController

<?php

FUSE::Require_class('AppControl/FusePhotoController');

class PhotoAlbumPhotoController extends FusePhotoController {

}

?>

[edit] Setting up the Models

models/AlbumPhoto.class.php


<?php

FUSE::require_class('FuseDataModel');

class AlbumPhoto extends FuseDataModel {

    protected $_Prefix_db_field_name = 'photo_';
    
    protected function _Init() {
    	
    	$this->belongs_to('Album');
    	
    }
}
?>

models/Album.class.php


<?php

FUSE::require_class('FuseDataModel');

class Album extends FuseDataModel {

    protected $_Prefix_db_field_name = 'album_';
    
    protected function _Init() {
    	
    	$this->has_many('AlbumPhoto');
    	
    }
}
?>

[edit] Setting up the Views

For editing photos:

views/PhotoAlbumPhoto/PhotoAlbumPhoto-Edit.tmpl

<table class="form_table centered bordered_hard" style="width:100%;">
<{form_tag}>
  <tr>
    <th colspan="2">Add Photos</th>
  <tr>
  <tr>
    <td class="left">Album</td>
    <td class="right">
    	<{IF album_count > 0}>
    	<{HTML/FormOptionsHelper::Select_all('Album', 'name', 'id', array('for_model'=>'AlbumPhoto') );}>
    	<{ELSE}>
    	Please <a href="<{SITE_BASE_URI}>/Album/Add">create an album</a> before uploading pictures.
		<{/IF}>
    </td>
  <tr>
    <td class="left">File</td>
    <td class="right"><input class="photo_file" name="photo_album_photo_file1" type="file"></td>
  </tr>
 <tr>
    <td class="left">File</td>
    <td class="right"><input class="photo_file" name="photo_album_photo_file2" type="file"></td>
  </tr>
  <tr>
    <td class="left">File</td>
    <td class="right"><input class="photo_file" name="photo_album_photo_file3" type="file"></td>
  </tr>
  <tr class="button">
    <td colspan="2"><input type="submit" value="Save Changes" /></td>
  </tr>
</form>
</table>

For displaying photos:

views/PhotoAlbumPhoto/PhotoAlbumPhoto-List.tmpl


<{IF photo_count > 0}>
<{DB_LOOP photos}>
<div>
<img src="<{$_SITE_BASE_URI}>/photos/<{photo_filename}>" />
</div>
<{/LOOP}>
<{ELSE}>
<div class="centered" style="text-align:center; margin-top: 30px; font-weight:bold;">
Sorry, No Photos were found for that album!
</div>
<{/IF}>

[edit] Adding Routes

in config/routes.conf.php

FuseURIRouter::Route_connect( 'photos/album/:album_id', array(  
		'action' => 'list',
		'method' => 'show_list', 
		'controller' => 'PhotoAlbumPhoto',
                'requirements' => array( 'album_id' => '/\d+/' )
	)
);

FuseURIRouter::Route_connect( 'photos/add/:album_id', array(  
		'action' => 'add',
		'controller' => 'PhotoAlbumPhoto' , 
		'requirements' => array( 'album_id' => '/\d+/' )
	)
);



[edit] Customization Example

Since $image_manager is an instantiation of the FusePhotoManager class, you can further customize how images are uploaded and resized by calling any of the members and methods. You will probably want to customize these, so have a look here: FusePhotoManager

By default, the DataControllerWithImage allows GIF, JPG, and PNG uploads, and uses the defaults from FusePhotoManager for most other options.

Note: You can also reference the image manager in other methods by using $this->image_manager.



class AlbumPhotoController extends FusePhotoController {

   public function setup_photo_manager( $image_manager, $options = null ) {

         $image_manager->photo_rootdir = '/home/myproject/photos/profiles'; 
         $image_manager->photo_linkdir = constant('SITE_BASE_URI') . '/photos/profiles';

         // we want a thumbnail of 150 pixels wide to be stored in /photos/profiles/thumb/browse
         $image_manager->add_thumbnail_size( 'browse', 150 ); 

         $image_manager->max_upload_size = 3000; 
	 $image_manager->max_sane_width  = 1000; // max pixel width to actually try to process
	 $image_manager->max_sane_height = 1000; // max pixel height to actually try to process
	 $image_manager->fixed_photo_width = 600; //proportionally resize all images to be 600 pixels wide
   }

}

Personal tools