Dash Multiple Page Application With Callbacks - python-3.x

I created a couple dash applications and now I think I'd like to connect them with a menu that takes you between the pages.
So i used this example: https://github.com/plotly/dash-sample-apps/tree/master/apps/dash-financial-report to begin however, each page in my application has specific callbacks associated and those callbacks need a dash app defined to work. How can I make this example work with callbacks with pages that have callback calls inside them? (i.e. I'd like to keep the header portion as on every page as I move through).
https://dash-gallery.plotly.host/dash-financial-report/overview

Related

Express - Async Templating

I'm using Express-Handlebars for my templating engine and I'd like to make an asynchronous call from within my templates like the following example:
{{{cmsLoader 'search-{$searchTerm}' searchTerm=query.input defaultId='search-default'}}}
This would query the db for a chunk of html by a specific id (i.e. 'search-video-games'), if the key exists, it adds the html. If the key doesn't exist, it looks for the defaultId (i.e. 'search-default') and adds it instead. If the defaultId is not specified or doesn't exist, nothing is added.
Most of the backend functionality is in place. My problem is the doing async processing inside of a helper. Is there a way to wait for the results of an async call from an hbs-helper before finalizing the render?
NOTE:
I realize I can make these calls from inside the controller and feed the data to the view, but there are tons of templates most with multiple CMS blocks and since these will be changing regularly, accounting for them ahead of time would be difficult to maintain.
Handlebars is not an asynchronous templating engine so that is not possible. You would need to switch to an asynchronous templating engine for Node.js such as Marko. Marko allows you to asynchronously fetch additional data even after rendering has begun.

Chrome extension: Identifying "actual" tabs from webNavigation events

I'm trying to identify if a tab for which I received "webNavigation.onCompleted" is an "actual" tab.
As described in the documentation:
http://developer.chrome.com/extensions/webNavigation.html
A short quote from the docs:
A note about tab IDs :
Not all navigating tabs correspond to actual tabs in Chrome's UI, e.g., a tab that is being pre-rendered. Such tabs are not accessible via the tabs API nor can you request information about them via webNavigation.getFrame or webNavigation.getAllFrames. Once such a tab is swapped in, an onTabReplaced event is fired and they become accessible via these APIs.
So now when I get an event I encounter 2 problems when trying to figure out if the tab is "actual":
The scenario as described in the documentation, however I see that onTabReplaced can called before/after onCompleted,
or even not called even though I expect it to be called since I dont have the tab id in a list of tabs I create in tabs.onCreate,
and later the page is displayed in a tab.
Pages that are pre-rendered in Google chrome pages (e.g google for "ford"), and eventually dont become to show on tabs.
In case you're not familiar with pre-rendering:
https://support.google.com/chrome/answer/1385029?hl=en
I consider these cases to be different because I see in difference in pre-rendered pages,
that end u to be tads, and the ones who are not used eventually.
One page is eventually "navigated to", while the other on is just "cached".
But this difference can not be detected by using the webNavigation api, as far I as could find.
So my question - is there any way to distinguish (hopefully using the webNaviagtion api),
between an "actual" tab, a pre-rendered page which is going to be displayed as tab,
and a pre-rendered page that is going stay in cache (for now) ?
Just 2 clarifications, about solutions that supposedly I can use, but they look to me "not good",
at least at this stage.
The docs say "Such tabs are not accessible via the tabs API".
so technically I can try an use this API, get an exception, and this way figure out it's "pre-renderd" tab,
but I dont like my code to use exceptions for this, so I'm looking for a "clean" way.
in webNavigation.onComplete, I can set a timeout for 1 second,
and then if in this one second, onTabReplaced, I can figure out that this tab was
moved to be an "actual" tab. and not stayed in "cache".
But during this 1 second, or any duration I choose, there can be a lot of other events,
and even the tab can be closed.
So again, I'm looking for a "clean" solution.
Thanks for your help.

How to provide command line arguments using HTTP under Node

