Skip to content

Commit 227d341

Browse files
AntwnisAntwnis
authored
Merge pull request #23 from Landoop/removing-forms-preparing-release
removing froms, bug fixes, beautify HTML
2 parents dfee9f9 + 2aa0063 commit 227d341

File tree

15 files changed

+331
-350
lines changed

15 files changed

+331
-350
lines changed

‎README.md‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,9 @@ docker run --rm -it -p 8000:8000 \
1616
-e "CONNECT_URL=http://connect.distributed.url" \
1717
landoop/kafka-connect-ui
1818
```
19+
20+
The CONNECT_URL can be a comma separated array of Connect worker endpoints. E.g: CONNECT_URL=http://connect.1.url,http://connect.2.url"
21+
1922
Web UI will be available at `http://localhost:8000`
2023

2124

‎docker/Dockerfile‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ RUN wget "https://caddyserver.com/download/build?os=linux&arch=amd64&features="
1313
&& rm -f /caddy.tgz
1414

1515
# Add and Setup Kafka-Connect-Ui
16-
ARG CONNECT_UI_URL=https://github.com/Landoop/kafka-connect-ui/releases/download/v.0.8.2/kafka-connect-ui-0.8.2.tar.gz
16+
ARG CONNECT_UI_URL=https://github.com/Landoop/kafka-connect-ui/releases/download/v.0.9.0/kafka-connect-ui-0.9.0.tar.gz
1717
RUN wget "${CONNECT_UI_URL}" -O /kafka-connect-ui.tar.gz \
1818
&& mkdir /kafka-connect-ui \
1919
&& tar xzf /kafka-connect-ui.tar.gz -C /kafka-connect-ui \

‎index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
<div layout="row" layout-xs="column">
2222
<div flex>
2323
<!-- <h5><a href="{{cluster ? '#/cluster/'+cluster.NAME : '#/'}}">KAFKA CONNECT</a></h5> -->
24-
<h5><a href="/#/">KAFKA CONNECT</a></h5>
24+
<h5><a href="/#/" style="color:#fff;font-weight: normal;font-size: 14px;">KAFKA CONNECT</a></h5>
2525
</div>
2626
<label ng-show="!missingEnvJS && clusters.length > 1 && !isHome" style="color:#ccc; font-size:12px"><b>SELECT CLUSTER :</b></label>
2727
<md-input-container ng-show="!missingEnvJS && clusters.length > 1 && !isHome" class="selectCluster">

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "kafka-connect-ui",
3-
"version": "0.8.2",
3+
"version": "0.9.0",
44
"description": "A user interface for managing Kafka Connectors",
55
"readme": "README.md",
66
"main": "Gruntfile.js",

‎src/assets/icons/coap.png‎

1.57 KB
Loading

‎src/assets/icons/mongodb.png‎

4.82 KB
Loading

‎src/kafka-connect/cluster-view/cluster-view.html‎

Lines changed: 83 additions & 83 deletions
Original file line numberDiff line numberDiff line change
@@ -1,100 +1,100 @@
11
<div layout="row" layout-sm="column" layout-xs="column">
2-
<div flex-gt-sm="33">
3-
<div ng-controller="KafkaConnectListCtrl" ng-include="'src/kafka-connect/list/list-connectors.html'"></div>
4-
</div>
5-
<div flex-gt-sm="66" flex>
6-
<md-card ng-hide="connectionFailure || rebalancing">
2+
<div flex-gt-sm="33">
3+
<div ng-controller="KafkaConnectListCtrl" ng-include="'src/kafka-connect/list/list-connectors.html'"></div>
4+
</div>
5+
<div flex-gt-sm="66" flex>
6+
<md-card ng-hide="connectionFailure || rebalancing">
77

8-
<div layout="row" layout-xs="column">
9-
<h1 flex style="font-weight:300; padding-left:20px; margin-bottom:0px">{{welcomeMessage}} <span ng-show="clusters.length > 1">- {{cluster}}</span></h1>
10-
<md-button flex="20" style="margin-left:10px; margin-top:20px;"
11-
ng-href="#/cluster/{{cluster}}/export-configs">
12-
<i class="fa fa-download" aria-hidden="true"></i> Export config
13-
</md-button>
14-
</div>
15-
<hr style="margin-left:0px; margin-right:0px; background-color:#E0E0E0;border: 0;
8+
<div layout="row" layout-xs="column">
9+
<h1 flex style="font-weight:300; padding-left:20px; margin-bottom:0px">{{welcomeMessage}} <span ng-show="clusters.length > 1">- {{cluster}}</span></h1>
10+
<md-button flex="20" style="margin-left:10px; margin-top:20px;"
11+
ng-href="#/cluster/{{cluster}}/export-configs">
12+
<i class="fa fa-download" aria-hidden="true"></i> Export config
13+
</md-button>
14+
</div>
15+
<hr style="margin-left:0px; margin-right:0px; background-color:#E0E0E0;border: 0;
1616
height: 0;border-bottom: 1px solid rgba(255, 255, 255, 0.3);" size="1">
1717

