Add HyperLink With Word JavaScript API - javascript

I'm having difficulties to add an HyperLink to my Word Document using the Javascript API. I've look to Doc and I can't find any hints how to accomplish my duty...
Here is my Question: What is the best way to add an HyperLink inside a Word Document using the Javascript API.
And Here is what I tried:
Word.run((context: Word.RequestContext) => {
var range = context.document.getSelection();
context.load(range, "hyperlink");
return context.sync().then(() => {
range.font.highlightColor = '#FFFF00';
range.hyperlink = "C:\My Documents\MyFile.doc";
}).then(context.sync);
});
I've added the highlightColor just to have a visual that my changes are being sync. Everything seems fine but the Hyperlink property is not being updated. Am I missing something?
And If you guys are wondering what's this syntax, I'm using TypeScript.

Good, if you don't mind i will reply in JavaScript :)
Setting a hyperlink to a file must work (provided that the file exists :) ). I have this simplified example working successfully, btw you don't need to load the range for setting this.
Also hyperlinks is now supported as preview, so please make sure that you are running an updated (latest) version of Word (go file and install updates) and most importantly make sure you are using the preview CDN for Office.js which is here: https://appsforoffice.microsoft.com/lib/beta/hosted/office.js
Word.run(function(context) {
// Insert your code here. For example:
context.document.getSelection().hyperlink = "C:\My Documents\MyFile.doc";
return context.sync();
});

Related

LaunchDarkly Bootstrapping: (JS) Property Assignment Expected

