Ionic - Open some URL into modal - javascript

I'm not sure if this is even possible but, I have a button (Add event to calendar).
This button should let the user create an entry to his Google calendar.
For this, I have to open somewhere this URL
My concern here is that I don't want the user to "quit" the main page (where the button is placed). So opening it in a new tab is not an option.
So I'm wondering if it is possible to open it in ion-modal or anything else that keeps the user with the page.

If your app is based on cordova you can use In App Browser to load a url within the app.
If you are using capacitor you can use Browser Plugin, same purpose.

Related

injecting react tsx into content script - google chrome

I'm having some issue I couldn't find information about online.
I have a chrome extension, which when I click on the extension's icon, I have a popup UI opening.
Next, when I click on a certain button, it injects JS code into my content script. Cool!
Issue begins when I try to inject a react code into the page. How could I inject such thing instead of JS code?
Or even better, how could I render there a new ReactTSX component?
I'll just add that what I attempt to do is that when a user clicks on a button in the popup's ui, it takes a print screen using captureCurrentVisible, which I want to pass to a large screen so I can draw on that image using a canvas (I have built the component responsible for that, I just don't know how to open a window, full screen, which I could edit the image on).
Regards! :-)

How to open a browser app which is listed in chrome://apps

Chromium-based browser has the apps page at chrome://apps
There are some apps that I have installed into it. Is it able to launch one of them from JavaScript somewhat just like opening file selecting box?
I can open chrome://apps by setting this URL in to a link, but how about a single app?
Copied from: Open Chrome in a new window (Chrome app)
Sadly, there's no way to do that I know of.
Using window.open in an app's context is a bit of a hack, but results in the URL being open in the user's default browser (not necessarily Chrome). There's no control as to how the browser chooses to open it.
There's a Chrome App-specific API that was created specifically with "open a page in Chrome" in mind, chrome.browser. However, it still doesn't provide an option to open in a new window.
The closest you can get is to create your own "browser": an app window with an in it. Then you have full control over the presentation, but it's not integrated with Chrome's profile and may require additional work to implement things like dialogs and browser controls. See the Browser sample app and documentation.
You may need the app id which you can then append to the URL. I am not entirely sure how you would find but if you go to the apps page on chrome, drag the icon of the app to the search bar in the browser, you should get the full link.
For instance, I dragged the Google Slides Icon onto the search bar and it gave me this url chrome-extension://aapocclcgogkmnckokdopfmhonfmgoek/main.html. So, you may give it a shot! Try to open the chrome apps page, then drag the app you want to open in new tab onto the search bar.
Hence, using Javascript:
window.open("chrome-extension://aapocclcgogkmnckokdopfmhonfmgoek/main.html", "_blank");
Opens Google Slides App in a new tab.

Tabbed Page layout lost state when when refreshed

We have designed the application with tabbed pages layout.
Tabbed Page Style
the tabs are page and are created on click of menu, these are and added in parent container as child DOM element,it is a new form which has input elements,we could have many tabbed pages at a time. my application is in Spring MVC ,PostgresSQL ,Jquery.
What happens when refreshed, lost all the added dynamic new tabs (tabs are pages and we lost the current state).
I could share the reference code if required.
Please suggest how could I manage the state of application.
Window reload/refresh is a pure browser event that ends the execution of the page, you can't really have script continuity after it.
One option is to attach an alert to window.onbeforeunload informing the user that the content will be lost if they reload - this will work with closing the window and refreshing it.
If, however, you need to be able to reload (eg, to load fresh data in the tabs) while preserving tabs, you can use window.onbeforeunload to prompt the user whether they want to save the data/layout before closing, and if so, execute an AJAX call to the server, where you save the tabs (associating it with the session). This would mean that on loading the page you need to first check if there is tab data associated with the session, and load from there.
Other option - and this would be my preference - is to use window.localStorage to save the data on user's disk, and on page load check if there is data in localStorage. It has pretty wide browser support at this point, and there are good libraries that make using it a breeze. I have used store.js and can vouch for its ease and reliability.

Triggering multiple individual JavaScript functions via URL without a page refresh

I'm building a simple webapp using NFC(near field communication), which involved certain tags being programmed with the URL of my website + a hash that will trigger a specific JavaScript function.
For example, "www.website.com/index.html#hide/one" will hide the element labeled "one" on the webpage. Simple enough, right? I thought it would be.
I've since learned that when you tap an NFC tag, it opens the URL in a new webpage/tab. I think this could be averted if my webpage checked to see if there are any other open pages and closes them, though.
If there's a better way to do this(trigger JavaScript functions on a webpage via a URL to that webpage), please let me know. It's important to note that there are 8 tags(elements) in total, and they all have to be triggered for the game/app to end, which requires it all to be done on the same page, preferably without refreshes(although I could probably rig something up using localstorage so it could be refreshed).
Thanks in advance, I'm just not sure how I would proceed here.
-Mitchyl
EDIT - I should mention that I already am using backbone.js for my routing needs. It's perfect for my situation at the moment,
What you need is a hash tag routing libary. http://projects.jga.me/routie/
This will run when your app page loads and read the hash, diverting the logic of your code to do something based on the hash tag, thus you make your items remove on the page in your code logic. No need for lots of pages.
But!
If the url launcher on the device launches new windows each time an item is detected, that is a problem since you can't close those windows, other than from the window itself.
Solution
The app has a main window for the game, each item is stored in local storage, You can use the local storage event system to detect if another page changes an item, and update the UI in real-time.
addEvent(window, 'storage', function (event) {
if (event.key == 'item1') {
item1.innerHTML = event.newValue;
}
});
When NFC launches a new window, display user feedback that states they have completed a task of the game then close it using a timeout.
Below that window will be the main page window with the update displayed.
Done properly it will work brilliantly. You can also add a nice x close button on the pop windows as tasks are completed.

How can i open a child window in Chrome when we click the custom formula link in IE

I am having a Proposal Builder Custom Formula(TEXT) using hyperlink on opportunity. When i click that i am trying to open a VF page in new window.
Hi, i need help on this salesforce task plzz.
My requirement is..
I opened Opportunity In IE and when i click Proposal Builder link on Opp, then that VF page should open in CHROME.
Any Suggestions or ideas plzzz..
Here is the Formula field i created:
HYPERLINK("https://mysalesforceorg.com/apex/cpq?opportunity_id="& Id &"&quote_id="& Id &"&Session_id="&$Api.Session_ID,"Proposal Builder","_blank")
CPQ is the VF Page to be opened when clicked.
Thankyou...
There is no way to force a browser to pass a URL to a different browser. It would be possible to create shortcuts on your desktop to open certain bookmarks in a specific browser, but what you are asking for is not possible. Once you're operating in a browser, it's going to handle any links/redirects/actions within itself (whether that be in the current tab, in a new tab, or in a new window).
With that said, there are certain extensions for Chrome that would allow an end user to render a page using an IE tab within Chrome...but there's no way for you as the developer to guarantee your users are going to do that.

Categories