Added query string option to show github credentials in LwM2M registry

.eslintrc.js

@@ -4,13 +4,13 @@ module.exports = {
     es2020: true,
     jquery: true,
   },
-  plugins: ['jsx-a11y', 'prettier'],
-  extends: ['airbnb-base', 'eslint:recommended', 'prettier', 'plugin:jsx-a11y/recommended'],
+  plugins: ['html'],
+  extends: ['airbnb-base', 'eslint:recommended', 'prettier'],
   parserOptions: {
     ecmaVersion: 11,
     project: 'tsconfig.json',
   },
-  rules: { 'no-unused-vars': 'off', 'no-use-before-define': 'off' },
+  rules: { 'no-unused-vars': 'off', 'no-use-before-define': 'off', 'import/extensions': [0, { js: 'always' }] },
 
   // rules: {},
 };

OMNA/LwM2M/LwM2MRegistry.html

@@ -18,7 +18,7 @@
     <script src="../../Scripts/config.js"></script>
     <script src="../../Scripts/tabledregistries.js"></script>
     <script src="../../Scripts/lwm2m_xmlregistries.js"></script>
-    <script src="../../Scripts/getRepositoryInfo.js"></script>
+    <!-- <script type="module" src="../../Scripts/getRepositoryInfo.js"></script> -->
     <script>
         // function handleLogin() {
         //     const settings = {
@@ -32,7 +32,6 @@
 
         //     $.get(settings);
         // }
-
         function handleBranchSelectorChange(selectObject) {
             // Clear the errors when selecting a different release/branch
             $('#show-errors').hide(); 
@@ -41,9 +40,9 @@
 
             const selectObjValue = JSON.parse(selectObject.value);
 
-            const tagName = selectObjValue.tagName;
-            const branchName = selectObjValue.branchName;
-            const url = selectObjValue.url;
+            const {tagName} = selectObjValue;
+            const {branchName} = selectObjValue;
+            const {url} = selectObjValue;
 
             if (tagName)
             history.pushState({'pageTitle':document.title},'',`?releaseTagName=${tagName}`)
@@ -56,7 +55,7 @@
             TablesWithRowspanStyleChanges();
         }
 
