Don't make user click button, just show link immediately

krschau · krschau · commit ab6f5508526d · 2021-10-19T08:47:30.000-07:00
diff --git a/GithubToAdoExt/popup/popup.html b/GithubToAdoExt/popup/popup.html
@@ -12,9 +12,7 @@
     </head>
     <noscript>Oh... you disabled Javascript or client side scripting, so this extention won't work</noscript>
     <body>
-        <p id="content">
-            <button id="linkButton">Get Link</button>
-        </p>
+        <p id="content"></p>
         <script type="text/javascript" src="scripts.js"></script>
     </body>
 </html>
diff --git a/GithubToAdoExt/popup/scripts.js b/GithubToAdoExt/popup/scripts.js
@@ -1,10 +1,11 @@
-function getTabs()
-{
-    chrome.tabs.query({currentWindow: true, active: true}, doThingWithTabs);
-}
+window.onload = (event) => {
+    // Gets the current tabs
+    chrome.tabs.query({currentWindow: true, active: true}, getAdoLink);
+};
 
-function doThingWithTabs(tabs)
+function getAdoLink(tabs)
 {
+    // Check the URL of the current tab to see if it's a MUX GitHub URL
     let fullUrl = tabs[0].url;
     if (isValidUrl(fullUrl))
     {
@@ -14,40 +15,35 @@ function doThingWithTabs(tabs)
         // Create link with search URL
         document.getElementById("content").innerHTML = 
             "<a href='" + searchUrl + "' "
-            + "target='_blank' rel='noopener' " // Opens link in new tab
-            + "title='Open ADO link in new tab'>Link</a>";
+            + "target='_blank' rel='noopener' "   // Opens link in new tab
+            + "title='Open ADO link in new tab' " // Hover text
+            + ">ADO Link</a>";                    // Display text
     }
     else
     {
-        //document.write("Not a WinUI GitHub page");
         document.getElementById("content").innerHTML = "Not a WinUI GitHub page";
     }
 }
 
 function isValidUrl(fullUrl)
 {
-    let firstPart = "https://github.com/microsoft/microsoft-ui-xaml/issues/";
-    let isValid = (fullUrl.startsWith(firstPart)) ? true : false;
-    return isValid;
+    // Leave out ending slash so the full list of issues (no number) is considered valid
+    let firstPart = "https://github.com/microsoft/microsoft-ui-xaml/issues";
+    return fullUrl.startsWith(firstPart);
 }
 
 function getGithubNumberFromUrl(fullUrl)
 {
-    let number;
     let firstPart = "https://github.com/microsoft/microsoft-ui-xaml/issues/";
-    let len = firstPart.length;
-    number = fullUrl.substring(len);
-    return number;
+    return fullUrl.substring(firstPart.length);
 }
 
 function createAdoSearchUrl(githubNumber)
 {
     let urlStart = "https://microsoft.visualstudio.com/OS/_search?";
-    let searchTest = "text=https%3A//github.com/microsoft/microsoft-ui-xaml/issues/";
-    // github item number goes here
+    let searchText = "text=https%3A//github.com/microsoft/microsoft-ui-xaml/issues/";
+    // github item number goes here (if there is one, otherwise we return a query for all the MUX GitHub issues)
     let itemType = "&type=workitem&lp=workitems-Project";
-    let searchUrl = urlStart + searchTest + githubNumber + itemType;
+    let searchUrl = urlStart + searchText + githubNumber + itemType;
     return searchUrl;
 }
-
-document.getElementById("linkButton").addEventListener("click", getTabs);
diff --git a/README.md b/README.md
@@ -3,17 +3,19 @@ A Chromium extension for linking to MSFT internal ADO items from WinUI 3 GitHub
 
 ## How install
 Currently, the only way to install this extention into Edge is to sideload it as an unpackaged extension.
