Develop Reference

Obtain data from internet with jsoup

**hi, i was trying obtain data from a page but i don't know how to obtain this data: Chapter 120 and de url link
This is the code from page (i simplified it):
<div class="row">
<div class="col-12">
<div class="card chapters" id="chapters">
<ul class="list-group list-group-flush">
<li class="list-group-item p-0 bg-light upload-link" data-index="0">
<h4 class="px-2 py-3 m-0">
<div class="row">
<div class="col-10 text-truncate">
<a style="display: block;" class="btn-collapse" onclick="collapseChapter('collapsible490362')" role="button"> Capítulo 120.00</a>
</div>
</div>
</h4>
<div style="display: block;" id="collapsible490362">
<div class="card chapter-list-element">
<ul class="list-group list-group-flush chapter-list">
<li class="list-group-item">
<div class="row">
<div class="col-2 col-sm-1 text-right">
<a href="https://lectortmo.com/view_uploads/599487" class="btn btn-default btn-sm">
<span class="fas fa-play fa-2x" style="color:#2957ba"></span>
</a>
</div>
</div>
</li>
</ul>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
In this line we can see the text (Chapter 120) that i need show in TextView but i don't know how to obtain it
<a style="display: block;" class="btn-collapse" onclick="collapseChapter('collapsible490362')" role="button"> Chapter 120</a>
And in this line we can see the url that i need:
<a href="https://lectortmo.com/view_uploads/599487" class="btn btn-default btn-sm">
This is my method to obtain data parsing:
#Override
protected ArrayList<TMODatosSeleccion> doInBackground(Void... voids) {
String url = getIntent().getStringExtra("valor");
tmoDatosSeleccions.clear();
try {
Document doc = Jsoup.connect(url).get();
Elements data = doc.select("div.row>.col-10");
int size = data.size();
Log.d("doc", "doc: "+doc);
Log.d("data", "data: "+data);
Log.d("size", ""+size);
for (Element e : data) {
String numeroCap = e.select("a").attr("none");
String urlManga = e.select("div.row>.col-2").select("a").addClass("btn").attr("href").trim();
tmoDatosSeleccions.add(new TMODatosSeleccion(numeroCap, urlManga));
}
} catch (IOException e) {
e.printStackTrace();
}
return tmoDatosSeleccions;
}
Someone can help me?
Print Screen:

You could get the two links you are trying to find using:
Elements data = doc.select("div.row a");
for (Element e : data)
{
// process the link
}
Or you could get them individually using:
Elements data = doc.select("div.row>.col-10 a");
if (data.size() == 1)
{
Element e = data.get(0);
// process col-10 link
}
data = doc.select("div.row>.col-2 a");
if (data.size() == 1)
{
Element e = data.get(0);
// process col-2 link
}
The main problem you were having was that the col-2 element was not nested inside the col-10 element, so your loop would not have found any items.

I want to fetch some info from a webpage in android studio

