work
This commit is contained in:
albert
@@ -1,347 +1,395 @@
|
||||
(function() {
|
||||
Danbooru.Note = function() {}
|
||||
|
||||
Danbooru.Note.initialize_all = function() {
|
||||
$("#note-container").width($("#image").width());
|
||||
$("#note-container").height($("#image").height());
|
||||
Danbooru.Note = {
|
||||
Box: {
|
||||
create: function(id) {
|
||||
var $inner_border = $('<div/>');
|
||||
$inner_border.addClass("note-box-inner-border");
|
||||
$inner_border.css({opacity: 0.7});
|
||||
|
||||
var $note_box = $('<div/>');
|
||||
$note_box.addClass("note-box");
|
||||
$note_box.data("id", id);
|
||||
$note_box.attr("data-id", id);
|
||||
$note_box.draggable({containment: "parent"});
|
||||
$note_box.resizable({
|
||||
containment: "parent",
|
||||
handles: "se"
|
||||
});
|
||||
$note_box.append($inner_border);
|
||||
Danbooru.Note.Box.bind_events($note_box);
|
||||
|
||||
return $note_box;
|
||||
},
|
||||
|
||||
$("a#translate").click(function(e) {
|
||||
e.preventDefault();
|
||||
Danbooru.Note.create(1);
|
||||
});
|
||||
}
|
||||
|
||||
Danbooru.Note.prototype.getElement = function(name, unwrap) {
|
||||
var element = $("#note-" + name + "-" + this.id);
|
||||
bind_events: function($note_box) {
|
||||
$note_box.bind(
|
||||
"dragstart resizestart",
|
||||
function(e) {
|
||||
var $note_box_inner = $(e.currentTarget);
|
||||
Danbooru.Note.dragging = true;
|
||||
Danbooru.Note.clear_timeouts();
|
||||
Danbooru.Note.Body.hide_all();
|
||||
}
|
||||
)
|
||||
|
||||
$note_box.bind(
|
||||
"resize",
|
||||
function(e) {
|
||||
var $note_box_inner = $(e.currentTarget);
|
||||
Danbooru.Note.Box.resize_inner_border($note_box_inner);
|
||||
}
|
||||
);
|
||||
|
||||
$note_box.bind(
|
||||
"dragstop resizestop",
|
||||
function(e) {
|
||||
Danbooru.Note.dragging = false;
|
||||
}
|
||||
);
|
||||
|
||||
$note_box.bind(
|
||||
"mouseover mouseout",
|
||||
function(e) {
|
||||
if (Danbooru.Note.dragging) {
|
||||
return;
|
||||
}
|
||||
|
||||
var $note_box_inner = $(e.currentTarget);
|
||||
if (e.type === "mouseover") {
|
||||
Danbooru.Note.Body.show($note_box_inner.data("id"));
|
||||
} else if (e.type === "mouseout") {
|
||||
Danbooru.Note.Body.hide($note_box_inner.data("id"));
|
||||
}
|
||||
}
|
||||
);
|
||||
},
|
||||
|
||||
if (unwrap) {
|
||||
return element[0];
|
||||
} else {
|
||||
return element;
|
||||
}
|
||||
}
|
||||
|
||||
Danbooru.Note.prototype.getBox = function(unwrap) {
|
||||
return this.getElement("box", unwrap);
|
||||
}
|
||||
|
||||
Danbooru.Note.prototype.getImage = function(unwrap) {
|
||||
return this.getElement("image", unwrap);
|
||||
}
|
||||
|
||||
Danbooru.Note.prototype.getBody = function(unwrap) {
|
||||
return this.getElement("body", unwrap);
|
||||
}
|
||||
|
||||
Danbooru.Note.prototype.getCorner = function(unwrap) {
|
||||
return this.getElement("corner", unwrap);
|
||||
}
|
||||
|
||||
Danbooru.Note.prototype.initialize = function(id, is_new, raw_body) {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#initialize (id=%d)", id);
|
||||
}
|
||||
resize_inner_border: function($note_box) {
|
||||
var $inner_border = $note_box.find("div.note-box-inner-border");
|
||||
$inner_border.css({
|
||||
height: $note_box.height() - 2,
|
||||
width: $note_box.width() - 2
|
||||
});
|
||||
},
|
||||
|
||||
this.id = id;
|
||||
this.is_new = is_new;
|
||||
|
||||
// Cache the dimensions
|
||||
this.fullsize = {
|
||||
left: this.getBox().offset().left,
|
||||
top: this.getBox().offset().top,
|
||||
width: this.getBox().width(),
|
||||
height: this.getBox().height()
|
||||
}
|
||||
scale: function($note_box) {
|
||||
var $image = $("#image");
|
||||
var original_width = parseFloat($image.data("width"));
|
||||
var original_height = parseFloat($image.data("height"));
|
||||
var ratio = $image.width() / original_width;
|
||||
|
||||
if (ratio < 1) {
|
||||
var scaled_width = original_width * ratio;
|
||||
var scaled_height = original_height * ratio;
|
||||
var scaled_top = $note_box.offset().top * ratio;
|
||||
var scaled_left = $note_box.offset().left * ratio;
|
||||
$note_box.css({
|
||||
top: scaled_top,
|
||||
left: scaled_left,
|
||||
width: scaled_width,
|
||||
height: scaled_height
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
// Store the original values (in case the user clicks Cancel)
|
||||
this.old = {
|
||||
raw_body: raw_body,
|
||||
formatted_body: this.getBody().html()
|
||||
}
|
||||
|
||||
for (p in this.fullsize) {
|
||||
this.old[p] = this.fullsize[p];
|
||||
}
|
||||
|
||||
// Make the note translucent
|
||||
if (is_new) {
|
||||
this.getBox().css({opacity: 0.2});
|
||||
} else {
|
||||
this.getBox().css({opacity: 0.5});
|
||||
}
|
||||
|
||||
if (is_new && raw_body == '') {
|
||||
this.bodyfit = true;
|
||||
this.getBody().css({height: 100});
|
||||
}
|
||||
|
||||
// Attach the event listeners
|
||||
this.getBox().mousedown(this.dragStart);
|
||||
this.getBox().mouseout(this.bodyHideTimer);
|
||||
this.getBox().mouseover(this.bodyShow);
|
||||
this.getCorner().mousedown(this.resizeStart);
|
||||
this.getBody().mouseover(this.bodyShow);
|
||||
this.getBody().mouseout(this.bodyHideTimer);
|
||||
this.getBody().click(this.showEditBox);
|
||||
|
||||
this.adjustScale();
|
||||
}
|
||||
|
||||
// Returns the raw text value of this note
|
||||
Danbooru.Note.prototype.textValue = function() {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#textValue (id=%d)", this.id);
|
||||
}
|
||||
|
||||
return this.old.raw_body.trim();
|
||||
}
|
||||
|
||||
// Removes the edit box
|
||||
Danbooru.Note.prototype.hideEditBox = function(e) {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#hideEditBox (id=%d)", this.id)
|
||||
}
|
||||
|
||||
var id = $("#edit-box").data("id");
|
||||
|
||||
if (id != null) {
|
||||
$("#edit-box").unbind();
|
||||
$("#note-save-" + id).unbind();
|
||||
$("#note-cancel-" + id).unbind();
|
||||
$("#note-remove-" + id).unbind();
|
||||
$("#note-history-" + id).unbind();
|
||||
$("#edit-box").remove();
|
||||
}
|
||||
}
|
||||
|
||||
// Shows the edit box
|
||||
Danbooru.Note.prototype.showEditBox = function(e) {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#showEditBox (id=%d)", this.id);
|
||||
}
|
||||
|
||||
this.hideEditBox(e);
|
||||
|
||||
var insertionPosition = this.getInsertionPosition();
|
||||
var top = insertionPosition[0];
|
||||
var left = insertionPosition[1];
|
||||
html += '<div id="edit-box" style="top: '+top+'px; left: '+left+'px; position: absolute; visibility: visible; z-index: 100; background: white; border: 1px solid black; padding: 12px;">';
|
||||
html += '<form onsubmit="return false;" style="padding: 0; margin: 0;">';
|
||||
html += '<textarea rows="7" id="edit-box-text" style="width: 350px; margin: 2px 2px 12px 2px;">' + this.textValue() + '</textarea>';
|
||||
html += '<input type="submit" value="Save" name="save" id="note-save-' + this.id + '">';
|
||||
html += '<input type="submit" value="Cancel" name="cancel" id="note-cancel-' + this.id + '">';
|
||||
html += '<input type="submit" value="Delete" name="remove" id="note-remove-' + this.id + '">';
|
||||
html += '<input type="submit" value="History" name="history" id="note-history-' + this.id + '">';
|
||||
html += '</form>';
|
||||
html += '</div>';
|
||||
$("#note-container").append(html);
|
||||
$('#edit-box').data("id", this.id);
|
||||
$("#edit-box").mousedown(this.editDragStart);
|
||||
$("#note-save-" + this.id).click(this.save);
|
||||
$("#note-cancel-" + this.id).click(this.cancel);
|
||||
$("#note-remove-" + this.id).click(this.remove);
|
||||
$("#note-history-" + this.id).click(this.history)
|
||||
$("#edit-box-text").focus();
|
||||
}
|
||||
|
||||
// Shows the body text for the note
|
||||
Danbooru.Note.prototype.bodyShow = function(e) {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#bodyShow (id=%d)", this.id);
|
||||
}
|
||||
|
||||
if (this.dragging) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.hideTimer) {
|
||||
this.hideTimer.clear();
|
||||
}
|
||||
|
||||
if (Note.noteShowingBody == this) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (Note.noteShowingBody) {
|
||||
Note.noteShowingBody.bodyHide();
|
||||
}
|
||||
|
||||
Note.noteShowingBody = this;
|
||||
|
||||
if (Note.zindex >= 9) {
|
||||
/* don't use more than 10 layers (+1 for the body, which will always be above all notes) */
|
||||
Note.zindex = 0;
|
||||
for (var i=0; i< Note.all.length; ++i) {
|
||||
Note.all[i].getBox().css({zIndex: 0});
|
||||
descale: function($note_box) {
|
||||
var $image = $("#image");
|
||||
var original_width = parseFloat($image.data("width"));
|
||||
var original_height = parseFloat($image.data("height"));
|
||||
var ratio = $image.width() / original_width;
|
||||
|
||||
if (ratio < 1) {
|
||||
var scaled_width = original_width * ratio;
|
||||
var scaled_height = original_height * ratio;
|
||||
var scaled_top = $note_box.offset().top * ratio;
|
||||
var scaled_left = $note_box.offset().left * ratio;
|
||||
$note_box.css({
|
||||
top: scaled_top,
|
||||
left: scaled_left,
|
||||
width: scaled_width,
|
||||
height: scaled_height
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
this.getBox().css({zIndex: ++Note.zindex});
|
||||
this.getBody().css({zIndex: 10, top: 0, left: 0});
|
||||
var dw = document.documentElement.scrollWidth;
|
||||
this.getBody().css({visibility: "hidden", display: "block"});
|
||||
if (!this.bodyfit) {
|
||||
this.getBody().css({height: "auto", minWidth: 140});
|
||||
var w = this.getBody(true).offsetWidth;
|
||||
var h = this.getBody(true).offsetHeight;
|
||||
var lo = null;
|
||||
var hi = null;
|
||||
var x = null;
|
||||
var last = null;
|
||||
if (this.getBody(true).scrollWidth <= this.getBody(true).clientWidth) {
|
||||
/* for short notes (often a single line), make the box no wider than necessary */
|
||||
// scroll test necessary for Firefox
|
||||
lo = 20;
|
||||
hi = w;
|
||||
},
|
||||
|
||||
do {
|
||||
x = (lo+hi)/2
|
||||
this.getBody().css({minWidth: x});
|
||||
if (this.getBody(true).offsetHeight > h) {
|
||||
lo = x;
|
||||
} else {
|
||||
hi = x;
|
||||
}
|
||||
} while ((hi - lo) > 4);
|
||||
if (this.getBody(true).offsetHeight > h) {
|
||||
this.getBody().css({minWidth: hi});
|
||||
}
|
||||
Body: {
|
||||
create: function(id) {
|
||||
var $note_body = $('<div></div>');
|
||||
$note_body.addClass("note-body");
|
||||
$note_body.data("id", id);
|
||||
$note_body.attr("data-id", id);
|
||||
$note_body.hide();
|
||||
Danbooru.Note.Body.bind_events($note_body);
|
||||
return $note_body;
|
||||
},
|
||||
|
||||
initialize: function($note_body) {
|
||||
var $note_box = $("#note-container div.note-box[data-id=" + $note_body.data("id") + "]");
|
||||
$note_body.css({
|
||||
top: $note_box.position().top + $note_box.height() + 5,
|
||||
left: $note_box.position().left
|
||||
});
|
||||
Danbooru.Note.Body.bound_position($note_body);
|
||||
},
|
||||
|
||||
bound_position: function($note_body) {
|
||||
var doc_width = $(window).width();
|
||||
if ($note_body.offset().left + $note_body.width() > doc_width) {
|
||||
$note_body.css({
|
||||
// 30 is a magic number to factor in width of the scroll bar
|
||||
left: $note_body.position().left - 30 - ($note_body.offset().left + $note_body.width() - doc_width)
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
show: function(id) {
|
||||
if (Danbooru.Note.editing) {
|
||||
return;
|
||||
}
|
||||
|
||||
Danbooru.Note.Body.hide_all();
|
||||
Danbooru.Note.clear_timeouts();
|
||||
var $note_body = $("#note-container div.note-body[data-id=" + id + "]");
|
||||
$note_body.show();
|
||||
Danbooru.Note.Body.initialize($note_body);
|
||||
},
|
||||
|
||||
hide: function(id) {
|
||||
var $note_body = $("#note-container div.note-body[data-id=" + id + "]");
|
||||
Danbooru.Note.timeouts.push($.timeout(250).done(function() {$note_body.hide();}));
|
||||
},
|
||||
|
||||
hide_all: function() {
|
||||
$(".note-body").hide();
|
||||
},
|
||||
|
||||
resize: function($note_body) {
|
||||
var w = $note_body.width();
|
||||
var h = $note_body.height();
|
||||
var golden_ratio = 1.6180339887;
|
||||
|
||||
while (w / h < golden_ratio) {
|
||||
w = w * 1.025;
|
||||
h = h / 1.025;
|
||||
}
|
||||
|
||||
if ($.browser.msie) {
|
||||
// IE7 adds scrollbars if the box is too small, obscuring the text
|
||||
if (this.getBody(true).offsetHeight < 35) {
|
||||
this.getBody().css({minHeight: 35});
|
||||
}
|
||||
|
||||
if (this.getBody(true).offsetWidth < 47) {
|
||||
this.getBody().css({minWidth: 47});
|
||||
}
|
||||
while (w / h > golden_ratio) {
|
||||
w = w / 1.025;
|
||||
h = h * 1.025;
|
||||
}
|
||||
this.bodyfit = true;
|
||||
|
||||
$note_body.css({
|
||||
width: w,
|
||||
height: "auto"
|
||||
});
|
||||
},
|
||||
|
||||
set_text: function($note_body, text) {
|
||||
$note_body.html(text);
|
||||
Danbooru.Note.Body.resize($note_body);
|
||||
Danbooru.Note.Body.bound_position($note_body);
|
||||
},
|
||||
|
||||
bind_events: function($note_body) {
|
||||
$note_body.mouseover(function(e) {
|
||||
var $note_body_inner = $(e.currentTarget);
|
||||
Danbooru.Note.Body.show($note_body_inner.data("id"));
|
||||
});
|
||||
|
||||
$note_body.mouseout(function(e) {
|
||||
var $note_body_inner = $(e.currentTarget);
|
||||
Danbooru.Note.Body.hide($note_body_inner.data("id"));
|
||||
});
|
||||
|
||||
$note_body.click(function(e) {
|
||||
var $note_body_inner = $(e.currentTarget);
|
||||
Danbooru.Note.Edit.show($note_body_inner);
|
||||
})
|
||||
}
|
||||
this.getBody().css({
|
||||
top: this.getBox(true).offsetTop + this.getBox(true).clientHeight + 5
|
||||
},
|
||||
|
||||
Edit: {
|
||||
show: function($note_body) {
|
||||
if (Danbooru.Note.editing) {
|
||||
return;
|
||||
}
|
||||
|
||||
$(".note-box").resizable("disable");
|
||||
$(".note-box").draggable("disable");
|
||||
|
||||
$textarea = $('<textarea></textarea>');
|
||||
$textarea.css({
|
||||
width: "100%",
|
||||
height: "10em"
|
||||
});
|
||||
|
||||
if ($note_body.html() !== "<em>Click to edit</em>") {
|
||||
$textarea.val($note_body.html());
|
||||
}
|
||||
|
||||
$dialog = $('<div></div>');
|
||||
$dialog.append($textarea);
|
||||
$dialog.data("id", $note_body.data("id"));
|
||||
$dialog.dialog({
|
||||
modal: true,
|
||||
width: 300,
|
||||
dialogClass: "note-edit-dialog",
|
||||
title: "Edit note",
|
||||
buttons: {
|
||||
"Save": Danbooru.Note.Edit.save,
|
||||
"Cancel": Danbooru.Note.Edit.cancel,
|
||||
"Delete": Danbooru.Note.Edit.delete,
|
||||
"History": Danbooru.Note.Edit.history
|
||||
}
|
||||
});
|
||||
$dialog.bind("dialogclose", function() {
|
||||
Danbooru.Note.editing = false;
|
||||
$(".note-box").resizable("enable");
|
||||
$(".note-box").draggable("enable");
|
||||
});
|
||||
Danbooru.Note.editing = true;
|
||||
},
|
||||
|
||||
save: function() {
|
||||
var $this = $(this);
|
||||
var $textarea = $this.find("textarea");
|
||||
var id = $this.data("id");
|
||||
var $note_body = $("#note-container .note-body[data-id=" + id + "]");
|
||||
var $note_box = $("#note-container .note-box[data-id=" + id + "]");
|
||||
var text = $textarea.val();
|
||||
Danbooru.Note.Body.set_text($note_body, text);
|
||||
$this.dialog("close");
|
||||
$note_box.find(".note-box-inner-border").removeClass("unsaved");
|
||||
console.log("save %d", id);
|
||||
},
|
||||
|
||||
cancel: function() {
|
||||
$(this).dialog("close");
|
||||
},
|
||||
|
||||
delete: function() {
|
||||
var $this = $(this);
|
||||
var id = $this.data("id");
|
||||
console.log("delete %d", id);
|
||||
$("#note-container .note-box[data-id=" + id + "]").remove();
|
||||
$("#note-container .note-body[data-id=" + id + "]").remove();
|
||||
$(this).dialog("close");
|
||||
},
|
||||
|
||||
history: function() {
|
||||
var $this = $(this);
|
||||
var id = $this.data("id");
|
||||
console.log("history %d", id);
|
||||
$(this).dialog("close");
|
||||
}
|
||||
},
|
||||
|
||||
TranslationMode: {
|
||||
start: function() {
|
||||
$("#note-container").click(Danbooru.Note.TranslationMode.create_note);
|
||||
$("#translate-button").one("click", Danbooru.Note.TranslationMode.stop).html("Click on image");
|
||||
},
|
||||
|
||||
stop: function() {
|
||||
$("#note-container").unbind("click");
|
||||
$("#translate-button").one("click", Danbooru.Note.TranslationMode.start).html("Translate");
|
||||
},
|
||||
|
||||
create_note: function(e) {
|
||||
var offset = $("#image").offset();
|
||||
Danbooru.Note.new(e.pageX - offset.left, e.pageY - offset.top);
|
||||
Danbooru.Note.TranslationMode.stop();
|
||||
}
|
||||
},
|
||||
|
||||
Image: {
|
||||
resize: function() {
|
||||
var $image = $("#image");
|
||||
var max_width = parseInt($("meta[name=max-image-width]").attr("content"));
|
||||
var current_width = $image.width();
|
||||
var current_height = $image.height();
|
||||
if (current_width > max_width) {
|
||||
var ratio = max_width / current_width;
|
||||
$image.attr("ratio", ratio);
|
||||
$image.width(current_width * ratio).height(current_height * ratio).attr("resized", "1");
|
||||
}
|
||||
},
|
||||
|
||||
reset_size: function() {
|
||||
var $image = $("#image");
|
||||
$image.width($image.data("width")).height($image.data("height")).attr("resized", "0");
|
||||
}
|
||||
},
|
||||
|
||||
id: "x",
|
||||
dragging: false,
|
||||
editing: false,
|
||||
timeouts: [],
|
||||
pending: {},
|
||||
|
||||
scale: function() {
|
||||
var $image = $("#image");
|
||||
if ($image.attr("ratio")) {
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
add: function(id, x, y, w, h, text) {
|
||||
var $note_box = Danbooru.Note.Box.create(id);
|
||||
var $note_body = Danbooru.Note.Body.create(id);
|
||||
|
||||
$note_box.css({
|
||||
left: x,
|
||||
top: y,
|
||||
width: w,
|
||||
height: h
|
||||
});
|
||||
|
||||
// keep the box within the document's width
|
||||
var l = 0;
|
||||
var e = this.getBox(true);
|
||||
do {
|
||||
l += e.offsetLeft
|
||||
} while (e = e.offsetParent);
|
||||
l += this.getBody(true).offsetWidth + 10 - dw;
|
||||
if (l > 0) {
|
||||
this.getBody().css({left: this.getBox(true).offsetLeft - l});
|
||||
} else {
|
||||
this.getBody().css({left: this.getBox(true).offsetLeft});
|
||||
}
|
||||
this.getBody().css({visibility: "visible"});
|
||||
}
|
||||
|
||||
Danbooru.Note.prototype.bodyHideTimer = function(e) {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#bodyHideTimer (id=%d)", this.id);
|
||||
}
|
||||
this.hideTimer = $.timeout(250).done(this.bodyHide);
|
||||
}
|
||||
|
||||
// Start dragging the note
|
||||
Danbooru.Note.prototype.dragStart = function(e) {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#dragStart (id=%d)", this.id);
|
||||
}
|
||||
|
||||
$(document).mousemove(this.drag);
|
||||
$(document).mouseup(this.dragStop);
|
||||
$(document).select(function(e) {e.preventDefault();});
|
||||
|
||||
this.cursorStartX = e.pageX;
|
||||
this.cursorStartY = e.pageY;
|
||||
this.boxStartX = this.getBox().offset().left;
|
||||
this.boxStartY = this.getBox().offset().top;
|
||||
this.boundsX = new ClipRange(5, this.getImage(true).clientWidth - this.getBox(true).clientWidth - 5);
|
||||
this.boundsY = new ClipRange(5, this.getImage(true).clientHeight - this.getBox(true).clientHeight - 5);
|
||||
this.dragging = true;
|
||||
this.bodyHide();
|
||||
}
|
||||
$("div#note-container").append($note_box);
|
||||
$("div#note-container").append($note_body);
|
||||
Danbooru.Note.Box.scale($note_box);
|
||||
Danbooru.Note.Box.resize_inner_border($note_box);
|
||||
Danbooru.Note.Body.set_text($note_body, text);
|
||||
},
|
||||
|
||||
// Stop dragging the note
|
||||
Danbooru.Note.prototype.dragStop = function(e) {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#dragStop (id=%d)", this.id);
|
||||
}
|
||||
|
||||
$(document).unbind();
|
||||
|
||||
this.cursorStartX = null;
|
||||
this.cursorStartY = null;
|
||||
this.boxStartX = null;
|
||||
this.boxStartY = null;
|
||||
this.boundsX = null;
|
||||
this.boundsY = null;
|
||||
this.dragging = false;
|
||||
|
||||
this.bodyShow();
|
||||
}
|
||||
|
||||
Danbooru.Note.prototype.ratio = function() {
|
||||
return this.getImage().width() / parseFloat(this.getImage().data("original-width"));
|
||||
}
|
||||
|
||||
// Scale the notes for when the image gets resized
|
||||
Danbooru.Note.prototype.adjustScale = function() {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#adjustScale (id=%d)", this.id);
|
||||
}
|
||||
|
||||
var ratio = this.ratio();
|
||||
this.getBox().css({
|
||||
left: this.fullsize.left * ratio,
|
||||
top: this.fullsize.top * ratio,
|
||||
width: this.fullsize.width * ratio,
|
||||
height: this.fullsize.height * ratio
|
||||
new: function(x, y) {
|
||||
var $note_box = Danbooru.Note.Box.create(Danbooru.Note.id);
|
||||
var $note_body = Danbooru.Note.Body.create(Danbooru.Note.id);
|
||||
$note_box.offset({
|
||||
top: y,
|
||||
left: x
|
||||
});
|
||||
}
|
||||
$note_box.find(".note-box-inner-border").addClass("unsaved");
|
||||
$note_body.html("<em>Click to edit</em>");
|
||||
$("div#note-container").append($note_box);
|
||||
$("div#note-container").append($note_body);
|
||||
Danbooru.Note.Box.resize_inner_border($note_box);
|
||||
Danbooru.Note.id += "x";
|
||||
},
|
||||
|
||||
// Update the note's position as it gets dragged
|
||||
Danbooru.Note.prototype.drag = function(e) {
|
||||
var left = this.boxStartX + e.pageX - this.cursorStartX;
|
||||
var top = this.boxStartY + e.pageY - this.cursorStartY;
|
||||
left = this.boundsX.clip(left);
|
||||
top = this.boundsY.clip(top);
|
||||
this.getBox().css({left: left, top: top});
|
||||
var ratio = this.ratio();
|
||||
this.fullsize.left = left / ratio;
|
||||
this.fullsize.top = top / ratio;
|
||||
|
||||
e.preventDefault();
|
||||
}
|
||||
|
||||
// Start dragging the edit box
|
||||
Danbooru.Note.prototype.editDragStart = function(e) {
|
||||
if (Note.debug) {
|
||||
console.debug("Note#editDragStart (id=%d)", this.id);
|
||||
}
|
||||
clear_timeouts: function() {
|
||||
$.each(Danbooru.Note.timeouts, function(i, v) {
|
||||
v.clear();
|
||||
});
|
||||
|
||||
var node = e.element().nodeName;
|
||||
if (node != 'FORM' && node != 'DIV') {
|
||||
return
|
||||
}
|
||||
|
||||
document.observe("mousemove", this.editDrag.bindAsEventListener(this))
|
||||
document.observe("mouseup", this.editDragStop.bindAsEventListener(this))
|
||||
document.observe("selectstart", function() {return false})
|
||||
|
||||
this.elements.editBox = $('edit-box');
|
||||
this.cursorStartX = e.pointerX()
|
||||
this.cursorStartY = e.pointerY()
|
||||
this.editStartX = this.elements.editBox.offsetLeft
|
||||
this.editStartY = this.elements.editBox.offsetTop
|
||||
this.dragging = true
|
||||
Danbooru.Note.timeouts = [];
|
||||
}
|
||||
})();
|
||||
}
|
||||
|
||||
$(document).ready(function() {
|
||||
Danbooru.Note.initialize_all();
|
||||
if ($("#c-posts #a-show").size > 0) {
|
||||
Danbooru.Note.Image.resize();
|
||||
$("#translate-button").one("click", Danbooru.Note.TranslationMode.start);
|
||||
$("#note-container").width($("#image").width()).height($("#image").height());
|
||||
// $(document).bind("keydown", "ctrl+n", Danbooru.Note.TranslationMode.start);
|
||||
|
||||
$("#toggle-resize").click(function() {
|
||||
var $image = $("#image");
|
||||
if ($image.attr("resized") === "1") {
|
||||
Danbooru.Note.Image.reset_size();
|
||||
} else {
|
||||
Danbooru.Note.Image.resize();
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user