What is the best way to setup and create CMS managed header section

ziggyz27 · September 2013

I am trying to give control to users to update content in the header section. My guess is to create a block module that is pulled into the header block.

For example;
Slides show module

Module Functionality;
Customer uploads images with description

Header-section Block functionality:
Header Section Block pulls the list of saved images and runs them in a slideshow using jquery

Does this sound the correct architectural approach based on the strengths of FUEL CMS? Please advise.

admin · September 2013

Are the images going to change on a per page basis or will they be the same across every implementation of the block?

If you want them to be the same across all the pages, then the the way you suggested is how I would advise. Create the module, then create the block that pulls in the data that you need and renders the HTML for the page.

If they are different across pages (or you want that option), we normally will include a page layout that allows the user to control which images get displayed in that slideshow are. There is a field type of "asset" you can use that will allow you to select or upload one or more images (multiple must be set to TRUE).

Layouts
http://docs.getfuelcms.com/general/layouts

Asset field type
http://docs.getfuelcms.com/general/forms#asset

ziggyz27 · September 2013

Images will be the same for now, I dont want them to have too much control.

btw I am stuck in custom module where I am trying to figure out how to display a field as file field and upload that image file to the server and rename it if defined.

ziggyz27 · September 2013

the module displays the field as text field right now as it reads from the structure of the database table.

admin · September 2013

Try setting the field type to "file":
$fields['my_file'] = array('type' => 'file');

If that still doesn't work, try adding the parameter 'ignore_representative' => FALSE

ziggyz27 · September 2013

This is what i have in my project_image_model

[code]
<?php
if (!defined('BASEPATH')) exit('No direct script access allowed');
require_once(FUEL_PATH . 'models/base_module_model.php');

class Project_images_model extends Base_module_model
{
public $required = array('heading','image_file');
//public $fields = array('type' => 'file', 'overwrite' => TRUE, 'display_overwrite' => TRUE, 'multiple' => FALSE);
public $foreign_keys = array('project_id' => array('schauer_projects' => 'projects_model'));
function __construct()
{
parent::__construct('schauer_project_images');
}
/*
function tree()
{
return $this->_tree('project_category_id');
}
*/
}

class Project_image_model extends Base_module_record
{
}
[/code]

admin · September 2013

So in this case you want to overwrite the model's form_fields method like so:

public function form_fields($values = array(), $related = array())
{	
	$fields = parent::form_fields($values, $related);
	$fields['image'] = array('type' => 'file', 'file_name' => 'slideshow_{id}');
	return $fields;
}

This is a pretty common thing to do with simple modules to get the forms the way you want. There are a lot of different field options which you can read about here:
http://docs.getfuelcms.com/general/forms

If you are wanting more control over the file name, you can use an on_after_post model hook to do further processing like so:

public function on_after_post($values){
	$record = $this->find_by_key($values['id']);
	// $this->upload_data['values'] will provide upload information regarding your image if needed
	// the $values array may provide additional data you want to join with the name 
	$record->image = 'my_new_name.jpg'; 
	$record->save();
	return $values;
}