1818

19-
<md-card-content>
20-
<div layout="row" layout-xs="column">
21-
<div flex>
22-
<md-card style="background-color: #4f6672; color: #fff; ">
23-
<md-card-title style="padding-bottom:5px;">
24-
<md-card-title-text>
25-
<span class="md-headline tile-heading ">SINK CONNECTORS</span>
26-
</md-card-title-text>
27-
</md-card-title>
28-
<md-card-content>
29-
<div layout="row" layout-xs="column" layout-wrap>
30-
<div flex>
31-
<p class="bigTotal">{{sinks.length}}</p>
19+
<md-card-content>
20+
<div layout="row" layout-xs="column">
21+
<div flex>
22+
<md-card style="background-color: #4f6672; color: #fff; ">
23+
<md-card-title style="padding-bottom:5px;">
24+
<md-card-title-text>
25+
<span class="md-headline tile-heading ">SINK CONNECTORS</span>
26+
</md-card-title-text>
27+
</md-card-title>
28+
<md-card-content>
29+
<div layout="row" layout-xs="column" layout-wrap>
30+
<div flex>
31+
<p class="bigTotal">{{sinks.length}}</p>
32+
</div>
3233
</div>
33-
</div>
34-
</md-card-content>
35-
</md-card>
36-
</div>
37-
<div flex>
38-
<md-card style="background-color: #4f6672; color: #fff; ">
39-
<md-card-title style="padding-bottom:5px;">
40-
<md-card-title-text>
41-
<span class="md-headline tile-heading ">SOURCE CONNECTORS</span>
42-
</md-card-title-text>
43-
</md-card-title>
44-
<md-card-content>
45-
<div layout="row" layout-xs="column" layout-wrap>
46-
<div flex>
47-
<p class="bigTotal">{{sources.length}}</p>
34+
</md-card-content>
35+
</md-card>
36+
</div>
37+
<div flex>
38+
<md-card style="background-color: #4f6672; color: #fff; ">
39+
<md-card-title style="padding-bottom:5px;">
40+
<md-card-title-text>
41+
<span class="md-headline tile-heading ">SOURCE CONNECTORS</span>
42+
</md-card-title-text>
43+
</md-card-title>
44+
<md-card-content>
45+
<div layout="row" layout-xs="column" layout-wrap>
46+
<div flex>
47+
<p class="bigTotal">{{sources.length}}</p>
48+
</div>
4849
</div>
49-
</div>
50-
</md-card-content>
51-
</md-card>
52-
</div>
53-
<div flex>
54-
<md-card style="background-color: #4f6672; color: #fff; ">
55-
<md-card-title style="padding-bottom:5px;">
56-
<md-card-title-text>
57-
<span class="md-headline tile-heading ">TOPICS used by connectors</span>
58-
</md-card-title-text>
59-
</md-card-title>
60-
<md-card-content>
61-
<div layout="row" layout-xs="column" layout-wrap>
62-
<div flex>
63-
<p class="bigTotal">{{allTopics.unique().length}}</p>
50+
</md-card-content>
51+
</md-card>
52+
</div>
53+
<div flex>
54+
<md-card style="background-color: #4f6672; color: #fff; ">
55+
<md-card-title style="padding-bottom:5px;">
56+
<md-card-title-text>
57+
<span class="md-headline tile-heading ">TOPICS used by connectors</span>
58+
</md-card-title-text>
59+
</md-card-title>
60+
<md-card-content>
61+
<div layout="row" layout-xs="column" layout-wrap>
62+
<div flex>
63+
<p class="bigTotal">{{allTopics.unique().length}}</p>
64+
</div>
6465
</div>
65-
</div>
66-
</md-card-content>
67-
</md-card>
68-
</div>
69-
<div flex ng-hide="true">
70-
<md-card style="background-color: #2196F3; color: #fff; ">
71-
<md-card-title style="padding-bottom:5px;">
72-
<md-card-title-text>
73-
<span class="md-headline tile-heading ">TOPICS total</span>
74-
</md-card-title-text>
75-
</md-card-title>
76-
<md-card-content>
77-
<div layout="row" layout-xs="column" layout-wrap>
78-
<div flex>
79-
<p class="bigTotal">{{allTopics.unique().length}}</p>
66+
</md-card-content>
67+
</md-card>
68+
</div>
69+
<div flex ng-hide="true">
70+
<md-card style="background-color: #2196F3; color: #fff; ">
71+
<md-card-title style="padding-bottom:5px;">
72+
<md-card-title-text>
73+
<span class="md-headline tile-heading ">TOPICS total</span>
74+
</md-card-title-text>
75+
</md-card-title>
76+
<md-card-content>
77+
<div layout="row" layout-xs="column" layout-wrap>
78+
<div flex>
79+
<p class="bigTotal">{{allTopics.unique().length}}</p>
80+
</div>
8081
</div>
81-
</div>
82-
</md-card-content>
83-
</md-card>
82+
</md-card-content>
83+
</md-card>
84+
</div>
8485
</div>
85-
</div>
86-
</md-card-content>
86+
</md-card-content>
8787

