API tools faq
paste
commodore73

Contentstack Developer Widget

commodore73
Apr 30th, 2021 (edited)
443
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 6.99 KB | None | 0 0
raw download clone embed print report
  1. <!doctype html>
  2. <html lang="en">
  3.     <head>
  4.         <meta charset="UTF-8"/>
  5.         <title>Contentstack Developer Widget</title>
  6.         <style>
  7. body { margin: 0; }
  8.         </style>
  9.         <link rel="stylesheet" type="text/css" href="https://www.contentstack.com/sdks/contentstack-ui-extensions/dist/latest/ui-extension-sdk.css">
  10.         <link href="https://assets.contentstack.io/v3/assets/blt30b41f7b9a5d7467/bltb6bb4f7db098181f/5b39e605fda2af4e7866b92c/jsoneditor.min.css" rel="stylesheet" type="text/css">
  11.             <script src="https://www.contentstack.com/sdks/contentstack-ui-extensions/dist/latest/ui-extension-sdk.js"></script>
  12.             <script src="https://cdn.jsdelivr.net/npm/lodash@4.17.4/lodash.min.js"></script>
  13.             <script src="https://assets.contentstack.io/v3/assets/blt30b41f7b9a5d7467/blte7fe106cc93cf2bf/5b33888fcfc846f95726af6f/jsoneditor.min.js"></script>
  14.         </head>
  15.         <body>
  16.             <div>
  17.                 <ul>
  18.                     <li>Edit Content Type: <a id="ctlink" href="" target="_blank">Edit Content Type</a></li>    
  19.                     <li>Visit: <a id="cthref" href="" target="_blank"></a></li>
  20.                 </ul>
  21.             </div>
  22.             <div id="jsoneditor"></div>
  23.             <script>
  24.  
  25. // shouldn't mess with prototype, but...
  26. Object.prototype.getTypeName = function()
  27. {
  28.    var funcNameRegex = /function (.{1,})\(/;
  29.    var results = (funcNameRegex).exec((this).constructor.toString());
  30.    return (results && results.length > 1) ? results[1] : "";
  31. };
  32.    
  33. window.extensionField = {};
  34. var jsoneditorElement = document.getElementById("jsoneditor");
  35. var jsonEditor = {};
  36.  
  37. ContentstackUIExtension.init().then(function(extension)
  38. {
  39.     extensionField = extension;
  40.     console.log("Entry JSON:");
  41.     console.log(extension.entry._data);
  42. //    recurse("extension.entry", extension.entry);
  43.     recurse("extension", extension);
  44.  
  45.     var value = extensionField.entry._data;
  46.     var options = {
  47.         modes: ['text', 'code', 'tree', 'form', 'view'],
  48.         mode: 'code',
  49.         ace: ace,
  50.     };
  51.     jsonEditor = new JSONEditor(jsoneditorElement, options);
  52.     jsonEditor.set(value);
  53.  
  54.     document.getElementById("ctlink").href = "/#!/stack/" + extensionField.stack["_data"]["api_key"]
  55.         + "/content-type/" + extensionField.entry.content_type["uid"] + "/content-type-builder";
  56.     document.getElementById("ctlink").target = "ctedit" + extensionField.entry.content_type["uid"];
  57.     document.getElementById("ctlink").innerHTML = extensionField.entry.content_type["uid"];
  58.  
  59.     var url = extensionField.entry._data["url"];
  60.    
  61.     if (!(typeof url === 'undefined'))
  62.     {
  63.         var baseurl = extensionField.config["preview"]["baseurl"];
  64.  
  65.         if (!(typeof baseurl === 'undefined'))
  66.         {
  67.           url = baseurl + url;
  68.         }
  69.        
  70.         document.getElementById("cthref").href = url;
  71.         document.getElementById("cthref").target = "ctvisit" + extensionField.entry.uid;
  72.         document.getElementById("cthref").innerHTML = url;
  73.     }
  74. });
  75.  
  76. // log object elements, recursively
  77. function recurse(name, obj, spaces = '')
  78. {
  79.   // don't show function bodies
  80.     if (typeof(obj) != "function")
  81.     {
  82.         value = " : " + obj;
  83.     }
  84.  
  85.     // log the object
  86. //    var msg = spaces + name + " : " + typeof(obj) + value
  87.     var msg = spaces + name + " : " + obj.getTypeName() + value
  88.     console.log(msg);
  89.  
  90.     // log methods of the object
  91.     for (const [method, body] of Object.entries(getMethods(obj)))
  92.     {
  93.         var msg = spaces + "  " + name + "." + method + "()" + " : method" /* + body*/;
  94.         console.log(msg);
  95.     }
  96.  
  97.     // log values in the object
  98.     var lastKey;
  99.  
  100.     try
  101.     {
  102.         // store most recently attempted key in case of error
  103.         var lastKey;
  104.  
  105.         for (const [key, value] of Object.entries(obj))
  106.         {
  107.             lastKey = key;
  108.  
  109.             // recurse descendants of object
  110.             if (typeof(value) == "object")
  111.             {
  112.               recurse(name + "." + key, value, spaces + "  ");
  113.             }
  114.             else
  115.             {
  116.                 output = "";
  117.  
  118.                 // don't render method bodies
  119.                 if (typeof(value) != "function")
  120.                 {
  121.                     output = " : " + value;
  122.                 }
  123.  
  124. //                var msg = "  " + spaces + '' + name + "['" + key + "'] : " + typeof(value) + output;
  125.                 var msg = "  " + spaces + '' + name + "['" + key + "'] : " + value.getTypeName() + output;
  126.                 console.log(msg);
  127.             }
  128.         }
  129.     }
  130.     catch(error)
  131.     {
  132.         var msg = "ERROR accessing " + name + "[" + lastKey + "]" + " " + error
  133.         console.log(msg);
  134.     }
  135. }
  136.  
  137. // get the methods in the object and its base prototypes(s)
  138. function getMethods(obj)
  139. {
  140.     var methods = {};
  141.     var currentObj = obj;
  142.     var type;
  143.  
  144.     do
  145.     {
  146.         for(const key of Object.getOwnPropertyNames(currentObj))
  147.         {
  148.             // try to limit methods shown for object/array/string/etc
  149.             if (typeof(obj[key]) === "function"
  150.                 && key != "toLocaleString"
  151.                && key != "valueOf"
  152.                && key != "getTypeName"
  153.                && key != "hasOwnProperty"
  154.                && key != "isPrototypeOf"
  155.                && key != "propertyIsEnumerable"
  156.                && key != "toString"
  157.                && key != "constructor"
  158.                && !key.startsWith("__"))
  159. //              && key != "concat"
  160. //              && key != "copyWithin"
  161. //              && key != "fill"
  162. //              && key != "find"
  163. //              && key != "findIndex"
  164. //              && key != "lastIndexOf"
  165. //              && key != "pop"
  166. //              && key != "push"
  167. //              && key != "reverse"
  168. //              && key != "shift"
  169. //              && key != "unshift"
  170. //              && key != "slice"
  171. //              && key != "sort"
  172. //              && key != "splice"
  173. //              && key != "includes"
  174. //              && key != "indexOf"
  175. //              && key != "join"
  176. //              && key != "keys"
  177. //              && key != "entries"
  178. //              && key != "values"
  179. //              && key != "forEach"
  180. //              && key != "filter"
  181. //              && key != "flat"
  182. //              && key != "flatMap"
  183. //              && key != "map"
  184. //              && key != "every"
  185. //              && key != "some"
  186. //              && key != "map"
  187. //              && key != "reduce"
  188. //              && key != "reduceRight"
  189.            {
  190.                methods[key] = obj[key].toString();
  191.             }
  192.         }
  193.      
  194.         currentObj = Object.getPrototypeOf(currentObj);
  195.      
  196.         if (currentObj != null)
  197.         {
  198.             var type = currentObj.getTypeName();
  199.  
  200.             if (type == "Array")
  201.             {
  202.                 currentObj = null;
  203.             }
  204.         }
  205.     } while (currentObj != null);
  206.  
  207.     return methods;
  208. }
  209.  
  210.         </script>
  211.     </body>
  212. </html>
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!