I am setting up LaunchDarkly to control my first feature flag and its working fine from server & client side.
Now I am trying LaunchDarkly Bootstrap approach (From the below given Link) and tried like below my code, but it's not accepting the double braces and I do not know How to get flag value by using the bootstrap approach, so where I did go wrong in my code?. Could anyone please help me with an example?
Link,
https://docs.launchdarkly.com/docs/js-sdk-reference#section-bootstrapping
Initialized client with Bootstrap option as below,
client = LDClient.initialize(sdkKey, userContext.user, options = {
bootstrap: {
{{ ldclient.all_flags(userContext.user) }}
}
});
And my function to get the flag value,
isFeatureEnabled: function (featureFlag, properties) {
console.log("Before Variation");
//we shall update the custom properties into user context.
if (properties) {
for (var k in properties) {
userContext.user.custom[k] = properties[k];
}
}
//later make the identity call to update the user details.
client.identify(userContext.user, null, function () { /*rules updated*/
console.log("New user's flags available");
//validate the feature flag
var showFeature = client.variation(featureFlag);
if (!showFeature) {
window.in8.platform.showUnauthorized('');
}
console.log("after Variation");
});
}
Full disclosure, My name is John, and I am part of the support team here at LaunchDarkly. I'll be happy to help you out with this problem
Firstly, it appears you are using an older version of the bootstrapping example. The new example has a typo fix, and uses the new all_flags_state method.
I see two major issues here. There is the primary issue of how to bootstrap flag variations from the back-end to the front-end, and how to appropriately utilize LaunchDarkly when using bootstrapping. I will tackle the issue of how to bootstrap flag variations from the back-end first.
The example in LaunchDarkly's documentation utilizes templating to include the bootstrapped values to the front end. Templating is a strategy for including programmatically generated content in your static source or text files. Templating is commonly used when compiling or deploying code, or at runtime when serving content to clients. This is done to render information only available at that time in the final version.
Different templating languages behave in different ways, but generally speaking you include tokens in your source or text files which direct the template renderer to replace that token with data you supply it.
In the documentation it mentions that this example is for templating using Ruby, but the example is using Mustache rendering, and Mustache is available in many different languages. Templating is a strategy for including programmatically generated content in your static source or text files. This is commonly used when compiling or deploying code, or at runtime when serving content to clients. This is done to render information only available at that time in the final version.
The example may not work depending on which back-end language and framework you are using. According to the tags associated with your question, I feel safe to assume that you are using .NET to power your back-end, which doesn't have a prescribed templating language. There are many open source solutions out there, though.
In the following example I'm going to use https://github.com/rexm/Handlebars.Net to render the a users bootstrapped flag values into the result variable. I am going to borrow code available from the example in the handle bars repo, and from LaunchDarkly's hello-bootstrap and hello-dotnet repos, which are available here: https://github.com/launchdarkly/hello-bootstrap & https://github.com/launchdarkly/hello-dotnet
string source =
#"
<html>
<head>
<script src=""https://app.launchdarkly.com/snippet/ldclient.min.js""></script>
<script>
window.ldBootstrap={{ldBootstrap}};
window.ldClientsideId=""{{ldClientsideId}}"";
window.ldUser={{ldUser}};
</script>
</head>
<body>
<h1>LaunchDarkly server-side bootstrap example</h1>
<ul>
<li><code>normal client</code>: <span class=""normal"">initializing…</span></li>
<li><code>bootstrapped client</code>: <span class=""bootstrap"">initializing…</span></li>
</ul>
<script>
var user = window.ldUser;
console.log(`Clients initialized`);
var client = LDClient.initialize(window.ldClientsideId, user);
var bootstrapClient = LDClient.initialize(window.ldClientsideId, user, {
bootstrap: window.ldBootstrap
});
client.on('ready', handleUpdateNormalClient);
client.on('change', handleUpdateNormalClient);
bootstrapClient.on('ready', handleUpdateBootstrapClient);
bootstrapClient.on('change', handleUpdateBootstrapClient);
function handleUpdateNormalClient(){
console.log(`Normal SDK updated`);
render('.normal', client);
}
function handleUpdateBootstrapClient(){
console.log(`Bootstrapped SDK updated`);
render('.bootstrap', bootstrapClient);
}
function render(selector, targetClient) {
document.querySelector(selector).innerHTML = JSON.stringify(targetClient.allFlags(user), null, 2);
}
</script>
</body>
</html>";
var template = Handlebars.Compile(source);
Configuration ldConfig = LaunchDarkly.Client.Configuration.Default("YOUR_SDK_KEY");
LdClient client = new LdClient(ldConfig);
User user = User.WithKey("bob#example.com")
.AndFirstName("Bob")
.AndLastName("Loblaw")
.AndCustomAttribute("groups", "beta_testers");
var data = new {
ldBootstrap: JsonConvert.SerializeObject(client.AllFlagsState(user)),
ldUser = JsonConvert.SerializeObject(user),
ldClientsideId = "YOUR_CLIENT_SIDE_ID"
};
var result = template(data);
You could take this example and adapt it to render your static source code when serving the page to your users.
The second issue is how you are utilizing the SDK. I see that you are calling identify before evaluating your user every time. Each time you call identify the SDK needs to reinitialize. This means that even after bootstrapping your initial variations you will force the SDK to reinitialize by calling identify, removing all benefits of bootstrapping. As a solution, detect if your user object has changed. if it has, then call identify. Otherwise, do not call identify so that the SDK uses the cached user attributes.
If you want to dive deeper into this and provide us with some more of the source for your wrapper you can reach out to us at support#launchdarkly.com

PreloadJS cannot find audio

