I need to embed an already running AnyLogic model simulation in my web app.
The official documentation describes how to embed a model into the web app using the iframe tag, specifying the modelId as a query parameter:
<iframe width="1000" height="650" allow="fullscreen"
src="https://cloud.anylogic.com/assets/embed?modelId=7d49a08e-2641-42a9-bf0a-11b2dffe1408"
></iframe>
Is there any way to also specify the experimentRunId so that I can get the real-time animation of an already running simulation?
I tried using query parameters like runId, experimentRunId and experimentId (which are similar to the key returned by the Animation API when you start the model, link here) but none of them works.
The run ID is taken from the Animation SVG Run info which is a JSON structure like this one:
{
"animationHeight": 600,
"animationSpeed": 10,
"animationWidth": 1000,
"experimentRunId": "fbc6a1d8-fa08-4a5c-a171-4631657c1aa7",
"modelUuid": "493e6789-acf7-4dac-971d-325cb508ea39",
"restUrl": "b0cc221b-8217-474b-af18-c2d07753187b/",
"sessionUuid": "b0cc221b-8217-474b-af18-c2d07753187b",
"version": "8.5.0"
}
Any help would be greatly appreciated!
Try to use Cloud API, where this is possible to use different client class methods. Custom User Interface built for a Cloud-based AnyLogic Model tutorial may be helpful as well.
Related
Looking into using Google Cloud Print, it seems that it is quite complicated regarding OAuth2, the various tokens/client ids etc.
What is the simplest possible way to print a PDF from a web page?
Implemented client side in Javascript with AJAX (so with CORS) or server side with Java (but preferrably not too many jars needed)
PDF document can be sent as binary or referred to as publicly available URL
Preferrably no user login, must be with some kind of "service" authorization
The same application is already using API keys for google maps geocoding. So re-using these keys, if possible, would be the ideal option.
It would be great with some pointers on how to do this in the simplest possible manner possible.
The simplest possible scenario is using the GCP Web Element, as described in: https://developers.google.com/cloud-print/docs/gadget
It boils down to including the print gadget scripts, creating a container to host the button and creating the print gadget in it:
<html>
<head>
</head>
<body>
<div id="print_button_container"></div>
<script src="https://www.google.com/cloudprint/client/cpgadget.js">
</script>
<script>
window.onload = function() {
var gadget = new cloudprint.Gadget();
gadget.setPrintButton(
cloudprint.Gadget.createDefaultPrintButton("print_button_container")); // div id to contain the button
gadget.setPrintDocument("url", "Test Page", "https://www.google.com/landing/cloudprint/testpage.pdf");
}
</script>
</body>
</html>
If you are not logged-in your GCP account you will be shown the appropriate log-in dialog and then you'll select the target printer.
Check the fiddle here:
https://jsfiddle.net/0ncsuqra/
I have a web application and I have embedded a video player. It turns out that the video player is Kaltura. I was able to successfully make it autoplay due to the flashvars property. However, I want it to auto-fullscreen when it starts to play.
With this requirement, I searched and found that Kaltura has a Javascript API. I also found certain codes that will help me in this requirement.
kWidget.addReadyCallback(function( playerId ){
var kdp = document.getElementById(playerId);
kdp.kBind("doPlay", function(){
kdp.sendNotification('openFullScreen');
});
kdp.kBind("doPause", function(){
kdp.sendNotification('closeFullScreen');
});
kdp.kBind("openFullScreen", function(){
$("#fslog").append("openFullScreen\n");
});
kdp.kBind("closeFullScreen", function(){
$("#fslog").append("closeFullScreen\n");
});
});
When I read the documentation regarding the API, it has a kWidget which is apparently part of the API. However, I cannot find this API or the js file for this.
Furthermore, I am not using just the player, I just have an embedded Kaltura player from an internal company site.
The src is: https://internalsite.company.com/embed/secure/iframe/entryId/videoid/uiConfId/integers?(string of flashvars)
Now, I cannot understand how am I suppose to integrate this if I can't find the relevant js files for the Kaltura player. If someone can help me just to start out on integrating Kaltura (like a simple code or a link to the tutorial) it would really help.
If you must embed via an iframe with src set to https://internalsite.company.com/embed/secure/iframe/..., then you probably won't be able to access player's JS API. This is a MediaSpace endpoint for internal embeds (protected via SSO).
You can try requesting a different player uiConfId ID from the company that provided you with this endpoint, that will have the full screen support build in.
I am working on a project, and a key point of it, is to display links as embeded content. After looking around I found iframely.
One of their methods is to use embed.js, like this:
iframely.load(containerElement, 'http://yoururl.here');
or like this:
<a href="http://yoururl.here" data-iframely-url>yoururl.here</a>
Doing both like this, I get a "Preview not available. No embeds API Access" error.
Here is a jsfiddle of the code
You will need an iframely API-Key.
See API Documentation
Get an API-Key here
I am trying to stream a song using SoundCloud api, but apprantly it does not play it in Chrome. However it works on other browsers.
SC.initialize({
client_id: '65243ec784b284f1d8a8f950312240fa',
redirect_uri: 'http://example.com/callback'
});
SC.stream('/tracks/293').then(function(player) {
player.play();
});
JSFIDDLE
Any idea to make it working in Chrome?
see my solution on the open Github issue (code pasted below for convenience).
If you use SoundManager2, then call setup when the dom is ready.
Rather than using the stream function of the SoundCloud api, call SC.get and then create a soundobject in SoundManager using createSound(), passing in the stream_url from the track that you just grabbed.
SC.get('/users/711016/tracks').then(function(tracks) {
var sound = soundManager.createSound({
id: 'mySound',
url: tracks[0].stream_url + "?client_id=YOUR_CLIENT_ID",
stream: true
});
sound.play();
});
I imagine the api route to the track(s) you are trying to play may be different than mine.
This is a known compatibility issue due to Chrome's version of Flash. There is little you can do besides disable Flash or play with the different versions of the SDK to see which one works for your specific build of Chrome.
As JAL said, this is unfortunately known and there doesn't seem to be a fix out there.
Instead what I would suggest doing is using their widget API to create a custom iFrame (you can make it invisible if you want), and then use the .load() method to load whichever track, or tracks you want. You can read about that here.
The widget API is really nice because it comes with a bunch of event listeners that are very helpful, depending on what you're doing.
On my website, a user enters their Twitter username when they register and their timeline is embedded on their profile page. Until now, I've achieved this with the following JavaScript code:
<script type="text/javascript">
var twitterUsername = // read from database
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 4,
interval: 30000,
width: 'auto',
height: 210,
features: {
scrollbar: true,
loop: false,
live: false,
behavior: 'all'
}
}).render().setUser(twitterUsername).start();
</script>
Recently I noticed the following messages appearing in the JavaScript console
TWITTER WIDGET: This widget is being deprecated, and will cease functioning soon. https://twitter.com/support/status/307211042121973760
TWITTER WIDGET: You can obtain a new, upgraded widget from https://twitter.com/settings/widgets/new/user?screen_name=electricpicnic
It seems that instead of using this widget I should use an embedded timeline. However, the docs seem to suggest that in order to embed a timeline in a page, you need to go to the widgets section of your settings page and setup a widget for each user whose timeline you wish to embed. Twitter gives you the code that will embed this timeline in your page, but this code contains an attribute data-widget-id="275025608696795138" which has a different value for each user.
Obviously this approach won't work for me, because it's not feasible for me to setup a widget for all my users (present and future) and store a data-widget-id for each of them. Is there some non-deprecated way that I can embed timelines, which allows me to provide the Twitter username at runtime?
Update
According to this post in the Twitter dev discussion group, this functionality is not available currently, but will be provided in a future version.
Twitter is deprecating their unauthenticated widgets. You will no longer be able to use those.
But Twitter has an API that you can call, and you can generate your own custom tweet timeline UI without having to use their widget. For an example of the UI, see http://tweet.seaofclouds.com/.
But you also have to know that you just can't call their API directly from Javascript, since their API has OAuth. You can call their API only from server-side code (I don't know what you're using now, PHP/Ruby/Python/Java?). Good news is, OAuth is an open standard and you can call their API using any language. Here is an example of the same widget, but it gets data by calling the API using PHP. This is a long term solution.
If the Twitter timeline is essential for your site - then you have to go the API way. You must register your site with Twitter, and then use OAuth to get a user's timeline data, and use that data to render the javascript widget.
With the new Twitter widgets, just create an authenticated twitter widget from your own account (e.g. YourName).
Then set the data-screen-name of the user (e.g. 'twitterUsername') you want to show and you end up with something like this:
<a class='twitter-timeline' href='https://twitter.com/YourName'
data-widget-id='your-widget-id'
data-screen-name='twitterUsername'>Tweets by #twitterUsername</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s) [0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document,'script','twitter-wjs');</script>
Here is a bit of javascript that you can use to embed a user's timeline in a webpage
Add the script https://www.tweetjs.com/tweetjs.js
Then add the code:
TweetJs.ListTweetsOnUserTimeline("PetrucciMusic",
function (tweets) {
for(var i in tweets)
{
document.write(tweets[i].text + "<br>");
}
});
... Although I'd recommend using better styling than that :)
This is how I use it, feels pretty decent.
HTML:
<ul id="twitter_update_list">
</ul>
Script:
<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script>
<script type="text/javascript" src="https://api.twitter.com/1/statuses/user_timeline.json?screen_name=theunexpected1&callback=twitterCallback2&count=10"></script>
Notice the "screen_name" variable sent out to the script.
You can customize your callback function (blogger.js), also you can save this file locally to avoid external request.
Hope this is useful.
For reference, I have created a jsfiddle here, you can take the CSS snippets too from there.
http://jsfiddle.net/rahulsv/8fRTD/
UPDATE:
This solution no longer works since Twitter updated to v1.2 - no unauthorized access to tweets.