I want to get all the outgoing links associated with an element .What is the way to achieve this in jointJs .Actually I have tried something like this but It is giving result for both outgoing and incoming .
paper.findViewByModel(start).options.inbound=true;
alert(graph.getConnectedLinks(start));
Just use
var outboundLinks = graph.getConnectedLinks(myElement, { outbound: true })
See the JointJS API reference here http://jointjs.com/api#joint.dia.Graph:getConnectedLinks.
Related
I'm trying to make a Discord bot that gets the most recent post and sends it out when someone runs a command. I've managed to make it work by sending out the titles of the posts, but I want to make it so that it sends out the link to the post.
The HTML of the forum for the post looks something like
Is there any way to get those random numbers and letters from the HTML element and apply them to a link somewhere else in the bot's code? I tried using puppeteer and cheerio to do this but I can't figure out what the title = $(element).find('XXXXXXXXXXX').text() would be.
If you're using cheerio, you'll want to do something like this:
const $ = cheerio.load('');
const href = $('a').attr('href');
// "https://link-here.com/a/b/c"
I have a perhaps simple question. What would be the difference between an <a> tag and a normal GET request with any element. I know the <a> tag automatically sends you to the url specified in its href attribute. So I assume that a Get request does something similar in it's success callback (as demonstrated below)
But let's say that I also want to send some information along with a normal get request when a for example <span> element is clicked on so I write:
$('span').click(() => {
$.ajax({
url: '/someurl',
type: 'GET',
data: {
title: someTitle,
email: someEmail
},
success: (data) => {
window.location = '/someurl';
}
});
});
Is there any way to achieve this with an <a> tag? Sending information to the server so it's available in req.query.title and req.query.email ?
Doing the ajax request above will run my app.get('/someurl',(req,res)=>{})twice because I am sending a GET request to send the data (title and email) and then I am making another GET request when I write window.location = '/someurl' How can I redo this so that it only sends the GET request ONCE but also allows for the sending and storing information to the req object AND ensures that the browser is now displaying /someurl.
Just create the appropriate query string in the URL you put in the href of the <a> tag and it will work just like your ajax call. Suppose someTitle has the value of "The Hobbit" and someEmail has the value of foo#whatever.com, then you can construct that URL like this:
Click Me
A number of non-letter characters have to be escaped in URLs. In the above URL, the space is replaced with %20 and the # with %40. In your particular example, you could open the network tab in the chrome debugger and see the EXACT URL that Chrome was sending for your ajax call, copy that to the clipboard and insert it into your <a> tag.
Here's a table that shows what characters have to be replaced in a query string component (the part after & or after =):
I'm just wondering then, aside from semantic reasons, is there any other advantages to using an a tag instead of anything else?
<a> tags are understood by all sorts of machines that may read your page such as screen readers for the disabled or crawlers indexing your site. In addition, they work automatically with browser keyboard support, Ctrl-click to open a new tab. Whereas a piece of Javascript may not automatically support any of that functionality. So, basically, if the <a> tag can do what you need it is widely preferred because it has so much other default functionality that can be necessary or handy for users.
Hello
I want to display an image on a webpage on the basis of what the user enters in a form. I have the form defined in abc.jade, and in abc.js I store everything from the form, and generate the image's url and store it in a variable map_img on the basis of the form. How do I set an image's source in jade to point to map_img URL?
abc.js:
sales.save();
markers = [{ 'location': sales.location }]
var gm = require('googlemaps');
var map_img = gm.staticMap(sales.location, 16, '500x400', false, false, markers);
In general, what is the best way to manipulate fields in an HTML/Jade document from node/express?
Im not sure if i get your question right...
There are severals ways to send data.
Mostly described here: http://jade-lang.com/reference/
I usually use #{img_map} or in the case you have to get pure html its better to use !{img_map_html_desc}.
Also, the alternative variant, create #temp div, send data there. Than on the front end js(on window.onload) you can get that data and store to the variable. Don't forget to clear the #temp div after you dont need that anymore.
Once i've used side front-end js module and couldnt find better sollution, than this. Cause that module waited for window.onload, and than started to load itself...
I have been trying to scrape 10 websites for a website we are building with links to the original sites, on node.js using cheerio, problem we are getting is that some of the sites have changed which now uses ajax calls to bring their data, my question is how can we get that information, for instance trigger a button click first and then get the DOM.
secondly: same dom structure is not getting me all data, it is retrieving information for one page, but not getting the the elements on another page with identical DOM structure. any help would be appreciated.
Thanks and regards.
Edit 1: Relevant code
$('#ProductContent').filter(function(){
var price = undefined;
var ukulele = false;
var model = $(this).find('.ProductSubtitle').text().replace(/\n\s*/g,"");
if(model.indexOf(/m/i) != 0){
var description = $(this).find('.RomanceCopy').text().replace(/\n\s*|\r/g,"");
.
.code removed for brevity and the variables present here are populated
.
//this children is populated only for one page.
children = $(this).find('.SpecsColumn .SpecsTable table tbody').children('tr');
console.log('children: '+children.length)
console.log(guitar_url);
children.each(function(){
var key = $(this).children('td').first().text();
var value = $(this).children('td').last().text();
specs[key] = value;
console.log(specs);
});
Edit 2: Cherios Initialization
request(guitar_url,function(error,response,html){
if(!error){
var $ = cheerio.load(html);
$("#content #right-content").filter(function(){..children and other variables are populated inside here....})
}
})
To summarise all the comments you received:
Cheerio is minimalistic DOM reader inspired by jQuery. Its design is focused about reading data, and is not a browser emulator, where you could click a button.
Alternative is to use headless browsers like PhantomJS or CasperJS.
Those two are outside of Node.js scope, and you may have hard times transmitting the data back and forth from Node.js to headless browser.
If it is important for you to keep inside of Node.js environment, then you can use JSDOM.
All of them are more complicated to use than Cheerio, but if you want to manipulate the DOM, execute JavaScript on the DOM, etc... Then this is your best bet.
Removing the 'tbody' tags solved the problem, once they were removed it started to fetch the data normally for all three sites.
I have many large KML data-sets, which are served using a hierarchy of region-based network-links; as described in the KML reference:
Using Regions in conjunction with NetworkLinks, you can create a hierarchy of pointers, each of which points to a specific sub-Region. The <viewRefreshMode>, as shown in the following KML file, has an onRegion option, which specifies to load the Region data only when the Region is active. If you provide nested Regions with multiple levels of detail, larger amounts of data are loaded only when the user's viewpoint triggers the next load.
This works nicely when loaded in Google Earth.
I now wish to load these in an application using the Google Earth plug-in. And I need to access the loaded content via the Google Earth API; (i.e. attach click events, alter styles) to integrate the content into the application.
The issue is, I haven't found any reference to an 'on-load' event for network links. In my mind, the way this would work is:
Load top-level network link via the API, attaching a call-back function which will be invoked when the network-link is loaded.
In the call-back function, parse the KML returned by network link. For intermediate levels in the regionation hierarchy, this KML will contain only network links to the next regionation level. Load these into the plug-in via the API, again specifying the same call-back function, which will be invoked when these are loaded (i.e. when their region becomes visible).
Eventually, the KML returned will contain the actual 'content'. At this stage we load the actual content (i.e. placemarks) into the plug-in, after performing any desired modifications (e.g. attaching event-listeners, setting styles, etc).
I'm thinking the javascript would look something like the following.
Please note: this is just a rough sketch to perhaps aid in understanding my question. I am NOT asking why this code doesn't work.
//create network link
var networkLink = ge.createNetworkLink("");
networkLink.setName("Regionated hierarchy root");
// create a Link object
//the network-links contained in the kml that will be returned in this file
//are region-based; they will only be loaded when the user zooms into the relevant
//region.
var link = ge.createLink("");
link.setHref("http://foo.com/regionatedRoot.kml");
// attach the Link to the NetworkLink
networkLink.setLink(link);
//specify the callback function to be invoked when the network link is loaded
//this is is the part that doesn't actually exist; pure fiction...
networkLink.onLoad = networkLinkLoaded;
// add the NetworkLink feature to Earth
ge.getFeatures().appendChild(networkLink);
// function which will be invoked when a network-link is loaded
// i.e. when its region becomes active
function networkLinkLoaded(kml) {
//parse the kml returned for child network links,
//this will create the network link KmlObject, with a
//region specified on it.
for (childNetworkLink in parseNetworkLinks(kml)) {
//and append them, again hooking up the call-back
childNetworkLink.onLoad = networkLinkLoaded;
ge.getFeatures().appendChild(childNetworkLink);
}
//if the user has zoomed in far enough, then the kml returned will
//contain the actual content (i.e. placemarks).
//parse the kml returned for content (in this case placemarks)
for (placemark in parsePlacemarks(kml)) {
//here we would attach event-listeners to the placemark
ge.getFeatures().appendChild(placemark);
}
}
Is this possible?
Have I taken a wrong turn in my thinking? I believe I have followed recommended practices for managing large KML datasets, but I am unsure how to use these via the API.
Addendum:
As an example of the type of problem I am trying to solve:
Imagine you are building a web application using the Google Earth Plugin, and you want to display a placemark for every set of traffic-lights in the world. The placemarks should only display at an appropriate level-of-detail (e.g. when the camera is at 5km altitude). When a user clicks on a placemark, we want the web app to load statistics for that set of traffic-lights, and display them in a sidebar.
How would you engineer this?
You wouldn't need access to the object data directly to provide the functionality you require. You would handle the data load exactly like you have done, using a hierarchy of region-based network-links.
Then if your usage scenario is like the one you set out in your addendum then you would simply use the target data from the click event to load your statistical data based on the placemarks as required.
For example, you could simply set up a generic mousedown event handler on the window object and then test to see if the target is a placemark. You can add this generic listener before you load any data and it will still be fired when you click on your dynamically loaded placemarks. There is no need to attach individual event-listeners to the placemarks at all.
e.g.
window.google.earth.addEventListener(ge.getWindow(), 'mousedown', onWindowMouseDown);
var onWindowMouseDown = function(event) {
if (event.getTarget().getType() == 'KmlPlacemark') {
// get the placemark that was clicked
var placemark = event.getTarget();
// do something with it, or one of its relative objects...
var document = placemark.getOwnerDocument();
var parent = placemark.getParentNode();
// etc...
}
}
Not sure if this is quite what you want but there is a kmltree api that will:
build out the kml tree for you based on the kml given
allow you to have a 'kmlloaded' event handler
http://code.google.com/p/kmltree/
function initCB(instance){
ge = instance;
ge.getWindow().setVisibility(true);
var gex = gex = new GEarthExtensions(ge);
var tree = kmltree({
url: 'http://foo.com/regionatedRoot.kml',
gex: gex,
mapElement: $('#map3d'),
element: $('#tree'),
});
$(tree).bind('kmlLoaded', function(event, kmlObject){ //do something here });
tree.load();
}
it does require you to bring in another js api but it works pretty good and gives you some good built in functionality.
So far I haven't found anything just from the plug-in that will fire an event when the kml is loaded...
you might be able to try using fetchKml() especially if you are hardcoding that url for the link in there?
google.earth.fetchKml(ge, 'http://foo.com/regionatedRoot.kml', function(kmlObject){
//do logic here
});