Automoderated users, Bureaucrats, Comment administrators, Moderators, Administrators, Widget editors
30,706
edits
Changes
Jump to navigation
Jump to search
loadLive2dGirl var anythingFailedHandler = function(x,y,z) { view.closest($".artTab").removeClass(artTabDiv"loading"); console.log("Failed loading Live2D", tdollx, costume, varianty, z); }; var loadLive2DgirlSuccessHandler = function(live2dData) { view.closest(".artTab").removeClass("loading"); stage.addChild(live2dData); }; var loadLive2DsuccessHandler = function() { gfUtils.live2dUtils.loadLive2dGirl($(artTabDiv), tdoll, costume, variant, loadLive2DgirlSuccessHandler, anythingFailedHandler); }; mw.loader.using('ext.gadget.live2dAnimation').then(loadLive2DsuccessHandler, anythingFailedHandler);
}
function base64ArrayBuffer(arrayBuffer) {
var base64 = '';
var encodings = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
var bytes = new Uint8Array(arrayBuffer);
var byteLength = bytes.byteLength;
var byteRemainder = byteLength % 3;
var mainLength = byteLength - byteRemainder;
var a, b, c, d;
var chunk;
var i;
// Main loop deals with bytes in chunks of 3
for (i = 0; i < mainLength; i = i + 3) {
// Combine the three bytes into a single integer
chunk = (bytes[i] << 16) | (bytes[i + 1] << 8) | bytes[i + 2];
// Use bitmasks to extract 6-bit segments from the triplet
a = (chunk & 16515072) >> 18; // 16515072 = (2^6 - 1) << 18;
b = (chunk & 258048) >> 12; // 258048 = (2^6 - 1) << 12;
c = (chunk & 4032) >> 6; // 4032 = (2^6 - 1) << 6;
d = chunk & 63 ; // 63 = 2^6 - 1;
// Convert the raw binary segments to the appropriate ASCII encoding
base64 += encodings[a] + encodings[b] + encodings[c] + encodings[d];
}
// Deal with the remaining bytes and padding
if (byteRemainder == 1) {
chunk = bytes[mainLength];
a = (chunk & 252) >> 2; // 252 = (2^6 - 1) << 2;
// Set the 4 least significant bits to zero
b = (chunk & 3) << 4; // 3 = 2^2 - 1;
base64 += encodings[a] + encodings[b] + '==';
} else if (byteRemainder == 2) {
chunk = (bytes[mainLength] << 8) | bytes[mainLength + 1];
a = (chunk & 64512) >> 10; // 64512 = (2^6 - 1) << 10;
b = (chunk & 1008) >> 4; // 1008 = (2^6 - 1) << 4;
// Set the 2 least significant bits to zero
c = (chunk & 15) << 2; // 15 = 2^4 - 1;
base64 += encodings[a] + encodings[b] + encodings[c] + '=';
}
return base64;
}
function makeBase64Request(url) {
let xhr = new XMLHttpRequest();
let prom = new Promise(function (resolve, reject) {
xhr.open('GET', url, true);
xhr.responseType = 'arraybuffer';
xhr.onload = function () {
if (this.status >= 200 && this.status < 300) {
resolve(base64ArrayBuffer(xhr.response));
} else {
reject({
status: this.status,
statusText: xhr.statusText
});
}
};
xhr.onerror = function () {
reject({
status: this.status,
statusText: xhr.statusText
});
};
});
prom.startProcess = function(param) { xhr.send(param); };
return prom;
}
function hideProgress(container) {
let progress = $(container).find('.live2dloadingprogress').first();
progress.hide();
}
function showProgress(container, done, length) {
let progress = $(container).find('.live2dloadingprogress').first();
if (progress.length == 0) {
let centeringFix = $('<span></span>');
let live2dprogress = $('<div></div>').addClass("live2dprogress").append(centeringFix);
let live2dprogressbar = $('<div></div>').addClass("live2dprogressbar");
let live2dprogressbarcontainer = $('<div></div>').addClass("live2dprogressbarcontainer").append(live2dprogressbar);
progress = $('<div></div>').addClass("live2dloadingprogress").append(live2dprogress).append(live2dprogressbarcontainer);
$(container).append(progress);
}
progress.show();
let progressAmount = parseFloat(done / length * 100).toFixed(2);
progress.find('.live2dprogress span').text(progressAmount);
progress.find('.live2dprogressbar').css('width', progressAmount + "%");
}
function loadLive2dGirl(container, tdoll, costume, variant, callback) {
var modelId = tdoll;
if (costume.length > 0) {
modelId = modelId + "_" + costume;
}
if (variant && variant.length > 0) {
modelId = modelId + "_" + variant;
}
$.ajax({
dataType: "json",
mimeType: "text/plain",
url: curl(modelId + "_live2d_model.txt"),
success: function (data) {
// Init
var counter = 0;
var maxItems = 1000;
var confun = function() {
counter++;
showProgress(container, counter, maxItems);
};
confun();
json = data;
var loadingJobs = new Array();
// Correct paths
json.model = curl(modelId + "_live2d_model.moc" + ".skel");
if (json.hasOwnProperty('physics')) { json.physics = curl(modelId + "_live2d_" + json.physics + ".txt"); }
if (json.hasOwnProperty('pose')) { json.pose = curl(modelId + "_live2d_" + json.pose + ".txt"); }
for (var idx=json.motions.idle.length-1; idx >= 0; idx--) {
let job = makeBase64Request(curl(modelId + "_live2d_" + json.motions.idle[idx].file + ".txt"));
job.then(function(promiseData) {
let _datatoPush = "data:text/plain;base64," + promiseData;
json.motions.idle.push({ "file": _datatoPush });
confun();
});
json.motions.idle.splice(idx, 1);
loadingJobs.push(job);
}
for (var idx=json.motions.tap_figure.length-1; idx >= 0 ; idx--) {
let job = makeBase64Request(curl(modelId + "_live2d_" + json.motions.tap_figure[idx].file + ".txt"));
job.then(function(promiseData) {
let _datatoPush = "data:text/plain;base64," + promiseData;
json.motions.tap_figure.push({ "file": _datatoPush });
confun();
});
json.motions.tap_figure.splice(idx, 1);
loadingJobs.push(job);
}
for (var idx=0; idx < json.textures.length; idx++) {
let job = makeBase64Request(curl(modelId + "_live2d_" + json.textures[idx]));
job.then(function(promiseData) {
let _datatoPush = "data:image/png;base64," + promiseData;
json.textures.push(_datatoPush);
confun();
});
json.textures.splice(idx, 1);
loadingJobs.push(job);
}
// Ajaxing
maxItems = loadingJobs.length;
for (var idxXhr=0; idxXhr < loadingJobs.length; idxXhr++) { loadingJobs[idxXhr].startProcess(null); }
// Do it
$.when.apply($, loadingJobs)
.done(function(x) {
var l2d_tdoll_sprite = createLive2dSprite(json);
callback(l2d_tdoll_sprite);
})
.fail(function(x) { console.log("Failed ajax", x); })
.always(function(x) { hideProgress(container); });
}
});
variantswitcherartTabDiv.find('.rightartTabLive2dSwitch').remove();
Added document-ready wait functionality as the MediaWiki does not wait for DOM
function refreshView(artTabDiv) {
var tdoll = $(artTabDiv).data('tdollId');
var costume = $(artTabDiv).dataattr('tdollCostumedata-tdoll-costume');
var variant = $(artTabDiv).attr('data-tdoll-variant'); // why not data though?
var stage = view.data('live2dStage');
stage.removeChildren();
});
} else {
return l2d_tdoll_sprite;
}
hideLive2dView(artTabDiv);
var basePath = mw.config.get("wgServer") + "/images/";
var normArt = artTabDiv.find(".fullart:not(.damaged) a");
normArt.attr("href", fullartPath "/wiki/File:" + artModelId + ".png");
normArt.find('img').attr("src", fullartPath );
normArt.find('img').attr("srcset", fullartPath );
var damagedArt = artTabDiv.find(".fullart.damaged a");
damagedArt.attr("href", fullartDamagedPath "/wiki/File:" + artModelId + "_D.png");
damagedArt.find('img').attr("src", fullartDamagedPath );
damagedArt.find('img').attr("srcset", fullartDamagedPath );
var isLive2dPossible = doesLive2dAnimationExist(artTabDiv, costumeSuffix);
if (isLive2dPossible) {
var live2dButton live2dButtonHandler = $('<button></button>'); live2dButton.addClass('artTabLinks'); live2dButton.addClass('right'); live2dButton.click(function() {
if (live2dButton.is('.enabled')) {
hideLive2dView($(artTabDiv));
live2dButton.addClass('enabled');
}
}); var live2dButton= gfUtils.textcreateSliderButton("Live2Dhttp://en.gfwiki.com/images/a/a3/live2d-logo.png", live2dButtonHandler); live2dButton.addClass('artTabLive2dSwitch'); variantswitcherartTabDiv.append(live2dButton);
}
refreshView(artTabDiv);
};
RLQ.push(['jquery', function () { $(document).ready(function() {
var artTabDiv = $('.artTab');
artTabDiv.on('costume_changed', modelChanged);
normalButton.click();
});
}]);
