From 7e65d845779bf14a82ae52ca2d7c0bb20284c0b5 Mon Sep 17 00:00:00 2001 From: rabuzarus <> Date: Wed, 10 Aug 2016 13:07:13 +0200 Subject: [PATCH 1/4] frio: fix for display auto position scroll + some cleanup --- view/theme/frio/js/mod_display.js | 11 +++++++++++ view/theme/frio/js/theme.js | 19 +++++++++++++++++++ .../frio/templates/threaded_conversation.tpl | 15 +-------------- 3 files changed, 31 insertions(+), 14 deletions(-) create mode 100644 view/theme/frio/js/mod_display.js diff --git a/view/theme/frio/js/mod_display.js b/view/theme/frio/js/mod_display.js new file mode 100644 index 000000000..1faacaeb7 --- /dev/null +++ b/view/theme/frio/js/mod_display.js @@ -0,0 +1,11 @@ +/** + * @brief Javascript for the display module + */ + +// Catch the GUID from the URL +var itemID = window.location.pathname.split("/").pop(); + +$(document).ready(function(){ + // Scroll to the Item by its GUID + scrollToItem(itemID); +}); diff --git a/view/theme/frio/js/theme.js b/view/theme/frio/js/theme.js index 1e26ad770..27f2c93a7 100644 --- a/view/theme/frio/js/theme.js +++ b/view/theme/frio/js/theme.js @@ -542,3 +542,22 @@ String.prototype.rtrim = function() { var trimmed = this.replace(/\s+$/g, ''); return trimmed; }; + +// Scroll to a specific item and highlight it +// Note: jquery.color.js is needed +function scrollToItem(itemID) { + if( typeof searchValue === "undefined") + return; + + // Define the colors which are used for highlighting + var colWhite = {backgroundColor:'#F5F5F5'}; + var colShiny = {backgroundColor:'#FFF176'}; + + // Scroll to the DIV with the ID (GUID) + $('html, body').animate({ + scrollTop: $('#item-'+itemID).position().top + }, 400, function() { + // Highlight post/commenent with ID (GUID) + $('#item-'+itemID).animate(colWhite, 1000).animate(colShiny).animate(colWhite, 2000); + }); +} diff --git a/view/theme/frio/templates/threaded_conversation.tpl b/view/theme/frio/templates/threaded_conversation.tpl index 3746ba032..a5402ede5 100644 --- a/view/theme/frio/templates/threaded_conversation.tpl +++ b/view/theme/frio/templates/threaded_conversation.tpl @@ -1,4 +1,5 @@ +{{if $mode == display}}{{/if}} {{$live_update}} @@ -23,17 +24,3 @@ {{/if}} - - - -{{if $mode == display}} - -{{/if}} - From 531cba5ce53b85ad6ffae73f1f91580feb9f3101 Mon Sep 17 00:00:00 2001 From: rabuzarus Date: Wed, 10 Aug 2016 13:33:49 +0200 Subject: [PATCH 2/4] frio: fix - I used the wrong variable --- view/theme/frio/js/theme.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/view/theme/frio/js/theme.js b/view/theme/frio/js/theme.js index 27f2c93a7..f153fc33f 100644 --- a/view/theme/frio/js/theme.js +++ b/view/theme/frio/js/theme.js @@ -546,7 +546,7 @@ String.prototype.rtrim = function() { // Scroll to a specific item and highlight it // Note: jquery.color.js is needed function scrollToItem(itemID) { - if( typeof searchValue === "undefined") + if( typeof itemID === "undefined") return; // Define the colors which are used for highlighting From cf23a81c33eb29153196e01d9a68d45230ff1933 Mon Sep 17 00:00:00 2001 From: rabuzarus Date: Wed, 10 Aug 2016 14:14:58 +0200 Subject: [PATCH 3/4] frio: highlight - use offset() instead of postion() --- view/theme/frio/js/mod_display.js | 4 ++-- view/theme/frio/js/theme.js | 8 ++++++-- 2 files changed, 8 insertions(+), 4 deletions(-) diff --git a/view/theme/frio/js/mod_display.js b/view/theme/frio/js/mod_display.js index 1faacaeb7..c93d2c006 100644 --- a/view/theme/frio/js/mod_display.js +++ b/view/theme/frio/js/mod_display.js @@ -3,9 +3,9 @@ */ // Catch the GUID from the URL -var itemID = window.location.pathname.split("/").pop(); +var itemGuid = window.location.pathname.split("/").pop(); $(document).ready(function(){ // Scroll to the Item by its GUID - scrollToItem(itemID); + scrollToItem('item-'+itemGuid); }); diff --git a/view/theme/frio/js/theme.js b/view/theme/frio/js/theme.js index f153fc33f..1e93be24c 100644 --- a/view/theme/frio/js/theme.js +++ b/view/theme/frio/js/theme.js @@ -553,11 +553,15 @@ function scrollToItem(itemID) { var colWhite = {backgroundColor:'#F5F5F5'}; var colShiny = {backgroundColor:'#FFF176'}; + // Get the Item Position (we need to substract 100 to match + // correct position + var itemPos = $('#'+itemID).offset().top - 100; + // Scroll to the DIV with the ID (GUID) $('html, body').animate({ - scrollTop: $('#item-'+itemID).position().top + scrollTop: itemPos }, 400, function() { // Highlight post/commenent with ID (GUID) - $('#item-'+itemID).animate(colWhite, 1000).animate(colShiny).animate(colWhite, 2000); + $('#'+itemID).animate(colWhite, 1000).animate(colShiny).animate(colWhite, 600); }); } From 5e440e5359ce77f6fc9b902890876b624e599518 Mon Sep 17 00:00:00 2001 From: rabuzarus Date: Wed, 10 Aug 2016 14:26:16 +0200 Subject: [PATCH 4/4] frio: highlight - wait until the whole page is loaded --- view/theme/frio/js/mod_display.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/view/theme/frio/js/mod_display.js b/view/theme/frio/js/mod_display.js index c93d2c006..86608821e 100644 --- a/view/theme/frio/js/mod_display.js +++ b/view/theme/frio/js/mod_display.js @@ -5,7 +5,7 @@ // Catch the GUID from the URL var itemGuid = window.location.pathname.split("/").pop(); -$(document).ready(function(){ +$(window).load(function(){ // Scroll to the Item by its GUID scrollToItem('item-'+itemGuid); });