I am trying to display a random image in a conjoint experiment on Qualtrics and be able to know what image each respondent saw (i.e., in other words, get the .jpg path). The code is based on this Qualtrics conjoint tutorial.
Currently, I am running into some issues because Qualtrics is not storing the values (image URLs) as embedded data fields. Any help would be appreciated.
JS:
Qualtrics.SurveyEngine.addOnload(function()
{
!function(a,b){function c(c,j,k){var n=[];j=1==j?{entropy:!0}:j||{};var s=g(f(j.entropy?[c,i(a)]:null==c?h():c,3),n),t=new d(n),u=function(){for(var a=t.g(m),b=p,c=0;q>a;)a=(a+c)*l,b*=l,c=t.g(1);for(;a>=r;)a/=2,b/=2,c>>>=1;return(a+c)/b};return u.int32=function(){return 0|t.g(4)},u.quick=function(){return t.g(4)/4294967296},u["double"]=u,g(i(t.S),a),(j.pass||k||function(a,c,d,f){return f&&(f.S&&e(f,t),a.state=function(){return e(t,{})}),d?(b[o]=a,c):a})(u,s,"global"in j?j.global:this==b,j.state)}function d(a){var b,c=a.length,d=this,e=0,f=d.i=d.j=0,g=d.S=[];for(c||(a=[c++]);l>e;)g[e]=e++;for(e=0;l>e;e++)g[e]=g[f=s&f+a[e%c]+(b=g[e])],g[f]=b;(d.g=function(a){for(var b,c=0,e=d.i,f=d.j,g=d.S;a--;)b=g[e=s&e+1],c=c*l+g[s&(g[e]=g[f=s&f+b])+(g[f]=b)];return d.i=e,d.j=f,c})(l)}function e(a,b){return b.i=a.i,b.j=a.j,b.S=a.S.slice(),b}function f(a,b){var c,d=[],e=typeof a;if(b&&"object"==e)for(c in a)try{d.push(f(a[c],b-1))}catch(g){}return d.length?d:"string"==e?a:a+"\0"}function g(a,b){for(var c,d=a+"",e=0;e<d.length;)b[s&e]=s&(c^=19*b[s&e])+d.charCodeAt(e++);return i(b)}function h(){try{if(j)return i(j.randomBytes(l));var b=new Uint8Array(l);return(k.crypto||k.msCrypto).getRandomValues(b),i(b)}catch(c){var d=k.navigator,e=d&&d.plugins;return[+new Date,k,e,k.screen,i(a)]}}function i(a){return String.fromCharCode.apply(0,a)}var j,k=this,l=256,m=6,n=52,o="random",p=b.pow(l,m),q=b.pow(2,n),r=2*q,s=l-1;if(b["seed"+o]=c,g(b.random(),a),"object"==typeof module&&module.exports){module.exports=c;try{j=require("crypto")}catch(t){}}else"function"==typeof define&&define.amd&&define(function(){return c})}([],Math);
// seed random number generator from embedded data fields
// conjoint profile 1
Math.seedrandom('${e://Field/seed1}');
var description = [
"https://i.picsum.photos/id/0/5616/3744.jpg",
"https://i.picsum.photos/id/1/5616/3744.jpg",
];
var size = description.length
var x = Math.floor(size*Math.random())
traits_a = document.getElementById('image').src=description[x];
var description2 = [
"https://i.picsum.photos/id/10/2500/1667.jpg",
"https://i.picsum.photos/id/100/2500/1656.jpg"
];
var size2 = description2.length
var x2 = [Math.floor(size2*Math.random())]
traits_b = document.getElementById('image2').src=description2[x2];
// Create list of variables to use when setting attributes
a_list = ["a1"];
b_list = ["b1"];
// set html values in conjoint table
for(i=0;i<1;i++){
document.getElementById(a_list[i]).innerHTML = traits_a[i];
document.getElementById(b_list[i]).innerHTML = traits_b[i];
}
// store values as embedded data fields
Qualtrics.SurveyEngine.setEmbeddedData('traits1a', traits_a.join("|"));
Qualtrics.SurveyEngine.setEmbeddedData('traits1b', traits_b.join("|"));
});
HTML:
<table style="width:90%; align:center; margin-left:auto; margin-right:auto; text-align:center; table-layout:fixed;" cellspacing="10" cellpadding = "10">
<tr>
<td id = "a1"><td style="font-weight:bold;">Image A<br /><img id="image" / width = "200px"></td></td>
<td id = "b1"><td style="font-weight:bold;">Image B<br /><img id="image2" / width = "200px"></td></td>
</tr>
</table>
<br>
<span>
<p style="font-weight:bold;">Which image do you prefer?</p>
</span>