Skip to content

Commit bf18e02

Browse files
authored
Merge pull request #361 from jeff-phillips-18/branch-4.0-dev
Remove JQuery Dependency from Angular Patternfly 4
2 parents d9141b9 + b89e582 commit bf18e02

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

44 files changed

+613
-910
lines changed

Gruntfile.js

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -124,17 +124,11 @@ module.exports = function (grunt) {
124124
title: 'Angular Patternfly Documentation',
125125
dest: 'docs',
126126
image: 'misc/logo-alt.svg',
127-
scripts: ['lib/jquery/dist/jquery.js',
128-
'lib/bootstrap/dist/js/bootstrap.js',
129-
'lib/patternfly-bootstrap-combobox/js/bootstrap-combobox.js',
130-
'lib/bootstrap-datepicker/dist/js/bootstrap-datepicker.js',
127+
scripts: [
131128
'lib/moment/moment.js',
132-
'lib/eonasdan-bootstrap-datetimepicker/src/js/bootstrap-datetimepicker.js',
133-
'lib/bootstrap-select/js/bootstrap-select.js',
134-
'lib/patternfly-bootstrap-treeview/src/js/bootstrap-treeview.js',
135129
'lib/c3/c3.js',
136130
'lib/d3/d3.js',
137-
'lib/patternfly/dist/js/patternfly.js',
131+
'lib/patternfly/dist/js/patternfly-settings.js',
138132
'lib/angular/angular.js',
139133
'lib/angular-sanitize/angular-sanitize.js',
140134
'lib/angular-animate/angular-animate.js',
@@ -250,6 +244,10 @@ module.exports = function (grunt) {
250244
files: ['Gruntfile.js'],
251245
tasks: ['eslint']
252246
},
247+
test: {
248+
files: ['test/**/*.js'],
249+
tasks: ['test']
250+
},
253251
all: {
254252
files: ['Gruntfile.js', 'src/**/*.js', 'src/**/*.html', 'styles/**/*.css'],
255253
tasks: ['build'],

index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,6 @@ require('angular-animate');
33
require('angular-sanitize');
44
require('angular-ui-bootstrap');
55
require('lodash');
6-
require('patternfly/dist/js/patternfly.min');
6+
require('patternfly/dist/js/patternfly-settings.min');
77
require('./dist/angular-patternfly');
8-
module.exports = 'angular-patternfly';
8+
module.exports = 'angular-patternfly';

src/card/basic/card.html

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
<div ng-class="showTopBorder === 'true' ? 'card-pf card-pf-accented' : 'card-pf'">
22
<div ng-if="showHeader()" ng-class="shouldShowTitlesSeparator ? 'card-pf-heading' : 'card-pf-heading-no-bottom'">
3-
<div ng-if="showFilterInHeader()" uib-dropdown class="card-pf-time-frame-filter">
4-
<div ng-include="'card/basic/card-filter.html'"></div>
5-
</div>
3+
<div ng-if="showFilterInHeader()" uib-dropdown class="card-pf-time-frame-filter" ng-include="'card/basic/card-filter.html'"></div>
64
<h2 class="card-pf-title">{{headTitle}}</h2>
75
</div>
86

@@ -12,9 +10,7 @@ <h2 class="card-pf-title">{{headTitle}}</h2>
1210
<div ng-transclude></div>
1311
</div>
1412
<div ng-if="footer" class="card-pf-footer">
15-
<div ng-if="showFilterInFooter()" uib-dropdown class="card-pf-time-frame-filter">
16-
<div ng-include="'card/basic/card-filter.html'"></div>
17-
</div>
13+
<div ng-if="showFilterInFooter()" uib-dropdown class="card-pf-time-frame-filter" ng-include="'card/basic/card-filter.html'"></div>
1814
<p>
1915
<a ng-if="footer.href" href="{{footer.href}}" ng-class="{'card-pf-link-with-icon':footer.iconClass,'card-pf-link':!footer.iconClass}">
2016
<span ng-if="footer.iconClass" class="{{footer.iconClass}} card-pf-footer-text"></span>

src/card/card.module.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,4 @@
55
* Card module for patternfly.
66
*
77
*/
8-
angular.module('patternfly.card', []);
8+
angular.module('patternfly.card', ['ui.bootstrap']);

src/charts/c3/c3-chart-defaults.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
(function () {
22
'use strict';
33

4-
var patternflyDefaults = $().c3ChartDefaults();
4+
var patternflyDefaults = patternfly.c3ChartDefaults();
55

66
angular.module('patternfly.charts').constant('c3ChartDefaults', {
77
getDefaultColors: patternflyDefaults.getDefaultColors,

src/charts/c3/c3-chart.directive.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@
3838
$scope.total = 1000;
3939
$scope.available = $scope.total - $scope.used;
4040
41-
$scope.chartConfig = $().c3ChartDefaults().getDefaultDonutConfig('MHz Used');
41+
$scope.chartConfig = patternfly.c3ChartDefaults().getDefaultDonutConfig('MHz Used');
4242
$scope.chartConfig.data = {
4343
type: "donut",
4444
columns: [

src/charts/donut/donut-pct-chart-directive.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -384,7 +384,7 @@ angular.module('patternfly.charts').directive('pfDonutPctChart', function (pfUti
384384
$scope.config.data.onclick = $scope.config.onClickFn;
385385
};
386386

387-
$scope.config = pfUtils.merge($().c3ChartDefaults().getDefaultDonutConfig(), $scope.config);
387+
$scope.config = pfUtils.merge(patternfly.c3ChartDefaults().getDefaultDonutConfig(), $scope.config);
388388
$scope.updateAll($scope);
389389

390390

src/charts/line/line-chart.directive.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -174,7 +174,7 @@ angular.module('patternfly.charts').directive('pfLineChart', function (pfUtils)
174174
$scope.showYAxis = ($scope.config.showAxis !== undefined) && $scope.config.showAxis;
175175
}
176176

177-
$scope.defaultConfig = $().c3ChartDefaults().getDefaultLineConfig();
177+
$scope.defaultConfig = patternfly.c3ChartDefaults().getDefaultLineConfig();
178178
$scope.defaultConfig.axis = {
179179
x: {
180180
show: $scope.showXAxis === true,

src/charts/sparkline/sparkline-chart.directive.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -232,7 +232,7 @@ angular.module('patternfly.charts').directive('pfSparklineChart', function (pfUt
232232
'</tr>';
233233
break;
234234
default:
235-
tipRows = $().c3ChartDefaults().getDefaultSparklineTooltip().contents(d);
235+
tipRows = patternfly.c3ChartDefaults().getDefaultSparklineTooltip().contents(d);
236236
}
237237
}
238238
return $scope.getTooltipTableHTML(tipRows);
@@ -278,7 +278,7 @@ angular.module('patternfly.charts').directive('pfSparklineChart', function (pfUt
278278
$scope.showYAxis = ($scope.config.showAxis !== undefined) && $scope.config.showAxis;
279279
}
280280

281-
$scope.defaultConfig = $().c3ChartDefaults().getDefaultSparklineConfig();
281+
$scope.defaultConfig = patternfly.c3ChartDefaults().getDefaultSparklineConfig();
282282
$scope.defaultConfig.axis = {
283283
x: {
284284
show: $scope.showXAxis === true,

src/charts/trends/trends-chart.directive.js

Lines changed: 71 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -59,23 +59,39 @@
5959
<form role="form" >
6060
<div class="form-group">
6161
<label>Layout</label></br>
62-
<select pf-select class="pf-select-sm" ng-model="layout" id="layout">
63-
<option value="large" ng-selected="true" selected>Large</option>
64-
<option value="small">Small</option>
65-
<option value="compact">Compact</option>
66-
<option value="inline">Inline</option>
67-
</select>
62+
<div class="btn-group" uib-dropdown>
63+
<button type="button" uib-dropdown-toggle class="btn btn-default">
64+
{{layout.title}}
65+
<span class="caret"></span>
66+
</button>
67+
<ul uib-dropdown-menu class="dropdown-menu-right" role="menu">
68+
<li ng-repeat="item in layouts" ng-class="{'selected': item === layout}">
69+
<a role="menuitem" tabindex="-1" ng-click="updateLayout(item)">
70+
{{item.title}}
71+
</a>
72+
</li>
73+
</ul>
74+
</div>
6875
</div>
6976
</form>
7077
</div>
7178
<div class="col-md-3">
7279
<form role="form" ng-hide="layout == 'inline'">
7380
<div class="form-group">
7481
<label>Title Value Type</label></br>
75-
<select pf-select class="pf-select-sm" ng-model="valueType" id="valueType">
76-
<option value="actual" ng-selected="true" selected>Actual</option>
77-
<option value="percentage">Percentage</option>
78-
</select>
82+
<div class="btn-group" uib-dropdown>
83+
<button type="button" uib-dropdown-toggle class="btn btn-default">
84+
{{valueType.title}}
85+
<span class="caret"></span>
86+
</button>
87+
<ul uib-dropdown-menu class="dropdown-menu-right" role="menu">
88+
<li ng-repeat="item in valueTypes" ng-class="{'selected': item === valueType}">
89+
<a role="menuitem" tabindex="-1" ng-click="updateValueType(item)">
90+
{{item.title}}
91+
</a>
92+
</li>
93+
</ul>
94+
</div>
7995
</div>
8096
</form>
8197
</div>
@@ -98,7 +114,7 @@
98114
</div>
99115
</file>
100116
<file name="script.js">
101-
angular.module( 'demo', ['patternfly.charts', 'patternfly.card'] ).controller( 'ChartCtrl', function( $scope ) {
117+
angular.module( 'demo', ['patternfly.charts', 'patternfly.card', 'ui.bootstrap'] ).controller( 'ChartCtrl', function( $scope ) {
102118
103119
$scope.config = {
104120
chartId : 'exampleTrendsChart',
@@ -128,6 +144,50 @@
128144
}
129145
}
130146
147+
$scope.layouts = [
148+
{
149+
title: "Large",
150+
value: "large"
151+
},
152+
{
153+
title: "Small",
154+
value: "small"
155+
},
156+
{
157+
title: "Compact",
158+
value: "compact"
159+
},
160+
{
161+
title: "Inline",
162+
value: "inline"
163+
}
164+
];
165+
166+
$scope.layout = $scope.layouts[0];
167+
168+
$scope.updateLayout = function(item) {
169+
$scope.layout = item;
170+
$scope.config.layout = item.value;
171+
};
172+
173+
$scope.valueTypes = [
174+
{
175+
title: "Actual",
176+
value: "actual"
177+
},
178+
{
179+
title: "Percentage",
180+
value: "percentage"
181+
}
182+
];
183+
184+
$scope.valueType = $scope.valueTypes[0];
185+
186+
$scope.updateValueType = function(item) {
187+
$scope.valueType = item;
188+
$scope.config.valueType = item.value;
189+
};
190+
131191
var today = new Date();
132192
var dates = ['dates'];
133193
for (var d = 20 - 1; d >= 0; d--) {
@@ -148,15 +208,6 @@
148208
$scope.data.xData.push(new Date($scope.data.xData[$scope.data.xData.length - 1].getTime() + (24 * 60 * 60 * 1000)));
149209
$scope.data.yData.push(Math.round(Math.random() * 100));
150210
};
151-
152-
$scope.$watch('valueType', function (newValue) {
153-
$scope.config.valueType = newValue;
154-
});
155-
156-
$scope.$watch('layout', function (newValue) {
157-
$scope.config.layout = newValue;
158-
});
159-
160211
});
161212
</file>
162213
</example>

0 commit comments

Comments
 (0)