Google Chrome Packaged App Pop-up? - google-chrome

I have a packaged app in Google Chrome to allow for serial communications. I need to make a pop-up help page to explain how to use it etc. I have tried several different ways that I can think of and have not found any information on here or Google itself on how to do this. Anyone have any ideas?

One way is to open a window with chrome.app.window.create and populate it with the help-file HTML. However, this won't allow navigation within that same window with an <a> tag. (It will navigate to an external browser window.) To get full-blown navigation, you can place a <webview> in the window, and put the help file there. The tag looks like this:
<webview id="webview" src="http://example.com/help" style="width:600px; height:500px"></webview>

Related

Can I create a Chrome extension that shows several pages in one window?

I'd like to show several webpages in one Chrome window by either writing an app or an extension.
Genuine iframes won't do, because some webpages either disable loading in iframes, or otherwise problems with content-security-policy directives prevent this from working.
webview tags don't use the browser's extension set, or write to history and so on - they seem to be just kind of little browsers of their own.
App Windows would be nice if instead of having their own window, they could be embedded in a single host window.
What I'd like is several "iframe-like" components that act completely like a normal Chrome viewport from the loaded site's perspective, and upon which installed extensions work, etc. If I were able to install extensions inside a webview, that would work too.
Is there anything like this that I can use within a Chrome app or extension?

Chrome webview application to load extension

Is it possible to have a webview application for a web page and load extensions in the application?
I have created a frameless wrapper for one of our web pages, so we can hide the chrome header. I am also using the stylebot extension to alter some elements in the page. It works fine inside chrome, but when I run the application the stylebot extension is not loaded.
Any idea how can I add the extension to the application?
Greatly appreciate your help on this
Thanks, Laszlo
A Google chrome extension have to be load in Google Chrome (or Chromium based browsers). The Google chrome extension API is not included in the webview engine.
You can open a frameless window with create method of the Google window API. You should add an handler to browser action click and create a window of with "popup" type and the url you want. It's not exactly what you are looking for but I don't know a better way to do it on Mac. Perhaps some one more familliar with that environement could help you.
An other far more complicated solution is to fork the Crhomium project and do what you want. But it demand a large developpement I think.

Open Chrome app within Chrome's main window

I'm fairly new to Chrome app development and was wondering if it's possible to run an app within Chrome's main window, like the TweetDeck app.
Thanks!
No. Chrome Apps' current goal is to provide a native-like app experience outside the Chrome browser. Today, with the exception of certain privileged APIs, putting an app in Chrome would be... well, it would be a website.
If you want an app in one of Chrome's tabs, why not just build a website? What does the open web lack for your project?
Note that we have been thinking about what it would mean for an app to be a component inside a webpage. You could imagine a Facebook Like button or a Google+ +1 button implemented as an app in a webpage in the same way that those buttons today are usually implemented as iframes. There are some interesting security properties that this approach would bring over iframes. But again, this doesn't seem to be what you had in mind. What you had in mind appears to be a regular website.

View PPT files directly in an iframe (with Chrome Office Viewer?)

So I am currently working on a local web-based application. Here are the facts:
I am using the CSS page transitions found here:
http://tympanus.net/Development/PageTransitions/ Due to this, each "page" of my application is contained in it's own div in a single file.
Example:
<div class="pt-page pt-page-1">
<!-- Page 1 content goes here ... -->
</div>
<div class="pt-page pt-page-2">
<!-- Page 2 content goes here ... -->
</div>
...etc
The client wants to be able to view Powerpoint (.ppt) files directly on the web browser. To attempt a quick and dirty solution, I have installed the Chrome extension "Chrome Office Viewer" https://chrome.google.com/webstore/detail/chrome-office-viewer-beta/gbkeegbaiigmenfmjfclcdgdpimamgkj?hl=en to each machine(this application is going to be isolated to just four machines that will be using Chrome for the application, so usability isn't an issue here)
What I WANT to have happen is to link to the .ppt file in an iFrame in one of my <div> pages as seen above, so when the user clicks on a link to view the PowerPoint, the page transitions and the slides can be viewed within the iFrame due to the Chrome Extension capabilitiy.
What CURRENTLY happens is that as soon as the application loads, the page redirects to the browser FROM the original application page to a seperate page to view the .ppt file. I would like this to be done inside of the <iframe> as mentioned earlier instead of an entire page redirect...
Is this possible or am I limited due to the construction of the Chrome Extension itself? I can always have the client save their .ppt as images and then display those within a <div> page, but I figured the Chrome Extension would be the quickest solution. Any ideas? Thanks in advance.
You can use Google Drive web publishing and embed your documents by iframes.
https://support.google.com/drive/answer/37579
Try making a .html or .php (depending if you use php) and link the .ppt in it, and then just put that .html in an iFrame.
<div class="pt-page pt-page-1">
<iframe src="/page 1 file linked here"></iframe>
</div>
<div class="pt-page pt-page-2">
<iframe src="/page 2 file linked here"></iframe>
</div>
If it still redirects then its an extension thing.
Also in future try keeping away on reliance to extensions and browsers, they are not really reliable enough for commercial use.
And whats the intention of this system? If its gonna stay in the office for work why does it need fancy transitions?
EDIT:
If you need those .ppt files to be dynamic you can use PHP for dynamic .html creation.
http://www.microsoft.com/web/solutions/powerpoint-embed.aspx
This might help, unfortunately I couldn't find any other way, using iframe forces the browser to download the file, and embedding also doesn't work here. Moreover, this method also allows you to add controls below, and its almost same as an iframe window. :)

open pdf in iphone webapp

I am trying to open a pdf from my JQM webapp. I have tried iframes/embed/object, and none of those work on an iphone like they do on a desktop browser (scrolling, zooming, etc). I have settled with simply opening the pdf via a link Link. This works fine in the standard browser because the user can simply use the browser back button to navigate back to my app.
The issue that I am having, is that when a user saves the page to thier home screen and opens it using the chromeless safari browser, they no longer have the browser back button. I have tried adding target="_blank" to the link, but apparently JQM hijacks the link and prevents opening in a new page, and I have been unable to get the hacks to work.
I have also tried pdf.js, but I can't seem to even get that to work as my javascript knowledge is fairly limited, and the examples are pretty advanced. The only tutorial that I found used an old version which I couldn't get to work.
Are there any ways to bypass the JQM in openning a link in a new window (which would in turn open in the mobile safari rather than my chromeless web app), or are there any other suggestions for how to open a pdf from a webapp?
Just disable the default jQuery Mobile behaviour, by specifying data-ajax=false.
For example:
Link
See http://jquerymobile.com/demos/1.2.0/docs/pages/page-links.html
For my webApps I used https://docs.google.com/viewer to embed the pdf into my interface.
So, when I navigate the webApp by home screen icon, the app doesn't close when I open the pdf.
I met the same question: open pdf in webapp with html5.
I've tried several solutions: iframe、embed、pdf.js, but none of them is the best solution.
tips: iOS 9.x upper, open pdf with iframe only show the first page of the pdf file, and there will be a <img /> tag in the iframe body when you debug.
util now I still have this troublesome problem, anyone has solution please write your experience here.
Thank you.