Documentation for @nitoku.public/blockApi service🔗


 

Index🔗




Services🔗





Metadata🔗


  postMsg.messageMetadata = {};      

Note that only the following data structures can be send using to the postMessage interface :

https://html.spec.whatwg.org/multipage/web-messaging.html#posting-messages



Get and set page and block data🔗



get-data🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0'
  postMsg.service = 'get-data'
  //message metadata will be returned on the response

  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

set-data🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0'
  postMsg.service = 'set-data'
  postMsg.message = {'data':'my block data'};
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

get-page-css🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0'
  postMsg.service = 'get-page-css'
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

get-inner-width🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'get-inner-width';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

get-inner-height🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'get-inner-height';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

Retreive the height from the message event listener as follows :

  if(e.data.service === "get-inner-height" ){
  	console.log("height: " + e.data.response.data); 
  }

get-pathname🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'get-pathname';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

hold-loading-frame🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'hold-loading-frame';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

clear-loading-frame🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'clear-loading-frame';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

allow-same-origin🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'allow-same-origin';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

is-admin-user🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'is-admin-user';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 



Block dialog window🔗



If we use dialogs on our blocks, a natural way of separate the logic that will be executed on the main frame and the logic in the dialog frame is to ask to the page app if the frame is a dialog frame or not. After the response is received we will have the information that we need to apply required operations on the frame dialog or the main frame. You can see an example below:

is-dialog🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'is-dialog';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

show-dialog🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'show-dialog';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

close-dialog🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'close-dialog';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

save-and-close-dialog🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'save-and-close-dialog';
  postMsg.message = { 'data' : 'data1data2data3data4data5' };
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 



Block sizing and positioning🔗


set-full-width🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'set-full-width';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 


set-height🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'set-height';
  postMsg.message = { 'height' : 200 };
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

set-overlay🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'set-overlay';
  postMsg.message = { 'top' : 30, 'bottom' : 20 };
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

clear-overlay🔗


  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'clear-overlay';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

 

Block shared Data🔗


read-shared🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'read-shared';
  postMsg.message =  { 'id' : 'dataid'};
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

get-shared-list🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'get-shared-list'; 
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

write-shared🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'write-shared'; 
  postMsg.message = { 'id' : 'dataid', 'data' : 'data1data2data3data4data5' };
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

delete-shared🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'delete-shared';
  postMsg.message =  { 'id' : 'dataid'} ;
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

 

Block files🔗


get-team-resources-availability🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'get-team-resources-availability';
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

get-file🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'get-file';
  postMsg.message = { 'url' : 'https://www.nitoku.com/file/@nitoku.public/nitoku.public-files/file1234' };
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

  if(e.data.service === "get-file"){
    console.log(e.data.response.blog);
  }

get-file-list🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'get-file-list'; 
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 
if(e.data.service === "get-file-list" ){        
       console.log(e.data.response.data);
}

The e.data.response.data structure is a json array containing the uris of the files managed by the block.

[ 
   { 
    uri : "https://www.nitoku.com/@nitoku.public/nitoku.public-file/file1234",
    size : 31200
    type : "application/javascript" 
   },
   
]

write-file🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'write-file';
  postMsg.message = { 'id' : 'file1234' , 'name' : 'file name', 'blob' : blob};
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 

delete-file🔗

  var postMsg = {};
  postMsg.channel = '@nitoku.public/blockApi';
  postMsg.version = '1.0';
  postMsg.service = 'delete-file';
  postMsg.message = { 'id' : 'file12345' };
  parent.postMessage( postMsg, "https://www.nitoku.com" ); 



Links🔗



open-link🔗

var postMsg = {};
postMsg.channel = '@nitoku.public/blockApi';
postMsg.version = '1.0';
postMsg.service = 'open-link';
postMsg.message = { 'href' : from.href , 'target' : from.target};
window.parent.postMessage(postMsg,"https://www.nitoku.com");      

Note : If the target is not provided the link will open on same window for nitoku.com links and in a new window for external links.



Nitoku App's messages handling🔗



window.addEventListener('message', function (e) {

  if (e.origin !== ("https://www.nitoku.com")){
      console.warn("error on frame origin");
      return;
  }

  if(e.data != null) {

    if(e.data.channel !== "@nitoku.public/blockApi"){
      return;
    }

    if(e.data.service === "get-data" || e.data.service === "data-update"){
    
      var helloEl = document.getElementById('hello'); 
      helloEl.innerHTML = e.data.response.data+ "<div> Hello page! </div>";
      
      //if we had set metadata on the request it will be returned on the response
      if(e.data.messageMetadata){
      	console.log(e.data.messageMetadata);
      }
    }
  }

}

 

 

Nitoku App's event messages🔗



data-update🔗


if(e.data.service === "data-update" ){        
      console.log("data update");	
      console.log(e.data.response.data);	
}

close-dialog-event🔗


This event is received when the user clicks on the close bottom of the block dialog menu. You can capture this event with:

if(e.data.service === "close-dialog-event" ){        
      console.log("close event");	
}









Nitoku is serviced from cloud infrastructure in USA 🇺🇸, provided from Spain 🇪🇸, developed with ❤️ in Japan 🇯🇵 Tokyo 🗼. Copyright © 2019 Nitoku Europe S.L. Icons by Icon8🔗