Yii 1.1: p3widgets

Module for dynamic widget creation and management
20 followers

Phundament 3 - Widgets

P3WidgetsModule provides basic Content Management System (CMS) functionality through a widget container for frontend-editing and a backend for managing widget properties and content.

A widget container tags its contents (widgets) by its id, the current controller and action and optionally also by a request parameter.

When you edit a widget you can specify its type (see config value modules[p3widgets].params[widgets]), its attributes by editing them with a built-in JSON editor and its content by editing it with a built-in ckeditor.

Database schema setup is done easily with yiic migrate.

Resources

Addon: In-depth thread about general module management and a Yii-based CMS

Version

0.2 - CHANGELOG

Requirements

  • Yii 1.1.8
  • Database (tested with SQLite and MySQL)

Installation

1) Extract into 'p3widgets'.

2) Create a webapp by running

cd p3widgts
/path/to/yii/framework yiic webapp .

3) Import database schema with yiic. Note: This command will create an own migration table for this module, it will not disturb your application migration table! Use your application yiic command.

> ./yiic migrate \
    --migrationPath=application.modules.p3widgets.migrations \
    --migrationTable=migration_module_p3widgets

4) Add contents from 'p3widgets/config/main.php' to the corresponding part in your application configuration.

return CMap::mergeArray(
    require(dirname(__FILE__).'/../modules/p3widgets/config/main.php'),
    ...

Available widgets from Yii, zii and yiiext:

    'modules' => array(
        'p3widgets' => array(
            'params' => array(
                'widgets' => array(
                    'zii.widgets.CMenu' => 'Menu',
                    'zii.widgets.CPortlet' => 'Portlet',
                    'ext.yiiext.widgets.fancybox.EFancyboxWidget' => 'Fancy Box',
                    'ext.yiiext.widgets.cycle.ECycleWidget' => 'Cycle',
                    'CFlexWidget' => 'Flex Widget',
                    'ext.yiiext.widgets.swfobject.ESwfobjectWidget' => 'SWF Object',
                    'ext.yiiext.widgets.lipsum.ELipsum' => 'Lorem Ipsum Text',
                )
            )
        )
    ),

5) Open /p3widgets/default/test or add a P3WidgetContainer to a view.

$this->widget(
        'p3widgets.components.P3WidgetContainer',
        array(
            'id'=>'main',
            'checkAccess'=>false // disable checkAccess feature for debugging, default 'P3widgets.Widget.*'
            )
    );

Note: You should only disable the 'checkAccess' feature for debugging or testing. Make sure containers on the same page have different values for 'id'.

Usage

When logged in as 'admin' you should see a grey box around the containers and widgets with admin controls when you hover them. You can drag and drop widgets between containers. To move widgets across pages, edit their values for controller, action or requestParam.

Widget Examples

Widget class and content

CWidget

<h1>Hello World!</h1>

ECycleWidget

<p><img src="http://static.flickr.com/66/199481236_dc98b5abb3_s.jpg" width="75" height="75" alt="" /></p>
<p><img src="http://static.flickr.com/75/199481072_b4a0d09597_s.jpg" width="75" height="75" alt="" /></p>
<p><img src="http://static.flickr.com/57/199481087_33ae73a8de_s.jpg" width="75" height="75" alt="" /></p>
<p><img src="http://static.flickr.com/77/199481108_4359e6b971_s.jpg" width="75" height="75" alt="" /></p>

EFancyBoxWidget

<a id="example1" href="http://farm5.static.flickr.com/4058/4252054277_f0fa91e026.jpg"><img alt="example1" src="http://farm5.static.flickr.com/4058/4252054277_f0fa91e026_m.jpg" /></a>
<a id="example2" href="http://farm3.static.flickr.com/2489/4234944202_0fe7930011.jpg"><img alt="example2" src="http://farm3.static.flickr.com/2489/4234944202_0fe7930011_m.jpg" /></a>
<a id="example3" href="http://farm3.static.flickr.com/2647/3867677191_04d8d52b1a.jpg"><img alt="example3" src="http://farm3.static.flickr.com/2647/3867677191_04d8d52b1a_m.jpg" /></a>

Widgets taken from http://code.google.com/p/yiiext/ Examples from jQuery demo pages.

Known Issues

None so far ;)

Screenshots

BackendFrontend

Developer

git clone --recursive git://github.com/schmunk42/p3widgets.git \
  protected/modules/p3widgets
git clone --recursive git://github.com/schmunk42/p3extensions.git \
  protected/extensions/p3extensions
git clone --recursive https://github.com/schmunk42/gii-template-collection \
  protected/extensions/gtc

Contact

Tobias Munk
phundament@usrbin.de
http://phundament.com

Total 7 comments

#7066 report it
Tibor Katelbach at 2012/02/22 05:22am
{{basePath}} in Json editor properties settings ?

Hi Thanks for your great piece of work and thinking :) I've started playing with it it works nicely , I was wondering if there were any parameters available that could be used in the JsonEditor which would then be replaced with there value at save time ? This could be usefull for the property paths since currently we can only use Absolute Urls I'm sure there could be other main variables such as {{basePath}} which is the first I ran into

I would also be interested in how do you deal with internationalision of content ?

#5565 report it
schmunk at 2011/10/20 07:22pm
@peili: Dude, you rock!

Thanks a million!

Will update this soon...

#5563 report it
peili at 2011/10/20 06:35pm
Solution for missing Order Feature

goTo:container.js (line 16) and replace:

// Apply sortable function to containers, handle widget movement
$(function() {
    $( ".widget-container" ).sortable({
    connectWith: ".widget-container",
    placeholder: 'ui-state-highlight',
    handle: '.handle',
        update: function() {
                var order = $(this).sortable("serialize")';
                $.post('<?php echo Yii::app()->controller->createUrl("/p3widgets/widget/updateOrder") ?>', order);
        }
    }).disableSelection();
});
 
// Handler for widget deletion

Go to WidgetControler and create new function:

public function actionUpdateOrder() {
        $updateRecordsArray = $_POST['widget'];
        foreach ($updateRecordsArray as $id) {
            $model = $this->loadModel($id);
            $model->rank = $listingCounter;
            $model->save(false);
            $listingCounter = $listingCounter + 1;
        }
    }

That's it!

#5008 report it
schmunk at 2011/09/05 06:35pm
Demo fixed

I've just resetted user table, thanks migajek!

#4833 report it
migajek at 2011/08/20 05:22am
demo is broken

demo is broken - can't log in with admin/admin, the account is inactive

#4215 report it
schmunk at 2011/06/16 10:06am
Demo Fixed & Updated

Thanks arash for the notice. I fixed the bug mentioned above and updated the demo.

#4171 report it
arash at 2011/06/12 01:25pm
demo page error

going to demo page, I got this error:

**Invalid argument supplied for foreach()

/usr/www/users/phun/demo.phundament.com/schmunk42-phundament-e58ea2f/protected/modules/p3widgets/components/P3WidgetContainer.php(72)**

Leave a comment

Please to leave your comment.

Create extension
Downloads
No downloadable files yet