-        function handleSaveGithubCrendentials() {
+        function handleSaveGithubCredentials() {
             // $('#github-credentials-form').serializeArray();
             const username = $('#username').val();
             const password = $('#user-access-token').val();
@@ -104,7 +103,7 @@
         };
 
         // On back button
-        window.onpopstate = function(e){
+        window.onpopstate = (e) => {
             if(e.state){
                 window.location.href = window.location.href;
                 // document.getElementById("content").innerHTML = e.state.html;
@@ -116,20 +115,17 @@
 
 
     </script>
-    <script>
-        $(document).ready(function () {
-            const owner = config.owner;
-            const repo = config.repo;
-            const productionBranchName = config.productionBranchName;
-            const testBranchName = config.testBranchName;
-            const devBranchName = config.devBranchName;
-            const testUrlPrefix = config.testUrlPrefix;
-            const devUrlPrefix = config.devUrlPrefix;
+    <script type="module">
+        import {getRepositoryInfo} from "../../Scripts/getRepositoryInfo.js";
+
+        $(document).ready( () => {
+            const {owner,repo,productionBranchName,testBranchName,devBranchName,testUrlPrefix,devUrlPrefix,showBranchSelectionQueryParameter} = config;
 
             $('#header').load("../../header.html");
             $('#footer').load("../../footer.html");
 
-            const githubAuth = window.localStorage.githubAuth;
+            const {githubAuth} = window.localStorage;
+
             if (!githubAuth) {
                 $('#github-credentials-form').show();
                 $('#github-credentials-remove-button').hide();
@@ -175,36 +171,28 @@
                 // selectObj.dispatchEvent(new Event('change'));
             }
 
-            //$('#LwM2MObjects').load("LwM2MObjects.html", function () { SetUpExpandableTDs(); TablesWithRowspanStyleChanges(); });
+            // $('#LwM2MObjects').load("LwM2MObjects.html", function () { SetUpExpandableTDs(); TablesWithRowspanStyleChanges(); });
             // For when using a clone Github repository as a submodule to get the DDF.xml file:
             // DisplayXML('../../lwm2m-registry/DDF.xml', '../../lwm2m-registry/reserved.xml', '../../lwm2m-registry/Common.xml');
             // For when using web server rewrite rules to rewrite /tech/profiles/lwm2m/DDF.xml to https://raw.githubusercontent.com/OpenMobileAlliance/trial/dev/DDF.xml
             const urlParams = new URLSearchParams(window.location.search);
 
             let branchName = urlParams.get('branchName') || urlParams.get('releaseTagName') || undefined;
+            const showBranchSelection = urlParams.get(showBranchSelectionQueryParameter);
 
-            if (window.location.host.startsWith(devUrlPrefix) || window.location.host.startsWith(testUrlPrefix)) {
-                if (!branchName) {  
-                    if (window.location.host.startsWith(devUrlPrefix)) {
-                        // $environmentURL = 'https://testwww.openmobilealliance.org/tech/profiles/lwm2m/';
-                        branchName = devBranchName;                    
-
-                    } else if (window.location.host.startsWith(testUrlPrefix)) {
-                        // $environmentURL = window.location.protocol + "//" + window.location.host + '/tech/profiles/lwm2m/'; // It's running on OMA server setup with URL rewriting to Github repository for DDF.xml, etc
-                        branchName = testBranchName;
-
-                    }
-                }
+            // if (window.location.host.startsWith(devUrlPrefix) || window.location.host.startsWith(testUrlPrefix)) {
+            if (showBranchSelection) {
+                if (!branchName)
+                    branchName = productionBranchName;
 
                 // Once the page has loaded, show the branch selection options
                 $('#branch-selection').show();
 
                 const environmentUrl = `https://raw.githubusercontent.com/${owner}/${repo}/${branchName}`; 
                 getRepositoryInfo(owner,repo, () => {setSelectedValue($('#branch-selector-dd'), environmentUrl)}) 
             } else {
-                if (!branchName) {
+                if (!branchName) 
                     branchName = productionBranchName;
-                }
 
                 // If production then hide the branch/tag selector
                 $('#branch-selection').remove();
@@ -214,7 +202,7 @@
                 setSelectedValue($('#branch-selector-dd'), environmentUrl);
             }
 
-
+        });
             // const options = $('#branch-selector-dd')[0].options;
             // let found = false;
             // for (let i=0;i<options.length;i+=1) {
@@ -236,7 +224,7 @@
             //     $('#branch-selector-dd').val('')
             // }
 
-        });
+
     </script>
     <script src="../../Scripts/googleanalytics.js"></script>
 </head>
@@ -252,11 +240,11 @@
     <div id="branch-selection" hidden>
         <div id="github-info"></div>
         <div id="github-credentials">
-            <form id="github-credentials-form">
+            <div id="github-credentials-form">
                 <!-- <div id="github-credentials-form"> -->
-                    <span>Username: <input id="username" name="username" type="text"></span><span>Github Personal Access Token: <input id="user-access-token" name="user-access-token" type="password"></span><span><button onclick="handleSaveGithubCrendentials()">Use Github credentials</button></span><span>You can create a personal access token <a href="https://github.com/settings/tokens" target="_blank">here</a></span>
+                    <span>Username: <input id="username" name="username" type="text"></span><span>Github Personal Access Token: <input id="user-access-token" name="user-access-token" type="password"></span><span><button onclick="handleSaveGithubCredentials()">Use Github credentials</button></span><span>You can create a personal access token <a href="https://github.com/settings/tokens" target="_blank">here</a></span>
                 <!-- </div> -->
-            </form>
+            </div>
             <button id="github-credentials-remove-button" hidden onclick="handleRemoveGithubCredentials()">Remove Github credentials</button>
         </div>
         <div>

Scripts/config.js

@@ -6,4 +6,5 @@ const config = {
   testUrlPrefix: 'test',
   devBranchName: 'test',
   devUrlPrefix: 'localhost',
+  showBranchSelectionQueryParameter: 'show',
 };

Scripts/getRepositoryInfo.js

@@ -1,12 +1,32 @@
+/* eslint-disable import/prefer-default-export */
 /* exported getRepositoryInfo */
-function getRepositoryInfo(owner, repo, setSelectedOption) {
+
+// eslint-disable-next-line import/no-unresolved
+import { Octokit } from 'https://cdn.skypack.dev/@octokit/rest';
+
+export function getRepositoryInfo(owner, repo, setSelectedOption) {
   const { githubAuth } = window.localStorage;
 
   let githubCreds;
   if (githubAuth) {
     try {
       githubCreds = JSON.parse(githubAuth);
-    } catch {}
+    } catch {
+      console.error('Unable to parse the github credentials');
+    }
+  }
+
+  const octokit =
+    githubCreds &&
+    githubCreds.userAccessToken &&
+    new Octokit({
+      auth: githubCreds.userAccessToken,
+    });
+
+  if (octokit) {
+    console.debug('success', octokit);
+  } else {
+    console.debug('failure', octokit);
   }
 
   const auth = githubCreds && btoa(`${githubCreds.username}:${githubCreds.userAccessToken}`);
@@ -79,6 +99,7 @@ function getRepositoryInfo(owner, repo, setSelectedOption) {
         headers,
         dataType: 'json',
         success(branchesData, branchesTextStatus, branchesRequest) {
+          console.debug('branchesRequest', branchesRequest.getAllResponseHeaders());
           $('#github-info').html(
             `You have ${branchesRequest.getResponseHeader('X-RateLimit-Remaining')} github API requests remaining. Resets at ${new Date(
               branchesRequest.getResponseHeader('X-RateLimit-Reset') * 1000
@@ -104,11 +125,13 @@ function getRepositoryInfo(owner, repo, setSelectedOption) {
           setSelectedOption();
         },
         error(request, textStatus, errorThrow) {
+          console.debug('error2', errorThrow.message);
           handleError(request, textStatus, errorThrow);
         },
       });
     },
     error(request, textStatus, errorThrow) {
+      console.debug('error', errorThrow.message);
       handleError(request, textStatus, errorThrow);
     },
   });

index.html

@@ -15,12 +15,12 @@
     <link rel="stylesheet" href="CSS/specifications.css">
     <link rel="shortcut icon" href="https://www.omaspecworks.org/wp-content/uploads/2018/01/favicon-1.png" type="image/x-icon">
     <script>
-        $(function () {
-            //// Force no cache
-            //$.ajaxSetup({
+        $(() => {
+            /// / Force no cache
+            // $.ajaxSetup({
             //    // Disable caching of AJAX responses
             //    cache: false
-            //});
+            // });
 
             $('#header').load("header.html");
             $('#footer').load("footer.html");
@@ -635,7 +635,7 @@ <h1>
                     <tr>
                         <td>
                             <div>
-                                <a href="http://technical.openmobilealliance.org/Overviews/lightweightm2m_overview.html">OMA LightweightM2M (LwM2M)</a><br>
+                                <a href="./Overviews/lightweightm2m_overview.html">OMA LightweightM2M (LwM2M)</a><br>
                                 <a href="./OMNA/LwM2M/LwM2MRegistry.html" target="_blank">
                                     <img src="./Images/OMA-129 Lightweight M2M Logo_RGB_full.jpg" alt="LwM2M Logo" style="width:200px;height:100px;">
                                 </a>
@@ -661,7 +661,7 @@ <h1>
                             </div>
                         </td>
                         <td>
-                            <a href="http://technical.openmobilealliance.org/Overviews/lightweightm2m_overview.html" class="orange">Overview</a><br>
+                            <a href="./Overviews/lightweightm2m_overview.html" class="orange">Overview</a><br>
                             <a href="./OMNA/LwM2M/LwM2MRegistry.html" class="orange">Registry</a><br>
                             <a href="https://www.openmobilealliance.org/tech/profiles/" class="blue">Supporting Data</a><br>
                             <a href="https://github.com/OpenMobileAlliance/OMA_LwM2M_for_Developers/wiki" class="green">Developer</a><br>