I am trying to use the Embed component in Fluent UI Northstar to embed a SharePoint Web Page:
<Embed
iframe={{
allowFullScreen: true,
src: "https://tenant.sharepoint.com/sites/SiteName/Lists/ListName",
frameBorder: 0,
height: '400px',
width: '711.11px',
}}
/>
The page doesn't get loaded, all I see in the page is a play icon:
What am I missing?
The component is used within the same SharePoint site, so the user is already authenticated.
I got it to work. I had to give the Embed component a width and height, and use the active prop to have the iframe load automatically without pressing "play".
When loading my bot using BotChat.js directline connection to Bot Framework inside of a SharePoint page, any builder.prompts.choice options that contain builder.liststyle.button will cause a page refresh if a user clicks that option.
HTML Button returned from BotChat.js DirectLine channel
<button class="ac-pushButton" style="overflow: hidden; white-space: nowrap; text-overflow: ellipsis; flex: 0 1 auto;">Test Button</button>
This appears to be down to the HTML button being returned to the user not having a type="button" attribute (see here).
How could I go about loading this attribute in to buttons that are displayed in the Bot Chat?
I am new to phonegap, I am creating a wishes/greeting app.I want to add a social button to share that greeting to people. The selected greeting should be share by Twitter, g+, WhatsApp and Facebook.
PhoneGap Social Sharing plugin for Android, iOS and Windows Phone:
I propose you to use the following plugin to add social sharing option. Its pretty simple and straight forward to use.
Social sharing link
Installation
Automatically (CLI / Plugman):
SocialSharing is compatible with Cordova Plugman, compatible with PhoneGap 3.0 CLI, here's how it works with the CLI:
$ phonegap local plugin add https://github.com/EddyVerbruggen/SocialSharing-PhoneGap-Plugin.git
or with Cordova CLI, from npm:
$ cordova plugin add cordova-plugin-x-socialsharing
$ cordova prepare
SocialSharing.js is brought in automatically. There is no need to change or add anything in your html.
Manually
Add the following xml to all the config.xml files you can find:
<!-- for iOS -->
<feature name="SocialSharing">
<param name="ios-package" value="SocialSharing" />
</feature>
<!-- for Android (you will find one in res/xml) -->
<feature name="SocialSharing">
<param name="android-package" value="nl.xservices.plugins.SocialSharing" />
</feature>
<!-- for Windows Phone -->
<feature name="SocialSharing">
<param name="wp-package" value="SocialSharing"/>
</feature>
For sharing remote images (or other files) on Android, the file needs to be stored locally first, so add this permission to AndroidManifest.xml:
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
For iOS, you'll need to add the Social.framework and MessageUI.framework to your project. Click your project, Build Phases, Link Binary With Libraries, search for and add Social.framework and MessageUI.framework.
Grab a copy of SocialSharing.js, add it to your project and reference it in index.html:
<script type="text/javascript" src="js/SocialSharing.js"></script>
Download the source files for iOS and/or Android and copy them to your project.
iOS: Copy SocialSharing.h and SocialSharing.m to platforms/ios//Plugins
Android: Copy SocialSharing.java to platforms/android/src/nl/xservices/plugins (create the folders)
Window Phone: Copy SocialSharing.cs to platforms/wp8/Plugins/nl.x-services.plugins.socialsharing (create the folders)
PhoneGap Build
Just add the following xml to your config.xml to always use the latest version of this plugin (which is published to plugins.cordova.io these days):
<gap:plugin name="cordova-plugin-x-socialsharing" source="npm" />
or to use an older version, hosted at phonegap build:
<gap:plugin name="nl.x-services.plugins.socialsharing" version="4.3.16" />
SocialSharing.js is brought in automatically. Make sure though you include a reference to cordova.js in your index.html's head:
<script type="text/javascript" src="cordova.js"></script>
Using the share sheet
Here are some examples you can copy-paste to test the various combinations:
<button onclick="window.plugins.socialsharing.share('Message only')">message only</button>
<button onclick="window.plugins.socialsharing.share('Message and subject', 'The subject')">message and subject</button>
<button onclick="window.plugins.socialsharing.share(null, null, null, 'http://www.x-services.nl')">link only</button>
<button onclick="window.plugins.socialsharing.share('Message and link', null, null, 'http://www.x-services.nl')">message and link</button>
<button onclick="window.plugins.socialsharing.share(null, null, 'https://www.google.nl/images/srpr/logo4w.png', null)">image only</button>
// Beware: passing a base64 file as 'data:' is not supported on Android 2.x: https://code.google.com/p/android/issues/detail?id=7901#c43
// Hint: when sharing a base64 encoded file on Android you can set the filename by passing it as the subject (second param)
<button onclick="window.plugins.socialsharing.share(null, 'Android filename', 'data:image/png;base64,R0lGODlhDAAMALMBAP8AAP///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAUKAAEALAAAAAAMAAwAQAQZMMhJK7iY4p3nlZ8XgmNlnibXdVqolmhcRQA7', null)">base64 image only</button>
// Hint: you can share multiple files by using an array as thirds param: ['file 1','file 2', ..], but beware of this Android Kitkat Facebook issue: [#164]
<button onclick="window.plugins.socialsharing.share('Message and image', null, 'https://www.google.nl/images/srpr/logo4w.png', null)">message and image</button>
<button onclick="window.plugins.socialsharing.share('Message, image and link', null, 'https://www.google.nl/images/srpr/logo4w.png', 'http://www.x-services.nl')">message, image and link</button>
<button onclick="window.plugins.socialsharing.share('Message, subject, image and link', 'The subject', 'https://www.google.nl/images/srpr/logo4w.png', 'http://www.x-services.nl')">message, subject, image and link</button>
Sharing directly to..
Facebook
<button onclick="window.plugins.socialsharing.shareViaFacebook('Message via Facebook', null /* img */, null /* url */, function() {console.log('share ok')}, function(errormsg){alert(errormsg)})">msg via Facebook (with errcallback)</button>
Twitter
<!-- unlike most apps Twitter doesn't like it when you use an array to pass multiple files as the second param -->
<button onclick="window.plugins.socialsharing.shareViaTwitter('Message via Twitter')">message via Twitter</button>
<button onclick="window.plugins.socialsharing.shareViaTwitter('Message and link via Twitter', null /* img */, 'http://www.x-services.nl')">msg and link via Twitter</button>
WhatsApp
Note that on iOS when sharing an image and text, only the image is shared - let's hope WhatsApp creates a proper iOS extension to fix this.
Before using this method you may want to use canShareVia('whatsapp'.. (see below).
<button onclick="window.plugins.socialsharing.shareViaWhatsApp('Message via WhatsApp', null /* img */, null /* url */, function() {console.log('share ok')}, function(errormsg){alert(errormsg)})">msg via WhatsApp (with errcallback)</button>
If you want to know more please check the link..Social Sharing
If the answer helps you please Vote up. Cheers
Try to test it not using phonegap, but rather create platform version (for example: android) and then run it in Android Studio via your phone. I tried simulator but didn't work there as there is no WhatsApp or other social app in the simulator, that is why it will show you nothing.
I have to display a MEAN.JS app within an iframe, so I started with a simple html file:
<iframe style="height: 100%; width: 100%;" src="http://localhost:3000/#!/workouts"></iframe>
But then the iframe content is empty, can please somebody help me?
Got it: My app is using Helmet (https://github.com/evilpacket/helmet) which setted a DENY in the X-Frame-Options. So, in my Express configuration I setted:
app.use(helmet.xframe('ALLOW-FROM', 'www.mydomain.com'));
And it worked
I would simply like have a link to a different page. But when I use:
<div style="position: absolute; top: 230px; width: 600px;
left: 250px; height: 120px">
<h2>
<a href='cgoogle.html'>
Sign in with your Google Account
</a>
</h2>
</div>
The link does nothing. I read that the solution is geturl, but I have no idea how to implement this. Does anyone have an example?
If what you want is open the link in the default browser (note that this may be not Chrome on the user's system), then add target="_blank" to your link:
<a href='cgoogle.html' target="_blank">
Sign in with your Google Account
</a>
However, it looks like what you're trying to do here is authenticate the user. The proper way to do that is to use the Chrome Identity API. You can read more on Chrome user authentication in general here (the API page also has this link).
If all that seems a little daunting, this app sample should get you off the ground.
Also note that "link does nothing" is not exactly true: it prints an error to the console, in addition mentioning the target="_blank" thingy. When you're developing Chrome apps, using the console is imperative (both the background page and foreground page ones) - it often provides very useful feedback on what's going on.