mirror of
https://github.com/GrammaticalFramework/gf-core.git
synced 2026-04-22 03:09:33 -06:00
RGL Browser: Improved UI, history support
This commit is contained in:
john.j.camilleri
@@ -4,25 +4,26 @@
|
||||
*/
|
||||
$(document).ready(function() {
|
||||
|
||||
var loading = function(b){
|
||||
if (b)
|
||||
$("#loading").show();
|
||||
else
|
||||
var loadCount = 0;
|
||||
var showLoading = function(){
|
||||
loadCount++;
|
||||
$("#loading").show();
|
||||
}
|
||||
var hideLoading = function(){
|
||||
loadCount = Math.max(loadCount-1, 0);
|
||||
if (loadCount == 0)
|
||||
$("#loading").hide();
|
||||
}
|
||||
|
||||
var scrollToY = function(y, callback){
|
||||
$("html, body").animate({ scrollTop: y }, "slow", callback);
|
||||
}
|
||||
var scrollToTop = function() {
|
||||
scrollToY(0);
|
||||
$("html, body").animate({ scrollTop: 0 }, "slow");
|
||||
}
|
||||
var scrollToCodeLine = function(lineNo) {
|
||||
showPanel("#code", function() {
|
||||
// Find exact line, using the classes generated by google prettify
|
||||
var obj = $("#code pre li.L"+(lineNo%10)+":eq("+Math.floor(lineNo/10)+")").prev();
|
||||
var y = Math.max(obj.offset().top - 75, 0);
|
||||
scrollToY(y, function(){
|
||||
var y = Math.max(obj.offset().top - obj.parent().offset().top - 75, 0);
|
||||
$("#code pre").animate({ scrollTop: y }, "slow", function(){
|
||||
highlight(obj);
|
||||
});
|
||||
});
|
||||
@@ -82,11 +83,11 @@ $(document).ready(function() {
|
||||
.appendTo(lang_select);
|
||||
}
|
||||
setLanguage("english");
|
||||
loading(false);
|
||||
hideLoading();
|
||||
},
|
||||
error: function(){
|
||||
hideLoading();
|
||||
alert("Error getting index. Try reloading page, or just give up.");
|
||||
loading(false);
|
||||
}
|
||||
});
|
||||
|
||||
@@ -103,14 +104,10 @@ $(document).ready(function() {
|
||||
for (i in index['languages'][lang]) {
|
||||
var module = index['languages'][lang][i];
|
||||
if (!module) continue;
|
||||
$('<span>')
|
||||
$('<a>')
|
||||
.html(module)
|
||||
.addClass('button')
|
||||
.click((function(lang, module){
|
||||
return function() {
|
||||
loadFile(lang, module);
|
||||
}
|
||||
})(lang, module))
|
||||
.attr('href', "#"+lang+"/"+module+".gf")
|
||||
.appendTo("#modules");
|
||||
}
|
||||
};
|
||||
@@ -118,8 +115,16 @@ $(document).ready(function() {
|
||||
// Initialize the panels & tabs
|
||||
// obj can be just a plain selector or a jQuery object
|
||||
var showPanel = function(obj, callback){
|
||||
$(".panel").hide();
|
||||
$(obj).show(0, callback);
|
||||
showLoading();
|
||||
setTimeout(function(){
|
||||
$(".panel:visible").hide();
|
||||
$(obj).show(0, callback);
|
||||
recalculateHeights();
|
||||
hideLoading();
|
||||
}, 500); // this ensures the loading displays
|
||||
}
|
||||
var getPanel = function() {
|
||||
return $('.panel:visible').first();
|
||||
}
|
||||
$(".panel").each(function(a,b){
|
||||
$("<a>")
|
||||
@@ -154,7 +159,7 @@ $(document).ready(function() {
|
||||
// Load a tags file
|
||||
var loadTagsFile = function(module) {
|
||||
clearScope();
|
||||
loading(true);
|
||||
showLoading();
|
||||
$.ajax({
|
||||
url: "tags/"+module+".gf-tags",
|
||||
type: "GET",
|
||||
@@ -164,48 +169,24 @@ $(document).ready(function() {
|
||||
var s = d.split("\t");
|
||||
if (c == "indir") {
|
||||
var name = s[2].slice(s[2].lastIndexOf('/')+1);
|
||||
var anchor = '<a href="'+s[2]+'">'+name+'</a>';
|
||||
var url = "#"+name;
|
||||
var anchor = '<a href="'+url+'">'+name+'</a>';
|
||||
return '<tr class="indir" name="'+b+'"><th>'+b+'</th><td>'+c+'</td><td>'+s[0]+'</td><td>'+s[1]+'</td><td>'+anchor+'</td><td></td></tr>'
|
||||
} else {
|
||||
var anchor = '<a href="'+s[0]+'">'+s[0]+'</a>';
|
||||
var bits = s[0].split("/"); // ["lib", "src", "english", "AdjectiveEng.gf:43-46"]
|
||||
var url = "#"+bits[3]+"/"+bits[4];
|
||||
var anchor = '<a href="'+url+'">'+s[0]+'</a>';
|
||||
return '<tr class="local" name="'+b+'"><th>'+b+'</th><td>'+c+'</td><td></td><td></td><td>'+anchor+'</td><td>'+s[1]+'</td></tr>'
|
||||
}
|
||||
});
|
||||
setScope(data);
|
||||
$('#scope_list a').click(function(){
|
||||
var href = $(this).attr('href');
|
||||
var m = href.match(/([^\/]+)\/([^\/]+)\.(gf(-tags)?)(:\d+)?/);
|
||||
if (m[3]=="gf") {
|
||||
// Load both tags and source
|
||||
var lineNo = m[5].slice(1);
|
||||
loadFile(m[1], m[2], lineNo);
|
||||
} else if (m[3]=="gf-tags") {
|
||||
// Try and determine the language from the contents
|
||||
checkSourceFile({
|
||||
lang: current_language,
|
||||
module: m[2],
|
||||
onsuccess: function(){
|
||||
loadFile(current_language, m[2]);
|
||||
scrollToTop();
|
||||
},
|
||||
onerror: function(){
|
||||
// Load just tags (we don't know source)
|
||||
setTitle(m[2]+" (scope only)");
|
||||
clearCode();
|
||||
loadTagsFile(m[2]);
|
||||
scrollToTop();
|
||||
}
|
||||
});
|
||||
}
|
||||
return false;
|
||||
});
|
||||
updateScopeCount();
|
||||
runFilter();
|
||||
loading(false);
|
||||
hideLoading();
|
||||
},
|
||||
error: function(data){
|
||||
clearScope("No scope available");
|
||||
loading(false);
|
||||
hideLoading();
|
||||
},
|
||||
});
|
||||
}
|
||||
@@ -223,21 +204,21 @@ $(document).ready(function() {
|
||||
// Load a source module
|
||||
var loadSourceFile = function(lang, module, lineNo) {
|
||||
clearCode();
|
||||
loading(true);
|
||||
showLoading();
|
||||
$.ajax({
|
||||
url: urlPrefix + "/lib/src/"+lang+"/"+module+".gf",
|
||||
type: "GET",
|
||||
dataType: "text",
|
||||
success: function(data, status, xhr){
|
||||
setCode(data);
|
||||
loading(false);
|
||||
hideLoading();
|
||||
if (lineNo) {
|
||||
scrollToCodeLine(lineNo);
|
||||
}
|
||||
},
|
||||
error: function(data){
|
||||
clearCode("No code available");
|
||||
loading(false);
|
||||
hideLoading();
|
||||
}
|
||||
});
|
||||
}
|
||||
@@ -254,10 +235,10 @@ $(document).ready(function() {
|
||||
else
|
||||
return haystack.toLowerCase().indexOf(needle.toLowerCase())>=0;
|
||||
};
|
||||
|
||||
var runFilter = function() {
|
||||
// Hide anything which doesn't match
|
||||
showLoading()
|
||||
var s = $("#search").val();
|
||||
loading(true);
|
||||
try {
|
||||
if (s) {
|
||||
$("#scope_list tr:match(\""+s+"\")").show();
|
||||
@@ -272,11 +253,18 @@ $(document).ready(function() {
|
||||
alert(error.message);
|
||||
}
|
||||
updateScopeCount();
|
||||
loading(false);
|
||||
hideLoading();
|
||||
}
|
||||
|
||||
// Instant results
|
||||
$("#search").keyup(runFilter);
|
||||
var prevSearch = $("#search").val();
|
||||
$("#search").keyup(function(){
|
||||
var s = $("#search").val();
|
||||
if (s!=prevSearch) {
|
||||
runFilter();
|
||||
prevSearch = s;
|
||||
}
|
||||
});
|
||||
$("#submit").hide();
|
||||
|
||||
// Filter & clear buttons
|
||||
@@ -298,16 +286,48 @@ $(document).ready(function() {
|
||||
$("#show_all").change(runFilter);
|
||||
$("#show_local").change(runFilter);
|
||||
|
||||
// ===== URL history =====
|
||||
$.History.bind(function(state){
|
||||
var s = state.split("/");
|
||||
if (s[0].match(/\.gf-tags$/)) {
|
||||
var module = stripExt(s[0]);
|
||||
checkSourceFile({
|
||||
lang: current_language,
|
||||
module: module,
|
||||
onsuccess: function(){
|
||||
$.History.go(current_language+"/"+module);
|
||||
},
|
||||
onerror: function(){
|
||||
// Load just tags (we don't know source)
|
||||
setTitle(module+" (scope only)");
|
||||
clearCode();
|
||||
loadTagsFile(module);
|
||||
scrollToTop();
|
||||
}
|
||||
});
|
||||
} else {
|
||||
var lang = s[0];
|
||||
var module = stripExt(s[1]);
|
||||
var parseLineNo = s[1].match(/:(\d+)(-(\d+))?$/);
|
||||
if (parseLineNo != undefined)
|
||||
loadFile(lang, module, parseInt(parseLineNo[1]));
|
||||
else
|
||||
loadFile(lang, module);
|
||||
}
|
||||
});
|
||||
|
||||
var stripExt = function(s) {
|
||||
return s.substr(0, s.lastIndexOf('.'));
|
||||
};
|
||||
|
||||
// ===== Resizing stuff =====
|
||||
|
||||
// Window resize stuff
|
||||
// refer: http://paulirish.com/2009/throttled-smartresize-jquery-event-handler/
|
||||
(function($,sr){
|
||||
|
||||
// debouncing function from John Hann
|
||||
// http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/
|
||||
var debounce = function (func, threshold, execAsap) {
|
||||
var timeout;
|
||||
|
||||
return function debounced () {
|
||||
var obj = this, args = arguments;
|
||||
function delayed () {
|
||||
@@ -326,7 +346,6 @@ $(document).ready(function() {
|
||||
}
|
||||
// smartresize
|
||||
jQuery.fn[sr] = function(fn){ return fn ? this.bind('resize', debounce(fn)) : this.trigger(sr); };
|
||||
|
||||
})(jQuery,'smartresize');
|
||||
|
||||
// usage:
|
||||
@@ -335,8 +354,13 @@ $(document).ready(function() {
|
||||
});
|
||||
|
||||
var recalculateHeights = function() {
|
||||
$('body').height( $(window).height()-80 )
|
||||
$('body').height( $(window).height()-85); //80 was just found empirically
|
||||
$('.maxheight').each(function(){
|
||||
var obj = $(this);
|
||||
var parent = obj.parent();
|
||||
obj.height(parent.height() - (obj.offset().top - parent.offset().top) - parseInt(parent.css('padding-bottom')));
|
||||
});
|
||||
}
|
||||
|
||||
recalculateHeights();
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user