Is it possible to pass command line arguments using HTTP under Node.js? This seems like a simple thing to do but I can not seem to find out how or if it is even possible. I am struggling a little with the async nature of node so may be missing something fundamental here!
Thanks,
Will
You have a few choices of how to pass state info from one script to another. One of the simplest and most portable has been around since the beginning - when you get the user data posted from page1, send it along in hidden form elements of page2. Then a post of page2 will have the user input on the new form elements and automatically include the hidden form element values as well. Of course you can use the data in the page1 post to otherwise determine what goes on page2. And so on to page3, etc.
The other common choice is cookies. You leave a cookie on the user's browser when they view page1 and then query the browser for it in your code for page2. This is totally portable in modern browsers, but the user can turn off cookies and then it won't work.
Another option is session variables in your node.js scripts. These are pretty easy to work with, but some servers use cookies behind the scenes and they could be off. You might want to read up on that one.
None of those 3 require use of JavaScript on the browser which is required for the Ajax option. In this single page mode you can keep all the state info you want in the JavaScript code because the page never gets reloaded. That gets a little tougher for a beginner and there's also the possibility that Javascript is off. If you are developing a rich, interactive app, you can expect your users to have JS enabled. But for a website with a few pages to sequence to casual visitors it may not always be on.
So, I'd suggest you try the hidden form elements to get started. Something like:
<input type="hidden" name="whatever" value="data-from-page1-post" />
If you put that onto a form in page2, it will come back in the post.
Have fun...

Web scraping from a Google Chrome extension

I've started to develop a Chrome extension to navigate and perform actions on a website. Until now the extension is able to receive a couple of parameters and check a set of radio-buttons, fill in a few inputs of a form and then submit it.
What I want to do now is to repeat the process, but I'm stuck when the page is reloaded. And I don't know how can I do to make the script react to the finish of the request.
The workflow I want to achieve is the following (is for automatically copying a certain object):
Popup side
Enter the number of the Master object to copy
Enter the base name of the copies (example Mod, so the I can iterate and add mod1, mod2, modn)
Enter the number of copies
Background side
Select master
Select standard options
Fill in inputs
Submit form
Wait for the page to complete the request and continue to the next copy. (here I need help)
The problem is on the repetition, the rest is taking care of. I assume that must be a way of dealing with requests. Any ideas?
By the way I'm doing it all with the extension and tabs methods of Google Chrome plus JavaScript and jQuery.
Ok, i´m going to answer the question myself based on Matthew Getner´s comment. The chrome.webRequest.onCompleted was the solution to the problem. With this method I was able to wait for the request to be completed and start over with the process. And with the messegaes methods I´ve achieved the comunication between the background and the extension itself. So I finally was able to filled a form, send it, and repeat. This way I´ve made a kind of robot to help a co-worker with a lame repetitive task on a aged web plataform.

Client id of elements changes in sharepoint page? Why? When?

Client id of every element from the sharepoint page changes sometimes.
Can anybody please tell me why and on which instance it changes???
jQuery is fantastic! It makes client-side development faster and
countless plug-ins are available for just about every need. Using
jQuery with Asp.NET Web-Forms gets aggravating when dealing with
nested server controls. ClientID’s get appended when using ASP.NET
Master Pages. Objects in JavaScript tend to look like this:
ctl00_m_g_aaf13d41_fc78_40be_81d5_2f40e534844f_txtName
The difficulty of the issue above is that, in order to get the element txtName, It’s necessary to know the full “path”. It’s quite
aggravating to refer to get the object using the method below:
document.getElementByID('ctl00_m_g_aaf13d41_fc78_40be_81d5_2f40e534844f_txtName');
This becomes a big problem when developing server controls or web parts that may be used in a typical ASP.NET application or SharePoint.
You cannot hard-code the path above if you don’t know the full path of
the control.
Fortunately, there are a few ways to get around this. There are three, in particular, I will mention. The first is the jQuery
equivalent to the standard JavaScript method:
document.getElementById("<%=txtName.ClinetID%>");");
This can be done in jQuery by using:
$("#'<%=txtName.ClinetID%>");");
The second jQuery method does not require server tags. This method searches through all tags and looks for an element ending with the
specified text. The jQuery code for this method is shown below:
$("[id$='_txtName']");
There are, of course, drawbacks to both methods above. The first is fast, but requires server tags. It’s fast, but it just looks messy.
Also, it will not work with external script files. The second
alternative is clean, but it can be slow. As I said earlier, there are
several other alternatives, but these two are the ones I find myself
using the most.
The third registering Javascript in C# code behind.
Page.ClientScript.RegisterStartupScript(GetType(), "saveScript",
String.Format("function EnableSave( isDisabled )"+
"{{ var saveButton = document.getElementById(\"{0}\");"+
"saveButton.disabled=isDisabled;}}", btnSave.ClientID), true);
Do not forget to call this script after controls have been loaded, I mean after Controls.Add(); in CreateChildControls method while
developing webparts.
$('input[title="Name"]')
Look at the page source and get the value of the title property - works every time.
ListBox1.Attributes.Add("onmouseup",
"document.getElementById('" + base.ClientID + "_" + lbnFilter.ClientID + "').style.display='block';");

Resources