Yue Wu edited this page Jun 17, 2020 · 5 revisions

It is rather tedious to build the app to the mobile device every time you change some code and wish to test. The old ARKit library contains a plugin called ARKitRemote that allows you to debug the app with the iOS device without having to deploy the app to the device. With ARKitRemote, you are able to test all AR features, including plane tracking.

ARFoundation, on the other hand, does not have a proper remote debugging tool. However, our app is not AR-heavy as we are only using the plane-tracking functionality of ARFoundation. This means that if we can separate plane finding and the rest of the logic, we can debug the app logic on the editor, without executing the ARFoundation code. We also need a new set of camera controls to navigate in the 3D space.

Therefore, I added two additional scripts, Debug Switch and Debug Camera. There are also slight modifications to StartPanelManager and InputManager.

Start Panel Manger

By using a state machine, we put the AR plane-finding logic in the FindPlane state, and put non-AR logic in other states. This achieves a natural separation of logic. If I skip the FindPlane state, I will not invoke the ARFoundation code.

The entry point of the app is in StartPanelManager, when the user will be prompted to select a language and toggle the tutorials. In the Confirm() method, the script will set the next state after the user confirmed her choice. If it detects that the app is running in the editor, it would skip FindPlane stage completely.

Input Manager

The input is managed by the Unity Event System. For more information, see Interaction System. Long story short, it supports multiple kinds of input, including screen touch and mouse click. Thus, we do not need significant changes to our input system.

The only thing we need to adapt is the "double tap" on the screen. Although this is not used in the main logic, it would still be nice to have it in case we need to change our interaction. We can treat a mouse right click as a double tap, which is the common approach. A couple of if statements in the Input Manager should do the trick.

Debug Camera

To navigate in the 3D scene, we need to move our camera. I adapted the script from http://wiki.unity3d.com/index.php/SmoothMouseLook to make a simple debug camera that runs only in the editor. This script is supposed to work in full screen, and will not work well in play mode, but it should be enough for simple camera rotation.

Debug Switch

Finally we need to switch between the debug camera and the AR camera, along with all ARFoundation components, depending on the device we are running. The script simply does that.

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content
Yue Wu edited this page Jun 17, 2020 · 5 revisions

It is rather tedious to build the app to the mobile device every time you change some code and wish to test. The old ARKit library contains a plugin called ARKitRemote that allows you to debug the app with the iOS device without having to deploy the app to the device. With ARKitRemote, you are able to test all AR features, including plane tracking.

ARFoundation, on the other hand, does not have a proper remote debugging tool. However, our app is not AR-heavy as we are only using the plane-tracking functionality of ARFoundation. This means that if we can separate plane finding and the rest of the logic, we can debug the app logic on the editor, without executing the ARFoundation code. We also need a new set of camera controls to navigate in the 3D space.

Therefore, I added two additional scripts, Debug Switch and Debug Camera. There are also slight modifications to StartPanelManager and InputManager.

Start Panel Manger

By using a state machine, we put the AR plane-finding logic in the FindPlane state, and put non-AR logic in other states. This achieves a natural separation of logic. If I skip the FindPlane state, I will not invoke the ARFoundation code.

The entry point of the app is in StartPanelManager, when the user will be prompted to select a language and toggle the tutorials. In the Confirm() method, the script will set the next state after the user confirmed her choice. If it detects that the app is running in the editor, it would skip FindPlane stage completely.

Input Manager

The input is managed by the Unity Event System. For more information, see Interaction System. Long story short, it supports multiple kinds of input, including screen touch and mouse click. Thus, we do not need significant changes to our input system.

The only thing we need to adapt is the "double tap" on the screen. Although this is not used in the main logic, it would still be nice to have it in case we need to change our interaction. We can treat a mouse right click as a double tap, which is the common approach. A couple of if statements in the Input Manager should do the trick.

Debug Camera

To navigate in the 3D scene, we need to move our camera. I adapted the script from http://wiki.unity3d.com/index.php/SmoothMouseLook to make a simple debug camera that runs only in the editor. This script is supposed to work in full screen, and will not work well in play mode, but it should be enough for simple camera rotation.

Debug Switch

Finally we need to switch between the debug camera and the AR camera, along with all ARFoundation components, depending on the device we are running. The script simply does that.

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Yue Wu edited this page Jun 17, 2020 · 5 revisions

It is rather tedious to build the app to the mobile device every time you change some code and wish to test. The old ARKit library contains a plugin called ARKitRemote that allows you to debug the app with the iOS device without having to deploy the app to the device. With ARKitRemote, you are able to test all AR features, including plane tracking.

ARFoundation, on the other hand, does not have a proper remote debugging tool. However, our app is not AR-heavy as we are only using the plane-tracking functionality of ARFoundation. This means that if we can separate plane finding and the rest of the logic, we can debug the app logic on the editor, without executing the ARFoundation code. We also need a new set of camera controls to navigate in the 3D space.

Therefore, I added two additional scripts, Debug Switch and Debug Camera. There are also slight modifications to StartPanelManager and InputManager.

Start Panel Manger

By using a state machine, we put the AR plane-finding logic in the FindPlane state, and put non-AR logic in other states. This achieves a natural separation of logic. If I skip the FindPlane state, I will not invoke the ARFoundation code.

The entry point of the app is in StartPanelManager, when the user will be prompted to select a language and toggle the tutorials. In the Confirm() method, the script will set the next state after the user confirmed her choice. If it detects that the app is running in the editor, it would skip FindPlane stage completely.

Input Manager

The input is managed by the Unity Event System. For more information, see Interaction System. Long story short, it supports multiple kinds of input, including screen touch and mouse click. Thus, we do not need significant changes to our input system.

The only thing we need to adapt is the "double tap" on the screen. Although this is not used in the main logic, it would still be nice to have it in case we need to change our interaction. We can treat a mouse right click as a double tap, which is the common approach. A couple of if statements in the Input Manager should do the trick.

Debug Camera

To navigate in the 3D scene, we need to move our camera. I adapted the script from http://wiki.unity3d.com/index.php/SmoothMouseLook to make a simple debug camera that runs only in the editor. This script is supposed to work in full screen, and will not work well in play mode, but it should be enough for simple camera rotation.

Debug Switch

Finally we need to switch between the debug camera and the AR camera, along with all ARFoundation components, depending on the device we are running. The script simply does that.

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Yue Wu edited this page Jun 17, 2020 · 5 revisions

It is rather tedious to build the app to the mobile device every time you change some code and wish to test. The old ARKit library contains a plugin called ARKitRemote that allows you to debug the app with the iOS device without having to deploy the app to the device. With ARKitRemote, you are able to test all AR features, including plane tracking.

ARFoundation, on the other hand, does not have a proper remote debugging tool. However, our app is not AR-heavy as we are only using the plane-tracking functionality of ARFoundation. This means that if we can separate plane finding and the rest of the logic, we can debug the app logic on the editor, without executing the ARFoundation code. We also need a new set of camera controls to navigate in the 3D space.

Therefore, I added two additional scripts, Debug Switch and Debug Camera. There are also slight modifications to StartPanelManager and InputManager.

Start Panel Manger

By using a state machine, we put the AR plane-finding logic in the FindPlane state, and put non-AR logic in other states. This achieves a natural separation of logic. If I skip the FindPlane state, I will not invoke the ARFoundation code.

The entry point of the app is in StartPanelManager, when the user will be prompted to select a language and toggle the tutorials. In the Confirm() method, the script will set the next state after the user confirmed her choice. If it detects that the app is running in the editor, it would skip FindPlane stage completely.

Input Manager

The input is managed by the Unity Event System. For more information, see Interaction System. Long story short, it supports multiple kinds of input, including screen touch and mouse click. Thus, we do not need significant changes to our input system.

The only thing we need to adapt is the "double tap" on the screen. Although this is not used in the main logic, it would still be nice to have it in case we need to change our interaction. We can treat a mouse right click as a double tap, which is the common approach. A couple of if statements in the Input Manager should do the trick.

Debug Camera

To navigate in the 3D scene, we need to move our camera. I adapted the script from http://wiki.unity3d.com/index.php/SmoothMouseLook to make a simple debug camera that runs only in the editor. This script is supposed to work in full screen, and will not work well in play mode, but it should be enough for simple camera rotation.

Debug Switch

Finally we need to switch between the debug camera and the AR camera, along with all ARFoundation components, depending on the device we are running. The script simply does that.

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content
Yue Wu edited this page Jun 17, 2020 · 5 revisions

It is rather tedious to build the app to the mobile device every time you change some code and wish to test. The old ARKit library contains a plugin called ARKitRemote that allows you to debug the app with the iOS device without having to deploy the app to the device. With ARKitRemote, you are able to test all AR features, including plane tracking.

ARFoundation, on the other hand, does not have a proper remote debugging tool. However, our app is not AR-heavy as we are only using the plane-tracking functionality of ARFoundation. This means that if we can separate plane finding and the rest of the logic, we can debug the app logic on the editor, without executing the ARFoundation code. We also need a new set of camera controls to navigate in the 3D space.

Therefore, I added two additional scripts, Debug Switch and Debug Camera. There are also slight modifications to StartPanelManager and InputManager.

Start Panel Manger

By using a state machine, we put the AR plane-finding logic in the FindPlane state, and put non-AR logic in other states. This achieves a natural separation of logic. If I skip the FindPlane state, I will not invoke the ARFoundation code.

The entry point of the app is in StartPanelManager, when the user will be prompted to select a language and toggle the tutorials. In the Confirm() method, the script will set the next state after the user confirmed her choice. If it detects that the app is running in the editor, it would skip FindPlane stage completely.

Input Manager

The input is managed by the Unity Event System. For more information, see Interaction System. Long story short, it supports multiple kinds of input, including screen touch and mouse click. Thus, we do not need significant changes to our input system.

The only thing we need to adapt is the "double tap" on the screen. Although this is not used in the main logic, it would still be nice to have it in case we need to change our interaction. We can treat a mouse right click as a double tap, which is the common approach. A couple of if statements in the Input Manager should do the trick.

Debug Camera

To navigate in the 3D scene, we need to move our camera. I adapted the script from http://wiki.unity3d.com/index.php/SmoothMouseLook to make a simple debug camera that runs only in the editor. This script is supposed to work in full screen, and will not work well in play mode, but it should be enough for simple camera rotation.

Debug Switch

Finally we need to switch between the debug camera and the AR camera, along with all ARFoundation components, depending on the device we are running. The script simply does that.

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Yue Wu edited this page Jun 17, 2020 · 5 revisions

It is rather tedious to build the app to the mobile device every time you change some code and wish to test. The old ARKit library contains a plugin called ARKitRemote that allows you to debug the app with the iOS device without having to deploy the app to the device. With ARKitRemote, you are able to test all AR features, including plane tracking.

ARFoundation, on the other hand, does not have a proper remote debugging tool. However, our app is not AR-heavy as we are only using the plane-tracking functionality of ARFoundation. This means that if we can separate plane finding and the rest of the logic, we can debug the app logic on the editor, without executing the ARFoundation code. We also need a new set of camera controls to navigate in the 3D space.

Therefore, I added two additional scripts, Debug Switch and Debug Camera. There are also slight modifications to StartPanelManager and InputManager.

Start Panel Manger

By using a state machine, we put the AR plane-finding logic in the FindPlane state, and put non-AR logic in other states. This achieves a natural separation of logic. If I skip the FindPlane state, I will not invoke the ARFoundation code.

The entry point of the app is in StartPanelManager, when the user will be prompted to select a language and toggle the tutorials. In the Confirm() method, the script will set the next state after the user confirmed her choice. If it detects that the app is running in the editor, it would skip FindPlane stage completely.

Input Manager

The input is managed by the Unity Event System. For more information, see Interaction System. Long story short, it supports multiple kinds of input, including screen touch and mouse click. Thus, we do not need significant changes to our input system.

The only thing we need to adapt is the "double tap" on the screen. Although this is not used in the main logic, it would still be nice to have it in case we need to change our interaction. We can treat a mouse right click as a double tap, which is the common approach. A couple of if statements in the Input Manager should do the trick.

Debug Camera

To navigate in the 3D scene, we need to move our camera. I adapted the script from http://wiki.unity3d.com/index.php/SmoothMouseLook to make a simple debug camera that runs only in the editor. This script is supposed to work in full screen, and will not work well in play mode, but it should be enough for simple camera rotation.

Debug Switch

Finally we need to switch between the debug camera and the AR camera, along with all ARFoundation components, depending on the device we are running. The script simply does that.

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
Yue Wu edited this page Jun 17, 2020 · 5 revisions

