Difference between revisions of "Userscript experimental local features"
From UnionCloud Support
(violentmonkey not violetmonkey) |
|||
| (One intermediate revision by one other user not shown) | |||
| Line 6: | Line 6: | ||
A user script is a small javascript file which modifies websites as they run locally on your machine. | A user script is a small javascript file which modifies websites as they run locally on your machine. | ||
| − | == Why would I want | + | == Why would I want to do that? == |
| − | To tweak your experience as a stop gap solution whose features will eventually be added to the platform by NUS. See ideas on get satisfaction. | + | To tweak your experience as a stop gap solution whose features will eventually be added to the platform by NUS. See ideas on get satisfaction. |
== Example Features == | == Example Features == | ||
| − | A staff logon button for the homepage. (On our page we have to click sign | + | A staff logon button for the homepage.(On our page, we have to click sign them, then select a non student.) |
I have added Links to the navigation to automatically view all: | I have added Links to the navigation to automatically view all: | ||
# Events | # Events | ||
| Line 18: | Line 18: | ||
# Promotions | # Promotions | ||
# Groups | # Groups | ||
| + | # Articles | ||
| + | # Resources | ||
| + | # Positions | ||
It appends new links to the DOM with | It appends new links to the DOM with | ||
| Line 23: | Line 26: | ||
?grid%5Border%5D=start_date&grid%5Border_direction%5D=asc&grid%5Bpp%5D=189 | ?grid%5Border%5D=start_date&grid%5Border_direction%5D=asc&grid%5Bpp%5D=189 | ||
| − | + | Where D is the total number of results at the end of the chosen section. | |
| − | |||
| − | |||
| − | |||
| − | |||
| + | '''Hide items marked as deleted in the shop: | ||
| + | ''' | ||
if(location.pathname=="/administrator/products"){ | if(location.pathname=="/administrator/products"){ | ||
$("tr td:contains('OLD Clothing Stock')").parent().hide(); | $("tr td:contains('OLD Clothing Stock')").parent().hide(); | ||
| Line 35: | Line 36: | ||
| − | + | '''Adding a save button direct from product edit page: | |
| + | ''' | ||
| + | |||
| + | This is done by loading the product variants page in a frame on the side. | ||
| + | |||
| + | <pre> if(location.pathname.match(/^\/administrator\/products\/\d\d\d\d\/edit/)){ var x = window.location.href.match(/(.*)(\/\d*)/)[1]+/product_variants/ document.body.innerHTML += '<div style="display:block;position:absolute;top:47%;left:91%;z-index:997;"><iframe id="saver" src="" frameborder="0" allowtransparency="yes" scrolling="no" style="border: 0px none; margin-left: -36px; height: 912px; margin-top: -480px; width: 650px;position:relative; left:-20px;top:30px;" ></iframe> </div>'; var saverFrame = document.getElementById("saver") saverFrame.src=x </pre> | ||
| + | |||
| + | '''Adding a next ticket button on hover: | ||
| + | ''' | ||
| + | |||
| + | Increments the final number in the URL to load the next ticket on hover over the new button. | ||
| − | + | <pre> | |
| + | if (/event_ticket_types/.test(window.location.href)) { | ||
| + | $(".button-holder").attr("id","nextTicketButton"); | ||
| + | var nextTicketButton = document.getElementById('nextTicketButton'); | ||
| + | nextTicketButton.insertAdjacentHTML('afterend','<button id="nxtTicketBtn" style="transform:translate(300%,-165%);border:0" class="btn btn-default">Next Ticket Hover</button>'); | ||
| + | var nextTicketFinal = document.getElementById('nxtTicketBtn'); | ||
| + | nextTicketFinal.addEventListener("mouseover",function(){ | ||
| + | var e, s; | ||
| + | var IB = 1; | ||
| + | function isDigit(c) { | ||
| + | return ("0" <= c && c <= "9"); | ||
| + | } | ||
| + | var L = location.href; | ||
| + | var LL = L.length; | ||
| + | for (e = LL - 1; e >= 0; --e) | ||
| + | if (isDigit(L.charAt(e))) { | ||
| + | for (s = e - 1; s >= 0; --s) | ||
| + | if (!isDigit(L.charAt(s))) break; | ||
| + | break; | ||
| + | }++s; | ||
| + | if (e < 0) return; | ||
| + | var oldNum = L.substring(s, e + 1); | ||
| + | var newNum = "" + (parseInt(oldNum, 10) + IB); | ||
| + | while (newNum.length < oldNum.length) newNum = "0" + newNum; | ||
| + | location.href = L.substring(0, s) + newNum + L.slice(e + 1); | ||
| + | }); | ||
| + | } | ||
| + | </pre> | ||
== How do I get started == | == How do I get started == | ||
Latest revision as of 12:07, 15 August 2018
After collecting feedback in certain areas of the dashboard I implemented by own test userscript (Example given NTSU) to ease use of the dashboard.
Contents
What is a userscript?
A user script is a small javascript file which modifies websites as they run locally on your machine.
Why would I want to do that?
To tweak your experience as a stop gap solution whose features will eventually be added to the platform by NUS. See ideas on get satisfaction.
Example Features
A staff logon button for the homepage.(On our page, we have to click sign them, then select a non student.) I have added Links to the navigation to automatically view all:
- Events
- Products
- Promotions
- Groups
- Articles
- Resources
- Positions
It appends new links to the DOM with
?grid%5Border%5D=start_date&grid%5Border_direction%5D=asc&grid%5Bpp%5D=189
Where D is the total number of results at the end of the chosen section.
Hide items marked as deleted in the shop:
if(location.pathname=="/administrator/products"){
$("tr td:contains('OLD Clothing Stock')").parent().hide();
$("tr td:contains('Delete')").parent().hide();
};
Adding a save button direct from product edit page:
This is done by loading the product variants page in a frame on the side.
if(location.pathname.match(/^\/administrator\/products\/\d\d\d\d\/edit/)){ var x = window.location.href.match(/(.*)(\/\d*)/)[1]+/product_variants/ document.body.innerHTML += '<div style="display:block;position:absolute;top:47%;left:91%;z-index:997;"><iframe id="saver" src="" frameborder="0" allowtransparency="yes" scrolling="no" style="border: 0px none; margin-left: -36px; height: 912px; margin-top: -480px; width: 650px;position:relative; left:-20px;top:30px;" ></iframe> </div>'; var saverFrame = document.getElementById("saver") saverFrame.src=x
Adding a next ticket button on hover:
Increments the final number in the URL to load the next ticket on hover over the new button.
if (/event_ticket_types/.test(window.location.href)) {
$(".button-holder").attr("id","nextTicketButton");
var nextTicketButton = document.getElementById('nextTicketButton');
nextTicketButton.insertAdjacentHTML('afterend','<button id="nxtTicketBtn" style="transform:translate(300%,-165%);border:0" class="btn btn-default">Next Ticket Hover</button>');
var nextTicketFinal = document.getElementById('nxtTicketBtn');
nextTicketFinal.addEventListener("mouseover",function(){
var e, s;
var IB = 1;
function isDigit(c) {
return ("0" <= c && c <= "9");
}
var L = location.href;
var LL = L.length;
for (e = LL - 1; e >= 0; --e)
if (isDigit(L.charAt(e))) {
for (s = e - 1; s >= 0; --s)
if (!isDigit(L.charAt(s))) break;
break;
}++s;
if (e < 0) return;
var oldNum = L.substring(s, e + 1);
var newNum = "" + (parseInt(oldNum, 10) + IB);
while (newNum.length < oldNum.length) newNum = "0" + newNum;
location.href = L.substring(0, s) + newNum + L.slice(e + 1);
});
}
How do I get started
Install violentmonkey (link assumes chrome available on firefox/opera/maxthon)
Install the script from here
Open dashboard
Edit
What if I have caused issues?
Really easy to disable just a couple of clicks
Notes on the script:
- Specific to trentstudents.org
- Not public i.e. unlisted on directory
- Requires a userscript manager (install page for Violentmonkey recommended)
- Should be easily adaptable source viewable here
