Chrome disables buttons and input elements when offline - javascript

I am working on a progressive web app and it has a file input button to choose a file from the device storage. It works fine offline on chrome desktop version but the android version disables the button. I have no idea how to fix this. There are no css in the project for now just the html and the javascript code for the service worker.

I figured out what was going on with my own page -- somehow every time I hit the app in the home screen, it would go to the saved offline page from Chrome instead of trying to actually use my PWA, and those saved offline pages have their inputs disabled.
I had to go delete the saved web page from Chrome to get mine to work again.
I only noticed because I changed some text around and nothing was correctly updated.

Your seems code is ok. So it might be the set up of the sys.
check the google tutorial
https://developers.google.com/web/fundamentals/codelabs/your-first-pwapp/?hl=en#download_the_code

Related

Should JavaScript/jQuery objects disappear when download hyperlink is clicked

We use Atalasoft's web image viewing SDK to display TIF images in a web page. We recently upgraded to their client-side, JavaScript/jQuery based component and discovered some odd behavior. After initializing the control, if a link is clicked to a resource that should be downloaded, the control(s) clear themselves out. The issue exists in Chrome and IE 11 that I have tested.
Since it is a paid SDK, the easiest way to test this is to go to their demo at:
http://www.atalasoft.com/demos/dotimagewebdemo/
Once the page finishes loading, open a developer console and paste in the following (simply adds a download link to a file on their site):
$("body").append($("<div style='position:absolute;right:5px;top:5px;'><a href='/Gallery/WebViewingDemo.zip'>DOWNLOAD</a></div>"))
Clicking the download link will wipe out their controls on the page.
Adding download to the anchor tag resolves the issue in Chrome, but not IE.
Adding target='_blank' resolves the issue in both, but creates an ugly blank window first (that in my experience does not always close).
I am setting headers server-side to tell the browser to download the file rather than displaying it.
I guess my questions are two-fold:
Is it normal for JavaScript/jQuery based objects to disappear/destroy/whatever when a link is clicked to download a file or is this a problem with their implementation?
and
What is the best solution for this (preferably without the blank page showing up)? We need to support mainly Chrome, FF, and IE (most popular desktop versions).
Thanks in advance!

From website to app to website on iOS

I'm working on an iOS app some people want to link to from their website.
While I've managed to open my app from a webpage using schemes, I wonder if, when I'm done with what I have to do in my app, I can switch back to the original website tab in safari.
To my knowledge : it is pretty straightforward to open a new page in safari from my app but I don't know if it is possible to get back to the actual original page, just like the ios9 back-to-app button would do.
I could open a new page and close it straight away with some javascript, which would probably display the original page because it's the next one in the tab list... but it doesn't feel right (does it?)
I read stuff about ios9 deep linking, still can't find anything interesting.
To achieve this is to open Safari using URLScheme. However, (afaik) Safari App doesn't have a url scheme. If the user came to your app from Chrome, than you can use its url scheme
Google Chrome has the following two URI schemes: googlechrome:// and googlechromes://
iOS 9's back to app button can't be invoked programmatically, so you can't use it as well. However in jailbreaked devices an app can mimic that, maybe that will help you http://theunlockr.com/2015/08/23/enable-back-button-ios-8-video/
I could open a new page and close it straight away with some
javascript, which would probably display the original page because
it's the next one in the tab list... but it doesn't feel right (does
it?)
It doesn't feel right at all. Because the typical behaviour for turning back to previos (or any other) application among iOS users is pressing home button twice, and selecting the app. Maybe you can simply show a message, and ask user to return Safari.

Intel XDK More than one cordova.js script?

I'm trying to build an app using Intel XDK, and I'm running into problems. Things were going well at first, but this morning I was prompted to update XDK, and now my app isn't working.
My login page works fine, and the resulting page with links to various pages in the app work. But when I click a link, the page loads, but is blank, and then I get a JS alert saying:
"It appears you have more than one script tag for cordova.js. There can only be one!"
I found the tag and commented it out to see what would happen, and the only thing that changed was I didn't get the alert. The page is still blank. The only coding I've done was the login script on the index page, so I don't know why it broke. I tried restarting the program, and even recreating the app, and it's doing the same thing. Any ideas why?
There were a variety of changes to the Emulate tab with the new version. I get the impression you're using the Emulate tab. I recommend that you test with the Debug tab on a real device, it will give more accurate results.
After some experimenting, I've come to realize that the problem was I was using List View buttons to navigate, and I was navigating to a different page altogether. That was causing my problem. I just combined all of the pages into one, and it works fine, now.

How to display external HTML with scroll and zoom (pinch) capabilities?

I have been struggling with this issue for days now. I am implementing an application for Android and iOS using Sencha Touch. I want to be able to click on a link (a list item) which can point to a html or an image or maybe even PDF documents (for iOS). This file can be either local or on another domain.
I have found two different approaches so far, but haven't got any of them to work perfect. One approach is to change "window.location" and go to a html page containing a frame with a back button and another frame with the file I want to display. Scrolling and zooming works fine but when the user wants to go back the whole application has to be reloaded (all javascript files and so on..).
The other approach is to fetch the desired file using an ajax request and add the response text inside a panel. The problem with this is that the zooming is not working. I tried to listen for a pinch event and then scale the panel but then the scrolling stops working...
So the question is: How do i display external content such as HTML pages and pictures but still preserve the scroll and zoom capabilites and allow the user to go back without having to reload the whole application again?
I am grateful for all information i can get! /Christian
Add the following to your apps onCreate() method:
WebSettings settings = this.appView.getSettings();
settings.setSupportZoom(true);
settings.setBuiltInZoomControls(true);
It won't work if your ROM does not support mulit-touch but since it is already working in your browser this should do it.
If you are using PhoneGap, you can try to the ChildBrowser plug-in: https://github.com/phonegap/phonegap-plugins/tree/master/iPhone/ChildBrowser
For a pure mobile web app, use the HTML5 cache manifest to avoid reloading when you move between frames and pages: http://diveintohtml5.ep.io/offline.html

Safari seems to cache the page and the DOM state

I've written a Greasemonkey javascript that works fine in NinjaKit the new Safari userscript manager, but when I try and compile the same script using the Safari 5 extension builder I get some very weird behavior.
The script gives the user an options editing screen, when you click the save button, the script saves the users preferences as a JSON packet via the HTML5 localstorage API, the script then closes the options screen and reloads the page, on the page reload, the script should reload the preferences from the JSON in localstorage, and the script should act on the new preferences to display the page the way the user wants it according to the settings they made.
The problem I am seeing is when I run it as an extension, when I click the save button, the script reloads the page, but when the page is reloaded the changes the user made to the settings do not get applied to the page. the weird part is, if I then manually reload the page again via the browsers refresh button, the changes the user made in the settings do all of a sudden become apparent. so obviously the data has been saved to the localstorage, but for some reason when the page reloads for the first time, it's somehow being reloaded from a cached file, and only on the second manual reload, is the new page displayed correctly. I can't understand why this works as a plain userscript in ninjakit, and also actually works in Firefox, Opera and Google chrome, it just wont work as an extension in safari, its soooo annoying. I've tried lots of ways to make sure that Safari 5 doesn't reload a cached page, e.g adding extra parameters to the URL, but I just can't get it to work, without having to reload the page twice.
BTW I'm not using the native safari extension settings system as I want the script to be cross browser compatible, so that's why I'm saving the settings to localstorage.
Has anyone else witnessed this behavior? Or got any clues how to fix this? It's driving me mental...
i managed to solve the problem though i didnt figure out exactly what was causing it.
i got the script working by adding it as an "end script" rather than a "start script" in the extension builder, it all seems to work fine now. phew!

Categories

Resources