zuzannamj

<script>
    function showSpinner() {
        $spinner = document.getElementsByClassName("slds-spinner_container")[0];
        $spinner.style.display = "block";
    }
    function hideSpinner() {
        $spinner.style.display = "none";
    }
    
    ...

zuzannamj

<script>
    function showSpinner() {
        $spinner = document.getElementsByClassName("slds-spinner_container")[0];
        $spinner.style.display = "block";
        setTimeout(() => {
            $spinner.style.display = "none";
        }, 5000);
    }
</script>

zuzannamj

<button onClick="showSpinner()">Try me!</button>
<div class="slds-spinner_container">
    <div role="status" class="slds-spinner slds-spinner_large"><span class="slds-assistive-text"></span>
        <div class="slds-spinner__dot-a"></div>
        <div class="slds-spinner__dot-b"></div>
    </div>
</div>

zuzannamj

<script>
    function showSpinner() {
        $spinner = document.getElementsByClassName("slds-spinner_container")[0];
        $spinner.style.display = "block";
    }
</script>

zuzannamj

.slds-spinner_container{position:absolute;top:0;right:0;bottom:0;left:0;z-index:9050;background-color:hsla(0,0%,100%,.75);visibility:visible;opacity:1;transition:opacity .2s ease,visibility 0;transition-delay:0s,.3s;display:none}
.slds-spinner{position:absolute;top:50%;left:50%;z-index:9051;transform:translate(-50%,-50%) rotate(90deg)}
.slds-spinner,.slds-spinner__dot-a,.slds-spinner__dot-b{transform-origin:50% 50%;will-change:transform}
.slds-spinner__dot-a,.slds-spinner__dot-b{position:absolute;top:0;left:0;width:100%}
.slds-spinner:after,.slds-spinner:before,.slds-spinner__dot-a:after,.slds-spinner__dot-a:before,.slds-spinner__dot-b:after,.slds-spinner__dot-b:before{content:"";position:absolute;background:#b0adab;border-radius:50%;animation-duration:1s;animation-iteration-count:infinite;transform:translateZ(0)}
.slds-spinner__dot-a{transform:rotate(60deg)}
.slds-spinner__dot-b{transform:rotate(120deg)}
.slds-spinner:before{animation-delay:-.083s}
.slds-spinner__dot-a:before{animation-delay:.083s}
.slds-spi

zuzannamj

var createAsset = HTTP.Post(requestUrl, contentType, Stringify(jsonBody), headerNames, headerValues);
//stringify response
var respo = createAsset.Response.toString();
//parse JSON
var res = Platform.Function.ParseJSON(respo);
//get the image url
var imgURL = res.fileProperties.publishedURL;
//initiate your data extension      
var myDE = DataExtension.Init("{{external key of the data extension}}");
//add a new row with url to a data extensions 

zuzannamj

{
   "id":xxx,
   "customerKey":"xxx",
   "objectID":"xxx",
   "assetType":{
      "id":23,
      "name":"jpg",
      "displayName":"Image"
   },
   "fileProperties":{

zuzannamj

POST /asset/v1/content/assets

{
    "name": "Astro",
    "assetType": {
        "name": "png",
        "id": 28
    },
    "file": "/9j/4AAQSkZJRgABAQAASABIAAD/2wBDAAQEBAQEBAcEBAcKBwcHCg0KCgoKDRANDQ0NDRAUEBAQEBAQFBQUFBQUFBQYGBgYGBgcHBwcHB8fHx8fHx8fHx//2wBDAQUFBQgHCA4HBw4gFhIWICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICD/wgARCAEAAQADASIAAhEBAxEB/8QAHAABAAIDAQEBAAAAAAAAAAAAAAYHAwQFAQII/8QAGgEBAAMBAQEAAAAAAAAAAAAAAAECAwQFBv/aAAwDAQACEAMQAAABv8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADn7n5/pe+9n8+WfEzR5g0z2GDMeubWFLXB7+ervT1hegAAAAAAAAGh+fP0P8AnrHbHuau3lrk+CJZsIzc/a1Jj4uambw0zkg3wAAAAAAAAGmQGB/fxydT45cGtWXcngdXXPLva8eRY/RqeTU0mM6g3ud/0K5fU6uUJAAAAAAAIZM67pau9fYi+HRFLSgd9TSteNcrLTj86Us7fm/ftzg9WHDkVb2RFrAsaoLf1yDSgAAAAAACDzjQrNBw+YR7DouDWzVlz3s/JF5RWwjJJ+dC7EtFMyrFk2pKrcg053wDSgAAAAAAAFcV1+i6qw6dX71vef3ehs8b2I7ehs5qeVxunqR604uhjuPow3Mp08oAAAAAAGD6hO3W0wFqqqmld4ewGPtAY+d0dKeUJlMoanO9kMmfT86E0AAAAAHChBIxJYBjv+gOdVvGtHa6nA62Hp7b69v0/Az78Grmw2yHs0+9zHs7eLxLSg/Zjmska4gAAAANbZH5sx21UfP0PPVbdjvxySbYvPW

zuzannamj

var headerNames = ["Authorization"];
var headerValues = ["Bearer " + accessToken];
var jsonBody = {
    "name": fileName,
    "assetType": {
        "name": assetName,
        "id": assetTypeID
    },
    "file": base64enc
};

zuzannamj

//prepare data for API call
var base64enc = obj.base64enc;
var fileName = obj.fileName;
var assetName = obj.assetName;

//match asset type with uploaded file (https://developer.salesforce.com/docs/atlas.en-us.noversion.mc-apis.meta/mc-apis/base-asset-types.htm)
var assetTypes = { ai: 16, psd: 17, pdd: 18, eps: 19, gif: 20, jpe: 21, jpeg: 22, jpg: 23, jp2: 24, jpx: 25, pict: 26, pct: 27, png: 28, tif: 29, tiff: 30, tga: 31, bmp: 32, wmf: 33, vsd: 34, pnm: 35, pgm: 36, pbm: 37, ppm: 38, svg: 39, "3fr": 40, ari: 41, arw: 42, bay: 43, cap: 44, crw: 45, cr2: 46, dcr: 47, dcs: 48, dng: 49, drf: 50, eip: 51, erf: 52, fff: 53, iiq: 54, k25: 55, kdc: 56, mef: 57, mos: 58, mrw: 59, nef: 60, nrw: 61, orf: 62, pef: 63, ptx: 64, pxn: 65, raf: 66, raw: 67, rw2: 68, rwl: 69, rwz: 70, srf: 71, sr2: 72, srw: 73, x3f: 74, "3gp": 75, "3gpp": 76, "3g2": 77, "3gp2": 78, asf: 79, avi: 80, m2ts: 81, mts: 82, dif: 83, dv: 84, mkv: 85, mpg: 86, f4v: 87, flv: 88, mjpg: 89, mjpeg: 90, mxf: 91, mpeg: 92, mp4: 93, m4v: 94, mp4v: 95, mov: