Redecorate florr.io with your style.
目前為
// ==UserScript==
// @name florr.io | Rarity Color customizer
// @namespace Hai
// @version 2.0.0
// @description Redecorate florr.io with your style.
// @author Furaken
// @match https://florr.io/*
// @license MIT
// ==/UserScript==
// If you have seen a version of this script somewhere, it is a modified version of very first version of this script which is unpublished.
// Remember to refresh page after saving to apply changes.
// --- EDITABLE PART ---
var changeSets = [ // [Input rarity, Output rarity]
["Ultra", "Shiny Ultra"],
["Super", "Shiny Super"]
]
/* Avaible Color Author
[
"Common",
"Unusual",
"Rare",
"Epic",
"Legendary",
"Mythic",
"Ultra",
"Super",
"Black Ultra",
"Orange Ultra",
"Hel", Furaken
"Shiny Ultra" Furaken
"Shiny Super" Furaken
"Chaos", TechCourse
"Effulgent", TechCourse & Kosuken
"Cataclysmic", TechCourse & Kosuken
"Abyssal", TechCourse & Kosuken
"Radiant", Kosuken
]
*/
/* To rename a rarity, add a "name" as that rarity key.
* Example:
"Black Ultra": {
name: "Dark",
background: "#444444",
border: "#373737",
shade: "#303030"
}
* Ctrl F to find a rarity quicker.
*/
var ctx = document.getElementById("canvas").getContext("2d")
var customColors = { // https://colorkit.io/
Common: {
background: "#7eef6d",
border: "#66c258",
shade: "#519946",
light: "#8af07b"
},
Unusual: {
background: "#ffe65d",
border: "#cfba4b",
shade: "#a3933c",
light: "#ffe86d"
},
Rare: {
background: "#4d52e3",
border: "#3e42b8",
shade: "#313491",
light: "#5e63e5"
},
Epic: {
background: "#861fde",
border: "#6d19b4",
shade: "#56148e",
light: "#9235e1"
},
Legendary: {
background: "#de1f1f",
border: "#b41919",
shade: "#8e1414",
light: "#e13535",
},
Mythic: {
background: "#1fdbde",
border: "#19b1b4",
shade: "#148c8e",
light: "#35dee1"
},
Ultra: {
background: "#ff2b75",
border: "#cf235f",
shade: "#a31c4b",
light: "#ff4082"
},
Super: {
background: "#2bffa3",
border: "#23cf84",
shade: "#1ca368",
light: "#40ffac"
},
"Black Ultra": { // Some colors here may not be accurate as they are taken from old screenshots we have.
name: "Dark", // If this line does not exist, petal rarity will change to "Black Ultra" instead of "Ultra"
background: "#444444",
border: "#373737",
shade: "#303030",
light: "#575757"
},
"Orange Ultra": { // Some colors here may not be accurate as they are taken from old screenshots we have.
name: "Celestial",
background: "#fcbf2c",
border: "#cf9a2c",
shade: "#916e17",
light: "#ffc747"
},
Hel: {
background: "#8f3838",
border: "#742d2d",
shade: "#5c2d2d",
light: "#9f4f4f"
},
"Shiny Ultra": { // Learn to how to create your own linear gradient: https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/createLinearGradient
name: "Ultra",
background: function(x0, y0, x1, y1) {
var thisx0, thisy0, thisx1, thisy1
if (x0 == null) {
thisx0 = 0
thisy0 = 0
} else {
thisx0 = x0 * 1
thisy0 = y0 * 1
}
if (x1 == null) {
thisx1 = thisx0 + 100
thisy1 = thisy0 + 100
} else {
thisx1 = x1 * 3.5
thisy1 = y1 * 3.5
}
var gradient = ctx.createLinearGradient(thisx0, thisy0, thisx1, thisy1)
gradient.addColorStop(0, "#ff2b75")
gradient.addColorStop(1, "#b12b5a")
return gradient
},
border: function(x0, y0, x1, y1) {
var thisx0, thisy0, thisx1, thisy1
if (x0 == null) {
thisx0 = 0
thisy0 = 0
} else {
thisx0 = x0 * 1
thisy0 = y0 * 1
}
if (x1 == null) {
thisx1 = thisx0 + 50
thisy1 = thisy0 + 50
} else {
thisx1 = x1 * 2
thisy1 = y1 * 2
}
var gradient = ctx.createLinearGradient(thisx0, thisy0, thisx1, thisy1)
gradient.addColorStop(0, "#cf235f")
gradient.addColorStop(1, "#7f2747")
return gradient
},
shade: function(x0, y0, x1, y1) {
var thisx0, thisy0, thisx1, thisy1
if (x0 == null) {
thisx0 = 0
thisy0 = 0
} else {
thisx0 = x0 * 1
thisy0 = y0 * 1
}
if (x1 == null) {
thisx1 = thisx0 + 100
thisy1 = thisy0 + 100
} else {
thisx1 = x1 * 3
thisy1 = y1 * 3
}
var gradient = ctx.createLinearGradient(thisx0, thisy0, thisx1, thisy1)
gradient.addColorStop(0, "#a31c4b")
gradient.addColorStop(1, "#67243b")
return gradient
},
light: "#b73f6f"
},
"Shiny Super": {
name: "Super",
background: function(x0, y0, x1, y1) {
var thisx0, thisy0, thisx1, thisy1
if (x0 == null) {
thisx0 = 0
thisy0 = 0
} else {
thisx0 = x0 * 1
thisy0 = y0 * 1
}
if (x1 == null) {
thisx1 = thisx0 + 100
thisy1 = thisy0 + 100
} else {
thisx1 = x1 * 3.5
thisy1 = y1 * 3.5
}
var gradient = ctx.createLinearGradient(thisx0, thisy0, thisx1, thisy1)
gradient.addColorStop(0, "#2bffa3")
gradient.addColorStop(1, "#2b9f6f")
return gradient
},
border: function(x0, y0, x1, y1) {
var thisx0, thisy0, thisx1, thisy1
if (x0 == null) {
thisx0 = 0
thisy0 = 0
} else {
thisx0 = x0 * 1
thisy0 = y0 * 1
}
if (x1 == null) {
thisx1 = thisx0 + 50
thisy1 = thisy0 + 50
} else {
thisx1 = x1 * 2
thisy1 = y1 * 2
}
var gradient = ctx.createLinearGradient(thisx0, thisy0, thisx1, thisy1)
gradient.addColorStop(0, "#23cf84")
gradient.addColorStop(1, "#277f58")
return gradient
},
shade: function(x0, y0, x1, y1) {
var thisx0, thisy0, thisx1, thisy1
if (x0 == null) {
thisx0 = 0
thisy0 = 0
} else {
thisx0 = x0 * 1
thisy0 = y0 * 1
}
if (x1 == null) {
thisx1 = thisx0 + 100
thisy1 = thisy0 + 100
} else {
thisx1 = x1 * 3
thisy1 = y1 * 3
}
var gradient = ctx.createLinearGradient(thisx0, thisy0, thisx1, thisy1)
gradient.addColorStop(0, "#1ca368")
gradient.addColorStop(1, "#246748")
return gradient
},
light: "#3fa77f"
},
Chaos: {
background: "#293188",
border: "#21286e",
shade: "#151a47",
light: "#3f4797"
},
Effulgent: {
background: "#ffbbf0",
border: "#d097c2",
shade: "#bd65aa",
light: "#ffbfef"
},
Cataclysmic: {
background: "#9a0000",
border: "#750000",
shade: "#550000",
light: "#b23b3b"
},
Abyssal: {
background: "#0a526d",
border: "#093849",
shade: "#22343d",
light: "#27677f"
},
Radiant: {
background: "#f34bb5",
border: "#ce3f9a",
shade: "#b13f88",
light: "#f75fbf"
}
}
// --- DO NOT MODIFY PARTS BELOW ---
var defaultColors = {
Common: {
background: "#7eef6d",
border: "#66c258",
shade: "#519946",
light: "#8af07b"
},
Unusual: {
background: "#ffe65d",
border: "#cfba4b",
shade: "#a3933c",
light: "#ffe86d"
},
Rare: {
background: "#4d52e3",
border: "#3e42b8",
shade: "#313491",
light: "#5e63e5"
},
Epic: {
background: "#861fde",
border: "#6d19b4",
shade: "#56148e",
light: "#9235e1"
},
Legendary: {
background: "#de1f1f",
border: "#b41919",
shade: "#8e1414",
light: "#e13535",
},
Mythic: {
background: "#1fdbde",
border: "#19b1b4",
shade: "#148c8e",
light: "#35dee1"
},
Ultra: {
background: "#ff2b75",
border: "#cf235f",
shade: "#a31c4b",
light: "#ff4082"
},
Super: {
background: "#2bffa3",
border: "#23cf84",
shade: "#1ca368",
light: "#40ffac"
}
}
Object.keys(customColors).forEach(name => {
for (const rarity in defaultColors) {
for (const property in defaultColors[rarity]) {
if (customColors[name][property] == defaultColors[rarity][property] && typeof customColors[name][property] == "string") customColors[name][property] = "#" + (parseInt(customColors[name][property].slice(1), 16) + 1).toString(16)
}
}
})
Object.keys(customColors).forEach(name => {
customColors[name.slice(0, -1) + "" + name.slice(-1)] = customColors[name]
delete customColors[name]
})
changeSets.forEach((set, i) => {
changeSets[i][1] = changeSets[i][1].slice(0, -1) + "" + changeSets[i][1].slice(-1)
})
// Credit to lexiyvv and Tinhone
for (let ctx of [CanvasRenderingContext2D, OffscreenCanvasRenderingContext2D]) {
if (ctx.prototype.RarityColorFillText == undefined) {
ctx.prototype.RarityColorFillText = ctx.prototype.fillText;
ctx.prototype.RarityColorStrokeText = ctx.prototype.strokeText;
ctx.prototype.RarityColorFillRect = ctx.prototype.fillRect;
ctx.prototype.RarityColorStroke = ctx.prototype.stroke;
ctx.prototype.RarityColorFill = ctx.prototype.fill;
ctx.prototype.RarityColorStrokeRect = ctx.prototype.strokeRect;
ctx.prototype.RarityColorMeasureText = ctx.prototype.measureText;
} else { break };
ctx.prototype.fillRect = function(x, y, width, height) {
changeSets.forEach((set, i) => {
["background", "border", "shade", "light"].forEach(type => {
if (this.fillStyle == defaultColors[changeSets[i][0]][type]) {
if (typeof customColors[changeSets[i][1]][type] == "string") this.fillStyle = customColors[changeSets[i][1]][type]
else this.fillStyle = customColors[changeSets[i][1]][type](x, y, x + width, y + height)
}
})
})
return this.RarityColorFillRect(x, y, width, height);
};
ctx.prototype.fill = function(path, fillRule) {
changeSets.forEach((set, i) => {
["background", "border", "shade", "light"].forEach(type => {
if (this.fillStyle == defaultColors[changeSets[i][0]][type]) {
if (typeof customColors[changeSets[i][1]][type] == "string") this.fillStyle = customColors[changeSets[i][1]][type]
else this.fillStyle = customColors[changeSets[i][1]][type](null, null, null, null)
}
})
})
if (path != null) return this.RarityColorFill(path, fillRule);
else return this.RarityColorFill(fillRule);
}
ctx.prototype.fillText = function(text, x, y) {
changeSets.forEach((set, i) => {
["background", "border", "shade", "light"].forEach(type => {
if (this.fillStyle == defaultColors[changeSets[i][0]][type]) {
if (typeof customColors[changeSets[i][1]][type] == "string") this.fillStyle = customColors[changeSets[i][1]][type]
else this.fillStyle = customColors[changeSets[i][1]][type](x, y, null, null)
}
})
if (text.includes(changeSets[i][0])) text = text.replaceAll(changeSets[i][0], customColors[changeSets[i][1]].name == null ? changeSets[i][1] : customColors[changeSets[i][1]].name)
})
return this.RarityColorFillText(text, x, y);
};
ctx.prototype.strokeText = function(text, x, y) {
changeSets.forEach((set, i) => {
if (text.includes(changeSets[i][0])) text = text.replaceAll(changeSets[i][0], customColors[changeSets[i][1]].name == null ? changeSets[i][1] : customColors[changeSets[i][1]].name)
})
return this.RarityColorStrokeText(text, x, y);
};
ctx.prototype.stroke = function(path) {
changeSets.forEach((set, i) => {
if (this.strokeStyle == defaultColors[changeSets[i][0]].border) {
if (typeof customColors[changeSets[i][1]].border == "string") this.strokeStyle = customColors[changeSets[i][1]].border
else this.strokeStyle = customColors[changeSets[i][1]].border(null, null, null, null)
}
})
if (path != null) return this.RarityColorStroke(path);
else return this.RarityColorStroke();
};
ctx.prototype.strokeRect = function(x, y, width, height) {
changeSets.forEach((set, i) => {
if (this.strokeStyle == defaultColors[changeSets[i][0]].border) {
if (typeof customColors[changeSets[i][1]].border == "string") this.strokeStyle = customColors[changeSets[i][1]].border
else this.strokeStyle = customColors[changeSets[i][1]].border(x, y, x + width, y + height)
}
})
return this.RarityColorStrokeRect(x, y, width, height);
};
ctx.prototype.measureText = function(text) {
changeSets.forEach((set, i) => {
if (text.includes(changeSets[i][0])) text = text.replaceAll(changeSets[i][0], customColors[changeSets[i][1]].name == null ? changeSets[i][1] : customColors[changeSets[i][1]].name)
})
return this.RarityColorMeasureText(text);
}
}
QingJ © 2025
镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址