I want to fetch sometitle and somelink from HTML code below for my android app ...
HELP ME :(
<div class="proper-list list-group page-cat-wrap">
<figure class="col-md-12 thumb-vertical">
<div class="col-xs-4 thumb-image">
<a href="/somelink.html" class="image-hover">
<img alt="SomeTag" src="/storage/images/100/2382.jpg">
</a>
</div>
<figcaption class="col-xs-8">
<h3>
<a href="/somelink.html">
SomeTitle
</a>
</h3>
<p>
<a href="/secondlink.html">
SomeText
</a>
</p>
</figcaption>
<div class="clearfix"></div>
<div class="mobile-only icon-right">
<a href="/somelink.html">
<i class="fa fa-chevron-right" aria-hidden="true"></i>
</a>
</div>
I heard of jsoup but won't able to get links with jsoup.

Jsoup is the best library to parse any of HTML content or document,
Here is the link and example,
http://jsoup.org/
Example
private void parsehtmlPage(){
File input = new File("/yourFolder/home.html");
Document doc = Jsoup.parse(input, "UTF-8", "http://example.com/");
Element elementId = doc.getElementById("elementId");
Elements ankerLinks = elementId.getElementsByTag("a");
for (Element link : ankerLinks) {
String linkHref = link.attr("href");
String linkText = link.text();
}
}

Gmap V3, JQM, Cordova Android App freezes on Map Zooming

I have built a Cordova Android app using jQuery Mobile and Google Maps V3.
The Map works fine for some time, but when I try to zoom or drag the map for 4-5 times the app freezes. It only works again if I clean my cache/RAM. I have used custom markers, and marker positions are from a SQLite database.
<div data-role="page" data-theme="f" id="Gomap" style="width:100%; height:100%;">
<div role="banner" class="ui-bar-a ui-header" data-role="header" data-position="fixed" data-tap-toggle="false">
<a data-theme="f" href="branch_locator.html" data-rel="back" class="ui-btn-left ui-btn ui-btn-icon-left ui-btn-corner-all ui-shadow ui-btn-up-a" data-icon="arrow-l">
<span class="ui-btn-inner ui-btn-corner-all">
<span class="ui-btn-text">
Back
</span>
<span class="ui-icon ui-icon-arrow-l ui-icon-shadow">
</span>
</span>
</a>
<h1 aria-level="1" role="heading" tabindex="0" class="ui-title">
Google Map
</h1>
</div>
<div data-role="content" class="map" id="content">
<div id="map_canvas" style="height:100%;">
<div class="img-container"><img src="img/loading8.gif" /> </div>
</div>
</div>
<div data-role="footer" data-position="fixed" data-tap-toggle="false" class="foot">
</div>
<!-- /footer -->
<script type="text/javascript" src="js/map.js"></script>
</div>
map.js
var latt1;
var longg1;
var latt2;
var longg2;
$("#Gomap").on("pageshow", function(e) {
var s = $(this).data("url");
var lat1Part = s.split("&")[0];
var long1Part = s.split("&")[1];
var lat2Part = s.split("&")[2];
var long2Part = s.split("&")[3];
latt1 = lat1Part.split("=")[1];
longg1 = long1Part.split("=")[1];
latt2 = lat2Part.split("=")[1];
longg2 = long2Part.split("=")[1];
loadScript();
});
function initialize() {
$('#map_canvas').empty();
var ur_pos = new google.maps.LatLng(latt1, longg1);
var br_pos = new google.maps.LatLng(latt2, longg2);
$('#map_canvas').gmap();
$('#map_canvas').gmap({
'center': ur_pos
});
$('#map_canvas').gmap({
'zoom': 6
});
$('#map_canvas').gmap('addMarker', {
'position': br_pos,
'bounds': true,
'icon':'img/logo.png',
'animation': google.maps.Animation.DROP
}).click(function() {
$('#map_canvas').gmap('openInfoWindow', {
'content': '<B>Some Text Here</B>'
}, this);
});
$('#map_canvas').gmap('addMarker', {
'position': ur_pos,
'bounds': true,
'animation': google.maps.Animation.DROP
}).click(function() {
$('#map_canvas').gmap('openInfoWindow', {
'content': '<B>Your Current Position</B>'
}, this);
});
$('#map_canvas').gmap('refresh');
}
function loadScript() {
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'http://maps.googleapis.com/maps/api/js?key=GMAP KEY HERE&sensor=false&' +
'callback=initialize';
document.body.appendChild(script);
}

Removing div tag from url loaded from webview android

I am loading a url into webview using web.loadUrl(url);. Now i want to remove part the body content when the url finished loading.
Data from the url is as follows :
<html>
<body>
<div class="header" data-role="header" data-theme="a">
<a data-icon="back" class="header-icon" data-iconpos="notext" href="mymob-web-mobile/restricted/menu.xhtml" data-ajax="false"> <span>Back</span> </a>
<!--Title-->
<h1>???help.main.title???</h1>
</div>
<div id="well">Hello World</div>
<body>
</html>
I want to remove this part in the url
<div class="header" data-role="header" data-theme="a">
<a data-icon="back" class="header-icon" data-iconpos="notext" href="mymob-web-mobile/restricted/menu.xhtml" data-ajax="false"> <span>Back</span> </a>
<!--Title-->
<h1>???help.main.title???</h1>
</div>
After some researh i come to this solution:
web= (WebView)findViewById(R.id.web);
web.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url)
{
web.loadUrl("javascript:var con = document.getElementByTagName('<div class=\"header\" data-role=\"header\" data-theme=\"a\"> '); " +
"con.style.display = 'none'; ");
}
});
web.clearCache(true);
web.clearHistory();
web.getSettings().setJavaScriptEnabled(true);
web.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
web.loadUrl(Constant.URL_AIDE, headers);
But the div element is not being removed.
a summery is , div to remove
<div class="header" data-role="header" data-theme="a">
<a data-icon="back" class="header-icon" data-iconpos="notext" href="mymob-web-mobile/restricted/menu.xhtml" data-ajax="false"> <span>Back</span> </a>
<!--Title-->
<h1>???help.main.title???</h1>
</div>
expected result
<html>
<body>
<div id="well">Hello World</div>
<body>
</html>
any idea please

