ASP.Net MVC 4 not using Mobile Views on iPhone standalone app (after adding to homescreen) - iphone

I have a web site that I have built in MVC 4 that has both Web and Mobile views. I am using the .Mobile extension on my views to render the mobile views when someone visits the site from a Mobile phone and that's working great. When I visit the site from an iPhone it detects the browser and displays the mobile views correctly.
However, if I add the app to the home screen and I navigate to the site by clicking on the Home Screen icon, MVC uses the standard web views.
I can only assume that when Safari is used in standalone/fullscreen mode it sends through different headers, which MVC does not recognise. (Side note: It also seems to ignore auto-login cookies that were previously set when the site was accessed normally through the browser).
What do I need to do in order to get MVC to recognise that it's still a mobile browser and render the Mobile views?

the simple if not particularly elegant way of getting this to work is to output the useragent string when launched from the home screen icon ... and then manually overriding to make sure that that useragent or some part thereof loads mobile like this question shows how to do :
ASP.NET MVC 4 Mobile Features

Related

Ionic 2 In App Browser - Keep user within app, currently all website links go to Safari

I am wrapping a web app I have built in an Ionic 2 application so the client can release on the app store(s).
I am using:
https://ionicframework.com/docs/native/in-app-browser/
Which correctly loads up my testing IP but any anchor tags open up in the normal Safari browser. How can I keep the user within the in app browser?
This is how I set up the browser:
const browser = this.iab.create('my.ip.add.ress');
browser.show();
I have tried changing the links on my website to use all of the following variations:
target="_blank"
target="_system"
target="_self"
But nothing works.

Which GWT Layout Panel is perfect for building Mobile Friendly Website?

Ok, A Mobile Friendly Website should be very short and focus on the task, so it wont need to show the headers as in Desktop Website.
Here is What I want to design.
When user open mydomain.com in Mobile devices like Smartphone or Tablet. They Will see
Email:
Pass:
Login
Registration
Explanation
About
When they CLick Login they will go to a page that lists all the products, the Page Should has "Home" link the Back button
Home Back
Product 1 , some other info
Product 2 , some other info
Product 3 , some other info
......
When user clicks on a product, it will show the details of the products
Home Back
This is Product 1
Detail info of product 1..
If user hits "Back" button then it will go back to the previous page (ie, the list of products page).
Note that: in the home page, we also have "Registration", "Explanation" & "About" Buttons, but we will never show these buttons in any other pages except the home page.
So, my question is:
Is there any Gwt Layout panel that can help me to achieve that Simple Design for Mobile Friendly Website?
The only 1 I can see is the TabLayoutPanel, but the headers are always appear in all pages.
What about "StackLayoutPanel"? How it look like? & is it good for Mobile Website?
It's better not to use any LayoutPanels in mobile apps. Ideally, you should not use any widgets that implement RequiresResize interface.
Such widgets rely on JavaScript to resize them. This is very slow compared to native browser layout mechanism. It also requires much more code. The difference is not significant on desktop, but very important/noticeable on mobile.
A good mobile library should rely entirely on a native browser layout mechanism, like a flexbox model. This is the key reason to consider mgwt for mobile development.
None of the widgets included with GWT are primary thought for mobile, so I recommend that you use another library like m-gwt, gwt-mobile, or touchkit.
Anyway there is a very simple mobile web example application in the GWT trunk which you can use as reference. They use DeckLayoutPanel since you can add multiple views and let it to animate between them. You can try this live demo from a mobile device (you can append formfactor=mobile/tablet/desktop to switch view implementations). The demo is very old, without using modern CSS3, but helpful.
So, if your application is very simple use DeckLayoutPanel, but if it's going to getting bigger, it's better to consider a mobile specific library.

MVC Facebook application - dual template

Maybe this is a stupid question and I did not understand exactly how Facebook applications work but here it goes
I want to implement a small e-shop as a Facebook application and for the products to have like button. The application will be instaled on a business page.
The problem is that the link for the like post on the wall will be to the actual eshop not to the facebook application on the business page.(or is it possible to make it to the application (eg. when you click the browser goes to the business page, selects the eshop tab, opens the product)?)
So actually I need to make a eshop site with 2 templates one for outside view and one for IFrame facebook view.
Is it possible to detect (from code-behind not in javascript) If the request is from the iframe or directly from outside?
Or the solution is more simple.. create a small version of the shop for browsing products only to be viewed in facebook and a full shop for outside view and the only relation between them is that when you click the like post from the first one you go to the second one?
I think I have found a solution...
I have created 2 domains that point to the eshop
shop.domainname & facebook.shop.domainname.
And in code behind I can check the Request.Url.Host if it starts with facebook.
For the facebook app the canvas url will be with facebook.shop.domainname and the links from the like button will be for the shop.domainname.
In this way I should be able to use 2 templates for the site and detect witch one I shoul use....

View HTML code of a iPhone WebApp that's on the Home Screen

Does anyone know how to view the HTML code of a webapp that's saved to the iPhone home screen? Some webapps redirect to a different html file when they get "promoted" to the home screen. It's that code I'd like to examine.
According to Apple's documentation, the mode in which a webapp is being viewed can be retrieved using JavaScript. So, if you send the iPhone's User-agent header from your computer and then grab a copy of the first HTML document that gets served up (before JavaScript has a chance to do any redirects) you should be able to find some JavaScript code that decides how to display the webapp based on the iPhone viewing mode.

Possible to open iPhone Safari and target a specific window?

I have an app that uses OAuth to authenticate, which means the user must be directed to the website to authorize the application. I prefer to make it obvious to the user that they are using a standard browser to authorize at the original site rather than just using a web view to show the content within my app. However, every time they are directed to Safari (via openURL), it launches a new Safari window and once Safari has 8 windows open, it simply fails to work at all.
I'm wondering if there is an equivalen to the "target" attribute of an anchor tag in html which would allow me to cause all openURL calls from my application to open in the same window.
There is other functionality that I can expose via the web application, creating a hybrid app between native iphone functionality and web app functionality in Safari, but if I have to launch a new window every time I switch between the app and Safari, it becomes unworkable. The Youtube app is obviously able to return the user to the previous page after showing a video, but that might well be a custom plugin in Safari for iphone. Also, while returning to the previous page is somewhat useful, sending them to a new URL in the existing window really opens up a lot of possiblities.
I'm pretty sure there is no way to pass a target parameter to openURL:.
What I noticed about Safari is that it won't open another tab if the page you are opening with openURL: is/was already open in Safari. It just reloads that page. This might sound trivial and not helpful but perhaps you could use it to your advantage if you can make your web application only use one page. Different views or states could be expressed with #anchor tags.
An example is http://m.flickr.com. Notice their URL structure? It goes http://m.flickr.com/#/home, http://m.flickr.com/#/explore/interesting/, http://m.flickr.com/#/search and so on. All of these are different web pages to the user but to Safari it's all the same page.
I found iOS 6.0.1 Safari will open the same tab with a simple hashtag, without the slashes. So with the above example http://m.flickr.com, openURL to http://m.flickr.com#someinfo opens to the same tab.
In your webpage, use window.location.hash to return the params. In the above example it will return #someinfo.