SkyCiv Add-ons


Build your own add-ons and apps directly on top of SkyCiv Structural 3D.

The SkyCiv Bill of Materials App is an example of a SkyCiv Addon

Getting Started#

To get started, simply open up SkyCiv Structural 3D. Then open your developer console by hitting CTRL+SHIFT+J (this may depend on your browser) and pasting the below code. This will install a sample app, you can continually copy and paste code into the Console

jQuery(document).ready(function () {
// put code in closure so it doesn't affect other things
// This puts the app into SKYCIV_APPS.newApp
new SKYCIV_APPS.create({
id: 'newApp', // must be unique
name: 'My Custom App',
width: '600px',
height: '600px',
icon_img: 'https://platform.skyciv.com/storage/images/logos/light/square-1.png',
icon_img_square: 'https://platform.skyciv.com/storage/images/logos/light/square-1.png',
draggable: true,
content: '<p>HEY</p>',
onInit: function () {
// this is called when the page loads the app
console.log('App has been initalised');
},
onFirstOpen: function () {
// this is called the first time the app is actually opened
},
});
// Can bind new functions to it
SKYCIV_APPS.newApp.myFun = function () {};
//initialize
SKYCIV_APPS.newApp.init();
});

Initialising Options#

KeyTypeDescription
idstringFile name of your model.
namestringPath in your cloud file storage.
contentstringHTML string of what should be displayed in the app.
widthstringOptional width setting for app window.
heightstringOptional height setting for app window.
icon_imgstringURL of image to be used.
icon_img_squarestringURL of image to be used within the app header.
draggableboolIs the app window draggable. True by default.
resizableboolCan user resize window? Used alongside resizeableFunction to update.
resizeableFunctionfunctionFunction which runs when the app window is resized.
help_urlstringURL of documentation or help page.
onInitfunctionFunction which runs when the page loads the app.
onFirstOpenfunctionRuns when the app is open for the first time.
onSoftwareUpdatefunctionFunction to run after changes are made to your model in S3D. E.g. Bill of Materials App re-calculates cost when a member is added/deleted.
beforeShowfunctionBefore the app is shown, run this function.
aferShowfunctionAfter the app is shown, run this function.
beforeHidefunctionBefore the app is hidden, run this function.
aferHidefunctionAfter the app is hidden, run this function.

Core Functions#

Once your app is initalized, you can call the following functions to make the most of your app. SKYCIV_APPS.create() will create the app and add it to SKYCIV_APPS as an object. You can then access all of the default and user defined functions for this app.

In the above example, we created an app. We now have access to the following functions from the console:

SKYCIV_APPS.newApp.show(); //shows the app window
SKYCIV_APPS.newApp.hide(); //hides the app window
SKYCIV_APPS.newApp.init(); //initialises the app. Must be run after creating the app
SKYCIV_APPS.newApp.getContainer(); //return the window as a jQuery element
SKYCIV_APPS.newApp.hasBeenOpened(); //returns true or false
SKYCIV_APPS.newApp.isOpen(); //returns true or false
SKYCIV_APPS.newApp.myFun(); //calling a custom function we wrote

What's next?#

Once you've built and tested your app, email us at [email protected] to learn more about getting this installed on our platform for internal or public use!