This forum uses cookies
This forum makes use of cookies to store your login information if you are registered, and your last visit if you are not. Cookies are small text documents stored on your computer; the cookies set by this forum can only be used on this website and pose no security risk. Cookies on this forum also track the specific topics you have read and when you last read them. Please confirm that you accept these cookies being set.

manipulating frame url by script
#1
Hello,

I'm using homeLYnk (2.0.1)  in a camper, so it's mobile. Wink

I have already the actual position (latitude and longitude) in two different KNX objects.
Now I want to show the actual position in a frame with an URL like this: http://osmand.net/go.html?lat=37.47498&l...46356&z=15.
But, of course, this URL is static so the position will never change.
How can i manipulate the frames url by script to see always my actual position? Huh

B. r. in advance,

Uwe

   
Reply
#2
Hi Uwe,

Create a frame and give it the additional class "position" and create 3 objects where your LON, LAT and ZOOM variables are written to and create this custom JS:

Code:
$(function(){
 if (typeof grp != 'undefined') {
   grp.listen('40/1/15', function(object, state) {
     var LON = grp.getvalue('40/1/15') || 0;
     var LAT = grp.getvalue('40/1/16') || 0;
     var ZOOM = grp.getvalue('40/1/17') || 15;
     $('.position').find('iframe').attr('src', 'http://osmand.net/go.html?lat=' + LAT + '&lon=' + LON + '&z=' + ZOOM)
   }, true);
 }
});

$(function(){
 if (typeof grp != 'undefined') {
   grp.listen('40/1/16', function(object, state) {
     var LON = grp.getvalue('40/1/15') || 0;
     var LAT = grp.getvalue('40/1/16') || 0;
     var ZOOM = grp.getvalue('40/1/17') || 15;
     $('.position').find('iframe').attr('src', 'http://osmand.net/go.html?lat=' + LAT + '&lon=' + LON + '&z=' + ZOOM)
   }, true);
 }
});

$(function(){
 if (typeof grp != 'undefined') {
   grp.listen('40/1/17', function(object, state) {
     var LON = grp.getvalue('40/1/15') || 0;
     var LAT = grp.getvalue('40/1/16') || 0;
     var ZOOM = grp.getvalue('40/1/17') || 15;
     $('.position').find('iframe').attr('src', 'http://osmand.net/go.html?lat=' + LAT + '&lon=' + LON + '&z=' + ZOOM)
   }, true);
 }
});

This will update the URL in the frame as soon as one of the 3 object values are changing, it happens client side so no refresh of the client is needed.

BR,

Erwin
Reply
#3
Hello Erwin,

hope you're well !

Thanks for the very quick response. It seems that sundays are disabled in the netherlands Cool  ?
I'll follow your instructions and give you a short feedback.

B.r., Uwe
Reply
#4
Hi Uwe,

Yes i’m very well, hope you to after leaving us, so i asume you have holiday 24/7 with your camper ?.

We live in a 24/7 economy so i adapted to that standard (:

Greatings,

Erwin
Reply
#5
Hello Erwin,

your instructions are working perfect! Thank's again.

On more question: when my camper don't move and I open this page the old URL is valid again and the frame shows an old position and not the actual one.
  • Is there a method to store a new URL permanent in this frame?
    or

  • is it possible to set an automatic trigger on the KNX objects (lat, lon or zoom) by opening this page?
    or
  • any other idea to solve this?
Thank you in advance,

Uwe
Reply
#6
Hi Uwe,

Hmm that is strange as the script should request the actual object values on start..

Try adding this to the custom JS also:
Code:
$(function(){
 if (typeof grp != 'undefined') {
     var LON = grp.getvalue('40/1/15') || 0;
     var LAT = grp.getvalue('40/1/16') || 0;
     var ZOOM = grp.getvalue('40/1/17') || 15;
     $('.position').find('iframe').attr('src', 'http://osmand.net/go.html?lat=' + LAT + '&lon=' + LON + '&z=' + ZOOM);
 }
});
BR,

Erwin
Reply
#7
Hi Erwin,

I added this code, but unfortunately the behaviour doesn't change. Without changing the object values (in lon, lat or zoom) the frame shows an old position on opening the page with this frame in it. 
When I open the page in edit mode the frames source URL is also the old one instead of the actual one.

It seems that the code changes the src (URL) only temporary.

Uwe

PS: the existing code:

Code:
$(function(){
 if (typeof grp != 'undefined') {
     var LON = grp.getvalue('10/4/2') || 0;
     var LAT = grp.getvalue('10/4/0') || 0;
     var ZOOM = grp.getvalue('10/4/3') || 15;
     $('.position').find('iframe').attr('src', 'http://osmand.net/go.html?lat=' + LAT + '&lon=' + LON + '&z=' + ZOOM);
 }
});

$(function(){
 if (typeof grp != 'undefined') {
   grp.listen('10/4/2', function(object, state) {
     var LON = grp.getvalue('10/4/2') || 0;
     var LAT = grp.getvalue('10/4/0') || 0;
     var ZOOM = grp.getvalue('10/4/3') || 15;
     $('.position').find('iframe').attr('src', 'http://osmand.net/go.html?lat=' + LAT + '&lon=' + LON + '&z=' + ZOOM)
   }, true);
 }
});

$(function(){
 if (typeof grp != 'undefined') {
   grp.listen('10/4/0', function(object, state) {
     var LON = grp.getvalue('10/4/2') || 0;
     var LAT = grp.getvalue('10/4/0') || 0;
     var ZOOM = grp.getvalue('10/4/3') || 15;
     $('.position').find('iframe').attr('src', 'http://osmand.net/go.html?lat=' + LAT + '&lon=' + LON + '&z=' + ZOOM)
   }, true);
 }
});

$(function(){
 if (typeof grp != 'undefined') {
   grp.listen('10/4/3', function(object, state) {
     var LON = grp.getvalue('10/4/2') || 0;
     var LAT = grp.getvalue('10/4/0') || 0;
     var ZOOM = grp.getvalue('10/4/3') || 15;
     $('.position').find('iframe').attr('src', 'http://osmand.net/go.html?lat=' + LAT + '&lon=' + LON + '&z=' + ZOOM)
   }, true);
 }
});
Reply
#8
Hello,

Did you manage to update your url from this script? 
Indeed I am trying to display a URL contained in a string type object and I cannot update the FRAME from this JS.
here is my script:


Code:
$(function(){
  if (typeof grp != 'undefined') {
      var URL= grp.getvalue('34/1/1');
      $('.testurl').find('iframe').attr('src', URL);
  }
});

I did add in Additional classes testurl but the FRAME remains on the URL that I entered manually in the object (34/1/1).


Thanks for your feedback.

B.R.
Reply
#9
This will only change the url once on load. You need to use grp.listen to update it dynamically.
Reply
#10
Hello,

I had also tested this script but nothing helped the url always remains the one I entered manually and is not updated based on the subject.

Code:
$(function(){
  if (typeof grp != 'undefined') {
    grp.listen('34/1/1', function(object, state) {
      var URL= grp.listen('34/1/1');
      $('.testurl').find('iframe').attr('src', URL)
    }, true);
  }
});

<div class="item testurl item-iframe" style="top: -1px; left: -1px; z-index: 10; width: 1025px; height: 769px;"><iframe border="0" frameborder="0" width="1025" height="769" src="https://xxxxxx"></iframe></div>
This is what I get when I inspect the iframe

I have also tried on several browsers.
B.R.
Reply
#11
Use this code and also enable "Persistent" mode for the iframe:
Code:
$(function(){
  if (typeof grp != 'undefined') {
    grp.listen('34/1/1', function(object) {
      $('.testurl').find('iframe').attr('src', object.value);
    }, true);
  }
});
Reply
#12
Thank you it's perfect !
B.R.
Reply


Forum Jump: