Can I specify random logos?

Support
1

Is it possible to (via a plug-in if necessary) randomly choose a logo (and small logo) from a set of 3 every time someone starts a new session (or until their browser refreshes the assets for the logo)?

The Ruby code is trivial - but how can we incorporate that into Discourse? :confused:

2

You could do it with JS i suppose, here is code i hope it works

<script>
if (document.getElementById) { window.onload = swap };
function swap() {
var numimages=4;
rndimg = new Array("IMAGE URL 1", "IMAGE URL 2", "IMAGE URL 3", "IMAGE URL 4");
x=(Math.floor(Math.random()*numimages));
randomimage=(rndimg[x]);
document.getElementById("banner").style.logo-big = "url("+ randomimage +")";
}
</script>

PS this only works on hard refresh. also the css to big logo would be

.logo-big { 
background-image: url('DEFAULT LOGO IMAGE URL HERE');
}

The JS would work because i am using that to rotate my banner image randomly on every hard refresh not sure the exact code for logo CSS.

2 Likes
3

Thanks - I’ll give that a go :slight_smile:

4

Hi,

This is exactly what I need! Is the second part required? Also where does the first part get put exactly?

Best,
Michael

6

This is doable in a theme component, the method by @Alankrit_Choudh can work but I would recommend adding a custom ember initializer instead that overrides the URL in discourse instead of relying on window.onload here.

1 Like
7

Sam,

I’ve run up against the same problem. window.onload works if called before </head>, but not if called later. And because of that, document.getElementById fails (the ID isn’t defined yet).

Could you point me to a primer/example/howto for how to create a custom ember initializer for someone who has no experience with ember?

For completeness, what I’m trying to do is display a random banner image from an array of URLs:

var jlmyPix = new Array(
     '/img/pic0.jpeg',
     [ ... ]
     '/img/picN.jpeg'
);

function jlchoosePic() {
     var jlrandomPicNum = Math.floor(Math.random() * jlmyPix.length);
     document.getElementById("jlmyPicture").src = jlmyPix[jlrandomPicNum];
};

window.onload = jlchoosePic;