|
|
metadata
1. Download https://github.com/kongregate/webgl-preloader
and
https://drive.google.com/file/d/11HRoZOx9c_l6-r46B1lvPRC75WQsGBxI/view?usp=sharing
2. Create WebGLTemplates folder under Assets in Unity.
3. Extract the preloader and drag the folder called Kong Preloader into the WebGLTemplates folder in Unity.
4. Create another folder called Plugins under Assets in Unity.
5. Drag the .jslib file into the Plugins folder in Unity.
6. Create a Game object in Unity called KongregateAPI and attach script KongregateAPIController to it.
7. Use SubmitScore script to submit stats.
Remember to change the Statistic name in the SubmitScore Script to whatever you want.
And make sure you use that name exactly when creating the statistic on Kongregate.
8. When Building, use the Kongregate Template.
9. Go to where you built the game.
10. Drag the Template Folder into the build folder.
11. Open index.html
change
background-image: url("Template/anthill.png");
to
background-image: url("Build/Template/anthill.png");
12. Upload on Kongregate as usual.
Let me know if I need to clarify anything. Message here or Private Message me.
Thanks say892 for helping me figure it out, as well as anyone else who contributed.
|
|
|
|
|
metadata
its is possible to add Get username?
|
|
|
|
|
metadata
Note: I haven't tested this, but this should mostly work still:
If you add this function to the KongregateAPIController file (or whatever file you init the API from), it should get all of the information you need:
> public void OnKongregateAPILoaded(string userInfoString) {
var info = userInfoString.Split('|');
var userId = System.Convert.ToInt32(info[0]);
var username = info[1];
var gameAuthToken = info[2];
Debug.Log("Kongregate User Info: " + username + ", userId: " + userId);
}
Explanation: The .jslib is already set up to run a callback function once the API is loaded (in this case its OnKongregateAPILoaded) and that returns a string with a lot of user information separated by the "|" character. You'll want to turn those variables into non-local variables so that you can use them in other places, but you get the general idea.
If the above doesn't work, let me know.
|
|
|
|
|
metadata
Has anyone tried this with Unity 2018.3 I have tried this method and "Super API Kongregate" from the asset store but The Kongregate API does not seem to load. My Callback is never called and if after waiting 5 minutes I try to submit a score I get and error and console says kongregate does not exist. I trying it from preview right after uploading my game. The game runs fine just no kongregate API.
|
|
|
|
|
metadata
> *Originally posted by **[AntHillPlan](/forums/1021798/topics/1673115?page=1#12997644)**:*
> Has anyone tried this with Unity 2018.3 I have tried this method and "Super API Kongregate" from the asset store but The Kongregate API does not seem to load. My Callback is never called and if after waiting 5 minutes I try to submit a score I get and error and console says kongregate does not exist. I trying it from preview right after uploading my game. The game runs fine just no kongregate API.
If it really does say "kongregate" doesn't exist, then that probably means your main .html file isn't set up correctly (which exists outside of Unity).
This is the kongregate_shell.html I use for the "game file" on upload:
> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
> <html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
> <head>
> <title>Kongregate Game Shell</title>
> <script type="text/javascript" src="https://www.kongregate.com/javascripts/kongregate_api.js"></script>
> <style type="text/css">
> html{border: none; overflow: hidden; background-color: #333; height: 100%;}
> body{border: none; background-color: #333;margin:0; padding:0;}
> </style>
> </head>
> <body>
> <script type="text/javascript">
> function onLoadCompleted(){
> kongregate = kongregateAPI.getAPI();
> var params = "kongregate_user_id=" + kongregate.services.getUserId() +
> "&kongregate_game_auth_token=" + kongregate.services.getGameAuthToken() +
> "&random=" + (Math.random() * 1000000000);
> kongregateAPI.embedFrame("index.html?" + params);
> }
> kongregateAPI.loadAPI(onLoadCompleted);
> </script>
> <!-- The div that the game will be placed into. Make sure to set the width and height properly -->
> <div id="contentdiv" style="top:0px; left:0px; width:820px; height:628px; borders:none;">
> </div>
> </body>
></html>
Formatting isn't great, but the key takeaway is the line that says "kongregate = kongregateAPI.getAPI()" that's what the .jslib function is using to submit stats.
You're free to use the above script (It used to exist on the docs somewhere but those seem to change every few months anyway...) for your own games. Just be sure to manually change the width and height of the game at the bottom.
|
|
|
|
|
metadata
Thanks for your quick reply. I have been using "kongregateUnitySupport.initAPI" as recomended by Kongregate docs ( although it uses an obsolete Unity call, so will stop working in a future version of Unity). I found different version of Kongregate docs (works https://docs.kongregate.com/docs/unity-api ) than I had been using before (problems https://www.kongregate.com/developer_center/docs/en/using-the-api-with-unity3d) and the code examples on that page seem to be working for me.
|
|
|
|
|
metadata
Just wanted to say a big thanks for writing this guide! I had the Super API asset but it didn't work, so I followed your guide and it all works perfectly. Though I don't understand every detail, I think I can extend it, which is a lot better than using an asset. So thanks again!
|
|
|
|
|
metadata
I just cant get it to work. The last error now is the "kongregate" is not defined, and I have tried just about everything that is written on the forums and in the documentation.
It just dont work ... :-/
|
|
|
|
|
metadata
I finally got it to work.
I leaved the Template and Buildfile at the same level in the directory and zipped them together to a file called Build.zip
This is the solution for the Gamefile (index.html)n that got through without errors:
```
<!doctype html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | Lander</title>
<style>
* {
margin: 0;
padding: 0;
}
body {
overflow: hidden;
}
#gameContainer canvas {
display:block;
}
div#webgl-content {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
div#loadingBox {
width: 100%;
height: 0px;
position: absolute;
top: 50%;
margin-top: 137px;
text-align: center;
}
div#icon {
width: 300px;
height: 310px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -185px;
margin-left: -150px;
background-image: url("Template/anthill.png");
background-repeat: no-repeat;
box-shadow: 1px 1px 5px #141414;
}
div#box {
width: 328px;
height: 367px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -199px;
margin-left: -164px;
background: #222;
box-shadow: 1px 1px 5px #000;
}
div#bgBar {
display: none;
position: absolute;
width: 300px;
margin-left: -150px;
left: 50%;
height: 18px;
background-color: #882121;
box-shadow: 1px 1px 5px #111;
}
div#progressBar {
display: none;
left: 50%;
position: absolute;
margin-left: -150px;
width: 0px;
height: 18px;
background-color: #dc4241;
}
p#loadingInfo {
color: #fff;
letter-spacing: 1px;
position: absolute;
width: 100%;
font-family: sans-serif;
text-align: center;
top: 50%;
font-size: 11px;
font-weight: 500;
margin-top: 140px;
text-shadow: 0px 0px 5px #000;
}
div#spinner {
position: absolute;
height: 18px;
left: 50%;
margin-left: -150px;
width: 300px;
position: relative;
overflow: hidden;
background-color: #882121;
box-shadow: 1px 1px 5px #111;
}
div#spinner:before {
display: block;
position: absolute;
content: "";
width: 150%;
margin-left: -10px;
height: 10px;
background-color: #e85352;
transform: rotate(-5deg);
animation: loading 1s linear infinite;
}
@keyframes loading {
from {
top: -185%
}
to {
top: 225%
}
}
</style>
<script src='https://cdn1.kongregate.com/javascripts/kongregate_api.js'>
</script>
<script src="Build/UnityLoader.js"></script>
<script>
function UnityProgress(gameInstance, progress) {
var container = document.getElementById("gameContainer");
if (container) document.body.style.background = container.style.background;
if (!gameInstance.Module) {
return;
} else if (progress === "complete") {
document.getElementById("loadingBox").style.display = "none";
document.getElementById("icon").style.display = "none";
document.getElementById("loadingInfo").style.display = "none";
document.getElementById("box").style.display = "none";
} else if (progress === 1 || progress === "preinit") {
document.getElementById("loadingInfo").innerHTML = "PROCESSING...";
document.getElementById("spinner").style.display = "inherit";
document.getElementById("bgBar").style.display = "none";
document.getElementById("progressBar").style.display = "none";
} else if (progress > 0) {
document.getElementById("progressBar").style.width = 300 * progress + "px"
document.getElementById("loadingInfo").innerHTML = Math.round(progress * 100) + "%";
document.getElementById("spinner").style.display = "none";
document.getElementById("bgBar").style.display = "block";
document.getElementById("progressBar").style.display = "inherit";
}
}
var gameInstance = UnityLoader.instantiate("gameContainer", "Build/LanderKongWebGLBuild.json", {
onProgress: UnityProgress,
Module: {
onRuntimeInitialized: function() { UnityProgress(gameInstance, "complete"); },
preInit: [function() { UnityProgress(gameInstance, "preinit"); }]
}
});
</script>
</head>
<body>
<div id="webgl-content" style="width:100%; height: 100%">
<div id="gameContainer" style="width: 100%; height: 100%"></div>
</div>
<div id="box"></div>
<div id="loadingBox">
<div id="spinner"></div>
<div id="bgBar"></div>
<div id="progressBar"></div>
</div>
<a target="_blank" href="http://www.kongregate.com"> <div id="icon"></div> </a>
<p id="loadingInfo"></p>
<script type="text/javascript">
function onLoadCompleted(){
kongregate = kongregateAPI.getAPI();
var params = "kongregate_user_id=" + kongregate.services.getUserId() +
"&kongregate_game_auth_token=" + kongregate.services.getGameAuthToken() +
"&random=" + (Math.random() * 1000000000);
//kongregateAPI.embedFrame("index.html?" + params);
}
kongregateAPI.loadAPI(onLoadCompleted);
</script>
<!-- The div that the game will be placed into. Make sure to set the width and height properly -->
<div id="contentdiv" style="top:0px; left:0px; width:1024px; height:768px; borders:none;">
</div>
</body>
</html>
```
|
|
|
|
|
metadata
> The last error now is the "kongregate" is not defined
I run into the same problem, if you find a solution please post it here
|
|
|
|
|
metadata
Looks like the webGL template on Github doesn't have the OnLoadCompleted callback defined. You may be able to add it through Unity itself, but you can update your index.html to match what Kjelle69 posted above (it was hidden, sorry!)
If you just want to add what you need though, this is all that's different: (add it to the end of your file, but before the end </body> tag)
> <script type="text/javascript">
> function onLoadCompleted(){
> kongregate = kongregateAPI.getAPI();
> var params = "kongregate_user_id=" + kongregate.services.getUserId() +
> "&kongregate_game_auth_token=" + kongregate.services.getGameAuthToken() +
> "&random=" + (Math.random() * 1000000000);
> }
> kongregateAPI.loadAPI(onLoadCompleted);
> </script>
>
> <!-- The div that the game will be placed into. Make sure to set the width and height properly -->
> <div id="contentdiv" style="top:0px; left:0px; width:1024px; height:768px; borders:none;">
> </div>
It's odd that the contentdiv wasn't there either, but this definitly worked at some point... The main problem you're all seeing though was kongregate was never defined in that OnLoad correctly and now it should work after this callback is added.
|
|
|
|
|
metadata
I will try it when I got time, thanks! hope it works, I will update later
edit: omg it worked! thank you so much say892! however I didn't need the contentdiv part.
|
|
|
|
|
metadata
I can now submit stats with the syntax ´´´SubmitKongStat("HighScore", GlobalData.GlobalDataCarrier.HighScore);´´´
but how do I *read* stats into the Unity game?
|
|
|
|
|
metadata
> *Originally posted by **[Kjelle69](/forums/1021798/topics/1673115?page=1#13195904)**:*
> but how do I *read* stats into the Unity game?
Since those stats are coming from the game itself, you shouldn't really need to have a Stats->Unity relationship. You can just save those stats to the users local storage using PlayerPrefs or something.
If you're really determined to having this though, you *could* try using this: https://docs.kongregate.com/reference#server-api-friends-high-scores. I think since everyone will show up on their own friends highscores list, you could try to use this server API call to get the users stats. See my first post in this thread to see how to easily get the current user ID. I should say, if the user has more than 100 friends (I think), and they aren't the highest of their friends then their name won't appear in that call due to how Kongregate limits the high score lists. So there's no gurantee this will work, which is why you should just try to save them locally as you're submitting, or look into some cloud server saving system.
|
|
|
|
|
metadata
My thought was just to read in the highest score on Kongregate and present it in the game.
|
|
|
|
|
metadata
"When you're uploading, add the ZIP folder containing Build and TemplateData as Additional Files. For Game File, choose index.html. " (Quoting something I read that helped me)
|
|
|
|
|
metadata
The SubmitScore.cs
```
using UnityEngine;
using System.Runtime.InteropServices;
public class SubmitScore : MonoBehaviour {
[DllImport("__Internal")]
private static extern void SubmitKongStat(string StatName, int StatValue);
public int LevelsBeat = 1;
// use this to submit
//Change YOURSTATNAME, to the statistic you wish to use, and LevelsBeat to the value
SubmitKongStat("YOURSTATNAME", LevelsBeat);
}
```
Gives the errors:
```
SubmitScore.cs(16,20): error CS1001: Identifier expected
SubmitScore.cs(16,34): error CS1031: Type expected
SubmitScore.cs(16,34): error CS1001: Identifier expected
SubmitScore.cs(16,46): error CS1001: Identifier expected
```
|
 "henil"){kind=small}
 "MrUnecht"){kind=small}
 "say892"){kind=small}
 "AntHillPlan"){kind=small}
 "BambooHutGames"){kind=small}
 "Kjelle69"){kind=small}
 "Svartskogen"){kind=small}
 "ClearlineGames"){kind=avatar}
 "Armore"){kind=small}