You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@rave.apache.org by ca...@apache.org on 2012/04/17 21:21:08 UTC
svn commit: r1327232 - in /rave/branches/bootstrap/rave-portal-resources/src:
main/webapp/WEB-INF/jsp/views/ main/webapp/WEB-INF/tags/ main/webapp/css/
main/webapp/script/ test/javascript/
Author: carlucci
Date: Tue Apr 17 19:21:07 2012
New Revision: 1327232
URL: http://svn.apache.org/viewvc?rev=1327232&view=rev
Log:
RAVE-532: Bootstrap-enable widget controls. Applying patch to /bootstrap branch supplied by Jacob Hilker.
Modified:
rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp
rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/tags/region_widget.tag
rave/branches/bootstrap/rave-portal-resources/src/main/webapp/css/default.css
rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave.js
rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave_layout.js
rave/branches/bootstrap/rave-portal-resources/src/test/javascript/raveSpec.js
Modified: rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp
URL: http://svn.apache.org/viewvc/rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp?rev=1327232&r1=1327231&r2=1327232&view=diff
==============================================================================
--- rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp (original)
+++ rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/jsp/views/page.jsp Tue Apr 17 19:21:07 2012
@@ -1,3 +1,4 @@
+<%@ taglib prefix="portal" uri="http://www.apache.org/rave/tags" %>
<%--
Licensed to the Apache Software Foundation (ASF) under one
or more contributor license agreements. See the NOTICE file
@@ -194,21 +195,35 @@
</div>
<fmt:message key="widget.menu.movetopage" var="moveWidgetToPageTitle"/>
- <div id="moveWidgetDialog" title="${moveWidgetToPageTitle}" class="dialog hidden">
- <div><fmt:message key="widget.menu.movethiswidget"/></div>
- <form id="moveWidgetForm">
- <select id="moveToPageId">
- <c:forEach var="userPage" items="${pages}">
- <c:if test="${userPage.entityId != page.entityId}">
- <option value="${userPage.entityId}">
- <c:out value="${userPage.name}"/>
- </option>
- </c:if>
- </c:forEach>
- </select>
- </fieldset>
- </form>
-</div>
+ <div id="moveWidgetModal" class="modal hide" data-backdrop="static">
+ <div class="modal-header">
+ <a href="#" class="close" data-dismiss="modal">×</a>
+ <h3><fmt:message key="widget.menu.movethiswidget"/></h3>
+ </div>
+ <div class="modal-body">
+ <form id="moveWidgetForm" class="form-horizontal">
+ <fieldset>
+ <div class="control-group">
+ <div class="controls">
+ <select id="moveToPageId">
+ <c:forEach var="userPage" items="${pages}">
+ <c:if test="${userPage.entityId != page.entityId}">
+ <option value="${userPage.entityId}">
+ <c:out value="${userPage.name}"/>
+ </option>
+ </c:if>
+ </c:forEach>
+ </select>
+ </div>
+ </div>
+ </fieldset>
+ </form>
+ </div>
+ <div class="modal-footer">
+ <a href="#" class="btn" onclick="$('#moveWidgetModal').modal('hide');"><fmt:message key="_rave_client.common.cancel"/></a>
+ <a href="#" class="btn btn-primary" onclick="rave.layout.moveWidgetToPage($('#moveWidgetModal').data('regionWidgetId'));"><fmt:message key="_rave_client.common.move"/></a>
+ </div>
+ </div>
<portal:register-init-script location="${'BEFORE_RAVE'}">
<script>
//Define the global widgets map. This map will be populated by RegionWidgetRender providers.
@@ -225,4 +240,4 @@
rave.layout.init();
});
</script>
-</portal:register-init-script>
\ No newline at end of file
+</portal:register-init-script>
Modified: rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/tags/region_widget.tag
URL: http://svn.apache.org/viewvc/rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/tags/region_widget.tag?rev=1327232&r1=1327231&r2=1327232&view=diff
==============================================================================
--- rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/tags/region_widget.tag (original)
+++ rave/branches/bootstrap/rave-portal-resources/src/main/webapp/WEB-INF/tags/region_widget.tag Tue Apr 17 19:21:07 2012
@@ -32,7 +32,7 @@ Template for rendering a RegionWidget in
<div class="widget-wrapper<c:if test="${isLocked}"> widget-wrapper-locked</c:if>" id="widget-${regionWidget.entityId}-wrapper">
<div class="widget-title-bar<c:if test="${isLocked}"> widget-title-bar-locked</c:if>">
<c:if test="${!isLocked}">
- <span id="widget-${regionWidget.entityId}-collapse" class="widget-toolbar-toggle-collapse" title="<fmt:message key="widget.chrome.toggle"/>"></span>
+ <div id="widget-${regionWidget.entityId}-collapse" class="widget-toolbar-toggle-collapse" title="<fmt:message key="widget.chrome.toggle"/>"></div>
</c:if>
<div id="widget-${regionWidget.entityId}-title" class="widget-title">
<c:choose>
@@ -44,44 +44,61 @@ Template for rendering a RegionWidget in
</c:otherwise>
</c:choose>
</div>
+
<%-- These are toolbar buttons --%>
- <div id="widget-${regionWidget.entityId}-toolbar" style="float:right;" <c:if test="${isLocked}">class="hidden"</c:if>>
- <div id="widget-${regionWidget.entityId}-widget-menu-wrapper" class="widget-menu-wrapper">
- <span id="widget-${regionWidget.entityId}-menu-button" class="widget-menu-button ui-icon ui-icon-gear" title="<fmt:message key="widget.menu.title"/>"></span>
- <div id="widget-${regionWidget.entityId}-menu" class="widget-menu">
+ <div id="widget-${regionWidget.entityId}-toolbar" class="widget-toolbar <c:if test="${isLocked}">hidden</c:if>">
+ <div id="widget-${regionWidget.entityId}-widget-menu-wrapper" class="dropdown widget-menu-wrapper">
+ <a id="widget-${regionWidget.entityId}-menu-button" class="dropdown-toggle" data-toggle="dropdown">
+ <i class="icon-cog"></i>
+ </a>
+ <ul id="widget-${regionWidget.entityId}-menu" class="dropdown-menu widget-menu">
<%--
By default the edit prefs item is disabled.
Each provider's widget initialization will be responsible for enabling this item
if the widget has preferences to be edited
--%>
- <div id="widget-${regionWidget.entityId}-menu-editprefs-item" class="widget-menu-item widget-menu-item-disabled">
- <fmt:message key="widget.menu.editprefs"/>
- </div>
- <div id="widget-${regionWidget.entityId}-menu-maximize-item" class="widget-menu-item">
- <fmt:message key="widget.menu.maximize"/>
- </div>
- <div id="widget-${regionWidget.entityId}-menu-move-item" class="widget-menu-item<c:if test='${hasOnlyOnePage}'> widget-menu-item-disabled</c:if>">
- <fmt:message key="widget.menu.movetopage"/>
- </div>
- <div id="widget-${regionWidget.entityId}-menu-delete-item" class="widget-menu-item">
- <fmt:message key="widget.menu.delete"/>
- </div>
- <div id="widget-${regionWidget.entityId}-menu-about-item" class="widget-menu-item widget-menu-item-divider">
- <fmt:message key="widget.menu.about"/>
- </div>
- </div>
+ <li id="widget-${regionWidget.entityId}-menu-editprefs-item" class="menu-item-disabled">
+ <a href="#">
+ <fmt:message key="widget.menu.editprefs"/>
+ </a>
+ </li>
+ <li id="widget-${regionWidget.entityId}-menu-maximize-item">
+ <a href="#">
+ <fmt:message key="widget.menu.maximize"/>
+ </a>
+ </li>
+ <li id="widget-${regionWidget.entityId}-menu-move-item" <c:if test='${hasOnlyOnePage}'>class="menu-item-disabled"</c:if>>
+ <a href="#">
+ <fmt:message key="widget.menu.movetopage"/>
+ </a>
+ </li>
+ <li id="widget-${regionWidget.entityId}-menu-delete-item">
+ <a href="#">
+ <fmt:message key="widget.menu.delete"/>
+ </a>
+ </li>
+ <li class="divider"></li>
+ <li id="widget-${regionWidget.entityId}-menu-about-item">
+ <a href="#">
+ <fmt:message key="widget.menu.about"/>
+ </a>
+ </li>
+ </ul>
</div>
+
<%-- the minimize widget button, which is hidden by default and only displays in maximized view --%>
- <button id="widget-${regionWidget.entityId}-min"
- class="widget-toolbar-btn widget-toolbar-btn-min"></button>
+ <span id="widget-${regionWidget.entityId}-min" class="widget-toolbar-btn widget-toolbar-btn-min">
+ <i class="icon-resize-small"></i>
+ </span>
</div>
+
<%-- if widget is disabled then display notification in titlebar --%>
<c:if test="${regionWidget.widget.disableRendering}">
- <span id="widget-${regionWidget.entityId}-disabled" class="widget-disabled-icon ui-icon ui-icon-alert" title="<fmt:message key="widget.chrome.disabled"/>"></span>
+ <div id="widget-${regionWidget.entityId}-disabled" class="widget-disabled-icon ui-icon ui-icon-alert" title="<fmt:message key="widget.chrome.disabled"/>"></div>
</c:if>
</div>
<div class="widget-prefs" id="widget-${regionWidget.entityId}-prefs-content"></div>
<div class="widget" id="widget-${regionWidget.entityId}-body">
<portal:render-widget regionWidget="${regionWidget}" />
</div>
-</div>
+</div>
\ No newline at end of file
Modified: rave/branches/bootstrap/rave-portal-resources/src/main/webapp/css/default.css
URL: http://svn.apache.org/viewvc/rave/branches/bootstrap/rave-portal-resources/src/main/webapp/css/default.css?rev=1327232&r1=1327231&r2=1327232&view=diff
==============================================================================
--- rave/branches/bootstrap/rave-portal-resources/src/main/webapp/css/default.css (original)
+++ rave/branches/bootstrap/rave-portal-resources/src/main/webapp/css/default.css Tue Apr 17 19:21:07 2012
@@ -29,11 +29,6 @@ ul, ol, table, p {
padding: 0;
}
-h1, h2, h3, h4, h5, h6 {
- text-transform: uppercase;
-}
-
-
dt {
display: inline;
float: left;
@@ -205,14 +200,24 @@ header h1 {
}
.widget-title-bar {
- color: #FFFFFF;
- background: #767676; /* IE 7*/
- filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = "#999999", endColorstr = "#666666");
- background: -moz-linear-gradient(center top, #999 0%, #666 25%) repeat scroll 0 0 transparent;
- background: -webkit-gradient(linear, left top, left bottom, from(#999), to(#666));
+ color: #333333;
+ text-align: center;
+ vertical-align: middle;
+ background-color: #f5f5f5;
+ background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: -ms-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
+ background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
+ background-image: linear-gradient(top, #ffffff, #e6e6e6);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
+ border-color: #e6e6e6 #e6e6e6 #bfbfbf;
+ border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
+ filter: progid:dximagetransform.microsoft.gradient(enabled=false);
+
border-radius: 5px 5px 0 0;
- padding: 2px;
- border-bottom: solid 1px #CCCCCC;
+ padding: 4px 10px 4px;
box-shadow: 2px 2px 4px #666666;
}
@@ -568,25 +573,18 @@ ul.storeItems li {
visibility: hidden;
}
-button.widget-toolbar-btn {
- width: 1em;
-}
-
-button.widget-toolbar-btn-prefs {
- display: none;
+.widget-toolbar {
+ float: right;
+ cursor: pointer;
}
-button.widget-toolbar-btn-min {
+.widget-toolbar-btn-min {
display: none;
}
.widget-toolbar-toggle-collapse {
- display: inline-block;
- vertical-align: middle;
+ float: left;
cursor: pointer;
- /* IE 7 hacks for inline-block */
- zoom: 1;
- *display: inline;
}
/* Form fields */
@@ -791,49 +789,6 @@ span.error, label.error {
padding-top: 20px;
}
-/* widget menu related styles */
-.widget-menu-wrapper {
- position: relative;
- display: inline-block;
- vertical-align: middle;
- /* IE 7 hacks for inline-block */
- zoom: 1;
- *display: inline;
-}
-
-.widget-menu {
- border: 1px solid black;
- position: absolute;
- display: none;
- left: 18px;
- top: 0;
- width: 100px;
- background-color: #FFFFFF;
- z-index: 1000;
- cursor: pointer;
-}
-
-.widget-menu-item {
- padding: 3px;
- color: #000000;
-}
-
-.widget-menu-item:hover {
- background-color: #B4C4CF;
-}
-
-.widget-menu-item-disabled {
- color: #D3D3D3;
-}
-
-.widget-menu-item-divider {
- border-top: 1px solid #000000;
-}
-
-.widget-menu-button {
- cursor: pointer;
-}
-
.widget-tags-select {
font-family: Arial, Helvetica, sans-serif;
Modified: rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave.js
URL: http://svn.apache.org/viewvc/rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave.js?rev=1327232&r1=1327231&r2=1327232&view=diff
==============================================================================
--- rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave.js (original)
+++ rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave.js Tue Apr 17 19:21:07 2012
@@ -56,10 +56,8 @@ var rave = rave || (function() {
var WIDGET_PREFS_INPUT_REQUIRED_CLASS = "widget-prefs-input-required";
var WIDGET_PREFS_INPUT_FAILED_VALIDATION = "widget-prefs-input-failed-validation";
- var WIDGET_ICON_BASE_CLASS = "ui-icon";
- var WIDGET_BTN_MINIMIZE_CLASS = "ui-icon-arrowthick-1-sw";
- var WIDGET_TOGGLE_DISPLAY_COLLAPSED = "ui-icon-triangle-1-e";
- var WIDGET_TOGGLE_DISPLAY_NORMAL = "ui-icon-triangle-1-s";
+ var WIDGET_TOGGLE_DISPLAY_COLLAPSED_HTML = '<i class="icon-chevron-down"></i>';
+ var WIDGET_TOGGLE_DISPLAY_NORMAL_HTML = '<i class="icon-chevron-up"></i>';
// variable to store whether or not the
// client is a mobile device
@@ -374,7 +372,7 @@ var rave = rave || (function() {
rave.getRegionWidgetById(args.regionWidgetId).collapsed = args.collapsed;
// toggle the collapse/restore icon
- rave.toggleCollapseWidgetIcon(args.regionWidgetId);
+ rave.toggleCollapseWidgetIcon(args.regionWidgetId, args.collapsed);
// if the widget has supplied a collapse or restore
// function, invoke it so each widget provider
@@ -417,7 +415,7 @@ var rave = rave || (function() {
return markup.join("");
}
- /**
+ /**
* Utility function to validate a userPref input element
*/
function validatePrefInput(element) {
@@ -628,40 +626,36 @@ var rave = rave || (function() {
// init the widget minimize button which is hidden by default
// and only renders when widget is in maximized view
- $("#widget-" + widgetId + "-min").button({
- text: false,
- icons: {
- primary: WIDGET_BTN_MINIMIZE_CLASS
- }
- }).click({id: widgetId}, rave.minimizeWidget);
+ $("#widget-" + widgetId + "-min").click({id: widgetId}, rave.minimizeWidget);
// init the collapse/restore toggle
// conditionally style the icon and setup the event handlers
var $toggleCollapseIcon = $("#widget-" + widgetId + "-collapse");
- $toggleCollapseIcon.hide();
- $toggleCollapseIcon.addClass(WIDGET_ICON_BASE_CLASS);
- $toggleCollapseIcon.addClass((widget.collapsed) ? WIDGET_TOGGLE_DISPLAY_COLLAPSED : WIDGET_TOGGLE_DISPLAY_NORMAL);
+ $toggleCollapseIcon.html((widget.collapsed) ? WIDGET_TOGGLE_DISPLAY_COLLAPSED_HTML : WIDGET_TOGGLE_DISPLAY_NORMAL_HTML);
$toggleCollapseIcon
.click({id: widgetId}, toggleCollapseAction)
.mousedown(function(event) {
// don't allow drag and drop when this item is clicked
event.stopPropagation();
});
- $toggleCollapseIcon.show();
+
+
+ $('#widget-' + widgetId + '-toolbar').mousedown(function(event) {
+ // don't allow drag and drop when this item is clicked
+ event.stopPropagation();
+ });
}
/**
* Toggles the display of the widget collapse/restore icon.
* @param widgetId the widgetId of the rendered widget to toggle the icon for
*/
- function toggleCollapseWidgetIcon(widgetId) {
+ function toggleCollapseWidgetIcon(widgetId, collapsed) {
var $toggleIcon = $("#widget-" + widgetId + "-collapse");
- if ($toggleIcon.hasClass(WIDGET_TOGGLE_DISPLAY_COLLAPSED)) {
- $toggleIcon.removeClass(WIDGET_TOGGLE_DISPLAY_COLLAPSED);
- $toggleIcon.addClass(WIDGET_TOGGLE_DISPLAY_NORMAL);
+ if (collapsed) {
+ $toggleIcon.html(WIDGET_TOGGLE_DISPLAY_COLLAPSED_HTML);
} else {
- $toggleIcon.removeClass(WIDGET_TOGGLE_DISPLAY_NORMAL);
- $toggleIcon.addClass(WIDGET_TOGGLE_DISPLAY_COLLAPSED);
+ $toggleIcon.html(WIDGET_TOGGLE_DISPLAY_NORMAL_HTML);
}
}
Modified: rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave_layout.js
URL: http://svn.apache.org/viewvc/rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave_layout.js?rev=1327232&r1=1327231&r2=1327232&view=diff
==============================================================================
--- rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave_layout.js (original)
+++ rave/branches/bootstrap/rave-portal-resources/src/main/webapp/script/rave_layout.js Tue Apr 17 19:21:07 2012
@@ -26,7 +26,7 @@ rave.layout = rave.layout || (function()
var $tab_title_input = $("#tab_title"),
$tab_id = $("#tab_id"),
$page_layout_input = $("#pageLayout");
-
+
// page menu related functions
var pageMenu = (function() {
var $addPageButton = $("#addPageButton");
@@ -100,10 +100,10 @@ rave.layout = rave.layout || (function()
if (!$menuItemMove.hasClass("menu-item-disabled")) {
$menuItemMove.bind('click', function(event) {
$movePageDialog.modal('show');
- });
+ });
}
}
-
+
return {
init: init
}
@@ -122,13 +122,13 @@ rave.layout = rave.layout || (function()
*/
function hideMenu(widgetId) {
$("#widget-" + widgetId + "-menu").hide();
- }
+ }
/**
- * Hides all widget menus
+ * Hides all widget menus
*/
function hideAllMenus() {
$(".widget-menu").hide();
- }
+ }
/**
* Shows the widget menu for a specific widget
* @param widgetId the id of the widget to show the menu for
@@ -144,96 +144,54 @@ rave.layout = rave.layout || (function()
* - binds body click event handler to close the menu
*/
function init() {
- // the modal dialog for moving a widget
- $moveWidgetDialog = $("#moveWidgetDialog").dialog({
- autoOpen: false,
- modal: true,
- buttons: [
- {
- text: rave.getClientMessage("common.move"),
- click: function() {
- moveWidgetToPage($(this).data('regionWidgetId'));
- }
- },
- {
- text: rave.getClientMessage("common.cancel"),
- click: function() {
- $(this).dialog("close");
- }
- }
- ],
- open: function() {
- $("#moveToPageId").focus();
- },
- close: function() {
- $("#moveWidgetForm")[0].reset();
- }
- });
-
- // initialize the widget menu and button
- $(".widget-menu-button").each(function(index, element) {
- if (!$(element).hasClass("widget-menu-item-disabled")) {
- $(element).bind('click', function(event) {
- $menu = $("#widget-" + rave.getObjectIdFromDomId(this.id) + "-menu");
- $menu.toggle();
- // prevent the menu button click event from bubbling up to parent
- // DOM object event handlers such as the page tab click event
- event.stopPropagation();
- });
- }
- });
-
// loop over each widget-menu and initialize the menu items
// note: the edit prefs menu item is by default rendered disabled
- // and it is up to the provider code for that widget to
+ // and it is up to the provider code for that widget to
// determine if the widget has preferences, and to enable
// the menu item
$(".widget-menu").each(function(index, element){
var widgetId = rave.getObjectIdFromDomId(element.id);
-
+
// setup the move to page menu item
$menuItemMove = $("#widget-" + widgetId + "-menu-move-item");
- if (!$menuItemMove.hasClass("widget-menu-item-disabled")) {
- $menuItemMove.bind('click', function(event) {
+ if (!$menuItemMove.hasClass("menu-item-disabled")) {
+ $menuItemMove.bind('click', function(event) {
var regionWidgetId = rave.getObjectIdFromDomId(this.id);
- $moveWidgetDialog
- .data('regionWidgetId', regionWidgetId)
- .dialog("open");
-
- // hide the widget menu
- rave.layout.hideWidgetMenu(regionWidgetId);
-
+ // Clear the dropdown box; needing to do this may be a bug?
+ $('.dropdown').removeClass('open');
+ // Open the modal
+ $("#moveWidgetModal").data('regionWidgetId', regionWidgetId);
+ $("#moveWidgetModal").modal('show');
+
// prevent the menu button click event from bubbling up to parent
// DOM object event handlers such as the page tab click event
event.stopPropagation();
});
- }
-
+ }
+
// setup the delete widget menu item
$menuItemDelete = $("#widget-" + widgetId + "-menu-delete-item");
- if (!$menuItemDelete.hasClass("widget-menu-item-disabled")) {
- $menuItemDelete.bind('click', function(event) {
+ if (!$menuItemDelete.hasClass("menu-item-disabled")) {
+ $menuItemDelete.bind('click', function(event) {
var regionWidgetId = rave.getObjectIdFromDomId(this.id);
- // hide the widget menu
- rave.layout.hideWidgetMenu(regionWidgetId);
+
// invoke the rpc call to remove the widget from the page
rave.layout.deleteRegionWidget(regionWidgetId);
-
+
// prevent the menu button click event from bubbling up to parent
// DOM object event handlers such as the page tab click event
event.stopPropagation();
});
- }
-
+ }
+
// setup the maximize widget menu item
$menuItemMaximize = $("#widget-" + widgetId + "-menu-maximize-item");
- if (!$menuItemMaximize.hasClass("widget-menu-item-disabled")) {
- $menuItemMaximize.bind('click', function(event) {
- var regionWidgetId = rave.getObjectIdFromDomId(this.id);
- // hide the widget menu
- rave.layout.hideWidgetMenu(regionWidgetId);
+ if (!$menuItemMaximize.hasClass("menu-item-disabled")) {
+ $menuItemMaximize.bind('click', function(event) {
+ var regionWidgetId = rave.getObjectIdFromDomId(this.id);
+
// maximize the widget
- rave.maximizeWidget({data: {id: regionWidgetId}});
+ rave.maximizeWidget({data: {id: regionWidgetId}});
// prevent the menu button click event from bubbling up to parent
// DOM object event handlers such as the page tab click event
event.stopPropagation();
@@ -242,11 +200,10 @@ rave.layout = rave.layout || (function()
// setup the about this widget menu item
$menuItemAbout = $("#widget-" + widgetId + "-menu-about-item");
- if (!$menuItemAbout.hasClass("widget-menu-item-disabled")) {
+ if (!$menuItemAbout.hasClass("menu-item-disabled")) {
$menuItemAbout.bind('click', function(event) {
var regionWidget = rave.getRegionWidgetById(rave.getObjectIdFromDomId(this.id));
- // hide the widget menu
- rave.layout.hideWidgetMenu(regionWidget.regionWidgetId);
+
// go to the widget detail page
rave.viewWidgetDetail(regionWidget.widgetId, getCurrentPageId());
// prevent the menu button click event from bubbling up to parent
@@ -255,28 +212,24 @@ rave.layout = rave.layout || (function()
});
}
});
-
- // close the widget menu if the user clicks outside of it
- $("html").click(widgetMenu.hideAll);
}
-
+
/**
* Enables the Edit Prefs including the Preferences view (Custom Edit Prefs)
* menu item in the widget menu to be clicked.
* Widget providers should use this function when initializing their
* widgets after determining if the widget has preferences to modify.
- *
+ *
* @param regionWidgetId the regionWidgetId of the regionWidget menu to enable
* @param isPreferencesView boolean to indicate whether "preferences" view or the default prefs view
*/
function enableEditPrefsMenuItem(regionWidgetId, isPreferencesView) {
// setup the edit prefs widget menu item
var $menuItemEditPrefs = $("#widget-" + regionWidgetId + "-menu-editprefs-item");
- $menuItemEditPrefs.removeClass("widget-menu-item-disabled");
- $menuItemEditPrefs.bind('click', function(event) {
- var regionWidgetId = rave.getObjectIdFromDomId(this.id);
- // hide the widget menu
- rave.layout.hideWidgetMenu(regionWidgetId);
+ $menuItemEditPrefs.removeClass("menu-item-disabled");
+ $menuItemEditPrefs.bind('click', function(event) {
+ var regionWidgetId = rave.getObjectIdFromDomId(this.id);
+
// show the regular edit prefs or the Custom Edit Prefs(preferences) region
if ( isPreferencesView )
rave.editCustomPrefs({data: {id: regionWidgetId}});
@@ -285,13 +238,13 @@ rave.layout = rave.layout || (function()
// prevent the menu button click event from bubbling up to parent
// DOM object event handlers such as the page tab click event
event.stopPropagation();
- });
+ });
}
return {
init: init,
hideAll: hideAllMenus,
- hide: hideMenu,
+ hide: hideMenu,
show: showMenu,
enableEditPrefsMenuItem: enableEditPrefsMenuItem
}
@@ -312,7 +265,7 @@ rave.layout = rave.layout || (function()
/**
* Submits the RPC call to add a new page if form validation passes
- */
+ */
function addPage() {
// if the form has passed validation submit the request
if ($pageForm.valid()) {
@@ -320,30 +273,30 @@ rave.layout = rave.layout || (function()
var newPageLayoutCode = $page_layout_input.val();
// send the rpc request to create the new page
- rave.api.rpc.addPage({pageName: newPageTitle,
+ rave.api.rpc.addPage({pageName: newPageTitle,
pageLayoutCode: newPageLayoutCode,
- successCallback: function(result) {
- rave.viewPage(result.result.entityId);
- }
- });
+ successCallback: function(result) {
+ rave.viewPage(result.result.entityId);
+ }
+ });
}
- }
+ }
/**
* Submits the RPC call to move the page to a new render sequence
- */
+ */
function movePage() {
var moveAfterPageId = $("#moveAfterPageId").val();
var args = { pageId: $("#currentPageId").val(),
successCallback: function(result) { rave.viewPage(result.result.entityId); }
};
-
+
if (moveAfterPageId != MOVE_PAGE_DEFAULT_POSITION_IDX) {
args["moveAfterPageId"] = moveAfterPageId;
}
-
+
// send the rpc request to move the new page
- rave.api.rpc.movePage(args);
+ rave.api.rpc.movePage(args);
}
function updatePage() {
@@ -363,7 +316,7 @@ rave.layout = rave.layout || (function()
$tab_id.val('');
$("#pageMenuDialog").modal("hide");
}
-
+
/**
* Invokes the RPC call to delete a regionWidget from a page
*
@@ -375,7 +328,7 @@ rave.layout = rave.layout || (function()
regionWidgetId: regionWidgetId,
successCallback: function() {
// remove the widget from the dom and the internal memory map
- $("#widget-" + this.regionWidgetId + "-wrapper").remove();
+ $("#widget-" + this.regionWidgetId + "-wrapper").remove();
rave.removeWidgetFromMap(this.regionWidgetId);
if (rave.isPageEmpty()) {
rave.displayEmptyPageMessage();
@@ -384,14 +337,14 @@ rave.layout = rave.layout || (function()
});
}
}
-
+
/**
* Returns the pageId of the currently viewed page
*/
function getCurrentPageId() {
return $("#currentPageId").val();
}
-
+
/***
* initializes the rave.layout namespace code
*/
@@ -401,7 +354,7 @@ rave.layout = rave.layout || (function()
// initialize the bootstrap dropdowns
$(".dropdown-toggle").dropdown();
}
-
+
// public rave.layout API
return {
init: init,
@@ -412,6 +365,7 @@ rave.layout = rave.layout || (function()
addPage: addPage,
updatePage: updatePage,
movePage: movePage,
- closePageDialog: closePageDialog
- };
+ closePageDialog: closePageDialog,
+ moveWidgetToPage: moveWidgetToPage
+ };
})();
Modified: rave/branches/bootstrap/rave-portal-resources/src/test/javascript/raveSpec.js
URL: http://svn.apache.org/viewvc/rave/branches/bootstrap/rave-portal-resources/src/test/javascript/raveSpec.js?rev=1327232&r1=1327231&r2=1327232&view=diff
==============================================================================
--- rave/branches/bootstrap/rave-portal-resources/src/test/javascript/raveSpec.js (original)
+++ rave/branches/bootstrap/rave-portal-resources/src/test/javascript/raveSpec.js Tue Apr 17 19:21:07 2012
@@ -101,29 +101,29 @@ describe("Rave", function() {
},
attr: function(a, b) {
- },
+ },
hasClass : function (className) {
return classMap.indexOf(className) != -1;
},
addClass : function (className) {
classMap.push(className);
},
- removeClass: function(className) {
- var idx = classMap.indexOf(className);
+ removeClass: function(className) {
+ var idx = classMap.indexOf(className);
if (idx != -1) {
- classMap.splice(idx, 1);
+ classMap.splice(idx, 1);
}
- }
+ }
}
- };
+ };
}
it("calls the appropriate providers", function() {
- var HIDDEN_CLASS = "hidden";
- createMockJQuery();
+ var HIDDEN_CLASS = "hidden";
+ createMockJQuery();
$().addClass(HIDDEN_CLASS);
expect($().hasClass(HIDDEN_CLASS)).toEqual(true);
-
+
var widgetsByRegionIdMap = {};
widgetsByRegionIdMap[1] = [
{type:"FOO"},
@@ -137,13 +137,13 @@ describe("Rave", function() {
rave.registerProvider(provider2);
rave.initWidgets(widgetsByRegionIdMap);
expect(provider1.initWidgetsWasCalled(2)).toBeTruthy();
- expect(provider2.initWidgetsWasCalled(2)).toBeTruthy();
+ expect(provider2.initWidgetsWasCalled(2)).toBeTruthy();
expect($().hasClass(HIDDEN_CLASS)).toEqual(true);
});
it("renders widgets in the appropriate order (first 'row', second 'row', third 'row', ...)", function() {
- createMockJQuery();
-
+ createMockJQuery();
+
var widgetsByRegionIdMap = {};
widgetsByRegionIdMap[1] = [
{type:"FOO", renderOrder:1},
@@ -180,8 +180,8 @@ describe("Rave", function() {
});
it("puts widgets in buckets keyed by regionIds", function() {
- createMockJQuery();
-
+ createMockJQuery();
+
var widgetsByRegionIdMap = {};
var regionOneKey = 1;
var regionTwoKey = 2;
@@ -200,8 +200,8 @@ describe("Rave", function() {
});
it("Renders an error gadget when invalid widget is provided", function(){
- createMockJQuery();
-
+ createMockJQuery();
+
var widgetsByRegionIdMap = {};
widgetsByRegionIdMap[1] = [
{type:"FOO", regionWidgetId:20},
@@ -210,7 +210,7 @@ describe("Rave", function() {
{type:"BAR", regionWidgetId:23},
{type:"NONE", regionWidgetId:43}
];
-
+
var provider1 = getMockProvider("FOO");
var provider2 = getMockProvider("BAR");
rave.registerProvider(provider1);
@@ -235,18 +235,18 @@ describe("Rave", function() {
expect($().expression()).toEqual("#widget-20-body");
expect($().html()).toEqual("Widget disabled");
});
-
+
it("Renders the empty page message when page has no widgets", function(){
var HIDDEN_CLASS = "hidden";
- createMockJQuery();
+ createMockJQuery();
$().addClass(HIDDEN_CLASS);
expect($().hasClass(HIDDEN_CLASS)).toEqual(true);
-
+
var widgetsByRegionIdMap = {};
-
+
rave.initWidgets(widgetsByRegionIdMap);
- expect($().hasClass(HIDDEN_CLASS)).toEqual(false);
- });
+ expect($().hasClass(HIDDEN_CLASS)).toEqual(false);
+ });
});
describe("initUI", function() {
@@ -410,7 +410,7 @@ describe("Rave", function() {
});
});
-
+
describe("isFunction", function() {
it("returns true when the object is a function", function() {
@@ -422,35 +422,35 @@ describe("Rave", function() {
var obj = 1;
var result = rave.isFunction(obj);
expect(result).toEqual(false);
- });
+ });
it("returns false when the object is a string", function() {
var obj = "hello";
var result = rave.isFunction(obj);
expect(result).toEqual(false);
- });
+ });
it("returns false when the object is an object", function() {
var obj = {"myattr" : "myvalue"};
var result = rave.isFunction(obj);
expect(result).toEqual(false);
- });
+ });
it("returns false when the object is null", function() {
var obj = null;
var result = rave.isFunction(obj);
expect(result).toEqual(false);
- });
+ });
it("returns false when the object is undefined", function() {
var obj;
var result = rave.isFunction(obj);
expect(result).toEqual(false);
- });
- });
-
+ });
+ });
+
describe("toggleCollapseWidgetIcon", function() {
//Creates a simple mock jquery object that mocks the functions used in this suite
function createMockJQuery() {
var expression;
- var classMap = [];
-
+ var html;
+
$ = function(expr) {
if (typeof expr != "undefined") {
@@ -461,60 +461,60 @@ describe("Rave", function() {
expression : function () {
return expression;
},
- hasClass : function (className) {
- return classMap.indexOf(className) != -1;
- },
- addClass : function (className) {
- classMap.push(className);
- },
- removeClass: function(className) {
- var idx = classMap.indexOf(className);
- if (idx != -1) {
- classMap.splice(idx, 1);
+ html : function (txt) {
+ if (typeof txt == "string") {
+ html = txt;
+ return $;
+ } else {
+ return html;
}
}
}
};
-
+
}
- it("changes icon from normal to collapsed", function() {
+ it("changes icon from normal to collapsed", function() {
createMockJQuery();
- // setup the state so the widget display is "normal"
- $().addClass("ui-icon-triangle-1-e");
-
+ // setup the state so the widget display is "normal"
+ $().html('<i class="icon-chevron-up"></i>');
+
var widgetId = 99;
-
- rave.toggleCollapseWidgetIcon(widgetId);
-
- expect($().expression()).toEqual("#widget-" + widgetId + "-collapse");
- expect($().hasClass("ui-icon-triangle-1-e")).toEqual(false);
- expect($().hasClass("ui-icon-triangle-1-s")).toEqual(true);
- });
-
- it("changes icon from collapsed to normal", function() {
- createMockJQuery();
- // setup the state so the widget display is "normal"
- $().addClass("ui-icon-triangle-1-s");
-
+ // state it is being changed to
+ var collapsed = true;
+
+ rave.toggleCollapseWidgetIcon(widgetId, collapsed);
+
+ expect($().expression()).toEqual("#widget-" + widgetId + "-collapse");
+ expect($().html()).toNotEqual('<i class="icon-chevron-up"></i>');
+ expect($().html()).toEqual('<i class="icon-chevron-down"></i>');
+ });
+
+ it("changes icon from collapsed to normal", function() {
+ createMockJQuery();
+ // setup the state so the widget display is "normal"
+ $().html('<i class="icon-chevron-down"></i>');
+
var widgetId = 99;
-
- rave.toggleCollapseWidgetIcon(widgetId);
-
- expect($().expression()).toEqual("#widget-" + widgetId + "-collapse");
- expect($().hasClass("ui-icon-triangle-1-s")).toEqual(false);
- expect($().hasClass("ui-icon-triangle-1-e")).toEqual(true);
- });
-
- });
-
+ // state it is being changed to
+ var collapsed = false;
+
+ rave.toggleCollapseWidgetIcon(widgetId, collapsed);
+
+ expect($().expression()).toEqual("#widget-" + widgetId + "-collapse");
+ expect($().html()).toNotEqual('<i class="icon-chevron-down"></i>');
+ expect($().html()).toEqual('<i class="icon-chevron-up"></i>');
+ });
+
+ });
+
describe("change widget view state", function(){
//Creates a simple mock jquery object that mocks the functions used in this suite
function createMockJQuery() {
var expression;
- var classMap = [];
+ var classMap = [];
var valuesMap = {};
-
+
$ = function(expr) {
if (typeof expr != "undefined") {
@@ -531,10 +531,10 @@ describe("Rave", function() {
addClass : function (className) {
classMap.push(className);
},
- removeClass: function(className) {
- var idx = classMap.indexOf(className);
+ removeClass: function(className) {
+ var idx = classMap.indexOf(className);
if (idx != -1) {
- classMap.splice(idx, 1);
+ classMap.splice(idx, 1);
}
return this;
},
@@ -557,99 +557,99 @@ describe("Rave", function() {
},
show: function() {
valuesMap["showWasCalled-" + expression] = true;
- },
+ },
height: function() {
-
+
},
width: function() {
-
+
},
css: function() {
-
+
},
prepend: function() {
-
+
},
remove: function() {
valuesMap["removeWasCalled"] = true;
},
getValue: function(varName) {
return valuesMap[varName];
- }
+ }
}
- };
+ };
}
-
- it("successfully maximizes the widget", function() {
+
+ it("successfully maximizes the widget", function() {
createMockJQuery();
-
- var mockWidget = {
- maximizeWasCalled: false,
+
+ var mockWidget = {
+ maximizeWasCalled: false,
maximize: function() { this.maximizeWasCalled = true; }
}
-
+
var args = {};
args.data = {};
args.data.id = 99;
spyOn(rave, "getRegionWidgetById").andReturn(mockWidget);
-
- rave.maximizeWidget(args);
-
- // verify the sortable parameters
+
+ rave.maximizeWidget(args);
+
+ // verify the sortable parameters
expect($().getValue("sortableOption")).toEqual("option");
expect($().getValue("sortableAttrName")).toEqual("disabled");
- expect($().getValue("sortableAttrValue")).toEqual(true);
+ expect($().getValue("sortableAttrValue")).toEqual(true);
// verify the CSS styles
expect($().hasClass("widget-wrapper-canvas")).toEqual(true);
- expect($().hasClass("widget-wrapper")).toEqual(false);
+ expect($().hasClass("widget-wrapper")).toEqual(false);
// verify widget menu hide was called
- expect($().getValue("hideWasCalled-#widget-" + args.data.id + "-widget-menu-wrapper")).toEqual(true);
+ expect($().getValue("hideWasCalled-#widget-" + args.data.id + "-widget-menu-wrapper")).toEqual(true);
// verify widget minimize show was called
- expect($().getValue("showWasCalled-#widget-" + args.data.id + "-min")).toEqual(true);
+ expect($().getValue("showWasCalled-#widget-" + args.data.id + "-min")).toEqual(true);
// verify getRegionWidgetById called
- expect(rave.getRegionWidgetById).toHaveBeenCalledWith(args.data.id);
+ expect(rave.getRegionWidgetById).toHaveBeenCalledWith(args.data.id);
// verify collapse/restore icon hide was called
- expect($().getValue("hideWasCalled-#widget-" + args.data.id + "-collapse")).toEqual(true);
+ expect($().getValue("hideWasCalled-#widget-" + args.data.id + "-collapse")).toEqual(true);
// verify widget.maximize was called
expect(mockWidget.maximizeWasCalled).toEqual(true);
-
- });
-
- it("successfully minimizes the widget", function() {
- createMockJQuery();
-
- var mockWidget = {
- minimizeWasCalled: false,
+
+ });
+
+ it("successfully minimizes the widget", function() {
+ createMockJQuery();
+
+ var mockWidget = {
+ minimizeWasCalled: false,
minimize: function() { this.minimizeWasCalled = true; }
}
-
+
var args = {};
args.data = {};
args.data.id = 99;
spyOn(rave, "getRegionWidgetById").andReturn(mockWidget);
-
- rave.minimizeWidget(args);
-
+
+ rave.minimizeWidget(args);
+
// verify remove was called
- expect($().getValue("removeWasCalled")).toEqual(true);
+ expect($().getValue("removeWasCalled")).toEqual(true);
// verify the sortable parameters
expect($().getValue("sortableOption")).toEqual("option");
expect($().getValue("sortableAttrName")).toEqual("disabled");
- expect($().getValue("sortableAttrValue")).toEqual(false);
+ expect($().getValue("sortableAttrValue")).toEqual(false);
// verify the CSS styles
expect($().hasClass("widget-wrapper-canvas")).toEqual(false);
expect($().hasClass("widget-wrapper")).toEqual(true);
// verify widget minimize hide was called
- expect($().getValue("hideWasCalled-#widget-" + args.data.id + "-min")).toEqual(true);
+ expect($().getValue("hideWasCalled-#widget-" + args.data.id + "-min")).toEqual(true);
// verify widget menu show was called
- expect($().getValue("showWasCalled-#widget-" + args.data.id + "-widget-menu-wrapper")).toEqual(true);
+ expect($().getValue("showWasCalled-#widget-" + args.data.id + "-widget-menu-wrapper")).toEqual(true);
// verify collapse/restore icon show was called
- expect($().getValue("showWasCalled-#widget-" + args.data.id + "-collapse")).toEqual(true);
+ expect($().getValue("showWasCalled-#widget-" + args.data.id + "-collapse")).toEqual(true);
// verify getRegionWidgetById called
- expect(rave.getRegionWidgetById).toHaveBeenCalledWith(args.data.id);
+ expect(rave.getRegionWidgetById).toHaveBeenCalledWith(args.data.id);
// verify widget.minimize was called
- expect(mockWidget.minimizeWasCalled).toEqual(true);
- });
+ expect(mockWidget.minimizeWasCalled).toEqual(true);
+ });
});
describe("log", function(){
@@ -728,4 +728,4 @@ describe("Rave", function() {
expect(args.onPublish).toBeDefined();
});
});
-});
\ No newline at end of file
+});