We Keep Coding

How to create a side panel that can be called from any page with Phonon Framework?

I'm using Phonon to make a hybrid app. It's my first time using this framework.
I am looking at the documentation for side panels and I see an attribute called data-page, which sets what page can call that panel.
If I want a global panel, which can be called from any page, what value do I set on it? I've tried just removing this attribute, but it made the panel to stop working on all pages. Do I need to repeat the same piece of code multiple times? (really?)

My response is late, but it can help.
The recent versions of Phonon support this feature now.
You can pass multiple pages with the attribute data-page.
For example: data-page="page1, page2"
Documentation for side panels

How can I make modifications to an HTML form that is automatically generated?

I'm creating a webform using a marketing automation platform. I want to add a field that functions with jquery to do an autocomplete. Unfortunately, the forms are generated through a WYSIWYG editor in the software, and then generated and put into the page when it renders. The only code for the form that appears in the HTML for the page is a simple variable placeholder - %%FORM::DEFINITION%% - which is then replaced with the form code when you visit the URL. The software support team tells me that making the change I want to make is impossible, which I see as a challenge.
The only thing I need to be able to do is add an id="autocomplete-dynamic" attribute to the input on the form. I had two ideas how I could achieve this.
The first, and most preferable option, would be some script that runs at the bottom of the page that simply inserts the attribute into the input tag after the page renders out. This would only be a client-side change, but since all this does is make the text field capable of looking up values out of another table, it should be fine. If someone had a script blocker in place, they would not be prevented from typing into the text field normally, it's just that the auto-lookup wouldn't work. We're trying to make it easier to select an item from a list of thousands of possibilities, but if someone had to type in their own entry without the autocomplete, it would not be a disaster. This seems like a clean solution, but I am not sure if it can be done.
The other possibility is to get the form code out of the software and embed it in a separate HTML document, and make the change there. You can extract the raw HTML for the form for use on another page, but pasting this code right back into the landing page causes errors. So, the thought then was that if I have taken the code generated by the software and put it in an HTML page on a separate web server, I could modify it as needed, and then turn around and use an iframe to stick it right back in the landing page. The software shouldn't complain because the form is being used on an external site like it's supposed to be... I have just hidden that external site back inside the platform-hosted page.
Option 1 would still be much easier to implement, I think, provided it is actually possible.
Thanks in advance.

Your first solution seems completely appropriate.
$(function() {
$('#myForm input').attr('id', 'autocomplete-dynamic');
});
This can be added anywhere inside a script tag because it's wrapped in a shorthand document.ready function, which waits to run until the DOM is ready.

What the functionality is called which is used while logging out of Google account?

When we want to log-out from the google/gmail account, we click on the profile picture displayed at the right most of the Google bar. The scenario with the pop-up is shown in below figure.
What does this functionality called in jQuery, HTML? I think it's not a modal pop-up as it's not appearing on the existing content of a page and background content is non-clickable. Also it can't be called as tool-tip as it's not showing up on mouse hover, we need to click on profile picture to see the log out button. So what does it called?
I'm asking this thing curiously because I need to implement same functionality in my website. That is when user clicks on specific text the pop-up/tool-tip(for now I'm using these words for your understanding only, may be I'm using wrong words). As I don't know the exact word for this functionality I'm not able to find out such jQuery plugin on internet which would behave the same way.
One more thing is that I want to use a form in this pop-up/tool-tip which would be submitted to PHP using AJAX.

Popover!
Example API from a popular CSS/JS toolkit:
http://getbootstrap.com/javascript/#popovers

Automatically refresh SharePoint site when item is added to a Form Library

I have a question about automatically refreshing a SharePoint form library any time an item is added to it. We have a business team within our company where any individual on the team can fill out a particular InfoPath form. Once that form is filled out and submitted, it is saved to the aforementioned SharePoint form library.
When any user submits a form like this, the other users like to know that it has happened and they almost always have their browsers open and pointed to this particular SharePoint form library. These form submissions and the data they contain are somewhat time-critical, so it's an important way for everyone on the team to be up-to-date about the submitted information.
Does anyone know if such a workflow is possible in InfoPath? I've Googled this issue already and I've found a lot of helpful advice about redirecting to the same page using the SPUtility class's functionality (which does seem to work), but I want to refresh/redirect the entire page, not just the pop-up window for which the SPUtility class is apparently responsible. I've also seen some results suggest using a Content Editor web part containing some JavaScript for refreshing the page and then accessing that Content Editor via a workflow or event receiver. Does anyone have any experience solving an issue like this or have some ideas? I'm not looking for anyone to write the solution for me - I just need a push in the right direction from someone that's more experienced with SharePoint.
Thanks!

I would suggest a bit of JavaScript that periodically redirects the page to itself. If you wanted to get flashy, you could use the Client Object Model to query the list for the last modified date of the last modified item. If that changes, refresh, or you could use the Notifications API to show a nice 'Notification', perhaps with a refresh button that reloads the page?

Multi step form with jQuery which degrades nicely if JS is turned off

I currently had my form set up so that each section was refreshed using Ajax, however it didn’t degrade gracefully with JavaScript turned off and I’ve looked into putting each part of the form in to a separate view which works fine but isn’t that great to be honest.
I know the client wants it to look nice so I thought about using jQuery to show and hide forms, so if JavaScript is turned off then all of the forms build in to one long form. However the only problem I am facing is that after each section the user needs to submit this information for it to be validated before the next stage is completed. How can I do this if JavaScript is turned off because the other forms will be visible...
Any ideas? Thanks.

You might consider using one long form divided into sections, and then if JavaScript is enabled you hide all but one section at a time, providing navigation between the sections (via tabs, for instance).
Alternately, you could look at using script and noscript sections, but then you end up duplicating the form (once in the script sections, once in the noscript sections) and it starts getting to be a maintenance problem.

What you do wrong is that you're thinking reverse. When you have it working with javascript disabled then it's much easier to apply some javascript functionality.
In addition to that I would display different forms based on wich step in the process the user are. And to that form pass the values from the last step into hidden fields. That way you can have a "step"-registration without js enabled.
?step=1 and let say you use php <?php if (isset($_GET['step']) && $_GET['step'] == '1'): ?>
Then just reload the part that contains the form with ajax.