You can use getElementsByClassName() to access the div. Here is my solution please try it.
web.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url){
web.loadUrl("javascript:document.getElementsByClassName('header')[0].style.display=\"none\";");
}
})

Your JavaScript is incorrect. There is no such thing as getElementByTagName, other than getElementById other getElements... functions return a list of nodes. It should be something like:
[].slice.call(document.getElementsByClassName("header")).forEach(function(element) {element.style.display = 'none';});

Use geo coordinates from google maps link/url/ in Android device

I have intent filter to intercept url's from Google maps.
My problem is: shortened link. If I don't know coordinates - links are useless. Unfortunately in Google maps for android links are shortened. In web user can choose type of Google maps link - short or not. In this case I have chance to use coordinates.
In short: If have link like this
http://maps.google.com/maps?q=45.089036,+-106.347656&num=1&t=h&vpsrc=0&ie=UTF8&z=4&iwloc=A
there is not problem to read coordinates. But if link is:
http://m.google.com/u/m/zIOcsV
ooops... Google have internal way to solve this link.
Does anybody found way to get coords from second link?

you can use this example of jquery mobile app using google maps geo coordinates:
jsfiddle-google-maps-geo-coordinates
or with custom images here: jsfiddle-google-map-with-images
the head is:
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<!--link rel="stylesheet" href="/Content/jquery-mobile-responsive.css" /-->
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script src="http://maps.google.com/maps/api/js?sensor=true&language=en"></script>
<script>
$(document).bind("mobileinit", function () {
$.mobile.ajaxEnabled = false;
});
$(Start);
function Start() {
$("#google_map .ui-collapsible-heading").click(function () {
var locations = [
['<br/>Main Office', 31.590496, 34.561981, 4],
['Sensor 16<br/>User Name: 16_DE-1R', 31.590595, 34.562980, 5],
['Sensor 17<br/>User Name: 17_TEN-2MP', 31.590694, 34.563979, 3],
['Sensor 18<br/>User Name: 18_TEN-2MP', 31.590793, 34.564978, 2],
];
var map = new google.maps.Map(document.getElementById('googleMap'), {
zoom: 17,
center: new google.maps.LatLng(31.590892, 34.561977),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < locations.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(locations[i][3], locations[i][2]),
map: map
});
google.maps.event.addListener(marker, 'click', (function (marker, i) {
return function () {
infowindow.setContent(locations[i][0]);
infowindow.open(map, marker);
}
})(marker, i));
}
});
}
</script>
and body:
<div data-role="page" class="type-interior">
<div data-role="header" data-theme="a">
<a data-icon="back" href="#" rel="external">Back</a>
<h1>Sensor</h1>
</div>
<div data-role="content">
<div class="content-primary">
<h2>Sensor: 16</h2>
<div data-role="collapsible-set">
<div id="google_map" data-role='collapsible' data-collapsed=true data-theme="b" data-content-theme="d">
<h1>Sensor Map</h1>
<div id="googleMap" style="width:100%; height:300px;"></div>
</div>
</div>
<ul data-role="listview" data-inset="true" data-theme="b">
<li data-role="list-divider"></li>
<li>Configure Comm</li>
<li>Measurements</li>
<li>Users</li>
</ul>
</div>
<div class="content-secondary">
<div data-role="collapsible" data-collapsed="true" data-theme="b" data-content-theme="d">
<h3>More Options</h3>
<ul data-role="listview" data-theme="c" data-dividertheme="d">
<li data-role="list-divider">Actions</li>
<li>Add User</li>
<li>Edit Sensor</li>
<li>Delete Sensor</li>
</ul>
</div>
</div>
</div>
<div data-role="footer" data-theme="a">
<h4>Mobile</h4>
</div>