Commit f03ba225 by niskac

Updated most of the widgets to work with Bootstrap 2.

parent 00269992
/*!
* Bootstrap Alert jQuery UI widget file.
* BootAlert jQuery UI widget file.
* @author Christoffer Niska <ChristofferNiska@gmail.com>
* @copyright Copyright &copy; Christoffer Niska 2011-
* @license http://www.opensource.org/licenses/bsd-license.php New BSD License
......@@ -9,6 +9,11 @@
( function( $ ) {
"use strict" // set strict mode
/**
* BootAlert class.
* @class jQuery.ui.bootAlert
* @augments jQuery.ui.bootWidget
*/
var widget = $.extend( {}, $.ui.bootWidget.prototype, {
/**
* The name of the widget.
......@@ -31,9 +36,10 @@
},
/**
* Creates the widget.
* @private
*/
_create: function() {
var alerts = this.element.find( '.alert-message' );
var alerts = this.element.find( '.alert' );
for ( var i = 0, l = alerts.length; i < l; ++i ) {
var alert = $( alerts[ i ] );
......@@ -63,11 +69,12 @@
* Initializes the alert by appending the close link
* and by setting a time out for the close callback.
* @param {Object} alert The alert element.
* @private
*/
_initAlert: function( alert ) {
var self = this;
this.element.find( '.close' ).bind( 'click', function( event ) {
this.element.find( '.close' ).on( 'click', function( event ) {
self.close( alert );
event.preventDefault();
return false;
......@@ -91,12 +98,6 @@
}
return this;
},
/**
* Destructs this widget.
*/
_destroy: function() {
// Nothing here yet...
}
} );
......
/*!
* BootDropdown jQuery UI widget file.
* @author Christoffer Niska <ChristofferNiska@gmail.com>
* @copyright Copyright &copy; Christoffer Niska 2011-
* @license http://www.opensource.org/licenses/bsd-license.php New BSD License
* @see http://twitter.github.com/bootstrap
*/
( function( $ ) {
"use strict" // set strict mode
/**
* BootDropdown class.
* @class jQuery.ui.bootDropdown
* @augments jQuery.ui.bootWidget
*/
var widget = $.extend( {}, $.ui.bootWidget.prototype, {
/**
* The name of the widget.
* @type String
*/
name: 'dropdown',
/**
* Widget options.
* - trigger: Trigger type. Valid values are 'click' and 'hover', default to 'click'.
* - open: Whether to open the dropdown by default.
* @type Object
*/
options: {
trigger: 'click',
open: false
},
/**
* Creates the widget.
*/
_create: function() {
var self = this,
parent = this.element.parent(),
dropdown = parent.find( '.dropdown-menu' ),
items = parent.find( '.dropdown-menu > li' );
if (!this.options.open) {
self.close();
}
if ( this.options.trigger === 'click' ) {
this.element.toggle( function() {
self.open();
}, function() {
self.close();
} );
} else {
this.element.on( 'mouseenter', function() {
self.open();
} );
dropdown.on( 'mouseleave', function() {
self.close();
} );
}
items.on( 'click', function() {
self.close();
} );
},
/**
* Opens the dropdown menu.
*/
open: function() {
var dropdown = this.element.parent();
dropdown.addClass( 'open' );
return this;
},
/**
* Closes the dropdown menu.
*/
close: function() {
var dropdown = this.element.parent();
dropdown.removeClass( 'open' );
return this;
}
} );
/**
* BootDropdown jQuery UI widget.
*/
$.widget( 'ui.bootDropdown', widget );
} )( jQuery );
\ No newline at end of file
/*!
* Bootstrap Modal jQuery UI widget file.
* BootModal jQuery UI widget file.
* @author Christoffer Niska <ChristofferNiska@gmail.com>
* @copyright Copyright &copy; Christoffer Niska 2011-
* @license http://www.opensource.org/licenses/bsd-license.php New BSD License
......@@ -9,6 +9,11 @@
( function( $ ) {
"use strict" // set strict mode
/**
* BootModal class.
* @class jQuery.ui.bootModal
* @augments jQuery.ui.bootWidget
*/
var widget = $.extend( {}, $.ui.bootWidget.prototype, {
/**
* The name of the widget.
......@@ -47,6 +52,7 @@
},
/**
* Creates the widget.
* @private
*/
_create: function() {
var header = this._createHeader(),
......@@ -65,6 +71,7 @@
},
/**
* Initializes the widget.
* @private
*/
_init: function() {
var self = this;
......@@ -113,6 +120,7 @@
/**
* Creates the modal header element.
* @return {Object} The element.
* @private
*/
_createHeader: function() {
var header = $( '<div class="modal-header">' );
......@@ -129,6 +137,7 @@
/**
* Creates the modal body element.
* @return {Object} The element.
* @private
*/
_createBody: function() {
return $( '<div class="modal-body">' )
......@@ -137,6 +146,7 @@
/**
* Creates the modal footer element.
* @return {Object} The element.
* @private
*/
_createFooter: function() {
var i, l, config, button,
......@@ -154,6 +164,7 @@
* Creates a button element from the given config array.
* @param {Array} config The button config.
* @returns {Object} The element.
* @private
*/
_createButton: function( config ) {
var button = $( '<button>' ),
......@@ -181,6 +192,8 @@
},
/**
* Creates a close link for this modal.
* @returns {Object} The element.
* @private
*/
_createCloseLink: function() {
var self = this;
......@@ -195,6 +208,7 @@
/**
* Returns the backdrop element creating it if it doesn't exist.
* @returns {Object} The element.
* @private
*/
_getBackdrop: function() {
var self = this,
......@@ -217,7 +231,8 @@
return backdrop;
},
/**
* Destructs the widget.
* Destroys the widget.
* @private
*/
_destroy: function() {
if ( this.options.escapeClose ) {
......
/*!
* Bootstrap Popover jQuery UI widget file.
* BootPopover jQuery UI widget file.
* @author Christoffer Niska <ChristofferNiska@gmail.com>
* @copyright Copyright &copy; Christoffer Niska 2011-
* @license http://www.opensource.org/licenses/bsd-license.php New BSD License
......@@ -9,7 +9,12 @@
( function( $ ) {
"use strict" // set strict mode
var widget = $.extend( {}, $.ui.bootTwipsy.prototype, {
/**
* BootPopover class.
* @class jQuery.ui.bootPopover
* @augments jQuery.ui.bootTooltip
*/
var widget = $.extend( {}, $.ui.bootTooltip.prototype, {
/**
* The name of the widget.
* @type String
......@@ -22,17 +27,17 @@
tooltipId: 'popover',
/**
* Widget options.
* - placement: The placement of the tooltip. Valid values are: "above", "right", "below" and "left".
* - placement: The placement of the tooltip. Valid values are: "top", "right", "bottom" and "left".
* - showEvent: The event for showing the tooltip.
* - hideEvent: The event for hiding the tooltip.
* - offset: Pixel offset of the tooltip.
* - live: Indicates whether to use jQuery.live or jQuery.bind.
* - live: Indicates whether to use jQuery.live or jQuery.on.
* @type Object
*/
options: {
placement: 'above',
showEvent: 'mouseenter',
hideEvent: 'mouseleave',
placement: 'right',
eventIn: 'mouseenter',
eventOut: 'mouseleave',
offset: 0,
live: false
},
......@@ -44,8 +49,8 @@
var tooltip = this._getTooltip(),
position;
tooltip.find( '.title' ).html( this.element.attr( 'data-title' ) );
tooltip.find( '.content p' ).html( this.element.attr( 'data-content' ) );
tooltip.find( '.popover-title' ).html( this.element.attr( 'data-original-title' ) );
tooltip.find( '.popover-content p' ).html( this.element.attr( 'data-content' ) );
position = this._pos();
tooltip.css( {
top: position.top,
......@@ -54,13 +59,16 @@
this.visible = true;
}
return this;
},
/**
* Creates the tooltip element and appends it to the body element.
* @returns {HTMLElement} The element.
* @private
*/
_createTooltip: function() {
var tooltip = $( '<div class="popover">' )
var tooltip = $( '<div class="popover in">' )
.attr( 'id', this.tooltipId )
.addClass( this.options.placement )
.appendTo( 'body' )
......@@ -69,7 +77,7 @@
$( '<div class="arrow">' )
.appendTo( tooltip );
$( '<div class="inner"><h3 class="title"></h3><div class="content"><p></p></div>' )
$( '<div class="popover-inner"><h3 class="popover-title"></h3><div class="popover-content"><p></p></div>' )
.appendTo( tooltip );
return tooltip;
......
/*!
* Bootstrap Tabs jQuery UI widget file.
* BootTabbed jQuery UI widget file.
* @author Christoffer Niska <ChristofferNiska@gmail.com>
* @copyright Copyright &copy; Christoffer Niska 2011-
* @license http://www.opensource.org/licenses/bsd-license.php New BSD License
......@@ -9,6 +9,11 @@
( function( $ ) {
"use strict" // set strict mode
/**
* BootTabbed class.
* @class jQuery.ui.bootTabbed
* @augments jQuery.ui.bootWidget
*/
var widget = $.extend( {}, $.ui.bootWidget.prototype, {
/**
* The name of the widget.
......@@ -23,20 +28,27 @@
},
/**
* Creates the widget.
* @private
*/
_create: function() {
var self = this,
title = this.element.attr( 'title' );
title = this.element.attr( 'data-title' ) || this.element.attr( 'title' );
this.element.bind('click', function( event ) {
this.element.on('click', function( event ) {
self._tab( event );
});
},
/**
* Activates or de-activates a single tab.
* @param {HTMLElement} element The element.
* @param {HTMLElement} container The container.
* @private
*/
_activate: function( element, container ) {
container.find( '> .active' )
.removeClass( 'active' )
.find( '> .dropdown-menu > .active' )
.removeClass( 'active' );
.removeClass( 'active' )
.find( '> .dropdown-menu > .active' )
.removeClass( 'active' );
element.addClass( 'active' );
......@@ -44,8 +56,12 @@
element.closest( 'li.dropdown' ).addClass( 'active' );
}
},
/**
* Activates a specific tab.
* @param {Event} event The click event.
* @private
*/
_tab: function( event ) {
console.log('tab clicked');
var ul = this.element.closest( 'ul:not(.dropdown-menu)' ),
href = this.element.attr( 'href' ),
previous, pane;
......@@ -54,7 +70,7 @@
event.preventDefault();
if ( !this.element.parent( 'li' ).hasClass( 'active' ) ) {
previous = ul.find( '.active a' ).last()[0];
previous = ul.find( '.active a' ).last()[ 0 ];
pane = $( href );
this._activate( this.element.parent( 'li' ), ul );
......@@ -66,18 +82,12 @@
} );
}
}
},
/**
* Destructs this widget.
*/
_destroy: function() {
// Nothing here yet...
}
}
} );
/**
* BootTabs jQuery UI widget.
* BootTabbed jQuery UI widget.
*/
$.widget( 'ui.bootTabs', widget );
$.widget( 'ui.bootTabbed', widget );
} )( jQuery );
\ No newline at end of file
/*!
* Bootstrap Twipsy jQuery UI widget file.
* BootTooltip jQuery UI widget file.
* @author Christoffer Niska <ChristofferNiska@gmail.com>
* @copyright Copyright &copy; Christoffer Niska 2011-
* @license http://www.opensource.org/licenses/bsd-license.php New BSD License
......@@ -9,17 +9,24 @@
( function( $ ) {
"use strict" // set strict mode
// todo: fix live binder, currently it doesn't work.
// todo: implement support for transition effects.
/**
* BootTooltip class.
* @class jQuery.ui.bootTooltip
* @augments jQuery.ui.bootWidget
*/
var widget = $.extend( {}, $.ui.bootWidget.prototype, {
/**
* The name of the widget.
* @type String
*/
name: 'twipsy',
name: 'tooltip',
/**
* The value of the tooltip id attribute.
* @type String
*/
tooltipId: 'twipsy',
tooltipId: 'tooltip',
/**
* Indicates whether the tooltip is visible.
* @type Boolean
......@@ -27,38 +34,38 @@
visible: false,
/**
* Widget options.
* - placement: The placement of the tooltip. Valid values are: "above", "right", "below" and "left".
* - placement: The placement of the tooltip. Valid values are: "top", "right", "bottom" and "left".
* - showEvent: The event for showing the tooltip.
* - hideEvent: The event for hiding the tooltip.
* - offset: Pixel offset of the tooltip.
* - live: Indicates whether to use jQuery.live or jQuery.bind.
* - live: Indicates whether to use jQuery.live or jQuery.on.
* @type Object
*/
options: {
placement: 'above',
showEvent: 'mouseenter',
hideEvent: 'mouseleave',
placement: 'top',
eventIn: 'mouseenter',
eventOut: 'mouseleave',
title: '',
offset: 0,
live: false
},
/**
* Creates the widget.
* @private
*/
_create: function() {
var self = this,
element = self.element,
options = self.options,
title = element.attr( 'title' ),
binder = options.live ? 'live' : 'bind';
title = this.element.attr( 'data-title' ) || this.element.attr( 'title' ) || this.options.title,
binder = this.options.live ? 'live' : 'on';
if ( title && title.length > 0 ) {
element.removeAttr( 'title' ); // remove the title to prevent it being displayed
element.attr( 'data-title', title );
this.element.removeAttr( 'title' ); // remove the title to prevent it being displayed
this.element.attr( 'data-original-title', title );
element[ binder ]( options.showEvent, function() {
this.element[ binder ]( this.options.eventIn, function() {
self.show();
});
element[ binder ]( options.hideEvent, function() {
this.element[ binder ]( this.options.eventOut, function() {
self.hide();
});
}
......@@ -71,12 +78,12 @@
var tooltip = this._getTooltip(),
position;
tooltip.find( '.twipsy-inner' ).html( this.element.attr( 'data-title' ) );
tooltip.find( '.tooltip-inner' ).html( this.element.attr( 'data-original-title' ) );
position = this._pos();
tooltip.css( {
top: position.top,
left: position.left
} ).show(); // todo: implement support for effects.
} ).show();
this.visible = true;
}
......@@ -89,15 +96,28 @@
hide: function() {
if ( this.visible ) {
var tooltip = this._getTooltip();
tooltip.hide(); // todo: implement support for effects.
tooltip.hide();
this.visible = false;
}
return this;
},
/**
* Toggles the tooltip.
*/
toggle: function() {
if ( this.visible ) {
this.hide();
} else {
this.show();
}
return this;
},
/**
* Calculates the position for the tooltip based on the element.
* @return {Object} The offset, an object with "top" and "left" properties.
* @private
*/
_pos: function() {
var twipsy = this._getTooltip(),
......@@ -107,8 +127,8 @@
left = 0;
switch ( this.options.placement ) {
case 'above':
top = offset.top - twipsy.outerHeight() - this.options.offset,
case 'top':
top = offset.top - twipsy.outerHeight() - this.options.offset;
left = offset.left + ( ( element.outerWidth() - twipsy.outerWidth() ) / 2 );
break;
......@@ -117,8 +137,8 @@
left = offset.left + element.outerWidth() - this.options.offset;
break;
case 'below':
top = offset.top + element.outerHeight() + this.options.offset,
case 'bottom':
top = offset.top + element.outerHeight() + this.options.offset;
left = offset.left + ( ( element.outerWidth() - twipsy.outerWidth() ) / 2 );
break;
......@@ -136,18 +156,19 @@
/**
* Creates the tooltip element and appends it to the body element.
* @returns {HTMLElement} The element.
* @private
*/
_createTooltip: function() {
var tooltip = $( '<div class="twipsy">' )
var tooltip = $( '<div class="tooltip in">' )
.attr( 'id', this.tooltipId )
.addClass( this.options.placement )
.appendTo( 'body' )
.hide();
$( '<div class="twipsy-arrow">' )
$( '<div class="tooltip-arrow">' )
.appendTo( tooltip );
$( '<div class="twipsy-inner">' )
$( '<div class="tooltip-inner">' )
.appendTo( tooltip );
return tooltip;
......@@ -156,6 +177,7 @@
* Returns the tooltip element from the body element.
* The element is created if it doesn't already exist.
* @return {HTMLElement} The element.
* @private
*/
_getTooltip: function() {
var tooltip = $( '#' + this.tooltipId );
......@@ -167,17 +189,18 @@
return tooltip;
},
/**
* Destructs this widget.
* Destroys the widget.
* @private
*/
_destroy: function() {
this.element.unbind( this.options.showEvent );
this.element.unbind( this.options.hideEvent );
this.element.unbind( this.options.eventIn );
this.element.unbind( this.options.eventOut );
}
} );
/**
* BootTwipsy jQuery UI widget.
* BootTooltip jQuery UI widget.
*/
$.widget( 'ui.bootTwipsy', widget );
$.widget( 'ui.bootTooltip', widget );
} )( jQuery );
\ No newline at end of file
......@@ -9,12 +9,23 @@
(function($) {
"use strict" // set strict mode
/**
* BootWidget class.
* @class jQuery.ui.bootWidget
*/
var widget = {
/**
* The name of the widget.
* @type String
*/
name: 'widget'
name: 'widget',
/**
* Destroys the widget.
* @private
*/
_destroy: function() {
// Base class does nothing.
}
};
/**
......
......@@ -18,18 +18,39 @@ class Bootstrap extends CApplicationComponent
*/
public function init()
{
Yii::setPathOfAlias('bootstrap', realpath(dirname(__FILE__).'/..'));
if (!Yii::getPathOfAlias('bootstrap'))
Yii::setPathOfAlias('bootstrap', realpath(dirname(__FILE__).'/..'));
}
/**
* Registers the Bootstrap CSS.
*/
public function registerCoreCss()
public function registerCss()
{
Yii::app()->clientScript->registerCssFile($this->getAssetsUrl().'/css/bootstrap.min.css');
}
/**
* Registers the Bootstrap responsive CSS.
* @since 0.9.8
*/
public function registerResponsiveCss()
{
Yii::app()->clientScript->registerCssFile($this->getAssetsUrl().'/css/bootstrap-responsive.min.css');
}
/**
* Registers the Bootstrap core JavaScript functionality.
* @since 0.9.8
*/
public function registerCoreScript()
{
$this->registerScriptFile('jquery.ui.boot-dropdown.js');
Yii::app()->clientScript->registerScript(__CLASS__, "jQuery('.dropdown-toggle[data-toggle=\"dropdown\"]').bootDropdown();");
}
/**
* Registers a Bootstrap JavaScript file.
* @param string $fileName the file name.
* @param integer $position the position of the JavaScript file.
......
......@@ -29,7 +29,7 @@ class BootAlert extends BootWidget
public function init()
{
parent::init();
$this->registerScriptFile('jquery.ui.bootalert.js');
$this->registerScriptFile('jquery.ui.boot-alert.js');
}
/**
......
......@@ -13,7 +13,7 @@ class BootDetailView extends CDetailView
/**
* @var array the HTML attributes for the container.
*/
public $htmlOptions = array('class'=>'detail-view');
public $htmlOptions = array('class'=>'table table-striped table-condensed detail-view');
/**
* @var string the URL of the CSS file used by this detail view.
* Defaults to false, meaning that no CSS will be included.
......
......@@ -8,6 +8,19 @@
class BootInput extends CInputWidget
{
// The different input types.
const TYPE_CHECKBOX = 'checkbox';
const TYPE_CHECKBOXES = 'checkboxlist';
const TYPE_DROPDOWN = 'dropdownlist';
const TYPE_FILE = 'filefield';
const TYPE_PASSWORD = 'password';
const TYPE_RADIO = 'radiobutton';
const TYPE_RADIOS = 'radiobuttonlist';
const TYPE_TEXTAREA = 'textarea';
const TYPE_TEXT = 'textfield';
const TYPE_CAPTCHA = 'captcha';
const TYPE_UNEDITABLE = 'uneditable';
/**
* @var BootActiveForm the associated form widget.
*/
......@@ -29,25 +42,21 @@ class BootInput extends CInputWidget
/**
* Initializes the widget.
* This method is called by {@link CBaseController::createWidget}
* and {@link CBaseController::beginWidget} after the widget's
* properties have been initialized.
*/
public function init()
{
if ($this->form === null)
throw new CException('Failed to initialize widget! Form is not set.');
throw new CException(__CLASS__.': Failed to initialize widget! Form is not set.');
if ($this->model === null)
throw new CException('Failed to initialize widget! Model is not set.');
throw new CException(__CLASS__.': Failed to initialize widget! Model is not set.');
if ($this->type === null)
throw new CException('Failed to initialize widget! Input type is not set.');
throw new CException(__CLASS__.': Failed to initialize widget! Input type is not set.');
}
/**
* Executes the widget.
* This method is called by {@link CBaseController::endWidget}.
* Runs the widget.
*/
public function run()
{
......@@ -56,57 +65,61 @@ class BootInput extends CInputWidget
switch ($this->type)
{
case 'checkbox':
case self::TYPE_CHECKBOX:
$this->checkBox();
break;
case 'checkboxlist':
case self::TYPE_CHECKBOXES:
$this->checkBoxList();
break;
case 'dropdownlist':
case self::TYPE_DROPDOWN:
$this->dropDownList();
break;
case 'filefield':
case self::TYPE_FILE:
$this->fileField();
break;
case 'password':
case self::TYPE_PASSWORD:
$this->passwordField();
break;
case 'radiobutton':
case self::TYPE_RADIO:
$this->radioButton();
break;
case 'radiobuttonlist':
case self::TYPE_RADIOS:
$this->radioButtonList();
break;
case 'textarea':
case self::TYPE_TEXTAREA:
$this->textArea();
break;
case 'textfield':
case self::TYPE_TEXT:
$this->textField();
break;
case 'captcha':
case self::TYPE_CAPTCHA:
$this->captcha();
break;
case 'uneditable':
case self::TYPE_UNEDITABLE:
$this->uneditableField();
break;
default:
throw new CException('Failed to run widget! Input type is invalid.');
throw new CException(__CLASS__.': Failed to run widget! Type is invalid.');
}
echo '</div>';
}
/**
* Renders a checkbox.
* @return string the rendered content
*/
protected function checkBox()
{
echo '<div class="controls">';
......@@ -117,6 +130,10 @@ class BootInput extends CInputWidget
echo '</label></div>';
}
/**
* Renders a list of checkboxes.
* @return string the rendered content
*/
protected function checkBoxList()
{
echo $this->getLabel().'<div class="controls">';
......@@ -125,6 +142,10 @@ class BootInput extends CInputWidget
echo '</div>';
}
/**
* Renders a drop down list (select).
* @return string the rendered content
*/
protected function dropDownList()
{
echo $this->getLabel().'<div class="controls">';
......@@ -133,6 +154,10 @@ class BootInput extends CInputWidget
echo '</div>';
}
/**
* Renders a file field.
* @return string the rendered content
*/
protected function fileField()
{
echo $this->getLabel().'<div class="controls">';
......@@ -141,6 +166,10 @@ class BootInput extends CInputWidget
echo '</div>';
}
/**
* Renders a password field.
* @return string the rendered content
*/
protected function passwordField()
{
echo $this->getLabel().'<div class="controls">';
......@@ -149,6 +178,10 @@ class BootInput extends CInputWidget
echo '</div>';
}
/**
* Renders a radio button.
* @return string the rendered content
*/
protected function radioButton()
{
echo '<div class="controls">';
......@@ -159,6 +192,10 @@ class BootInput extends CInputWidget
echo '</label></div>';
}
/**
* Renders a list of radio buttons.
* @return string the rendered content
*/
protected function radioButtonList()
{
echo $this->getLabel().'<div class="controls">';
......@@ -167,6 +204,10 @@ class BootInput extends CInputWidget
echo '</div>';
}
/**
* Renders a textarea.
* @return string the rendered content
*/
protected function textArea()
{
echo $this->getLabel().'<div class="controls">';
......@@ -175,6 +216,10 @@ class BootInput extends CInputWidget
echo '</div>';
}
/**
* Renders a text field.
* @return string the rendered content
*/
protected function textField()
{
echo $this->getLabel().'<div class="controls">';
......@@ -183,6 +228,10 @@ class BootInput extends CInputWidget
echo '</div>';
}
/**
* Renders a CAPTCHA.
* @return string the rendered content
*/
protected function captcha()
{
echo $this->getLabel().'<div class="controls"><div class="captcha">';
......@@ -192,6 +241,10 @@ class BootInput extends CInputWidget
echo '</div></div>';
}
/**
* Renders an uneditable field.
* @return string the rendered content
*/
protected function uneditableField()
{
echo $this->getLabel().'<div class="controls">';
......
......@@ -7,6 +7,7 @@
*/
Yii::import('zii.widgets.CListView');
class BootListView extends CListView
{
/**
......
......@@ -23,7 +23,7 @@ class BootModal extends BootWidget
public function init()
{
parent::init();
$this->registerScriptFile('jquery.ui.bootmodal.js');
$this->registerScriptFile('jquery.ui.boot-modal.js');
$id = $this->getId();
if (isset($this->htmlOptions['id']))
......@@ -32,7 +32,7 @@ class BootModal extends BootWidget
$this->htmlOptions['id'] = $id;
$options = !empty($this->options) ? CJavaScript::encode($this->options) : '';
$this->registerScript(__CLASS__.'#'.$id,"jQuery('#{$id}').bootModal($options);");
$this->registerScript(__CLASS__.'#'.$id, "jQuery('#{$id}').bootModal($options);");
echo CHtml::openTag($this->tagName, $this->htmlOptions).PHP_EOL;
}
......
<?php
/**
* BootNav class file.
* BootNavbar class file.
* @author Christoffer Niska <ChristofferNiska@gmail.com>
* @copyright Copyright &copy; Christoffer Niska 2011-
* @license http://www.opensource.org/licenses/bsd-license.php New BSD License
......@@ -11,8 +11,9 @@ Yii::import('bootstrap.widgets.BootWidget');
/**
* Bootstrap navigation widget with support for dropdown menus.
* @since 0.9.7
* @todo Add collapse support. http://twitter.github.com/bootstrap/javascript.html#collapse
*/
class BootNav extends BootWidget
class BootNavbar extends BootWidget
{
/**
* @var string the text for the brand.
......@@ -27,10 +28,10 @@ class BootNav extends BootWidget
*/
public $brandOptions = array();
/**
* @var array navigation item groups.
* @var array navigation items.
* @since 0.9.8
*/
public $groups = array();
public $items = array();
/**
* @var boolean flag that indicates if the nav should use the full width available. Defaults to false.
* @since 0.9.8
......@@ -79,37 +80,24 @@ class BootNav extends BootWidget
echo CHtml::openTag('div', $this->htmlOptions);
echo '<div class="navbar-inner"><div class="'.$containerCssClass.'">';
//todo: Add support for collapse on narrow layouts.
//echo '<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"></a>';
echo '<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"></a>';
echo CHtml::openTag('a', $this->brandOptions).$this->brand.'</a>';
echo '<div class="nav-collapse">';
foreach ($this->groups as $group)
foreach ($this->items as $item)
{
if (!isset($group['items']))
$group['items'] = array();
if (!isset($group['itemTemplate']))
$group['itemTemplate'] = '{menu}';
if (!isset($group['encodeLabel']))
$group['encodeLabel'] = true;
if (!isset($group['htmlOptions']))
$group['htmlOptions'] = array();
if (isset($group['htmlOptions']['class']))
$group['htmlOptions']['class'] .= ' nav';
if (is_string($item))
echo $item;
else
$group['htmlOptions']['class'] = 'nav';
{
if (!isset($item['class']))
$item['class'] = 'bootstrap.widgets.BootMenu';
$className = $item['class'];
unset($item['class']);
$this->controller->widget('bootstrap.widgets.BootMenu', array(
'type'=>'', // no default styling
'items'=>$group['items'],
'itemTemplate'=>$group['itemTemplate'],
'encodeLabel'=>$group['encodeLabel'],
'htmlOptions'=>$group['htmlOptions'],
));
$this->controller->widget($className, $item);
}
}
echo '</div></div></div></div>';
......
......@@ -52,6 +52,7 @@ class BootPager extends CLinkPager
return array();
list ($beginPage, $endPage) = $this->getPageRange();
$currentPage = $this->getCurrentPage(false); // currentPage is calculated in getPageRange()
$buttons = array();
......@@ -63,15 +64,17 @@ class BootPager extends CLinkPager
// prev page
if (($page = $currentPage - 1) < 0)
$page = 0;
$buttons[] = $this->createPageButton($this->prevPageLabel, $page, 'previous', $currentPage <= 0, false);
// internal pages
for ($i = $beginPage; $i <= $endPage; ++$i)
$buttons[]=$this->createPageButton($i + 1, $i, '', false, $i == $currentPage);
$buttons[] = $this->createPageButton($i + 1, $i, '', false, $i == $currentPage);
// next page
if (($page = $currentPage+1)>=$pageCount-1)
if (($page = $currentPage+1) >= $pageCount-1)
$page = $pageCount-1;
$buttons[] = $this->createPageButton($this->nextPageLabel, $page, 'next', $currentPage >= ($pageCount - 1), false);
// last page
......
......@@ -6,18 +6,18 @@
* @license http://www.opensource.org/licenses/bsd-license.php New BSD License
*/
Yii::import('bootstrap.widgets.BootWidget');
Yii::import('bootstrap.widgets.BootTooltip');
/**
* Bootstrap rich-content tooltip widget.
* @since 0.9.2
*/
class BootPopover extends BootWidget
class BootPopover extends BootTooltip
{
/**
* @var string the CSS selector to use for selecting the pop-over elements.
*/
public $selector = '.pop';
public $selector = 'a[rel="popover"]';
/**
* Initializes the widget.
......@@ -25,8 +25,7 @@ class BootPopover extends BootWidget
public function init()
{
parent::init();
$this->registerScriptFile('jquery.ui.boottwipsy.js');
$this->registerScriptFile('jquery.ui.bootpopover.js');
$this->registerScriptFile('jquery.ui.boot-popover.js');
}
/**
......
......@@ -12,7 +12,7 @@ Yii::import('bootstrap.widgets.BootWidget');
* Bootstrap JavaScript tabs widget.
* @since 0.9.6
*/
class BootTabs extends BootWidget
class BootTabbed extends BootWidget
{
/**
* @var string the type of tabs to display. Defaults to 'tabs'.
......@@ -38,7 +38,7 @@ class BootTabs extends BootWidget
/**
* @var string the CSS selector to use for selecting the tabs elements.
*/
public $selector = '.nav-tabs li > a, .nav-pills > li > a';
public $selector = '.nav-tabs > li > a, .nav-pills > li > a';
/**
* Initializes the widget.
......@@ -46,7 +46,7 @@ class BootTabs extends BootWidget
public function init()
{
parent::init();
$this->registerScriptFile('jquery.ui.boottabs.js');
$this->registerScriptFile('jquery.ui.boot-tabs.js');
}
/**
......@@ -112,6 +112,7 @@ class BootTabs extends BootWidget
}
}
}
echo CHtml::openTag('ul', array('class'=>'nav nav-'.$this->type, 'data-'.$this->type=>$this->type));
echo $tabsOut;
echo '</ul>';
......
<?php
/**
* BootMediaGrid class file.
* BootThumbs class file.
* @author Christoffer Niska <ChristofferNiska@gmail.com>
* @copyright Copyright &copy; Christoffer Niska 2011-
* @license http://www.opensource.org/licenses/bsd-license.php New BSD License
......@@ -8,19 +8,9 @@
Yii::import('bootstrap.widgets.BootListView');
// todo: update to work with Bootstrap 2 Thumbnails.
class BootMediaGrid extends BootListView
class BootThumbs extends BootListView
{
/**
* @var string the tag name for the view container. Defaults to 'div'.
*/
public $tagName = 'div';
/**
* @var array the images to display in the media grid.
*/
public $images = array();
/**
* Renders the data items for the view.
* Each item is corresponding to a single data model instance.
* Child classes should override this method to provide the actual item rendering logic.
......@@ -31,7 +21,7 @@ class BootMediaGrid extends BootListView
if (!empty($data))
{
echo CHtml::openTag('ul', array('class'=>'media-grid'));
echo CHtml::openTag('ul', array('class'=>'thumbnails'));
$owner = $this->getOwner();
$render = $owner instanceof CController ? 'renderPartial' : 'render';
foreach($data as $i=>$item)
......@@ -40,9 +30,7 @@ class BootMediaGrid extends BootListView
$data['index'] = $i;
$data['data'] = $item;
$data['widget'] = $this;
echo CHtml::openTag('li');
$owner->$render($this->itemView,$data);
echo '</li>';
}
echo '</ul>';
......
......@@ -8,12 +8,12 @@
Yii::import('bootstrap.widgets.BootWidget');
class BootTwipsy extends BootWidget
class BootTooltip extends BootWidget
{
/**
* @var string the CSS selector to use for selecting the twipsy elements.
*/
public $selector = 'a[title], a[data-title]';
public $selector = 'a[rel="tooltip"]';
/**
* Initializes the widget.
......@@ -21,7 +21,7 @@ class BootTwipsy extends BootWidget
public function init()
{
parent::init();
$this->registerScriptFile('jquery.ui.boottwipsy.js');
$this->registerScriptFile('jquery.ui.boot-tooltip.js');
}
/**
......@@ -31,6 +31,6 @@ class BootTwipsy extends BootWidget
{
$id = $this->getId();
$options = !empty($this->options) ? CJavaScript::encode($this->options) : '';
$this->registerScript(__CLASS__.'#'.$id,"jQuery('{$this->selector}').bootTwipsy($options);");
$this->registerScript(__CLASS__.'#'.$id,"jQuery('{$this->selector}').bootTooltip($options);");
}
}
......@@ -25,7 +25,7 @@ class BootWidget extends CWidget
Yii::app()->clientScript->registerCoreScript('jquery');
Yii::app()->clientScript->registerCoreScript('jquery.ui');
$this->registerScriptFile('jquery.ui.bootwidget.js');
$this->registerScriptFile('jquery.ui.boot-widget.js');
}
/**
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment