summaryrefslogtreecommitdiff
path: root/src/SMAPI.Web/wwwroot/Content
diff options
context:
space:
mode:
Diffstat (limited to 'src/SMAPI.Web/wwwroot/Content')
-rw-r--r--src/SMAPI.Web/wwwroot/Content/css/file-upload.css25
-rw-r--r--src/SMAPI.Web/wwwroot/Content/css/json-validator.css25
-rw-r--r--src/SMAPI.Web/wwwroot/Content/css/log-parser.css21
-rw-r--r--src/SMAPI.Web/wwwroot/Content/js/file-upload.js71
-rw-r--r--src/SMAPI.Web/wwwroot/Content/js/json-validator.js51
-rw-r--r--src/SMAPI.Web/wwwroot/Content/js/log-parser.js38
6 files changed, 117 insertions, 114 deletions
diff --git a/src/SMAPI.Web/wwwroot/Content/css/file-upload.css b/src/SMAPI.Web/wwwroot/Content/css/file-upload.css
new file mode 100644
index 00000000..ff170691
--- /dev/null
+++ b/src/SMAPI.Web/wwwroot/Content/css/file-upload.css
@@ -0,0 +1,25 @@
+#inputFile {
+ display: none;
+}
+
+#input {
+ width: 100%;
+ height: 20em;
+ max-height: 70%;
+ margin: auto;
+ box-sizing: border-box;
+ border-radius: 5px;
+ border: 1px solid #000088;
+ outline: none;
+ box-shadow: inset 0px 0px 1px 1px rgba(0, 0, 192, .2);
+}
+
+#submit {
+ font-size: 1.5em;
+ border-radius: 5px;
+ outline: none;
+ box-shadow: inset 0 0 1px 1px rgba(0, 0, 0, .2);
+ cursor: pointer;
+ border: 1px solid #008800;
+ background-color: #cfc;
+}
diff --git a/src/SMAPI.Web/wwwroot/Content/css/json-validator.css b/src/SMAPI.Web/wwwroot/Content/css/json-validator.css
index 18195098..de0f8fed 100644
--- a/src/SMAPI.Web/wwwroot/Content/css/json-validator.css
+++ b/src/SMAPI.Web/wwwroot/Content/css/json-validator.css
@@ -90,28 +90,3 @@
.footer-tip a {
color: gray;
}
-
-/*********
-** Upload form
-*********/
-#input {
- width: 100%;
- height: 20em;
- max-height: 70%;
- margin: auto;
- box-sizing: border-box;
- border-radius: 5px;
- border: 1px solid #000088;
- outline: none;
- box-shadow: inset 0px 0px 1px 1px rgba(0, 0, 192, .2);
-}
-
-#submit {
- font-size: 1.5em;
- border-radius: 5px;
- outline: none;
- box-shadow: inset 0 0 1px 1px rgba(0, 0, 0, .2);
- cursor: pointer;
- border: 1px solid #008800;
- background-color: #cfc;
-}
diff --git a/src/SMAPI.Web/wwwroot/Content/css/log-parser.css b/src/SMAPI.Web/wwwroot/Content/css/log-parser.css
index 4d4ab326..bfbc8982 100644
--- a/src/SMAPI.Web/wwwroot/Content/css/log-parser.css
+++ b/src/SMAPI.Web/wwwroot/Content/css/log-parser.css
@@ -301,24 +301,3 @@ div[data-os] {
display: none;
}
-#input {
- width: 100%;
- height: 20em;
- max-height: 70%;
- margin: auto;
- box-sizing: border-box;
- border-radius: 5px;
- border: 1px solid #000088;
- outline: none;
- box-shadow: inset 0px 0px 1px 1px rgba(0, 0, 192, .2);
-}
-
-#submit {
- font-size: 1.5em;
- border-radius: 5px;
- outline: none;
- box-shadow: inset 0 0 1px 1px rgba(0, 0, 0, .2);
- cursor: pointer;
- border: 1px solid #008800;
- background-color: #cfc;
-}
diff --git a/src/SMAPI.Web/wwwroot/Content/js/file-upload.js b/src/SMAPI.Web/wwwroot/Content/js/file-upload.js
new file mode 100644
index 00000000..411efad3
--- /dev/null
+++ b/src/SMAPI.Web/wwwroot/Content/js/file-upload.js
@@ -0,0 +1,71 @@
+/* globals $ */
+var smapi = smapi || {};
+
+/**
+ * Implements the logic for a log/JSON file upload form.
+ *
+ * @param {object} opts The file upload form options.
+ * @param {jQuery} opts.chooseFileLink The clickable link which shows the file chooser.
+ * @param {jQuery} opts.chooseFileInput The file input element.
+ * @param {jQuery} opts.contentArea The file content area.
+ * @param {jQuery} opts.submitButton The submit button.
+ */
+smapi.fileUpload = function (opts) {
+ /**
+ * Toggle the submit button if the form has content.
+ */
+ var toggleSubmit = function () {
+ var hasText = !!opts.contentArea.val().trim();
+ opts.submitButton.prop("disabled", !hasText);
+ };
+
+ /**
+ * Paste the content of a file into the content area.
+ * @param {File} file The file whose content to paste.
+ */
+ var pasteFile = function (file) {
+ var reader = new FileReader();
+ reader.onload = $.proxy(function (file, $input, event) {
+ $input.val(event.target.result);
+ toggleSubmit();
+ }, this, file, $("#input"));
+ reader.readAsText(file);
+ };
+
+ // initialize
+ if (opts.contentArea.length) {
+ // disable submit button if it's empty
+ opts.contentArea.on("input", toggleSubmit);
+ toggleSubmit();
+
+ // drag & drop file
+ opts.contentArea.on({
+ "dragover dragenter": function (e) {
+ e.preventDefault();
+ },
+ "drop": function (e) {
+ e.preventDefault();
+
+ var transfer = e.originalEvent.dataTransfer;
+ if (transfer && transfer.files.length)
+ pasteFile(transfer.files[0]);
+ }
+ });
+
+ // choose file
+ opts.chooseFileLink.on({
+ "click": function (e) {
+ e.preventDefault();
+ opts.chooseFileInput.click();
+ }
+ });
+ opts.chooseFileInput.on({
+ "change": function (e) {
+ if (!e.target.files || !e.target.files.length)
+ return;
+
+ pasteFile(e.target.files[0]);
+ }
+ });
+ }
+};
diff --git a/src/SMAPI.Web/wwwroot/Content/js/json-validator.js b/src/SMAPI.Web/wwwroot/Content/js/json-validator.js
index 72b8192b..e9f72226 100644
--- a/src/SMAPI.Web/wwwroot/Content/js/json-validator.js
+++ b/src/SMAPI.Web/wwwroot/Content/js/json-validator.js
@@ -41,7 +41,7 @@ smapi.LineNumberRange = function (maxLines) {
* Generate a URL hash for the current line range.
* @returns {string} The generated URL hash.
*/
- self.buildHash = function() {
+ self.buildHash = function () {
if (!self.minLine)
return "";
else if (self.minLine === self.maxLine)
@@ -54,7 +54,7 @@ smapi.LineNumberRange = function (maxLines) {
* Get a list of all selected lines.
* @returns {Array<int>} The selected line numbers.
*/
- self.getLinesSelected = function() {
+ self.getLinesSelected = function () {
// format
if (!self.minLine)
return [];
@@ -97,7 +97,7 @@ smapi.jsonValidator = function (urlFormat, fileId) {
});
// fix line links
- $(".sunlight-line-number-margin a").each(function() {
+ $(".sunlight-line-number-margin a").each(function () {
var link = $(this);
var lineNumber = parseInt(link.text());
link
@@ -111,7 +111,7 @@ smapi.jsonValidator = function (urlFormat, fileId) {
/**
* Scroll the page so the selected range is visible.
*/
- var scrollToRange = function() {
+ var scrollToRange = function () {
if (!selection.minLine)
return;
@@ -123,56 +123,33 @@ smapi.jsonValidator = function (urlFormat, fileId) {
* Initialize the JSON validator page.
*/
var init = function () {
+ var input = $("#input");
+
// set initial code formatting
selection.parseFromUrlHash(location.hash);
formatCode();
scrollToRange();
// update code formatting on hash change
- $(window).on("hashchange", function() {
+ $(window).on("hashchange", function () {
selection.parseFromUrlHash(location.hash);
formatCode();
scrollToRange();
});
// change format
- $("#output #format").on("change", function() {
+ $("#output #format").on("change", function () {
var schemaName = $(this).val();
location.href = urlFormat.replace("$schemaName", schemaName).replace("$id", fileId);
});
- // upload form
- var submit = $("#submit");
- var input = $("#input");
if (input.length) {
- // disable submit if it's empty
- var toggleSubmit = function () {
- var hasText = !!input.val().trim();
- submit.prop("disabled", !hasText);
- };
- input.on("input", toggleSubmit);
- toggleSubmit();
-
- // drag & drop file
- input.on({
- 'dragover dragenter': function (e) {
- e.preventDefault();
- e.stopPropagation();
- },
- 'drop': function (e) {
- var dataTransfer = e.originalEvent.dataTransfer;
- if (dataTransfer && dataTransfer.files.length) {
- e.preventDefault();
- e.stopPropagation();
- var file = dataTransfer.files[0];
- var reader = new FileReader();
- reader.onload = $.proxy(function (file, $input, event) {
- $input.val(event.target.result);
- toggleSubmit();
- }, this, file, $("#input"));
- reader.readAsText(file);
- }
- }
+ // upload form
+ smapi.fileUpload({
+ chooseFileLink: $("#choose-file-link"),
+ chooseFileInput: $("#inputFile"),
+ contentArea: input,
+ submitButton: $("#submit")
});
}
};
diff --git a/src/SMAPI.Web/wwwroot/Content/js/log-parser.js b/src/SMAPI.Web/wwwroot/Content/js/log-parser.js
index e6c7591c..6ae1707e 100644
--- a/src/SMAPI.Web/wwwroot/Content/js/log-parser.js
+++ b/src/SMAPI.Web/wwwroot/Content/js/log-parser.js
@@ -115,12 +115,10 @@ smapi.logParser = function (data, sectionUrl) {
*********/
var input = $("#input");
if (input.length) {
- // get elements
+ // instructions per OS
var systemOptions = $("input[name='os']");
var systemInstructions = $("div[data-os]");
- var submit = $("#submit");
- // instruction OS chooser
var chooseSystem = function () {
systemInstructions.hide();
systemInstructions.filter("[data-os='" + $("input[name='os']:checked").val() + "']").show();
@@ -128,34 +126,12 @@ smapi.logParser = function (data, sectionUrl) {
systemOptions.on("click", chooseSystem);
chooseSystem();
- // disable submit if it's empty
- var toggleSubmit = function () {
- var hasText = !!input.val().trim();
- submit.prop("disabled", !hasText);
- }
- input.on("input", toggleSubmit);
- toggleSubmit();
-
- // drag & drop file
- input.on({
- 'dragover dragenter': function (e) {
- e.preventDefault();
- e.stopPropagation();
- },
- 'drop': function (e) {
- var dataTransfer = e.originalEvent.dataTransfer;
- if (dataTransfer && dataTransfer.files.length) {
- e.preventDefault();
- e.stopPropagation();
- var file = dataTransfer.files[0];
- var reader = new FileReader();
- reader.onload = $.proxy(function (file, $input, event) {
- $input.val(event.target.result);
- toggleSubmit();
- }, this, file, $("#input"));
- reader.readAsText(file);
- }
- }
+ // file upload
+ smapi.fileUpload({
+ chooseFileLink: $("#choose-file-link"),
+ chooseFileInput: $("#inputFile"),
+ contentArea: input,
+ submitButton: $("#submit")
});
}
};