I'm working on hobby project. I'm using createjs. But, of course, I have a problem. Since I update the code to use Preloadjs, the browser can no longer find the audio files. Here is my loading code:
function load (canvasToShowProgress) {
canvas = canvasToShowProgress;
loadingStage = new createjs.Stage();
loadQueue = new createjs.LoadQueue(true);
progessText = new createjs.Text("Loading... 0%");
loadingStage.addChild(loadingStage);
loadingStage.update();
//start loading
loadQueue.installPlugin(createjs.Sound);
loadQueue.setMaxConnections(4); // Allow 4 concurrent loads
loadQueue.loadManifest("configuration/GameAssets.json");
loadQueue.on("progress", handleProgress);
loadQueue.on("complete",handleComplete);
}
My manifest GameAssets.json looks like this:
{"manifest":
[ {"src":"images/game/street.png", "id":"street"},
{"id":"Default", "src":"sounds/game/background.ogg"},
{"id":"Psychic", "src":"sounds/game/ps.ogg"},
{"id":"Nitro", "src":"sounds/game/ntr.ogg"}
]
}
By the way, the image is loaded perfectly. In the music player class, I call the audio by simply doing soundInstance = createjs.Sound.play(soundIds[currentPlayIndex]);. (The soundIds is temporary a hardcoded array with the ids. Where is my mistake?
First, I just want to confirm you are using the latest 0.6.0 releases of both SoundJS and PreloadJS (they need to be used together).
Currently only Firefox and Chrome support Ogg, so if you are using another browser you would need to provide and alternate format (mp3 is currently the most broadly supported) and set it up using SoundJS.alternateExtensions.
If you are still having loading errors, you'd likely need to dig into the errors a little more to determine the cause.
Hope that helps.
Your soundIds array declare like this
var soundIds=["Default","Psychic","Nitro"]
then call it like that
createjs.Sound.play(soundIds[0]);

AngularJS + HTML5 record audio file

I'm looking for a simple solution to record audio file and upload it to s3.
My web searches come up to find:
WebRTC-Experiment which is the most popuplar solution i could find.
it also have a working example in the following link : https://www.webrtc-experiment.com/RecordRTC/
I also found ngCamRecorder which wasn't supported by firefox yet.
I'm looking for a simple solution + working example, and suggestion.
Which solution is most popuplar to use with AngularJS?
if you can provide your own example or link to a working example that i can use.
if you also used S3 i would like to know how you can push the file to S3, and get the link to the controller.
The solution i found, throw error, and include a working example without the code itself explained.
I also would like to know how to push it to s3.
This is the code i implemented from the example:
$scope.start_recording = function()
{
navigator.getUserMedia(session, function (mediaStream) {
window.recordRTC = RecordRTC(MediaStream);
recordRTC.startRecording();
}, function(error){console.log(error)});
};
$scope.stop_recording = function()
{
navigator.getUserMedia({audio: true}, function(mediaStream) {
window.recordRTC = RecordRTC(MediaStream);
recordRTC.startRecording();
});
};
It simply throw an error: undefined is not a function on recordrtc.js line 641
if(!mediaStream.getAudioTracks().length) throw 'Your stream has no audio tracks.';
obviously mediaStrem is null.
Thanks.
There's an AngularJS wrapper for this, it's a simple directive that supports HTML5 (RecorderJS), Cordova Media and Flash.
Usage is straightforward
<ng-audio-recorder audio-model="someModel" auto-start="false">
<!-- controls -->
<button ng-click='recorder.startRecording()'>Start</button>
<button ng-click='recorder.stopRecording()'>Stop</button>
</ng-audio-recorder>
You can see the full usage here:
https://github.com/logbon72/angular-recorder
I got the same issue and figured it out. The function argument in the success function of navigation.getUserMedia() is supposed to be "MediaStream" instead of "mediaStream".

How to completely read a site that contains javascript from an android service?

I'm trying to read a node from a website that contains java script.
In VB .NET I just use the following code:
Dim listSpan As IHTMLElementCollection = bodyel.getElementsByTagName("span")
For Each spanItem As IHTMLElement In listSpan
If spanItem.className & "" = "span_name" Then
If Not spanItem.innerText Is Nothing Then
str_result = spanItem.innerText.ToString
Console.WriteLine("Found it: " & str_result)
Else
str_result = "NO"
Console.WriteLine("Not Found")
Console.Beep(500, 500)
End If
End If
Next
But I just can't find a way to convert this code to work in Android service. (Java).
I tried Jsoup but Jsoup is only reading the "view source code" elements and not the javascript results as html.
try {
Document doc = Jsoup.connect(str_link).get();
Elements links = doc.select("span_name");
for(Element link : links) {
String result = link.text();
Log.d("TMA Service","result: " + result);
list.add(title);
}
I mean. This code in VB can find everything. (just like if I right click in an element using google chrome and select "Inspect Element". This shows everything and I'd like to know how to get this data with Android.
CAN SOME ONE GIVE ME AN EXAMPLE?
Thanks.
Unfortunately you can't handle Javascript and dynamic content with Jsoup. Please see my answer here for more information and some examples of Java libraries, that may help you here.
Edit:
HtmlUnit - Getting started (section Getting started)
HtmlUnit: A Simple Example: Check Yahoo Email
How to use HtmlUnit in Java?
HtmlUnit: A Quick Introduction
HtmlUnit – A quick introduction
Getting started with HtmlUnit

How do I load an external file and make sure that it runs first in JSFiddle?

I have a JsFiddle here, and added Microsoft AJAX to be loaded through external JS/resource section. How can I tell whether or not my JS code is run after the AJAX file has finished loading?
Seems that the AJAX does not load either. :(
Here is the code in the JSFiddle:
Type.registerNamespace("Tutorial.Chapter1");
Tutorial.Chapter1.Person = function(firstName, lastName) {
this._firstName = firstName;
this._lastName = lastName;
};
Tutorial.Chapter1.Person.prototype = {
set_firstName: function(value) {
this._firstName = value;
},
get_firstName: function() {
return this._firstName;
},
set_lastName: function(value) {
this._lastName = value;
},
get_lastName: function() {
return this._lastName;
},
_firstName: "",
_lastName: "",
displayName: function() {
alert("Hi! " + this._firstName + " " + this._lastName);
}
};
Tutorial.Chapter1.Person.registerClass("Tutorial.Chapter1.Person", null);
The External Resources tab of jsFiddle is currently somewhat tricky and unstable to use.
The resources defined here are often not correctly included into the code. There seems to be an issue with the automatic recognition of JS and CSS resources. If this happens, the external resource is simply not added to the head section of the resulting code. You can check that by reviewing the source code of the Result frame of your jsFiddle. You will find that your MS AJAX resource is simply NOT mentioned in the resulting HTML code.
The correct recognition can actually be forced by adding a dummy value to the resource's URL like this (see –>jsFiddle docs for more info):
...&dummy=.js
Here is an example that shows how to add the external Google Maps API resource to a jsFiddle (mind the dummy parameter at the very end!):
https://maps.googleapis.com/maps/api/js?sensor=false&dummy=.js
Unfortunately this won't work for you as the MS AJAX URL will fail when additional parameters are appended.
A solution (and currently the safest way to load external resources) is to avoid the External Resources tab altogether and load external code manually in the first line(s) of jsFiddle's HTML window like this:
<script type='text/javascript' src="http://ajax.aspnetcdn.com/ajax/3.5/MicrosoftAjax.js"></script>
Here is your jsFiddle modified to use that method: http://jsfiddle.net/rEzW5/12/
It actually does not do a lot (I did not check what is wrong with the rest of your code), but at least it does not throw JavaScript errors anymore.
Open "Add Resources" section and add the url of your external script...
#Jpsy's approach no longer seems to work (see my comment under his answer).
For me, adding the resource under External Resources also didn't work. (According to the Firefox Debugger, it couldn't find the resource).
The only way I was able to get an external bit of JavaScript code (in my case jquery.backstretch.js) to work, was to use Google to find a Fiddle which used this resource (and worked), then Fork this Fiddle and copy/paste all my code into the HTML, CSS and JavaScript panels. Ugh!
#clayRay, You absolutely went thru a code surgery. Just resolved that by mentioning external source in plain html which in my case is
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
Using External Resources tab didn't help a bit...

Categories

Resources