diff --git a/LICENSE b/LICENSE index 6b30f77..e30cfed 100644 --- a/LICENSE +++ b/LICENSE @@ -1,6 +1,6 @@ MIT License -Copyright (c) 2018 DrewSK +Copyright (c) 2020 DrewSK Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal diff --git a/README.md b/README.md index 9d28284..6c1927f 100644 --- a/README.md +++ b/README.md @@ -1,31 +1,29 @@ -# Microsoft Docs Sidebar Collapser: Chrome Extension +# Microsoft Docs Sidebar Collapser: Edge/Chrome Extension -Chrome extension that enables the table of contents sidebar on https://docs.microsoft.com to be collapsed. +Edge/Chrome extension that enables the table of contents sidebar on https://docs.microsoft.com to be collapsed. ## Functionality -The icon for the extension is enabled on pages within https://docs.microsoft.com. - -Clicking the full-width icon (courtesy of Magicon from the Noun Project) expands the main content. - -Clicking the expand right icon (courtesy of atlantamountain from the Noun Project) expands the table of contents sidebar. - -**See it in action:** - -![Collapse and Expand](/images/Collapse_Revive.gif) +A button is automatically added to pages within https://docs.microsoft.com. +The button allows the left sidebar to be collapsed/expanded, creating more room to read the content. ## Installation -### Option 0: Install from the Chrome Web Store -0. Go to https://chrome.google.com/webstore/detail/microsoft-docs-fullview/dejphoknpednbppnajidmbcddpbejnoc and click *Add to Chrome* +### Option 0: Install from the Chrome Web Store/Microsoft Edge Store +Sorry! This option is no longer available. I am working to list it in the Microsoft Edge extension store. -### Option 1: Load Unpacked -0. both methods require enabling developer mode in *chrome://extensions* on your workstation +### Option 1: Load Unpacked (Chrome/Edge) +0. This method requires enabling developer mode in *chrome://extensions* or *edge://extensions* on your workstation 1. Download/clone this repository to your machine -2. Open *chrome://extensions* and click *Load Unpacked* +2. Open *chrome://extensions* or *edge://extensions* and click *Load Unpacked* 3. Select the root folder for the repository -### Option 2: Download the .crx file -0. both methods require enabling developer mode in *chrome://extensions* on your workstation +### Option 2: Download the .crx file (Chrome-only) +0. This methods requires enabling developer mode in *chrome://extensions* on your workstation 1. Go to https://github.com/dzsquared/MSDocsSidebarCollapser/releases and download the latest release 2. Open *chrome://extensions* and drag the downloaded crx file onto the page +## See it in action + +![Collapse and Expand](/images/example.gif) + + diff --git a/background.js b/background.js deleted file mode 100644 index f598f4d..0000000 --- a/background.js +++ /dev/null @@ -1,14 +0,0 @@ -chrome.runtime.onInstalled.addListener(function() { - // chrome.storage.sync.set({size: 'fullWidth'}, function() { - // console.log("collapsed"); - // }); - chrome.declarativeContent.onPageChanged.removeRules(undefined, function() { - chrome.declarativeContent.onPageChanged.addRules([{ - conditions: [new chrome.declarativeContent.PageStateMatcher({ - pageUrl: {hostEquals: 'docs.microsoft.com'}, - }) - ], - actions: [new chrome.declarativeContent.ShowPageAction()] - }]); - }); - }); \ No newline at end of file diff --git a/buttonActions.js b/buttonActions.js new file mode 100644 index 0000000..7131a63 --- /dev/null +++ b/buttonActions.js @@ -0,0 +1,21 @@ +function collapseSide() { + $('.left-container').toggle(500); + $('.primary-holder').animate({ width: '100%' }); + document.getElementById("docController").setAttribute("currentSidebar", "revealSide"); + document.getElementById("docController").innerHTML = "Show Sidebar"; +} +function revealSide() { + $('.left-container').toggle(500); + $('.primary-holder').animate({ width: '75%' }); + document.getElementById("docController").setAttribute("currentSidebar", "collapseSide"); + document.getElementById("docController").innerHTML = "Collapse Sidebar"; +} + +function sidebarButton() { + var currentSidebar = document.getElementById("docController").getAttribute("currentSidebar"); + if (currentSidebar == 'revealSide') { + revealSide(); + } else { + collapseSide(); + } +} \ No newline at end of file diff --git a/expandBack.js b/expandBack.js deleted file mode 100644 index b09993f..0000000 --- a/expandBack.js +++ /dev/null @@ -1,4 +0,0 @@ -$('.primary-holder').width('60%'); -$('#left-container').width('28%'); -$('#sidebar').show(); -$('#main-column').width('95%'); \ No newline at end of file diff --git a/fullWidth.js b/fullWidth.js index 9c89fe7..6511e75 100644 --- a/fullWidth.js +++ b/fullWidth.js @@ -1,6 +1,18 @@ -$('#left-container').width(2); -$('#sidebar').hide() - -$('.primary-holder').width('80%'); -$('#main-column').width('95%'); +function setupDocs() { + // add a script element for the button actions JS + var s = document.createElement('script'); + s.src = chrome.runtime.getURL('buttonActions.js'); + s.onload = function() { + this.remove(); + }; + (document.head || document.documentElement).appendChild(s); + // prepand a button to the page metadata area + var pageMetadata = document.getElementsByClassName("page-metadata")[0]; + if (typeof pageMetadata !== 'undefined') { + var sidebarButton = document.createElement("LI"); + sidebarButton.innerHTML = "" + pageMetadata.insertBefore(sidebarButton, pageMetadata.childNodes[0]); + } +} +setupDocs(); \ No newline at end of file diff --git a/images/Collapse_Revive.gif b/images/Collapse_Revive.gif deleted file mode 100644 index 4ade42e..0000000 Binary files a/images/Collapse_Revive.gif and /dev/null differ diff --git a/images/example.gif b/images/example.gif new file mode 100644 index 0000000..d57916a Binary files /dev/null and b/images/example.gif differ diff --git a/images/logoIcon.png b/images/logoIcon.png index 759d92e..c8f6400 100644 Binary files a/images/logoIcon.png and b/images/logoIcon.png differ diff --git a/images/logoIcon128.png b/images/logoIcon128.png index ca9e29c..b321b71 100644 Binary files a/images/logoIcon128.png and b/images/logoIcon128.png differ diff --git a/images/logoIcon16.png b/images/logoIcon16.png index 2867962..7329d64 100644 Binary files a/images/logoIcon16.png and b/images/logoIcon16.png differ diff --git a/images/logoIcon32.png b/images/logoIcon32.png index 702c15d..c05b587 100644 Binary files a/images/logoIcon32.png and b/images/logoIcon32.png differ diff --git a/images/logoIcon48.png b/images/logoIcon48.png index 494a9d9..4577b0f 100644 Binary files a/images/logoIcon48.png and b/images/logoIcon48.png differ diff --git a/images/noun_right.png b/images/noun_right.png deleted file mode 100644 index 8984b36..0000000 Binary files a/images/noun_right.png and /dev/null differ diff --git a/images/noun_right_2069553.png b/images/noun_right_2069553.png deleted file mode 100644 index 98c39bf..0000000 Binary files a/images/noun_right_2069553.png and /dev/null differ diff --git a/images/noun_width.png b/images/noun_width.png deleted file mode 100644 index 248c4ad..0000000 Binary files a/images/noun_width.png and /dev/null differ diff --git a/manifest.json b/manifest.json index 9927b2f..fa892c7 100644 --- a/manifest.json +++ b/manifest.json @@ -1,26 +1,23 @@ { - "name": "Microsoft Docs Fullview", - "version": "1.0", - "description": "Toggle to View Microsoft Docs in Full Width", - "permissions": ["activeTab","declarativeContent","storage"], - "background": { - "scripts": ["background.js"], - "persistent": false - }, - "page_action": { - "default_popup": "popup.html", - "default_icon": { - "16": "images/logoIcon16.png", - "32": "images/logoIcon32.png", - "48": "images/logoIcon48.png", - "128": "images/logoIcon128.png" - } - }, + "name": "Docs Fullview", + "version": "2.0", + "description": "Toggle to View Documentation in Full Width", + "permissions": [ + "tabs", "https://docs.microsoft.com/*" + ], "icons": { "16": "images/logoIcon16.png", "32": "images/logoIcon32.png", "48": "images/logoIcon48.png", "128": "images/logoIcon128.png" }, + "content_scripts": [ + { + "matches": ["https://docs.microsoft.com/*"], + "js": ["jquery.js", "fullWidth.js"], + "run_at": "document_end" + } + ], + "web_accessible_resources": ["buttonActions.js"], "manifest_version": 2 } \ No newline at end of file diff --git a/notes.txt b/notes.txt index 3fd92eb..29fa55f 100644 --- a/notes.txt +++ b/notes.txt @@ -1,8 +1,3 @@ https://code.jquery.com/jquery-3.3.1.min.js - -https://thenounproject.com/term/width/304721/ -width by Magicon from the Noun Project - -https://thenounproject.com/search/?q=right%20arrow&i=2069553 -right by atlantamountain from the Noun Project \ No newline at end of file +https://developer.chrome.com/extensions/content_scripts diff --git a/popup.html b/popup.html deleted file mode 100644 index f48704f..0000000 --- a/popup.html +++ /dev/null @@ -1,26 +0,0 @@ - - - - - - - - - - - \ No newline at end of file diff --git a/popup.js b/popup.js deleted file mode 100644 index a78419c..0000000 --- a/popup.js +++ /dev/null @@ -1,35 +0,0 @@ -let changeWidth = document.getElementById('changeWidthButton'); - -// chrome.storage.sync.get('size', function(data) { -// //changeWidth.style.backgroundColor = data.color; -// changeWidth.setAttribute('value', 'fullWidth'); -// }); - -changeWidth.onclick = function(element) { - //let scriptTE = element.target.value; - chrome.tabs.query({active: true, currentWindow: true}, function(tabs) { - chrome.tabs.executeScript( - tabs[0].id, - {file: "jquery.js"}, function() { - chrome.tabs.executeScript( - tabs[0].id, - {file: 'fullWidth.js'} - ); - }); - }); -}; - -let expandRight = document.getElementById('expandButton'); -expandRight.onclick = function(element) { - //let scriptTE = element.target.value; - chrome.tabs.query({active: true, currentWindow: true}, function(tabs) { - chrome.tabs.executeScript( - tabs[0].id, - {file: "jquery.js"}, function() { - chrome.tabs.executeScript( - tabs[0].id, - {file: 'expandBack.js'} - ); - }); - }); - };