More on model hooks (and model's in general) can be found here:
http://docs.getfuelcms.com/general/models#hooks

admin · September 2013

This may also be a good resource for you:
http://docs.getfuelcms.com/modules/tutorial

ziggyz27 · September 2013

thanks - I have been reading a lot of documentation on this but sometimes you dont see the answer even when its right there staring at you.

I will work on this.

admin · September 2013

No worries... there's a lot there. Feel free to ask any more questions.

ziggyz27 · September 2013

ok I made good progress on this project related images are getting uploaded, and here is where I am at;

1. On Edit > New Image gets uploaded but old image is not deleted
2. Even though I have the image_file field set as required, it still saves the record if an image is not selected
3. How to add tree view

I would appreciate your guidance.

<?php
if (!defined('BASEPATH')) exit('No direct script access allowed');
require_once(FUEL_PATH . 'models/base_module_model.php');
 
class Project_images_model extends Base_module_model
{
    public $required = array('project_id');
    public $foreign_keys = array('project_id' => array('my_projects' => 'projects_model'));

    function __construct()
    {
        parent::__construct('my_project_images');
    }

    public function form_fields($values = array(), $related = array())
    {
        $fields = parent::form_fields($values, $related);
        
        $fields['image_file'] = array('type' => 'file', 'required' => TRUE, 'file_name' => 'project_image_{id}');
        $fields['image_file']['class'] = 'asset_select images/projects';
        $fields['image_file']['upload_path'] = assets_server_path('projects', 'images');
        
        if (!empty($values['image_file']))
        {
            $fields['image_file']['before_html'] = '<div class="img_display"><img src="'.img_path('projects/'.$this->thumb_name($values['image_file'])).'" style="float: right;"/></div>';
        }

        return $fields;
    }

    function list_items($limit = NULL, $offset = NULL, $col = 'heading', $order = 'asc', $just_count = FALSE)
    {
        $this->db->join('my_projects', 'my_projects.id = my_project_images.project_id', 'left');
        $this->db->select('my_project_images.id as id, heading, my_project_images.image_file AS image_file', FALSE);
        $data = parent::list_items($limit, $offset, $col, $order, $just_count);
 
        // check just_count is FALSE or else $data may not be a valid array
        if (empty($just_count))
        {
          foreach($data as $key => $val)
          {
            $data[$key]['heading'] = htmlentities($val['heading'], ENT_QUOTES, 'UTF-8');
            $data[$key]['image_file'] =  '<div><img src="'.img_path('projects/'.$this->thumb_name($val['image_file'])).'"/></div>';
          }
        }
        return $data;
    }

    function on_after_post($values)
    {
        $CI =& get_instance();
        $CI->load->library('image_lib');
        
        // create the thumbnail if an image is uploaded
        if (!empty($CI->upload))
        {
            $data = $CI->upload->data();
            if (!empty($data['full_path']))
            {
                $thumb_img = assets_server_path('projects/'.$this->thumb_name($data['file_name']), 'images');
                
                // resize to proper dimensions
                $config = array();
                $config['source_image'] = $data['full_path'];
                $config['create_thumb'] = FALSE;
                //$config['new_image'] = $thumb_img;
                $config['width'] = 600;
                $config['height'] = 500;
                $config['master_dim'] = 'auto';
                $config['maintain_ratio'] = TRUE;
                $CI->image_lib->clear();
                $CI->image_lib->initialize($config);
                if (!$CI->image_lib->resize())
                {
                    $this->add_error($CI->image_lib->display_errors());
                }
                
                // create thumb
                $config = array();
                $config['source_image'] = $data['full_path'];
                $config['create_thumb'] = FALSE;
                $config['new_image'] = $thumb_img;
                $config['width'] = 100;
                $config['height'] = 80;
                $config['master_dim'] = 'auto';
                $config['maintain_ratio'] = TRUE;
                $CI->image_lib->clear();
                $CI->image_lib->initialize($config);
                if (!$CI->image_lib->resize())
                {
                    $this->add_error($CI->image_lib->display_errors());
                }
            }
        }

    return $values;
    }

    function on_before_delete($where)
    {
        $id = $this->_determine_key_field_value($where);
        $data = $this->find_by_key($id);
        $files[] = assets_server_path('projects/'.$data->image_file, 'images');
        $files[] = assets_server_path('projects/'.$this->thumb_name($data->image_file), 'images');
        foreach($files as $file)
        {
            if (file_exists($file))
            {
                @unlink($file);
            }
        }
    }

    function thumb_name($image)
    {
        return preg_replace('#(.+)(\.jpg|\.png)#U', '$1_thumb$2', $image);
    }

}
 
class Project_image_model extends Base_module_record
{
}

ziggyz27 · September 2013

btw most of the methods i have used were taken from the tutorial http://getfuelcms.com/blog/id/5

admin · September 2013

1. When you say old image isn't deleted, isn't it uploading with the same name and needs to be overwritten?
2. It's still saving because image_file isn't a field in the database correct? If so, it isn't looked at when validating required fields. To make it required, you can use an on_before_validate method on your model to check the $_FILES array. If it isn't there, you can use:$this->add_error('No image selected'):
3. To create a tree, you'll need to create a tree method on your model. The method should return an array of arrays using the same syntax as the when creating navigation:
http://docs.getfuelcms.com/general/navigation

The fuel_pages_model, fuel_navigation_model and fuel_categories_model have examples too.

Howdy, Stranger!

Categories

What is the best way to setup and create CMS managed header section

Comments