-1. Download the repo, or just the GithubToAdoExt directory.
-2. Open the Extensions pane in Edge (this can be found under the ... menu in the upper right)
-3. Ensure that "Developer mode" is turned on (bottom left corner. If it's not there, hit the hamburger menu in the upper left.)
+1. Download the repo, or just the GithubToAdoExt directory
+2. Open the Extensions pane in Edge (this can be found under the "..." menu in the upper right)
+3. Ensure that "Developer mode" is turned on. (There is a toggle in the bottom left corner. 
+   If it's not there, hit the hamburger menu in the upper left.)
 4. Click the "Load unpackaged" icon
 5. Select the GithubToAdoExt folder
 
 The extension should now be installed, and you should see the WinUI logo in your Edge toolbar.
 
 ## How to use
-- Go to the WinUI GitHub page you want to find the ADO item for.
+- Go to the WinUI GitHub page you want to find the ADO item for
 - Click the extension's icon in the toolbar
-- Click GetLink
-- Click the link
-If you are not on a WinUI GitHub page, you will see an error stating such.
+- Clicking the link provided will open the ADO item in a new tab
+
+If you are not on a WinUI GitHub page, you will see an error stating such. Using the extension from 
+the main GitHub issues page will bring you to a query for all ADO issues mirrored from the MUX GitHub.

Original file line number	Diff line number	Diff line change
`@@ -1,10 +1,11 @@`
`1`		`-function getTabs()`
`2`		`-{`
`3`		`- chrome.tabs.query({currentWindow: true, active: true}, doThingWithTabs);`
`4`		`-}`
	`1`	`+window.onload = (event) => {`
	`2`	`+ // Gets the current tabs`
	`3`	`+ chrome.tabs.query({currentWindow: true, active: true}, getAdoLink);`
	`4`	`+};`
`5`	`5`
`6`		`-function doThingWithTabs(tabs)`
	`6`	`+function getAdoLink(tabs)`
`7`	`7`	`{`
	`8`	`+ // Check the URL of the current tab to see if it's a MUX GitHub URL`
`8`	`9`	`let fullUrl = tabs[0].url;`
`9`	`10`	`if (isValidUrl(fullUrl))`
`10`	`11`	`{`
`@@ -14,40 +15,35 @@ function doThingWithTabs(tabs)`
`14`	`15`	`// Create link with search URL`
`15`	`16`	`document.getElementById("content").innerHTML =`
`16`	`17`	`"<a href='" + searchUrl + "' "`
`17`		`- + "target='_blank' rel='noopener' " // Opens link in new tab`
`18`		`- + "title='Open ADO link in new tab'>Link</a>";`
	`18`	`+ + "target='_blank' rel='noopener' " // Opens link in new tab`
	`19`	`+ + "title='Open ADO link in new tab' " // Hover text`
	`20`	`+ + ">ADO Link</a>"; // Display text`
`19`	`21`	`}`
`20`	`22`	`else`
`21`	`23`	`{`
`22`		`- //document.write("Not a WinUI GitHub page");`
`23`	`24`	`document.getElementById("content").innerHTML = "Not a WinUI GitHub page";`
`24`	`25`	`}`
`25`	`26`	`}`
`26`	`27`
`27`	`28`	`function isValidUrl(fullUrl)`
`28`	`29`	`{`
`29`		`- let firstPart = "https://github.com/microsoft/microsoft-ui-xaml/issues/";`
`30`		`- let isValid = (fullUrl.startsWith(firstPart)) ? true : false;`
`31`		`- return isValid;`
	`30`	`+ // Leave out ending slash so the full list of issues (no number) is considered valid`
	`31`	`+ let firstPart = "https://github.com/microsoft/microsoft-ui-xaml/issues";`
	`32`	`+ return fullUrl.startsWith(firstPart);`
`32`	`33`	`}`
`33`	`34`
`34`	`35`	`function getGithubNumberFromUrl(fullUrl)`
`35`	`36`	`{`
`36`		`- let number;`
`37`	`37`	`let firstPart = "https://github.com/microsoft/microsoft-ui-xaml/issues/";`
`38`		`- let len = firstPart.length;`
`39`		`- number = fullUrl.substring(len);`
`40`		`- return number;`
	`38`	`+ return fullUrl.substring(firstPart.length);`
`41`	`39`	`}`
`42`	`40`
`43`	`41`	`function createAdoSearchUrl(githubNumber)`
`44`	`42`	`{`
`45`	`43`	`let urlStart = "https://microsoft.visualstudio.com/OS/_search?";`
`46`		`- let searchTest = "text=https%3A//github.com/microsoft/microsoft-ui-xaml/issues/";`
`47`		`- // github item number goes here`
	`44`	`+ let searchText = "text=https%3A//github.com/microsoft/microsoft-ui-xaml/issues/";`
	`45`	`+ // github item number goes here (if there is one, otherwise we return a query for all the MUX GitHub issues)`
`48`	`46`	`let itemType = "&type=workitem&lp=workitems-Project";`
`49`		`- let searchUrl = urlStart + searchTest + githubNumber + itemType;`
	`47`	`+ let searchUrl = urlStart + searchText + githubNumber + itemType;`
`50`	`48`	`return searchUrl;`
`51`	`49`	`}`
`52`		`-`
`53`		`-document.getElementById("linkButton").addEventListener("click", getTabs);`