88-
<hr style="margin-left:0px; margin-right:0px; background-color:#E0E0E0;border: 0;
88+
<hr style="margin-left:0px; margin-right:0px; background-color:#E0E0E0;border: 0;
8989
height: 0;border-bottom: 1px solid rgba(255, 255, 255, 0.3);" size="1">
9090

91-
<md-card-content>
92-
<h2 flex style="font-weight:300;">Connect topology</h2>
91+
<md-card-content>
92+
<h2 flex style="font-weight:300;">Connect topology</h2>
9393

94-
<div flex="100" google-chart chart="chartObject" style="width: 100%;height:{{chartHeight}}px;border:1px solid white;"></div>
95-
</md-card-content>
96-
</md-card>
97-
</div>
94+
<div flex="100" google-chart chart="chartObject" style="width: 100%;height:{{chartHeight}}px;border:1px solid white;"></div>
95+
</md-card-content>
96+
</md-card>
97+
</div>
9898
</div>
9999

100100

‎src/kafka-connect/config/config.html‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
<md-content flex layout-padding>
33
<b>Kafka Connect :</b> {{kafkaConnectURL}} <br>
44
<span ng-show="showVersion"> <b>Kafka Connect Version :</b> {{version}} <br></span>
5+
<span> <b>Kafka Connect UI Version :</b> 0.9.0 <br></span>
56
<span ng-show="connectionFailure" class="red">{{connectivityError}}</span><br>
67
</md-content>
78
</md-card>

‎src/kafka-connect/create-connector/create-connector.controller.js‎

Lines changed: 3 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,6 @@
33
Config is created on the fly using the `template` models.
44
*/
55
angularAPP.controller('CreateConnectorCtrl', function ($scope, $rootScope, $http, $log, $routeParams, $location, $filter, KafkaConnectFactory, supportedConnectorsFactory, NewConnectorFactory, env, constants) {
6-
if (NewConnectorFactory.initConnector($routeParams.name)) {
7-
$scope.connector = NewConnectorFactory.initConnector($routeParams.name);
8-
$scope.maxNumberOfTabs = !$scope.connector.isUndefined ? $scope.connector.template.length + 1 : 0;
9-
$scope.selectedTabIndex = !$scope.connector.isUndefined ? $scope.connector.template.length + 1 : 0;
10-
$scope.makeCommands = function () {
11-
var configValues = NewConnectorFactory.flattenConnectorKeyValues($scope.connector);
12-
$scope.formValuesPerSection = configValues.join("\n");
13-
$scope.curlCommand = NewConnectorFactory.getCurlCommand(configValues);
14-
};
15-
} else {
166
$http.get(env.KAFKA_CONNECT() + '/connector-plugins').then(function(allPlugins){
177
angular.forEach(allPlugins.data, function (plugin) {
188
if (plugin.class.indexOf($routeParams.name) > 0) {
@@ -26,7 +16,6 @@ angularAPP.controller('CreateConnectorCtrl', function ($scope, $rootScope, $http
2616
$log.info('Got notification: ' + update);
2717
});
2818

29-
}
3019
$scope.prefillValues = true;
3120
$scope.showCurl = false;
3221
$scope.toggleShowCurl = function () { $scope.showCurl = !$scope.showCurl; }
@@ -42,6 +31,9 @@ angularAPP.controller('CreateConnectorCtrl', function ($scope, $rootScope, $http
4231
//If user changes config from the editor
4332
$scope.$watch('formValuesPerSection', function() {
4433
if ($scope.formValuesPerSection) {
34+
console.log('test', $scope.formValuesPerSection)
35+
$scope.formValuesPerSection = $scope.formValuesPerSection.replace("\r", "");
36+
console.log('test', $scope.formValuesPerSection)
4537
var flatValuesArray = $scope.formValuesPerSection.split("\n");
4638
$scope.curlCommand = NewConnectorFactory.getCurlCommand(flatValuesArray);
4739
}

0 commit comments

Comments
 (0)