|
1
|
package eu.dnetlib.repo.manager.client.enrichcontent;
|
|
2
|
|
|
3
|
import com.google.gwt.core.client.GWT;
|
|
4
|
import com.google.gwt.dom.client.Document;
|
|
5
|
import com.google.gwt.event.dom.client.ClickEvent;
|
|
6
|
import com.google.gwt.event.dom.client.ClickHandler;
|
|
7
|
import com.google.gwt.user.client.rpc.AsyncCallback;
|
|
8
|
import com.google.gwt.user.client.ui.FlowPanel;
|
|
9
|
import com.google.gwt.user.client.ui.HTML;
|
|
10
|
import com.google.gwt.user.client.ui.Widget;
|
|
11
|
import eu.dnetlib.domain.data.Repository;
|
|
12
|
import eu.dnetlib.gwt.client.help.HelpService;
|
|
13
|
import eu.dnetlib.gwt.client.help.HelpServiceAsync;
|
|
14
|
import eu.dnetlib.repo.manager.client.AbstractRepositoryManagerWidget;
|
|
15
|
import eu.dnetlib.repo.manager.client.HelpCallback;
|
|
16
|
import eu.dnetlib.repo.manager.client.RepositoryManager;
|
|
17
|
import eu.dnetlib.repo.manager.client.RepositoryManagerWidget;
|
|
18
|
import eu.dnetlib.repo.manager.client.services.BrokerService;
|
|
19
|
import eu.dnetlib.repo.manager.client.services.BrokerServiceAsync;
|
|
20
|
import eu.dnetlib.repo.manager.shared.DatasourcesCollection;
|
|
21
|
import eu.dnetlib.repo.manager.shared.Tuple;
|
|
22
|
import eu.dnetlib.repo.manager.shared.broker.BrowseEntry;
|
|
23
|
import eu.dnetlib.repo.manager.shared.broker.DatasourcesBroker;
|
|
24
|
import org.gwtbootstrap3.client.ui.Alert;
|
|
25
|
import org.gwtbootstrap3.client.ui.Anchor;
|
|
26
|
import org.gwtbootstrap3.client.ui.constants.AlertType;
|
|
27
|
|
|
28
|
/**
|
|
29
|
* Created by stefania on 4/4/16.
|
|
30
|
*/
|
|
31
|
public class EnrichContentWidget extends AbstractRepositoryManagerWidget implements RepositoryManagerWidget {
|
|
32
|
|
|
33
|
private String parentToken = "";
|
|
34
|
private String restToken = "";
|
|
35
|
|
|
36
|
private FlowPanel enrichContentBoxContent = new FlowPanel();
|
|
37
|
|
|
38
|
private Alert errorAlert = new Alert();
|
|
39
|
|
|
40
|
private static HelpServiceAsync helpService = GWT.create(HelpService.class);
|
|
41
|
private static BrokerServiceAsync brokerService = GWT.create(BrokerService.class);
|
|
42
|
|
|
43
|
public EnrichContentWidget() {
|
|
44
|
|
|
45
|
super();
|
|
46
|
|
|
47
|
HTML title = new HTML("<h1 class=\"uk-article-title\">Enrich Your Content - Browse Events</h1>");
|
|
48
|
title.addStyleName("uk-margin-medium-bottom");
|
|
49
|
contentPanel.add(title);
|
|
50
|
|
|
51
|
errorAlert.setType(AlertType.DANGER);
|
|
52
|
errorAlert.setDismissable(false);
|
|
53
|
errorAlert.setVisible(false);
|
|
54
|
enrichContentBoxContent.add(errorAlert);
|
|
55
|
|
|
56
|
contentPanel.add(enrichContentBoxContent);
|
|
57
|
}
|
|
58
|
|
|
59
|
@Override
|
|
60
|
public void clear() {
|
|
61
|
|
|
62
|
enrichContentBoxContent.clear();
|
|
63
|
errorAlert.setVisible(false);
|
|
64
|
gridPanel.remove(helpPanel);
|
|
65
|
}
|
|
66
|
|
|
67
|
@Override
|
|
68
|
public void reload() {
|
|
69
|
|
|
70
|
Document.get().getElementById("headerNoTransparent").removeClassName("tm-header-transparent");
|
|
71
|
enrichContentBoxContent.add(errorAlert);
|
|
72
|
|
|
73
|
helpService.getHelpById(parentToken, new HelpCallback(helpPanel, gridPanel));
|
|
74
|
|
|
75
|
final HTML loadingWheel = new HTML("<div class=\"loader-big\" style=\"text-align: center; padding-top: 170px; " +
|
|
76
|
"color: rgb(47, 64, 80); font-weight: bold;\">Retrieving repositories...</div>" +
|
|
77
|
"<div class=\"whiteFilm\"></div>");
|
|
78
|
enrichContentBoxContent.addStyleName("loading-big");
|
|
79
|
enrichContentBoxContent.add(loadingWheel);
|
|
80
|
|
|
81
|
brokerService.getDatasourcesOfUser(RepositoryManager.currentUser.getEmail(), false, false, new AsyncCallback<DatasourcesBroker>() {
|
|
82
|
|
|
83
|
@Override
|
|
84
|
public void onFailure(Throwable caught) {
|
|
85
|
|
|
86
|
enrichContentBoxContent.removeStyleName("loading-big");
|
|
87
|
enrichContentBoxContent.remove(loadingWheel);
|
|
88
|
|
|
89
|
errorAlert.setText("System error retrieving repositories.");
|
|
90
|
errorAlert.setVisible(true);
|
|
91
|
}
|
|
92
|
|
|
93
|
@Override
|
|
94
|
public void onSuccess(DatasourcesBroker datasourcesBroker) {
|
|
95
|
|
|
96
|
enrichContentBoxContent.removeStyleName("loading-big");
|
|
97
|
enrichContentBoxContent.remove(loadingWheel);
|
|
98
|
|
|
99
|
enrichContentBoxContent.addStyleName("uk-width-1-1 uk-grid");
|
|
100
|
|
|
101
|
FlowPanel titlePanel = new FlowPanel();
|
|
102
|
titlePanel.addStyleName("uk-width-1-1 uk-first-column uk-margin-bottom");
|
|
103
|
enrichContentBoxContent.add(titlePanel);
|
|
104
|
|
|
105
|
//CONTENT
|
|
106
|
|
|
107
|
final FlowPanel contentPanel = new FlowPanel();
|
|
108
|
contentPanel.addStyleName("uk-width-1-1");
|
|
109
|
enrichContentBoxContent.add(contentPanel);
|
|
110
|
|
|
111
|
final FlowPanel reposList = new FlowPanel();
|
|
112
|
createReposList(datasourcesBroker, reposList);
|
|
113
|
|
|
114
|
final FlowPanel reposGrid = new FlowPanel();
|
|
115
|
createReposGrid(datasourcesBroker, reposGrid);
|
|
116
|
contentPanel.add(reposGrid);
|
|
117
|
|
|
118
|
// TITLE
|
|
119
|
|
|
120
|
FlowPanel showOptions = new FlowPanel();
|
|
121
|
showOptions.addStyleName("uk-float-right");
|
|
122
|
titlePanel.add(showOptions);
|
|
123
|
|
|
124
|
final Anchor gridView = new Anchor();
|
|
125
|
final Anchor listView = new Anchor();
|
|
126
|
|
|
127
|
gridView.addStyleName("grid-view active");
|
|
128
|
gridView.setHTML("<i class=\"fa fa-th\"></i>");
|
|
129
|
gridView.addClickHandler(new ClickHandler() {
|
|
130
|
@Override
|
|
131
|
public void onClick(ClickEvent event) {
|
|
132
|
listView.removeStyleName("active");
|
|
133
|
gridView.addStyleName("active");
|
|
134
|
contentPanel.clear();
|
|
135
|
contentPanel.add(reposGrid);
|
|
136
|
}
|
|
137
|
});
|
|
138
|
showOptions.add(gridView);
|
|
139
|
|
|
140
|
listView.addStyleName("grid-view");
|
|
141
|
listView.setHTML("<i class=\"fa fa-th-list\"></i>");
|
|
142
|
listView.addClickHandler(new ClickHandler() {
|
|
143
|
@Override
|
|
144
|
public void onClick(ClickEvent event) {
|
|
145
|
gridView.removeStyleName("active");
|
|
146
|
listView.addStyleName("active");
|
|
147
|
contentPanel.clear();
|
|
148
|
contentPanel.add(reposList);
|
|
149
|
}
|
|
150
|
});
|
|
151
|
showOptions.add(listView);
|
|
152
|
|
|
153
|
// HTML titleElement = new HTML("<h4 class=\"uk-h4 uk-text-primary uk-scrollspy-inview uk-animation-slide-top-medium\"" +
|
|
154
|
// "uk-scrollspy-class=\"\"><span>Choose the Datasource for which you would like to view events</span></h4>");
|
|
155
|
// titleElement.addStyleName("m-b-md");
|
|
156
|
// titlePanel.add(titleElement);
|
|
157
|
}
|
|
158
|
});
|
|
159
|
}
|
|
160
|
|
|
161
|
@Override
|
|
162
|
public void setToken(String parentToken, String rest) {
|
|
163
|
this.parentToken = parentToken;
|
|
164
|
this.restToken = rest;
|
|
165
|
}
|
|
166
|
|
|
167
|
@Override
|
|
168
|
public void afterAdditionToRootPanel() {
|
|
169
|
|
|
170
|
}
|
|
171
|
|
|
172
|
private void createReposList(DatasourcesBroker datasourcesBroker, FlowPanel reposList) {
|
|
173
|
|
|
174
|
reposList.addStyleName("uk-grid-margin uk-grid uk-grid-stack repos-list");
|
|
175
|
|
|
176
|
if(datasourcesBroker.getDatasourcesOfUser().isEmpty()) {
|
|
177
|
|
|
178
|
reposList.add(new HTML("No Datasources are registered under your account"));
|
|
179
|
|
|
180
|
} else {
|
|
181
|
|
|
182
|
FlowPanel colPanel = new FlowPanel();
|
|
183
|
colPanel.addStyleName("uk-width-1-1@m uk-first-column");
|
|
184
|
reposList.add(colPanel);
|
|
185
|
|
|
186
|
FlowPanel divPanel = new FlowPanel();
|
|
187
|
divPanel.addStyleName("uk-overflow-auto uk-scrollspy-inview uk-animation-slide-top-medium");
|
|
188
|
colPanel.add(divPanel);
|
|
189
|
|
|
190
|
String content = "<table class=\"uk-table uk-table-striped uk-table-middle\">" +
|
|
191
|
"<thead><tr><th>Logo</th><th class=\"uk-text-nowrap\">Name</th><th class=\"uk-text-nowrap\"># of events</th>" +
|
|
192
|
"</tr></thead>";
|
|
193
|
|
|
194
|
content += "<tbody>";
|
|
195
|
|
|
196
|
for(final Tuple<BrowseEntry, String> datasource : datasourcesBroker.getDatasourcesOfUser()) {
|
|
197
|
|
|
198
|
content += "<tr class=\"el-item\">" +
|
|
199
|
"<td class=\"uk-table-shrink\">" +
|
|
200
|
"<a href=\"#" + parentToken + "/" + datasource.getFirst().getValue() + "\" class=\"el-link\">" ;
|
|
201
|
|
|
202
|
if(datasource.getSecond()==null || datasource.getSecond().trim().isEmpty())
|
|
203
|
content += "<img src=\"img/yourLogoHere.jpg\" alt=\"[Repo Logo]\" class=\"el-image uk-preserve-width\" style=\"height: 45px\">";
|
|
204
|
else
|
|
205
|
content += "<img src=\"" + datasource.getSecond() + "\" alt=\"[Repo Logo]\" class=\"el-image uk-preserve-width\" style=\"height: 45px\">";
|
|
206
|
|
|
207
|
content += "</a></td>" +
|
|
208
|
"<td class=\"uk-text-nowrap uk-table-shrink\">\n" +
|
|
209
|
"<a href=\"#" + parentToken + "/" + datasource.getFirst().getValue() + "\" class=\"el-link\">" +
|
|
210
|
datasource.getFirst().getValue() + "</a>" +
|
|
211
|
"</td>" +
|
|
212
|
"<td class=\"uk-text-nowrap uk-table-shrink\">\n" +
|
|
213
|
"<a href=\"#" + parentToken + "/" + datasource.getFirst().getValue() + "\" class=\"el-link\">" +
|
|
214
|
"<div class=\"el-title\">" + datasource.getFirst().getSize() + "</div>" +
|
|
215
|
"</a>" +
|
|
216
|
"</td>" +
|
|
217
|
"</tr>";
|
|
218
|
}
|
|
219
|
|
|
220
|
content += "</tbody></table>";
|
|
221
|
|
|
222
|
HTML reposListHTML = new HTML();
|
|
223
|
reposListHTML.setHTML(content);
|
|
224
|
|
|
225
|
divPanel.add(reposListHTML);
|
|
226
|
}
|
|
227
|
}
|
|
228
|
|
|
229
|
private void createReposGrid(DatasourcesBroker datasourcesBroker, FlowPanel reposGrid) {
|
|
230
|
|
|
231
|
reposGrid.addStyleName("uk-grid-large uk-grid-margin-large uk-grid repos-grid");
|
|
232
|
|
|
233
|
if(datasourcesBroker.getDatasourcesOfUser().isEmpty()) {
|
|
234
|
|
|
235
|
reposGrid.add(new HTML("No Datasources are registered under your account"));
|
|
236
|
|
|
237
|
} else {
|
|
238
|
|
|
239
|
if(datasourcesBroker.getDatasourcesOfUser().size()==1) {
|
|
240
|
|
|
241
|
FlowPanel colPanel = new FlowPanel();
|
|
242
|
colPanel.addStyleName("uk-width-expand@m uk-first-column");
|
|
243
|
reposGrid.add(colPanel);
|
|
244
|
|
|
245
|
FlowPanel divPanel = new FlowPanel();
|
|
246
|
divPanel.addStyleName("uk-margin uk-grid-match uk-child-width-1-1 uk-grid-small uk-grid-divider uk-grid uk-scrollspy-inview uk-animation-slide-top-medium uk-grid-stack");
|
|
247
|
colPanel.add(divPanel);
|
|
248
|
|
|
249
|
divPanel.add(createGridItemForRepo(datasourcesBroker.getDatasourcesOfUser().get(0), false));
|
|
250
|
|
|
251
|
} else if(datasourcesBroker.getDatasourcesOfUser().size()==2) {
|
|
252
|
|
|
253
|
FlowPanel colPanel1 = new FlowPanel();
|
|
254
|
colPanel1.addStyleName("uk-width-expand@m uk-first-column");
|
|
255
|
reposGrid.add(colPanel1);
|
|
256
|
|
|
257
|
FlowPanel divPanel1 = new FlowPanel();
|
|
258
|
divPanel1.addStyleName("uk-margin uk-grid-match uk-child-width-1-1 uk-grid-small uk-grid-divider uk-grid uk-scrollspy-inview uk-animation-slide-top-medium uk-grid-stack");
|
|
259
|
colPanel1.add(divPanel1);
|
|
260
|
|
|
261
|
divPanel1.add(createGridItemForRepo(datasourcesBroker.getDatasourcesOfUser().get(0), false));
|
|
262
|
|
|
263
|
FlowPanel colPanel2 = new FlowPanel();
|
|
264
|
colPanel2.addStyleName("uk-width-expand@m uk-first-column");
|
|
265
|
reposGrid.add(colPanel2);
|
|
266
|
|
|
267
|
FlowPanel divPanel2 = new FlowPanel();
|
|
268
|
divPanel2.addStyleName("uk-margin uk-grid-match uk-child-width-1-1 uk-grid-small uk-grid-divider uk-grid uk-scrollspy-inview uk-animation-slide-top-medium uk-grid-stack");
|
|
269
|
colPanel2.add(divPanel2);
|
|
270
|
|
|
271
|
divPanel2.add(createGridItemForRepo(datasourcesBroker.getDatasourcesOfUser().get(1), false));
|
|
272
|
|
|
273
|
} else {
|
|
274
|
|
|
275
|
FlowPanel colPanel1 = new FlowPanel();
|
|
276
|
colPanel1.addStyleName("uk-width-expand@m uk-first-column");
|
|
277
|
reposGrid.add(colPanel1);
|
|
278
|
|
|
279
|
FlowPanel divPanel1 = new FlowPanel();
|
|
280
|
divPanel1.addStyleName("uk-margin uk-grid-match uk-child-width-1-1 uk-grid-small uk-grid-divider uk-grid uk-scrollspy-inview uk-animation-slide-top-medium uk-grid-stack");
|
|
281
|
colPanel1.add(divPanel1);
|
|
282
|
|
|
283
|
FlowPanel colPanel2 = new FlowPanel();
|
|
284
|
colPanel2.addStyleName("uk-width-expand@m uk-first-column");
|
|
285
|
reposGrid.add(colPanel2);
|
|
286
|
|
|
287
|
FlowPanel divPanel2 = new FlowPanel();
|
|
288
|
divPanel2.addStyleName("uk-margin uk-grid-match uk-child-width-1-1 uk-grid-small uk-grid-divider uk-grid uk-scrollspy-inview uk-animation-slide-top-medium uk-grid-stack");
|
|
289
|
colPanel2.add(divPanel2);
|
|
290
|
|
|
291
|
FlowPanel colPanel3 = new FlowPanel();
|
|
292
|
colPanel3.addStyleName("uk-width-expand@m uk-first-column");
|
|
293
|
reposGrid.add(colPanel3);
|
|
294
|
|
|
295
|
FlowPanel divPanel3 = new FlowPanel();
|
|
296
|
divPanel3.addStyleName("uk-margin uk-grid-match uk-child-width-1-1 uk-grid-small uk-grid-divider uk-grid uk-scrollspy-inview uk-animation-slide-top-medium uk-grid-stack");
|
|
297
|
colPanel3.add(divPanel3);
|
|
298
|
|
|
299
|
for(int i=0; i<datasourcesBroker.getDatasourcesOfUser().size(); i++) {
|
|
300
|
|
|
301
|
boolean addExtraClass = false;
|
|
302
|
if(i>2)
|
|
303
|
addExtraClass = true;
|
|
304
|
|
|
305
|
if(i%3 == 0)
|
|
306
|
divPanel1.add(createGridItemForRepo(datasourcesBroker.getDatasourcesOfUser().get(i), addExtraClass));
|
|
307
|
else if(i%3 == 1)
|
|
308
|
divPanel2.add(createGridItemForRepo(datasourcesBroker.getDatasourcesOfUser().get(i), addExtraClass));
|
|
309
|
else
|
|
310
|
divPanel3.add(createGridItemForRepo(datasourcesBroker.getDatasourcesOfUser().get(i), addExtraClass));
|
|
311
|
}
|
|
312
|
|
|
313
|
}
|
|
314
|
}
|
|
315
|
}
|
|
316
|
|
|
317
|
private FlowPanel createGridItemForRepo(Tuple<BrowseEntry, String> datasource, boolean addExtraClass) {
|
|
318
|
|
|
319
|
FlowPanel gridItem = new FlowPanel();
|
|
320
|
if(addExtraClass)
|
|
321
|
gridItem.addStyleName("uk-grid-margin uk-first-column");
|
|
322
|
else
|
|
323
|
gridItem.addStyleName("uk-first-column");
|
|
324
|
|
|
325
|
|
|
326
|
String gridItemContent = "<a href=\"#" + parentToken + "/" + datasource.getFirst().getValue() + "\" class=\"el-link\">";
|
|
327
|
|
|
328
|
gridItemContent += "<div uk-scrollspy-class=\"\" class=\"el-item uk-panel uk-scrollspy-inview uk-animation-slide-top-medium\" style=\"\">" +
|
|
329
|
"<div class=\"uk-child-width-expand uk-grid-medium uk-flex-middle uk-grid\" uk-grid=\"\">";
|
|
330
|
|
|
331
|
|
|
332
|
gridItemContent += "<div class=\"uk-width-1-3@m uk-first-column\">";
|
|
333
|
|
|
334
|
if(datasource.getSecond()==null || datasource.getSecond().trim().isEmpty())
|
|
335
|
gridItemContent += "<img src=\"img/yourLogoHere.jpg\" class=\"el-image uk-border-rounded\" alt=\"\">";
|
|
336
|
else
|
|
337
|
gridItemContent += "<img src=\"" + datasource.getSecond() + "\" class=\"el-image uk-border-rounded\" alt=\"\">";
|
|
338
|
|
|
339
|
gridItemContent += "</div>";
|
|
340
|
|
|
341
|
gridItemContent += "<div><h3 class=\"el-title uk-margin uk-h5 uk-margin-remove-adjacent uk-margin-small-bottom\">" + datasource.getFirst().getValue() + "</h3>" +
|
|
342
|
"<div class=\"el-meta uk-margin uk-text-meta\">(" + datasource.getFirst().getSize() + " events)</div>" +
|
|
343
|
"</div>";
|
|
344
|
|
|
345
|
gridItemContent += "</div></div></a>";
|
|
346
|
|
|
347
|
gridItem.add(new HTML(gridItemContent));
|
|
348
|
|
|
349
|
return gridItem;
|
|
350
|
}
|
|
351
|
}
|