It is rather tedious to build the app to the mobile device every time you change some code and wish to test. The old ARKit library contains a plugin called ARKitRemote that allows you to debug the app with the iOS device without having to deploy the app to the device. With ARKitRemote, you are able to test all AR features, including plane tracking.

ARFoundation, on the other hand, does not have a proper remote debugging tool. However, our app is not AR-heavy as we are only using the plane-tracking functionality of ARFoundation. This means that if we can separate plane finding and the rest of the logic, we can debug the app logic on the editor, without executing the ARFoundation code. We also need a new set of camera controls to navigate in the 3D space.

Therefore, I added two additional scripts, Debug Switch and Debug Camera. There are also slight modifications to StartPanelManager and InputManager.

Start Panel Manger

By using a state machine, we put the AR plane-finding logic in the FindPlane state, and put non-AR logic in other states. This achieves a natural separation of logic. If I skip the FindPlane state, I will not invoke the ARFoundation code.

The entry point of the app is in StartPanelManager, when the user will be prompted to select a language and toggle the tutorials. In the Confirm() method, the script will set the next state after the user confirmed her choice. If it detects that the app is running in the editor, it would skip FindPlane stage completely.

Input Manager

The input is managed by the Unity Event System. For more information, see Interaction System. Long story short, it supports multiple kinds of input, including screen touch and mouse click. Thus, we do not need significant changes to our input system.

The only thing we need to adapt is the "double tap" on the screen. Although this is not used in the main logic, it would still be nice to have it in case we need to change our interaction. We can treat a mouse right click as a double tap, which is the common approach. A couple of if statements in the Input Manager should do the trick.

Debug Camera

To navigate in the 3D scene, we need to move our camera. I adapted the script from http://wiki.unity3d.com/index.php/SmoothMouseLook to make a simple debug camera that runs only in the editor. This script is supposed to work in full screen, and will not work well in play mode, but it should be enough for simple camera rotation.

Debug Switch

Finally we need to switch between the debug camera and the AR camera, along with all ARFoundation components, depending on the device we are running. The script simply does that.

Clone this wiki locally

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content
Yue Wu edited this page Jun 17, 2020 · 5 revisions

It is rather tedious to build the app to the mobile device every time you change some code and wish to test. The old ARKit library contains a plugin called ARKitRemote that allows you to debug the app with the iOS device without having to deploy the app to the device. With ARKitRemote, you are able to test all AR features, including plane tracking.

ARFoundation, on the other hand, does not have a proper remote debugging tool. However, our app is not AR-heavy as we are only using the plane-tracking functionality of ARFoundation. This means that if we can separate plane finding and the rest of the logic, we can debug the app logic on the editor, without executing the ARFoundation code. We also need a new set of camera controls to navigate in the 3D space.

Therefore, I added two additional scripts, Debug Switch and Debug Camera. There are also slight modifications to StartPanelManager and InputManager.

Start Panel Manger

By using a state machine, we put the AR plane-finding logic in the FindPlane state, and put non-AR logic in other states. This achieves a natural separation of logic. If I skip the FindPlane state, I will not invoke the ARFoundation code.

The entry point of the app is in StartPanelManager, when the user will be prompted to select a language and toggle the tutorials. In the Confirm() method, the script will set the next state after the user confirmed her choice. If it detects that the app is running in the editor, it would skip FindPlane stage completely.

Input Manager

The input is managed by the Unity Event System. For more information, see Interaction System. Long story short, it supports multiple kinds of input, including screen touch and mouse click. Thus, we do not need significant changes to our input system.

The only thing we need to adapt is the "double tap" on the screen. Although this is not used in the main logic, it would still be nice to have it in case we need to change our interaction. We can treat a mouse right click as a double tap, which is the common approach. A couple of if statements in the Input Manager should do the trick.

Debug Camera

To navigate in the 3D scene, we need to move our camera. I adapted the script from http://wiki.unity3d.com/index.php/SmoothMouseLook to make a simple debug camera that runs only in the editor. This script is supposed to work in full screen, and will not work well in play mode, but it should be enough for simple camera rotation.

Debug Switch

Finally we need to switch between the debug camera and the AR camera, along with all ARFoundation components, depending on the device we are running. The script simply does that.

Clone this wiki locally