source: main/trunk/model-sites-dev/von-sparql/js/von-sparql-comparison-setup.js@ 29444

Last change on this file since 29444 was 29444, checked in by sjs49, 9 years ago

Refactored code a little to remove some unecessary function parameters relating to drawing objects on left and right side of comparison page
File size: 9.0 KB
Line 
1///////////////////////////////////////////////
2// //
3// Setup for comparisons //
4// Query generation code is messy, watch out!//
5// //
6///////////////////////////////////////////////
7
8//SPARQL endpoint location
9var sparqlEndpoint= location.protocol + '//' + location.hostname + ":3030/greenstone/query" ;
10//Contains the query built
11var comparisonQuery;
12//Hard limit for results returned from a query
13var hardLimit = 2000;
14//sgvizler chart width/height
15var defaultChartWidth = 468;
16var defaultChartHeight = 200;
17//just to keep track of amount of queries running
18var currentQueries = 0;
19
20//collection names
21var leftCollection = "";
22var rightCollection = "";
23
24// ComparisonQuery object contains details about a comparison to be made between 2 datasets
25// page Page number
26// datsetSelection Left or right dataset
27// pred_L Left predicate
28// predval_L Left predicate value (if restricting to a specific value)
29// refine_L Left predicate to use for comparison after restriction
30// pred_R Right predicate
31// predval_R Right predicate value (if restricting to a specific value)
32// refine_R Right predicate to use for comparison after restriction
33function ComparisonQuery(){
34 this.page = 1;
35 this.datasetSelection = "";
36 this.type = "intersection";
37 this.pred_L = $('#sel_leftPredicate').val();
38 this.predval_L = $('#sel_leftPredicateValue').val();
39 this.refine_L = "";
40 if($('#cb_leftRefineSearch').is(':checked'))
41 this.refine_L = " <" + $('#sel_leftVisualizePredicate').val() + "> ";// + "> ?common";
42
43 this.pred_R = $('#sel_rightPredicate').val();
44 this.predval_R = $('#sel_rightPredicateValue').val();
45 this.refine_R = "";
46 if($('#cb_rightRefineSearch').is(':checked'))
47 this.refine_R = " <" + $('#sel_rightVisualizePredicate').val() + "> ";// + "> ?common";
48 $('#span_PageNum').text("1");
49}
50
51function setupPage(){
52 //load available collection names into dropdown lists
53
54 sgvizler_setup();
55
56 populateCollectionDropdowns();
57
58 //Load collection names from dropdown boxes
59 leftCollection = $('#sel_leftCollection').val();
60 rightCollection = $('#sel_rightCollection').val();
61
62
63 //Draw buttons, etc for each side of page
64 drawSide("left");
65 apply_functions("left");
66 drawSide("right");
67 apply_functions("right");
68
69 //apply css to generated objects
70 apply_styles();
71
72 //populates predicate dropdown boxes
73 populatePredicateSelector("all", "sel_comparisonPredicate");
74}
75
76//Loads collection names into seletors
77function populateCollectionDropdowns(){
78 var path = location.pathname;
79 var libraryName = path.split("/")[2];
80 var url = location.protocol + '//' + location.hostname + ":" + location.port + "/greenstone3/" + libraryName + "?o=xml" ;
81
82 //Ajax to get page xml
83 $.ajax({
84 url: url,
85 type:"GET",
86 async: false,
87 })
88 .done(function( xmlDoc ) {
89 //foreach collection returned
90 $("#sel_leftCollection").empty();
91 $("#sel_rightCollection").empty();
92 $(xmlDoc).find("page pageResponse collectionList collection").each(function(){
93 var name = $(this).attr("name");
94 $("#sel_leftCollection").append("<option value=\"" + name + "\">" + name + " </option>");
95 $("#sel_rightCollection").append("<option value=\"" + name + "\">" + name + " </option>");
96 });
97 });
98
99}
100
101//Redraw a side, given the collection name
102function drawSide(side){
103 var collectionName = $("#sel_" + side + "Collection").val();
104 $('#span_' + side + 'Name').html(collectionName);
105 drawOverview(collectionName, ("div_" + side + "Overview"));
106 populatePredicateSelector(collectionName, ("sel_" + side + "Predicate"));
107}
108
109//Draw predicates available for dataset
110function drawOverview(collection, container){
111 var Q = new sgvizler.Query();
112 Q.query(createOverviewQuery(collection))
113 .endpointURL(sparqlEndpoint)
114 .endpointOutputFormat("json")
115 .chartFunction("google.visualization.Table")
116 .draw(container);
117}
118
119//Return a query that searches for all uses of predicates in a graph
120function createOverviewQuery(collection){
121 var Query = "PREFIX gsdl: <http://localhost:3030/greenstone/data/>"
122 +"SELECT (?p as ?Predicate) (COUNT (?s) as ?Total)WHERE\n"
123 + "{\n";
124 if(collection=="all")
125 Query += "?s ?p ?o ";
126 else
127 Query += "GRAPH gsdl:" + collection + "{"
128 + " ?s ?p ?o "
129 + "}";
130 Query += "}"
131 + "GROUP BY ?p "
132 + "ORDER BY DESC(?Predicate)";
133 return Query;
134}
135
136function sgvizler_setup(){
137 sgvizler
138 .defaultEndpointOutputFormat('jsonp')
139 .defaultChartWidth(defaultChartWidth)
140 .defaultChartHeight(defaultChartHeight)
141 .prefix('dc', "http://purl.org/dc/elements/1.1/")
142 .prefix('xsd', "http://www.w3.org/2001/XMLSchema#")
143 .prefix('gsdl', "http://localhost:3030/greenstone/data/")
144}
145
146function apply_styles(){
147 $('.basicControls tbody tr td:first-child').addClass("alignRight");
148 $('.refineControls tbody tr td:first-child').addClass("alignRight");
149 $('.refineControls').toggle();
150 $('#txt_comparisonPredicate').val("http://purl.org/dc/elements/1.1/Title");
151 $('#div_resultPredicates').toggle();
152 $('#cb_showOnlyCommonObjects').attr('checked','checked');
153 $('#cb_showOnlyCommonObjects').on('click', function(){
154 $('#div_resultPredicates').toggle();
155 });
156
157 $('#btn_submitComparison').on('click',function(){
158 drawComparisonTable();
159 });
160
161 $('#btn_comparisonPagePrev').on('click',function(){
162 if(comparisonQuery.page <= 1)
163 return;
164 $('#span_PageNum').text(--comparisonQuery.page)
165 drawComparisonTable();
166 });
167
168 $('#btn_comparisonPageNext').on('click',function(){
169 $('#span_PageNum').text(++comparisonQuery.page)
170 drawComparisonTable();
171 });
172
173 $('#btn_exportCSV').on('click',function(){
174 var csv = $('#div_combinedResultsVisualization table').table2CSV({
175 delivery: 'value'
176 });
177 var vendorName = window.navigator.vendor;
178 if(vendorName == "Google Inc.") {
179 // is Google chrome
180 window.location.href = 'data:text/csv;charset=UTF-8,' + encodeURIComponent(csv);
181 }
182 else{
183 alert("-----Use Google Chrome to save file to disk.-----\n\n" + csv);
184 }
185 });
186}
187
188//Apply functions to various elements
189function apply_functions(side){
190
191 //Create jquery UI comboboxes
192 $('#div_' + side + 'RefineControls select').combobox({
193 select: function(event, ui) {
194 var collectionValue = $("#sel_" + side + "Collection").val();
195 var id = event.target.id;
196 if(id == "sel_" + side + "Predicate")
197 updateValueSelector(this.value,"sel_"+ side + "PredicateValue", collectionValue);
198 }
199 });
200
201 $('#btn_' + side + 'ShowChart').on('click',function(){
202 hardLimit=2000;
203 var collectionValue = $("#sel_" + side + "Collection").val();
204 drawFilteredDataset(side, collectionValue);
205 });
206
207 $('#btn_' + side + 'ShowQuery').on('click',function(){
208 var collectionValue = $("#sel_" + side + "Collection").val();
209 hardLimit=2000;
210 alert(generateQuery(side,collectionValue));
211 });
212
213 $('#btn_' + side + 'SubmitQuery').on('click',function(){
214 paper.install(window);
215 var color = updateCircle(side);
216 comparisonQuery = new ComparisonQuery();
217 $('#div_' + side + 'Indicator').css("background-color",color);
218 });
219
220 //When a <tr> in overview table is selected, select in predicate dropdown
221 $(document).on("click", "#div_" + side + "Overview.overview tr", function(){
222 var collectionValue = $("#sel_" + side + "Collection").val();
223 var clickedText = tidyPredicate($(this).children(":first").text());
224 $('#sel_' + side + 'Predicate option[text="' + clickedText + '"]').attr('selected','selected');
225 $('#sel_' + side + 'Predicate option').filter(function(){
226 return $(this).text() == clickedText;
227 }).attr('selected', true);
228
229 $('#sel_' + side + 'Predicate').siblings('.custom-combobox').find('.custom-combobox-input').val(clickedText);
230 updateValueSelector($('#sel_' + side + 'Predicate option:selected').val(),"sel_"+ side + "PredicateValue", collectionValue);
231
232 if($('#cb_quickSearch').is(':checked')) {
233 hardLimit=500;
234 drawFilteredDataset(side, collectionValue);
235 }
236
237 //When TD is selected, highlight similar TD's in opposite table
238 showSimilarPredicates(side,$(this).children(":first").text());
239 });
240
241 $('#cb_' + side + 'RefineSearch').on('click', function(){
242 //$('#table_' + side + 'RefineControls').toggle();
243 $('#table_' + side + 'RefineControls').toggle("slide", { direction: "up" });
244 });
245
246 $('#sel_' + side + 'Collection').on('change',function(){
247 if(side=="left")
248 leftCollection = $('#sel_' + side + 'Collection').val();
249 else
250 rightCollection = $('#sel_' + side + 'Collection').val();
251
252 drawSide(side, $('#sel_' + side + 'Collection').val());
253 });
254}
255
256// When a predicate is clicked on one side, makes the same predicate on
257// the opposite side bold, to stand out
258function showSimilarPredicates(side,clickedText){
259 var oppositeSide;
260 if(side == "left")
261 oppositeSide = "right";
262 else
263 oppositeSide = "left";
264
265 $('#div_' + oppositeSide + 'Overview.overview tr').each(function(){
266 if($(this).children(":first").text() == clickedText)
267 $(this).children(":first").addClass("bold");
268 else
269 $(this).children(":first").removeClass("bold");
270
271 });
272
273 $('#div_' + side + 'Overview.overview tr').each(function(){
274 if($(this).children(":first").text() == clickedText)
275 $(this).children(":first").addClass("bold");
276 else
277 $(this).children(":first").removeClass("bold");
278 });
279}
Note: See TracBrowser for help on using the repository browser.