Getting a DIV element from an external webpage using JavaScript only - javascript

I'm having a slight problem. I'm trying to make a script for Google Sheets (JavaScript), where I need to import a number from an external webpage. This number is an exchange rate between coins and represents the cost of the "foreign" coin, displayed in my local currency.
This number I'm trying to import is held in a DIV, not a table, that's my problem.
What I have is:
"Unique URL". The exact URL to the page where the exchange rate is located (no login is required, the data is publicly available).
"Unique class name". The div does not have an ID, but it does have a unique class name.
Does anyone know how to extract this DIV (and it's content) and load it into my Google Sheet? Once I have the .innerHTML, I can format the content into a number and load it into my Sheet.
I have a feeling that it's fairly straight forward, if I only knew...

Related

How can I generate a list of html elements on a particular page?

I am adding a help text model to my rails app, which allows admins to create help text for pages on my site. The form that allows admins to make help text requires text, location, and admin name. I would like the location attribute to have two input fields. The first being the particular page, and the second being the exact html element that the help text is to appear in.
How can I generate a list of the elements on the specified page?
Once the location is selected, I will build a helper to convert that into an xpath. From there, the help text and icon(s) will be added to the page via JavaScript.
If this approach isn't the most effective, what might be another method? RubyGems, scripts, rails magic, etc.
TL;DR How can I generate a list of html elements only knowing the page.

Get selected cell value, row, and column from Excel

Just looking to be pointed in the right direction about how I should do this.
Background: Creating a program which will automatically fill out excel pricing files for our customers from our database based on the UPC. However, there's over a hundred different sheets because customers want them sent in their own format. Some in very weird formats. I don't want to hard code the columns/locations for UPC, price, etc. (sections that need to be filled out), as the sheets sometimes change and we get new customers. Therefore, I'm going to put the power in the users hands to map the locations of the UPC column, etc. I currently use excel interop in C# to do the excel file reading/filling out, however the mapping user panel is what I need help with.
What I would like to do: I'm comfortable with modifying an excel file in the background. However, I would like the mapping to work as such. I could easily say: "UPC Column Header" and the user puts in B10 in a text box and so on. What I would rather do is have the previous mappings for that customer in the text boxes, a check to see if the text is the same (same cell text value as before), and then an error if the column header cell text doesn't match the previous mapping stored in a db. I'm fine and dandy with the database portion to store/check the mappings, but here is my conundrum... and I may be putting more work on myself.
The conundrum is: I would like the user to be able to view the selected excel sheet and click on a cell to select a new mapping in the program, or to map a new excel sheet. So it would say: "Click the UPC header," and so on in order to fill out the mapping form. How would you go about this?
I'm a C#/ASP.NET web developer with decent Javascript experience and would like to keep it as a web app (to avoid having to update the program based on my changes for the user). However, I'm willing to go down different avenues/languages.

Is there a way that I can autopopulate my webpage with pictures from another website?

I'm making a simple website (think of it as wikipedia without the text), where the users click links to people's names and then go to that person's personal page. I would like to be able to have an image of the person also show up on the personal page, but I don't want to hard code the links to the images or save them on my computer.
Is there a way that I can get the top search result from Google images and then copy that link to put into each page dynamically?
I would suggest using the google api (Google image search api ), pull a search on page load for the user, parse the json for the "unescapedUrl" and use that as your img src attribute.

extracting data from google spreadsheet into a html table

I have a google spreadsheet that stores data at my work and is constantly being updated via google drive so it is always online editing, what I want to do is to be able to extract the values in those cells and have them show up in a HTML5 table on my website, what would be the best solution for this?
I did try one way which was to just embed the spreadsheet in a iFrame and have that refresh every 5 minutes, but the refresh loading is too slow and it causes issues with trying to get the spreadsheet to fit perfectly in the iframe everytime I refresh. these websites will be on display on TV screens so I dont want to be adjusting them regularly, they will auto refresh and be idle.
Your Google Sheet's rows/columns can be exported as a pretty minimal HTML table. You can grab that HTML and manipulate it however you like. Here's how to get it:
Open the Sheet and find your file_id in the URL, and the gid for the specific tab you wish to export (you may have several spreadsheets within a single Google Sheet).
Use this URL string, replacing <FILE_ID> and <TAB_GID> with your own:
https://docs.google.com/spreadsheets/d/<FILE_ID>/gviz/tq?tqx=out:html&tq&gid=<TAB_GID>
You can set the refresh/recalculation rate under File > Spreadsheet settings to be every minute, if necessary.
Example:
Here is a Google Sheet with some data. To export this as an HTML table, we take:
the file_id: 1BxiMVs0XRA5nFMdKvBdBZjgmUUqptlbs74OgvE2upms and
the tab_gid: 0
from the URL and substitute those into the URL string (above), yielding:
https://docs.google.com/spreadsheets/d/1BxiMVs0XRA5nFMdKvBdBZjgmUUqptlbs74OgvE2upms/gviz/tq?tqx=out:html&tq&gid=0
Hope that helps. 🍻

What is the best approach for storing YouTube content appended to user contributed content?

So I'm trying to implement similar functionality to Facebook where I am including information from YouTube should a users post contain a link, and when clicked it embeds the video.
I've accomplished it thus far, I'm just wondering how Facebook stores this information.
To me there are two options:
1) Have the post saved as normal (it is just plain text), and if the post contains a youtube link, append it on the fly in JavaScript whenever that content is viewed. However I know that when you post a link, Facebook gives you the option to change the title, description etc. Which leads me to..
2) Generate the HTML that would be otherwise appended when viewed and store it alongside the post at the database-insert level.
If so, doesnt that add a significant amount of information per post? What happens if you want to change the formatting of all youtube content within posts on your site later on? Each will be stored individually and seems like it would be a pain.
What is the best way to manage & engineer this sort of functionality?
Cheers,
I'd store the information itself in the database, but not as HTML. Generate the HTML on the fly but store the data in a separate place. If you don't want to add too many extra database fields consider storing the information in some serialized form (like serialize() in PHP).
Anyway I would always keep information separated and never store auto-generated HTML unless it's some sort of cache that can be re-generated.
If you want the user to include his video within his text, store the link in HTML within that user's intervention, and output it as is from the database on the page. Then your users can edit their posts to decide whether to place the video before, after, in the middle or not at all, and can change the details in HTML.
If you are showing the video in some standard way, then store the video link along with the post in a separate database column, and generate the HTML on the fly. You can have data in columns for size, colour etc..., but the flexibility will always be limited to what you decide to store: if there is a database coloumn for colour then you are letting the user choose the colour, otherwise... not.
So, the most flexible is to let your users type HTML. If you think they aren't up to it, or you want to limit their choices of what they can format, you could use a java(script) rich text editor of the type that you have in stackoverflow, wikipedia etc., with possibilities to edit text in certain chosen ways via buttons. You could also store the post in XML, say in a chosen subset of HTML5 (anything that is valid in a certain container...), and transform it at presentation time.
to me this sounds like a problem that was taken too far.
if you implement ckeditor in your post form,
it should resolve the problem ( if i understood it right ),
since in ckeditor you can embed an swf/flv,
and the output will be html.
that gives the editor the power to decide exactly where he want the video ( since he can add the link wherever he wants in the form ).
since the flv/swf come with its meta data from youtube, you dont need to save that data,
just the link to the video.

Categories

Resources