123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185 |
- var d3 = require("d3"),
- $ = require("jquery"),
- preview = require("./preview.js");
-
- function _initialize() {
- d3.select("#btn-new-theme").on("click", uploadTheme);
- d3.select("#input-new-theme").on("change", updateNewThemeFile).each(updateNewThemeFile);
- d3.select("#input-new-caption").on("change keyup", updateNewCaption).each(updateNewCaption);
- d3.select("#btn-delete-theme").on("click", deleteTheme);
- d3.select("#chkNoPattern").on("change", setNoPattern);
- }
-
- function setClass(cl, msg) {
- d3.select("body").attr("class", cl || null);
- d3.select("#error").text(msg || "");
- }
-
- function uploadTheme() {
- var formData = new FormData();
- var file = preview.newTheme();
-
- formData.append("newTheme", file);
-
- var newCaption = preview.newCaption();
-
- formData.append("newCaption", newCaption);
-
- var img = new Image();
- img.onload = function() {
- var sizes = {
- width: this.width,
- height: this.height
- };
- URL.revokeObjectURL(this.src);
-
- if (sizes.width > sizes.height) {
- if (sizes.width > 1280) {
- sizes.width = 1280;
- }
- if (sizes.height > 720) {
- sizes.height = 720;
- }
- } else {
- if (sizes.height > 1280) {
- sizes.height = 1280;
- }
- if (sizes.width > 720) {
- sizes.width = 720;
- }
- }
-
- formData.append("newWidth", sizes.width);
- formData.append("newHeight", sizes.height);
-
- $.ajax({
- url: "/theme/upload",
- type: "POST",
- data: formData,
- dataType: "json",
- contentType: false,
- cache: false,
- processData: false,
- success: function () {
- d3.json("/settings/themes.json", function(err, themes){
-
- var errorMessage;
-
- // Themes are missing or invalid
- if (err || !d3.keys(themes).filter(function(d){ return d !== "default"; }).length) {
- if (err instanceof SyntaxError) {
- errorMessage = "Error in settings/themes.json:<br/><code>" + err.toString() + "</code>";
- } else if (err instanceof ProgressEvent) {
- errorMessage = "Error: no settings/themes.json.";
- } else if (err) {
- errorMessage = "Error: couldn't load settings/themes.json.";
- } else {
- errorMessage = "No themes found in settings/themes.json.";
- }
- d3.select("#loading-bars").remove();
- d3.select("#loading-message").html(errorMessage);
- if (err) {
- throw err;
- }
- return;
- }
-
- location.reload();
-
- });
- },
- error: function (error) {
- console.log('error', error);
- }
- });
-
- }
- var objectURL = URL.createObjectURL(file);
- img.src = objectURL;
-
- }
-
- function updateNewThemeFile() {
- if (!this.files || !this.files[0]) {
- preview.newTheme(null);
- setClass(null);
- return true;
- }
-
- newTheme = this.files[0];
-
- preview.loadNewTheme(newTheme, function (err) {
- if (err) {
- setClass("error", "Error updating new theme file");
- } else {
- setClass(null);
- }
- });
- }
-
- function updateNewCaption() {
- preview.newCaption(this.value);
- }
-
- function deleteTheme() {
- if(!confirm($("#btn-delete-theme").data("confirm"))){
- d3.event.stopImmediatePropagation();
- d3.event.preventDefault();
- return;
- }
-
- var theme = d3.select("#input-theme").property("value");
-
- $.ajax({
- url: "/theme/delete",
- type: "POST",
- data: JSON.stringify({theme: theme}),
- dataType: "json",
- contentType: "application/json",
- cache: false,
- success: function () {
- location.reload();
- },
- error: function (error) {
- console.log('error', error);
- }
- });
-
- }
-
- function saveTheme() {
- $.ajax({
- url: "/theme/save",
- type: "POST",
- data: JSON.stringify({theme: theme}),
- dataType: "json",
- contentType: "application/json",
- cache: false,
- success: function () {
- preview.theme(theme);
- },
- error: function (error) {
- console.log('error', error);
- }
- });
-
- }
-
- function setNoPattern() {
- if (!theme) {
- return;
- }
- const checked = d3.select("#chkNoPattern").property("checked");
- if (!theme.noPattern) {
- theme['noPattern'] = checked;
- } else {
- theme.noPattern = checked;
- }
-
- saveTheme();
- }
-
- module.exports = {
- initialize: _initialize
- };
|