Skip to content

Commit 587f265

Browse files
committed
Algolia integration using UUI library
1 parent 60379f2 commit 587f265

File tree

5 files changed

+283
-292
lines changed

5 files changed

+283
-292
lines changed
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
1-
.umb-content-grid {
2-
display:grid;
3-
grid-template-columns: repeat(3, 1fr);
4-
gap:10px;
1+
/* align child element in two columns: 1/3 and 2/3 */
2+
.alg-col-2 {
3+
display: grid;
4+
grid-template-columns: 25% 60%;
5+
gap: 20px;
56
}
7+
8+
/* align child element in three equal columns */
9+
.alg-col-3 {
10+
display: grid;
11+
grid-template-columns: 33% 33% 33%;
12+
gap: 10px;
13+
}
14+

src/Umbraco.Cms.Integrations.Search.Algolia/App_Plugins/UmbracoCms.Integrations/Search/Algolia/js/dashboard.controller.js

Lines changed: 82 additions & 68 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
function dashboardController(notificationsService, overlayService, eventsService, algoliaService, umbracoCmsIntegrationsSearchAlgoliaResource) {
22
var vm = this;
33

4+
const CREATE_INDEX_DEFINITION = "Create Index Definition";
5+
const EDIT_INDEX_DEFINITION = "Edit Index Definition";
6+
47
vm.loading = false;
58

69
vm.searchQuery = "";
@@ -18,27 +21,29 @@
1821
vm.searchIndex = searchIndex;
1922
vm.deleteIndex = deleteIndex;
2023
vm.search = search;
24+
vm.back = back;
2125

2226
function init() {
2327
/* contentData property:
2428
[
25-
{
26-
"contentType": {
27-
"alias": "",
28-
"name": "",
29-
"icon": ""
30-
},
31-
"properties": [
32-
{
33-
"alias": "",
34-
"name": ""
35-
}
36-
]
37-
}
29+
{
30+
"contentType": {
31+
"alias": "",
32+
"name": "",
33+
"icon": ""
34+
},
35+
"properties": [
36+
{
37+
"alias": "",
38+
"name": ""
39+
}
40+
]
41+
}
3842
]
3943
*/
4044
vm.manageIndex = {
4145
id: 0,
46+
viewTitle: CREATE_INDEX_DEFINITION,
4247
name: "",
4348
selectedContentType: {},
4449
contentTypesList: [],
@@ -55,7 +60,6 @@
5560
],
5661
contentData: [],
5762
showProperties: function (contentType) {
58-
5963
this.selectedContentType = contentType;
6064

6165
algoliaService.getPropertiesByContentTypeId(contentType.id, (response) => {
@@ -88,67 +92,64 @@
8892
this.propertiesList = [];
8993
},
9094
selectProperty: function (property) {
91-
9295
var contentDataItem = vm.manageIndex.contentData.find(obj => obj.contentType.alias == vm.manageIndex.selectedContentType.alias);
9396

94-
var selected = !property.selected;
95-
if (selected) {
96-
// mark item selected
97-
vm.manageIndex.propertiesList.find(obj => obj.alias == property.alias).selected = true;
98-
99-
// check if content type exists in the contentData array
100-
if (!contentDataItem) {
101-
var contentItem = {
102-
contentType: {
103-
alias: vm.manageIndex.selectedContentType.alias,
104-
name: vm.manageIndex.selectedContentType.name,
105-
icon: vm.manageIndex.selectedContentType.icon
106-
},
107-
properties: []
108-
};
109-
vm.manageIndex.contentData.push(contentItem);
110-
111-
// select content type
112-
vm.manageIndex.contentTypesList.forEach(obj => {
113-
if (obj.alias == vm.manageIndex.selectedContentType.alias) {
114-
obj.selected = true;
115-
obj.allowRemove = true;
116-
}
117-
});
118-
}
119-
120-
// add property
121-
vm.manageIndex.contentData
122-
.find(obj => obj.contentType.alias == vm.manageIndex.selectedContentType.alias)
123-
.properties.push({
124-
alias: property.alias,
125-
name: property.name
126-
});
97+
// mark item selected
98+
vm.manageIndex.propertiesList.find(obj => obj.alias == property.alias).selected = true;
99+
100+
// check if content type exists in the contentData array
101+
if (!contentDataItem) {
102+
var contentItem = {
103+
contentType: {
104+
alias: vm.manageIndex.selectedContentType.alias,
105+
name: vm.manageIndex.selectedContentType.name,
106+
icon: vm.manageIndex.selectedContentType.icon
107+
},
108+
properties: []
109+
};
110+
vm.manageIndex.contentData.push(contentItem);
111+
112+
// select content type
113+
vm.manageIndex.contentTypesList.forEach(obj => {
114+
if (obj.alias == vm.manageIndex.selectedContentType.alias) {
115+
obj.selected = true;
116+
obj.allowRemove = true;
117+
}
118+
});
127119
}
128-
else {
129-
// deselect item
130-
vm.manageIndex.propertiesList.find(obj => obj.alias == property.alias).selected = false;
131-
132-
// remove property item
133-
const propertyIndex = vm.manageIndex.contentData
134-
.find(obj => obj.contentType.alias == vm.manageIndex.selectedContentType.alias)
135-
.properties.map(obj => obj.alias).indexOf(property.alias);
136-
vm.manageIndex.contentData
137-
.find(obj => obj.contentType.alias == vm.manageIndex.selectedContentType.alias).properties.splice(propertyIndex, 1);
138-
139-
// remove content type item with no properties and deselect
140-
if (vm.manageIndex.contentData.find(obj => obj.contentType.alias == vm.manageIndex.selectedContentType.alias).properties.length == 0) {
141-
vm.manageIndex.contentTypesList.find(obj => obj.alias == vm.manageIndex.selectedContentType.alias).selected = false;
142-
vm.manageIndex.contentTypesList.find(obj => obj.alias == vm.manageIndex.selectedContentType.alias).allowRemove = false;
143-
144-
const contentTypeIndex = vm.manageIndex.contentData.map(obj => obj.contentType.alias).indexOf(vm.manageIndex.selectedContentType.alias);
145-
vm.manageIndex.contentData.splice(contentTypeIndex, 1);
146-
}
120+
121+
// add property
122+
vm.manageIndex.contentData
123+
.find(obj => obj.contentType.alias == vm.manageIndex.selectedContentType.alias)
124+
.properties.push({
125+
alias: property.alias,
126+
name: property.name
127+
});
128+
},
129+
removeProperty: function (property) {
130+
// deselect item
131+
vm.manageIndex.propertiesList.find(obj => obj.alias == property.alias).selected = false;
132+
133+
// remove property item
134+
const propertyIndex = vm.manageIndex.contentData
135+
.find(obj => obj.contentType.alias == vm.manageIndex.selectedContentType.alias)
136+
.properties.map(obj => obj.alias).indexOf(property.alias);
137+
vm.manageIndex.contentData
138+
.find(obj => obj.contentType.alias == vm.manageIndex.selectedContentType.alias).properties.splice(propertyIndex, 1);
139+
140+
// remove content type item with no properties and deselect
141+
if (vm.manageIndex.contentData.find(obj => obj.contentType.alias == vm.manageIndex.selectedContentType.alias).properties.length == 0) {
142+
vm.manageIndex.contentTypesList.find(obj => obj.alias == vm.manageIndex.selectedContentType.alias).selected = false;
143+
vm.manageIndex.contentTypesList.find(obj => obj.alias == vm.manageIndex.selectedContentType.alias).allowRemove = false;
144+
145+
const contentTypeIndex = vm.manageIndex.contentData.map(obj => obj.contentType.alias).indexOf(vm.manageIndex.selectedContentType.alias);
146+
vm.manageIndex.contentData.splice(contentTypeIndex, 1);
147147
}
148148
},
149149
reset: function () {
150150
this.visible = false;
151151
this.id = 0;
152+
this.viewTitle = CREATE_INDEX_DEFINITION
152153
this.name = "";
153154
this.selectedContentType = {};
154155
this.contentTypesList = [];
@@ -175,11 +176,13 @@
175176

176177
function saveIndex() {
177178

179+
console.log(vm.manageIndex.name);
180+
178181
if (vm.manageIndex.name.length == 0 || vm.manageIndex.contentData.length == 0) {
179182
notificationsService.error("Algolia", "Index name and content schema are required.");
180183
return false;
181184
}
182-
185+
183186
vm.loading = true;
184187

185188
umbracoCmsIntegrationsSearchAlgoliaResource
@@ -206,6 +209,7 @@
206209
vm.viewState = "manage";
207210

208211
vm.manageIndex.id = index.id;
212+
vm.manageIndex.viewTitle = EDIT_INDEX_DEFINITION;
209213
vm.manageIndex.name = index.name;
210214
vm.manageIndex.contentData = index.contentData;
211215

@@ -281,6 +285,16 @@
281285
vm.searchResults = response;
282286
});
283287
}
288+
289+
function back() {
290+
vm.manageIndex.reset();
291+
292+
vm.searchQuery = '';
293+
vm.selectedSearchIndex = {};
294+
vm.searchResults = {};
295+
296+
vm.viewState = "list";
297+
}
284298
}
285299

286300
angular.module("umbraco")

0 commit comments

Comments
 (0)