nhm91135 Posted October 6, 2023 Posted October 6, 2023 (edited) 6 hours ago, Squid said: Not all .page files (built in pages) are compatible with being able to be displayed as a tab due to their design. But, in this particular case, why would you want Docker Containers to be shown as a tab when they're already shown in the existing Docker tab??? I was hoping that it would be the Containers box from the Dashboard because when trying to open a WebGui from my phone, I have to zoom in on the Container box but then the Select List to open the gui opens off of the screen to the left, so I have to zoom out, a bit, hopefully enough to see the select list. I understand now that Custom Tab is not for that. Still, having the container box from dashboard by itself on a page would be amazing. We did something similar in our own software, maybe my mind is node locked, Thanks. Edited October 6, 2023 by nhm91135 Quote
Squid Posted October 6, 2023 Author Posted October 6, 2023 8 hours ago, nhm91135 said: Dashboard Dashboard works completely different Quote
dixtdf Posted October 17, 2023 Posted October 17, 2023 (edited) I have done everything for a better experience, and I hope not to be held accountable for using the following methods I hope the author of 'Custom Tab' can see this code, which implements adaptive window size The current form can only be set to a fixed size and is not friendly for devices with different resolutions I hope to add an adaptive window size option, and I can only temporarily resolve it this way until further updates arrive // ==UserScript== // @name Unraid Custom Tab自适应窗体大小 // @namespace https://github.com/dixtdf/Unraid-Custom-Tab-Adaptive-Window-Size // @version 1.0 // @description 窗体宽高随意设置即可 // @author dixtdf // @match http*://*/* // @icon https://upload.forums.unraid.net/live/monthly_2017_05/customlarge.png.e0cb690d73cea725de6927fc0abce6a7.png // @grant none // @license MIT // ==/UserScript== (function() { function onWindowResize() { let elementsByClassName = window.document.getElementsByClassName("content shift"); if (elementsByClassName.length>0){ let computedStyle = window.getComputedStyle(elementsByClassName[0].querySelector(".title")); if (computedStyle){ let height = window.innerHeight-( window.document.getElementById("header").offsetHeight +window.document.getElementById("menu").offsetHeight +(window.document.getElementById("footer")!=null?window.document.getElementById("footer").offsetHeight:26) +parseInt(computedStyle.getPropertyValue("height").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-top").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-bottom").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("margin-top").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("margin-bottom").replace("px",""), 10) +30 ) let width=parseInt(computedStyle.getPropertyValue("width").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-left").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-right").replace("px",""), 10) let iframeElement = window.document.querySelector(".content.shift iframe"); iframeElement.style.width = width+"px"; iframeElement.style.height = height+"px"; iframeElement.style.border = "0px"; } } } window.addEventListener("resize", function() { clearTimeout(window.resizedFinished); window.resizedFinished = setTimeout(onWindowResize, 200); }); onWindowResize(); })(); Of course, you can manually edit/usr/local/emhttp/plugins/customtabtemp/View *. page to insert the following code into the last line, which can achieve the same effect <script> function onWindowResize() { let elementsByClassName = window.document.getElementsByClassName("content shift"); if (elementsByClassName.length>0){ let computedStyle = window.getComputedStyle(elementsByClassName[0].querySelector(".title")); if (computedStyle){ let height = window.innerHeight-( window.document.getElementById("header").offsetHeight +window.document.getElementById("menu").offsetHeight +(window.document.getElementById("footer")!=null?window.document.getElementById("footer").offsetHeight:26) +parseInt(computedStyle.getPropertyValue("height").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-top").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-bottom").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("margin-top").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("margin-bottom").replace("px",""), 10) +30 ) let width=parseInt(computedStyle.getPropertyValue("width").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-left").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-right").replace("px",""), 10) let iframeElement = window.document.querySelector(".content.shift iframe"); iframeElement.style.width = width+"px"; iframeElement.style.height = height+"px"; iframeElement.style.border = "0px"; } } } window.addEventListener("resize", function() { clearTimeout(window.resizedFinished); window.resizedFinished = setTimeout(onWindowResize, 200); }); onWindowResize(); </script> Edited October 17, 2023 by dixtdf 1 Quote
cinereus Posted December 23, 2023 Posted December 23, 2023 On 6/18/2017 at 4:43 PM, Squid said: Added in support for custom tabs when using 6.4 RC3+ and the Azure / Gray themes Dynamix utilizes font-awesome for the new themes. A new entry on each Custom Tab setting will allow you to enter in the appropriate font-awesome code for the icon. This is a list of the font-awesome codes: http://fontawesome.io/cheatsheet/ When looking at it, you'll see entries like: fa-envelope [] What you need to enter for this particular icon is f0e0 Entering in an invalid code may result in strange results from dynamix (but doesn't appear to cause any crashing of unRaid's UI) Icons don't work... 1 Quote
FutyMax Posted June 29, 2024 Posted June 29, 2024 Hey, just a heads up. The link that points to this post in the plugin configuration is broken. In the text "Tab Position (see HERE)" the link in "HERE" points to https://lime-technology.com/forums/topic/57109-plugin-custom-tab/ and should be https://forums.unraid.net/topic/57109-plugin-custom-tab/ instead (because from the lime-technology domain it gets redirected to https://unraid.net/forums/topic/57109-plugin-custom-tab/ having "forums" as a page instead of a subdomain) Quote
ronia Posted July 8, 2024 Posted July 8, 2024 On 10/16/2023 at 11:23 PM, dixtdf said: I have done everything for a better experience, and I hope not to be held accountable for using the following methods I hope the author of 'Custom Tab' can see this code, which implements adaptive window size The current form can only be set to a fixed size and is not friendly for devices with different resolutions I hope to add an adaptive window size option, and I can only temporarily resolve it this way until further updates arrive // ==UserScript== // @name Unraid Custom Tab自适应窗体大小 // @namespace https://github.com/dixtdf/Unraid-Custom-Tab-Adaptive-Window-Size // @version 1.0 // @description 窗体宽高随意设置即可 // @author dixtdf // @match http*://*/* // @icon https://upload.forums.unraid.net/live/monthly_2017_05/customlarge.png.e0cb690d73cea725de6927fc0abce6a7.png // @grant none // @license MIT // ==/UserScript== (function() { function onWindowResize() { let elementsByClassName = window.document.getElementsByClassName("content shift"); if (elementsByClassName.length>0){ let computedStyle = window.getComputedStyle(elementsByClassName[0].querySelector(".title")); if (computedStyle){ let height = window.innerHeight-( window.document.getElementById("header").offsetHeight +window.document.getElementById("menu").offsetHeight +(window.document.getElementById("footer")!=null?window.document.getElementById("footer").offsetHeight:26) +parseInt(computedStyle.getPropertyValue("height").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-top").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-bottom").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("margin-top").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("margin-bottom").replace("px",""), 10) +30 ) let width=parseInt(computedStyle.getPropertyValue("width").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-left").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-right").replace("px",""), 10) let iframeElement = window.document.querySelector(".content.shift iframe"); iframeElement.style.width = width+"px"; iframeElement.style.height = height+"px"; iframeElement.style.border = "0px"; } } } window.addEventListener("resize", function() { clearTimeout(window.resizedFinished); window.resizedFinished = setTimeout(onWindowResize, 200); }); onWindowResize(); })(); Of course, you can manually edit/usr/local/emhttp/plugins/customtabtemp/View *. page to insert the following code into the last line, which can achieve the same effect <script> function onWindowResize() { let elementsByClassName = window.document.getElementsByClassName("content shift"); if (elementsByClassName.length>0){ let computedStyle = window.getComputedStyle(elementsByClassName[0].querySelector(".title")); if (computedStyle){ let height = window.innerHeight-( window.document.getElementById("header").offsetHeight +window.document.getElementById("menu").offsetHeight +(window.document.getElementById("footer")!=null?window.document.getElementById("footer").offsetHeight:26) +parseInt(computedStyle.getPropertyValue("height").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-top").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-bottom").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("margin-top").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("margin-bottom").replace("px",""), 10) +30 ) let width=parseInt(computedStyle.getPropertyValue("width").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-left").replace("px",""), 10) +parseInt(computedStyle.getPropertyValue("padding-right").replace("px",""), 10) let iframeElement = window.document.querySelector(".content.shift iframe"); iframeElement.style.width = width+"px"; iframeElement.style.height = height+"px"; iframeElement.style.border = "0px"; } } } window.addEventListener("resize", function() { clearTimeout(window.resizedFinished); window.resizedFinished = setTimeout(onWindowResize, 200); }); onWindowResize(); </script> Thanks. I used your solution and it worked great. Another thing you can do is create a file: /boot/config/plugins/customtab/resize.php Then paste the full contents of the <script>...</script> into that file. Then replace this line in /usr/local/emhttp/plugins/customtab/scripts/createTab.php line 121 (the logic that affects 'URL' type tabs): file_put_contents("/usr/local/emhttp/plugins/customtabtemp/$name".mt_rand().".page",$page); Replace with: $mtname = "$name".mt_rand(); file_put_contents("/usr/local/emhttp/plugins/customtabtemp/$mtname.page",$page); file_put_contents("/usr/local/emhttp/plugins/customtabtemp/$mtname.page", file_get_contents('/boot/config/plugins/customtab/resize.php'), FILE_APPEND | LOCK_EX); Bonus points, you can replace the file within /boot/config/plugins/customtab/customtab-[date stamp].txz and re-tar the file and I believe this should make it persistent across reboots. Quote
dixtdf Posted July 8, 2024 Posted July 8, 2024 1 hour ago, ronia said: Thanks. I used your solution and it worked great. Another thing you can do is create a file: /boot/config/plugins/customtab/resize.php Then paste the full contents of the <script>...</script> into that file. Then replace this line in /usr/local/emhttp/plugins/customtab/scripts/createTab.php line 121 (the logic that affects 'URL' type tabs): file_put_contents("/usr/local/emhttp/plugins/customtabtemp/$name".mt_rand().".page",$page); Replace with: $mtname = "$name".mt_rand(); file_put_contents("/usr/local/emhttp/plugins/customtabtemp/$mtname.page",$page); file_put_contents("/usr/local/emhttp/plugins/customtabtemp/$mtname.page", file_get_contents('/boot/config/plugins/customtab/resize.php'), FILE_APPEND | LOCK_EX); Bonus points, you can replace the file within /boot/config/plugins/customtab/customtab-[date stamp].txz and re-tar the file and I believe this should make it persistent across reboots. @ronia I actually made this plugin and it worked better, but it seems that officials don't want individuals to develop plugins and I couldn't get it on the shelf, so I gave up on continuing to optimize it. If you're interested, give it a try, it hasn't been updated in over half a year https://github.com/dixtdf/taglib/blob/master/plugins/taglib.plg https://github.com/dixtdf/taglib/blob/master/releases/taglib-2023.11.30.txz Quote
primeval_god Posted July 8, 2024 Posted July 8, 2024 (edited) 6 hours ago, dixtdf said: @ronia I actually made this plugin and it worked better, but it seems that officials don't want individuals to develop plugins and I couldn't get it on the shelf, so I gave up on continuing to optimize it. Not sure what you mean here? Your app does appear to be available via community applications. Edited July 8, 2024 by primeval_god Quote
dixtdf Posted July 10, 2024 Posted July 10, 2024 (edited) @primeval_godIs that right? Then I'll try it in a while. I've been so busy with work lately. Edited July 10, 2024 by dixtdf Quote
wassereimer Posted July 10, 2024 Posted July 10, 2024 @dixtdf I can confirm that I can find the Plugin. Installation also works. I just can't set it up, because it's in Chinese. 😅 Also as an information: After installation on the App Site, if you click on Actions and then Settings: You land on a blank Page. Going through the Settings Page to your Plugin works. Would be great if the Plugin would be available in English. 🙂 Quote
dixtdf Posted July 10, 2024 Posted July 10, 2024 @wassereimerIf I can get it on the shelf properly, I'll add internationalization in the future, I didn't continue to develop it because I didn't find a way to get it on the shelf at the time, but now maybe you can use Chrome/Edge for webpage translation for temporary use!By the way can someone tell me how to apply for a shelf? Quote
jcofer555 Posted July 25, 2024 Posted July 25, 2024 is it possible to make rows with the tabs rather than just extending the row of current tabs? screenshot for a rudimentary example Quote
danioj Posted July 25, 2024 Posted July 25, 2024 (edited) Nice Plugin, thank you. Dead link on the settings page: Tab Position (see HERE) Edited July 25, 2024 by danioj Quote
dixtdf Posted August 5, 2024 Posted August 5, 2024 (edited) On 7/10/2024 at 4:29 PM, wassereimer said: @dixtdf I can confirm that I can find the Plugin. Installation also works. I just can't set it up, because it's in Chinese. 😅 Also as an information: After installation on the App Site, if you click on Actions and then Settings: You land on a blank Page. Going through the Settings Page to your Plugin works. Would be great if the Plugin would be available in English. 🙂 @wassereimerYou might want to try updating it, it's now compatible with multiple languages, the language might not be perfect yet, fix it for the next version and experience it first, it works better than before because I refactored it using VUE Sorry it's late, I've been really busy with work. By the way, please backup /boot/config/plugins/taglib/taglib.json before updating, as the structure has been changed Edited August 5, 2024 by dixtdf Quote
wassereimer Posted August 6, 2024 Posted August 6, 2024 (edited) @dixtdfThe Settings-Page from the Plugin stays blank. In the Firefox Dev-Console i've got an error. Edited August 6, 2024 by wassereimer Quote
dixtdf Posted August 6, 2024 Posted August 6, 2024 @wassereimerI didn't find the issue in ubuntu firefox-128 version, I'm using fetch api, theoretically Firefox 39+ can use that api, you can try refreshing the page and then reclick on settings->taglib. Plugins->taglib->settings The link to the jump is not correct, I don't know why triggering it here carries /Apps Quote
wassereimer Posted August 7, 2024 Posted August 7, 2024 (edited) @dixtdf I'm on Firefox 129 on Windows. I reinstalled it and got to the Plugin-Settings though settings->taglib. If I do a hard-refresh to clear the Browser-Cache, I can see a flicker from something - nothing more. firefox_2024-08-07_18-46-04.mp4 Edited August 7, 2024 by wassereimer Quote
dixtdf Posted August 8, 2024 Posted August 8, 2024 @wassereimerIt doesn't seem to be reproducible, I'm trying to upgrade unraid to 6.12.11, hopefully I'll be able to find the problem! Quote
motoflyer Posted August 11, 2024 Posted August 11, 2024 Unraid Version: 6.12.11 custom tab version installed: 2023.02.26 error: creating once again the same tab name after deleting it, it shows after the name a "_" Is there a solution for it? see below picture: Quote
foo_fighter Posted September 7, 2024 Posted September 7, 2024 Is it possible to implement a tab that is a pulldown menu of URLs? I don't have enough real estate for many tabs but would like to add quick short cuts to Immich, Syncthing, Paperless, Frigate, Nextclock and a bunch of other dockers on the tab menu for convenience. Quote
beeper Posted October 30, 2024 Posted October 30, 2024 On 9/7/2024 at 7:36 PM, foo_fighter said: Is it possible to implement a tab that is a pulldown menu of URLs? I don't have enough real estate for many tabs but would like to add quick short cuts to Immich, Syncthing, Paperless, Frigate, Nextclock and a bunch of other dockers on the tab menu for convenience. That would be a very cool feature. Hopefully it's possible to implement it in a future version. Quote
erf89 Posted December 7, 2024 Posted December 7, 2024 Not sure if this is a bug when using in 7.0.0-rc1, but I can no longer see the Tab Name or URL options. I had an existing tab setup so that is preserved, but my tab for User Scripts I just created is called Custom1 and I can't seem to rename it Quote
Squid Posted December 7, 2024 Author Posted December 7, 2024 1 hour ago, erf89 said: Not sure if this is a bug when using in 7.0.0-rc1, but I can no longer see the Tab Name or URL options. I had an existing tab setup so that is preserved, but my tab for User Scripts I just created is called Custom1 and I can't seem to rename it Try today's update. It all worked for me, but there was an HTML error the Chrome was complaining about which may have caused you issues depending upon Browser versions and its settings 1 Quote
erf89 Posted December 7, 2024 Posted December 7, 2024 1 hour ago, Squid said: Try today's update. It all worked for me, but there was an HTML error the Chrome was complaining about which may have caused you issues depending upon Browser versions and its settings All working, thanks! Quote
Mattaton Posted January 30 Posted January 30 Doesn't seem adding a code for an icon does anything. Does that only work for themes with the tabs down the left side of the page? Thanks! Quote
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.