Partial re-write of drive integration UI

This commit is contained in:
Lewis Hemens 2014-03-23 17:06:40 +00:00
parent 8b27d9813d
commit 77e13d624d
4 changed files with 145 additions and 118 deletions

BIN
images/drive-icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 36 KiB

View File

@ -193,6 +193,7 @@ textarea {
.move-image { background-image: url('images/move-icon.png'); } .move-image { background-image: url('images/move-icon.png'); }
.text-image { background-image: url('images/text-icon.png'); } .text-image { background-image: url('images/text-icon.png'); }
.info-image { background-image: url('images/info-icon.png'); } .info-image { background-image: url('images/info-icon.png'); }
.drive-image { background-image: url('images/drive-icon.png'); }
</style> </style>
</head> </head>
@ -212,10 +213,9 @@ textarea {
</div> </div>
<div id="file-tools"> <div id="file-tools">
<div id="drive-filename" class="edit">Untitled ASCII Diagram</div> <button id="drive-button" class="tool drive-image"></button>
<button id="export-button" class="tool">Ex</button> <button id="export-button" class="tool">Ex</button>
<button id="import-button" class="tool">Im</button> <button id="import-button" class="tool">Im</button>
<button id="save-button" class="tool">Sa</button>
<button id="clear-button" class="tool">Cl</button> <button id="clear-button" class="tool">Cl</button>
<button id="undo-button" class="tool">Un</button> <button id="undo-button" class="tool">Un</button>
<button id="redo-button" class="tool">Re</button> <button id="redo-button" class="tool">Re</button>
@ -247,20 +247,24 @@ textarea {
<button id="import-submit-button">Submit</button> <button id="import-submit-button">Submit</button>
</div> </div>
<!-- These dialogs are handled seperately. -->
<div id="text-tool-widget"> <div id="text-tool-widget">
<textarea id="text-tool-input"></textarea> <textarea id="text-tool-input"></textarea>
<button id="text-tool-close">Close</button> <button id="text-tool-close">Close</button>
</div> </div>
<div id="drive-dialog" class="dialog">
<button class="close-dialog-button">Close</button>
</div>
<textarea id="freeform-tool-input"></textarea> <textarea id="freeform-tool-input"></textarea>
<canvas id="ascii-canvas"></canvas> <canvas id="ascii-canvas"></canvas>
<script src="https://apis.google.com/js/api.js"></script>
<script src="https://apis.google.com/js/client.js"></script>
<script src="jquery-1.9.1.min.js"></script> <script src="jquery-1.9.1.min.js"></script>
<script src="jquery.jeditable.min.js"></script>
<script src="js-compiled.js"></script> <script src="js-compiled.js"></script>
<script src="https://apis.google.com/js/client.js?onload=window.gapiCallback"></script>
<script> <script>
window.setTimeout(function() { $('#logo-interstitial').addClass('fade-out'); }, 1000); window.setTimeout(function() { $('#logo-interstitial').addClass('fade-out'); }, 1000);

View File

@ -1,7 +1,7 @@
try { try {
throw 1; throw 1;
} catch (aa) { } catch (aa) {
window.C = window.C || {}; window.D = window.D || {};
} }
var f = "ontouchstart" in window || "onmsgesturechange" in window; var f = "ontouchstart" in window || "onmsgesturechange" in window;
function l(a, b) { function l(a, b) {
@ -51,7 +51,7 @@ function da(a, b) {
} }
function ea(a, b) { function ea(a, b) {
this.position = a; this.position = a;
this.B = b; this.C = b;
} }
;function z(a) { ;function z(a) {
this.state = a; this.state = a;
@ -98,7 +98,7 @@ function fa(a) {
b.font = "15px Courier New"; b.font = "15px Courier New";
for (var g = c.x;g < e.x;g++) { for (var g = c.x;g < e.x;g++) {
for (var k = c.y;k < e.y;k++) { for (var k = c.y;k < e.y;k++) {
var h = D(a.state, new l(g, k)); var h = C(a.state, new l(g, k));
if (x(h) || null != h.f && " " != w(h)) { if (x(h) || null != h.f && " " != w(h)) {
a.context.fillStyle = null != h.f ? "#DEF" : "#F5F5F5", b.fillRect(9 * g - a.offset.x, 17 * (k - 1) - a.offset.y, 9, 17); a.context.fillStyle = null != h.f ? "#DEF" : "#F5F5F5", b.fillRect(9 * g - a.offset.x, 17 * (k - 1) - a.offset.y, 9, 17);
} }
@ -112,12 +112,12 @@ function fa(a) {
b.beginPath(); b.beginPath();
for (d = c.x;d < e.x;d++) { for (d = c.x;d < e.x;d++) {
for (h = !1, g = c.y;g < e.y;g++) { for (h = !1, g = c.y;g < e.y;g++) {
k = D(a.state, new l(d, g)), x(k) && g != e.y - 1 || !h || (b.moveTo(9 * d - a.offset.x + 4.5, 17 * h - a.offset.y - 8.5), b.lineTo(9 * d - a.offset.x + 4.5, 17 * (g - 1) - a.offset.y - 8.5), h = !1), x(k) && !h && (h = g); k = C(a.state, new l(d, g)), x(k) && g != e.y - 1 || !h || (b.moveTo(9 * d - a.offset.x + 4.5, 17 * h - a.offset.y - 8.5), b.lineTo(9 * d - a.offset.x + 4.5, 17 * (g - 1) - a.offset.y - 8.5), h = !1), x(k) && !h && (h = g);
} }
} }
for (g = c.y;g < e.y;g++) { for (g = c.y;g < e.y;g++) {
for (h = !1, d = c.x;d < e.x;d++) { for (h = !1, d = c.x;d < e.x;d++) {
k = D(a.state, new l(d, g)), x(k) && d != e.x - 1 || !h || (b.moveTo(9 * h - a.offset.x + 4.5, 17 * g - a.offset.y - 8.5), b.lineTo(9 * (d - 1) - a.offset.x + 4.5, 17 * g - a.offset.y - 8.5), h = !1), x(k) && !h && (h = d); k = C(a.state, new l(d, g)), x(k) && d != e.x - 1 || !h || (b.moveTo(9 * h - a.offset.x + 4.5, 17 * g - a.offset.y - 8.5), b.lineTo(9 * (d - 1) - a.offset.x + 4.5, 17 * g - a.offset.y - 8.5), h = !1), x(k) && !h && (h = d);
} }
} }
a.context.stroke(); a.context.stroke();
@ -130,11 +130,11 @@ function B(a, b) {
d = d || "+"; d = d || "+";
var g = Math.min(b.x, c.x), k = Math.min(b.y, c.y), h = Math.max(b.x, c.x), s = Math.max(b.y, c.y), t = e ? c.x : b.x; var g = Math.min(b.x, c.x), k = Math.min(b.y, c.y), h = Math.max(b.x, c.x), s = Math.max(b.y, c.y), t = e ? c.x : b.x;
for (e = e ? b.y : c.y;g++ < h;) { for (e = e ? b.y : c.y;g++ < h;) {
var P = new l(g, e), E = a.getContext(new l(g, e)); var Q = new l(g, e), E = a.getContext(new l(g, e));
" " == d && 2 == E.m + E.j || H(a, P, d); " " == d && 2 == E.m + E.j || H(a, Q, d);
} }
for (;k++ < s;) { for (;k++ < s;) {
P = new l(t, k), E = a.getContext(new l(t, k)), " " == d && 2 == E.left + E.right || H(a, P, d); Q = new l(t, k), E = a.getContext(new l(t, k)), " " == d && 2 == E.left + E.right || H(a, Q, d);
} }
I(a, b, d); I(a, b, d);
I(a, c, d); I(a, c, d);
@ -214,7 +214,7 @@ O.prototype.start = function(a) {
L(this.state); L(this.state);
$("#text-tool-input").val(""); $("#text-tool-input").val("");
this.a = a; this.a = a;
a = w(D(this.state, this.a)); a = w(C(this.state, this.a));
I(this.state, this.a, null == a ? "\u2009" : a); I(this.state, this.a, null == a ? "\u2009" : a);
}; };
O.prototype.move = function() { O.prototype.move = function() {
@ -236,15 +236,15 @@ O.prototype.e = function() {
"\n" == a[e] ? (c++, b = 0) : (I(this.state, this.g.add(new l(b, c)), a[e]), b++); "\n" == a[e] ? (c++, b = 0) : (I(this.state, this.g.add(new l(b, c)), a[e]), b++);
} }
}; };
function Q(a) { function P(a) {
this.state = a; this.state = a;
this.g = this.a = null; this.g = this.a = null;
} }
Q.prototype.start = function(a) { P.prototype.start = function(a) {
this.a = a; this.a = a;
this.move(a); this.move(a);
}; };
Q.prototype.move = function(a) { P.prototype.move = function(a) {
K(this.state); K(this.state);
this.g = a; this.g = a;
var b = Math.min(this.a.x, this.g.x); var b = Math.min(this.a.x, this.g.x);
@ -255,30 +255,30 @@ Q.prototype.move = function(a) {
} }
} }
}; };
Q.prototype.end = function() { P.prototype.end = function() {
L(this.state); L(this.state);
}; };
Q.prototype.l = function() { P.prototype.l = function() {
return "crosshair"; return "crosshair";
}; };
Q.prototype.e = function() { P.prototype.e = function() {
}; };
function R(a) { function R(a) {
this.state = a; this.state = a;
this.h = this.a = null; this.h = this.a = null;
} }
R.prototype.start = function(a) { R.prototype.start = function(a) {
if (f && !x(D(this.state, a))) { if (f && !x(C(this.state, a))) {
var b = v.concat([p.add(r), p.add(u), q.add(r), q.add(u)]), c = null, e = 0, d; var b = v.concat([p.add(r), p.add(u), q.add(r), q.add(u)]), c = null, e = 0, d;
for (d in b) { for (d in b) {
var g = a.add(b[d]), k = y(this.state.getContext(g)); var g = a.add(b[d]), k = y(this.state.getContext(g));
x(D(this.state, g)) && k > e && (c = b[d], e = k); x(C(this.state, g)) && k > e && (c = b[d], e = k);
} }
a = null == c ? a : a.add(c); a = null == c ? a : a.add(c);
} }
this.a = a; this.a = a;
this.h = null; this.h = null;
if (x(D(this.state, this.a))) { if (x(C(this.state, this.a))) {
this.state.getContext(this.a); this.state.getContext(this.a);
a = []; a = [];
for (var h in v) { for (var h in v) {
@ -312,7 +312,7 @@ R.prototype.end = function() {
function S(a, b, c) { function S(a, b, c) {
for (var e = b.clone(), d = [];;) { for (var e = b.clone(), d = [];;) {
var g = e.add(c); var g = e.add(c);
if (!x(D(a.state, g))) { if (!x(C(a.state, g))) {
return m(b, e) || d.push(e), d; return m(b, e) || d.push(e), d;
} }
e = g; e = g;
@ -320,7 +320,7 @@ function S(a, b, c) {
} }
} }
R.prototype.l = function(a) { R.prototype.l = function(a) {
return x(D(this.state, a)) ? "pointer" : "default"; return x(C(this.state, a)) ? "pointer" : "default";
}; };
R.prototype.e = function() { R.prototype.e = function() {
}; };
@ -328,8 +328,8 @@ function T() {
this.cells = Array(2E3); this.cells = Array(2E3);
this.i = []; this.i = [];
this.d = !0; this.d = !0;
this.B = [];
this.A = []; this.A = [];
this.w = [];
for (var a = 0;a < this.cells.length;a++) { for (var a = 0;a < this.cells.length;a++) {
this.cells[a] = Array(600); this.cells[a] = Array(600);
for (var b = 0;b < this.cells[a].length;b++) { for (var b = 0;b < this.cells[a].length;b++) {
@ -345,26 +345,26 @@ T.prototype.clear = function() {
} }
L(this); L(this);
}; };
function D(a, b) { function C(a, b) {
return a.cells[b.x][b.y]; return a.cells[b.x][b.y];
} }
function I(a, b, c) { function I(a, b, c) {
var e = D(a, b); var e = C(a, b);
a.i.push(new ea(b, e)); a.i.push(new ea(b, e));
e.f = c; e.f = c;
a.d = !0; a.d = !0;
} }
function H(a, b, c) { function H(a, b, c) {
w(D(a, b)) != c && I(a, b, c); w(C(a, b)) != c && I(a, b, c);
} }
function K(a) { function K(a) {
for (var b in a.i) { for (var b in a.i) {
a.i[b].B.f = null; a.i[b].C.f = null;
} }
a.i.length = 0; a.i.length = 0;
} }
function F(a, b) { function F(a, b) {
var c = D(a, b), c = null != c.f ? c.f : c.value; var c = C(a, b), c = null != c.f ? c.f : c.value;
if ("+" != c) { if ("+" != c) {
return c; return c;
} }
@ -372,8 +372,8 @@ function F(a, b) {
return c.left && c.right && !c.m && !c.j ? "\u2013" : !c.left && !c.right && c.m && c.j ? "|" : c.left && c.right && c.m && c.j ? "\u2013" : "+"; return c.left && c.right && !c.m && !c.j ? "\u2013" : !c.left && !c.right && c.m && c.j ? "|" : c.left && c.right && c.m && c.j ? "\u2013" : "+";
} }
T.prototype.getContext = function(a) { T.prototype.getContext = function(a) {
var b = x(D(this, a.add(p))), c = x(D(this, a.add(q))), e = x(D(this, a.add(r))); var b = x(C(this, a.add(p))), c = x(C(this, a.add(q))), e = x(C(this, a.add(r)));
a = x(D(this, a.add(u))); a = x(C(this, a.add(u)));
return new ca(b, c, e, a); return new ca(b, c, e, a);
}; };
function L(a, b) { function L(a, b) {
@ -384,7 +384,7 @@ function L(a, b) {
}); });
a.i.length = 0; a.i.length = 0;
for (var g in d) { for (var g in d) {
var k = d[g].B; var k = d[g].C;
c.push(new da(d[g].position, null != k.value ? k.value : " ")); c.push(new da(d[g].position, null != k.value ? k.value : " "));
var h = w(k); var h = w(k);
if ("\u2009" == h || " " == h) { if ("\u2009" == h || " " == h) {
@ -393,13 +393,13 @@ function L(a, b) {
k.f = null; k.f = null;
k.value = h; k.value = h;
} }
d = b ? a.w : a.A; d = b ? a.A : a.B;
0 < c.length && (50 < d.length && d.shift(), d.push(c)); 0 < c.length && (50 < d.length && d.shift(), d.push(c));
a.d = !0; a.d = !0;
} }
function U(a) { function U(a) {
if (0 != a.A.length) { if (0 != a.B.length) {
var b = a.A.pop(), c; var b = a.B.pop(), c;
for (c in b) { for (c in b) {
var e = b[c]; var e = b[c];
I(a, e.position, e.value); I(a, e.position, e.value);
@ -407,9 +407,9 @@ function U(a) {
L(a, !0); L(a, !0);
} }
} }
function V(a) { function ga(a) {
if (0 != a.w.length) { if (0 != a.A.length) {
var b = a.w.pop(), c; var b = a.A.pop(), c;
for (c in b) { for (c in b) {
var e = b[c]; var e = b[c];
I(a, e.position, e.value); I(a, e.position, e.value);
@ -417,7 +417,7 @@ function V(a) {
L(a); L(a);
} }
} }
function ga(a) { function ha(a) {
for (var b = new l(Number.MAX_VALUE, Number.MAX_VALUE), c = new l(-1, -1), e = 0;e < a.cells.length;e++) { for (var b = new l(Number.MAX_VALUE, Number.MAX_VALUE), c = new l(-1, -1), e = 0;e < a.cells.length;e++) {
for (var d = 0;d < a.cells[e].length;d++) { for (var d = 0;d < a.cells[e].length;d++) {
null != w(a.cells[e][d]) && (e < b.x && (b.x = e), d < b.y && (b.y = d), e > c.x && (c.x = e), d > c.y && (c.y = d)); null != w(a.cells[e][d]) && (e < b.x && (b.x = e), d < b.y && (b.y = d), e > c.x && (c.x = e), d > c.y && (c.y = d));
@ -434,14 +434,14 @@ function ga(a) {
} }
return g; return g;
} }
;function W(a, b) { ;function V(a, b) {
this.view = a; this.view = a;
this.state = b; this.state = b;
this.c = new J(b); this.c = new J(b);
this.mode = 0; this.mode = 0;
this.n(); this.n();
} }
W.prototype.p = function(a) { V.prototype.p = function(a) {
var b = B(this.view, a); var b = B(this.view, a);
null == this.o && (this.o = b); null == this.o && (this.o = b);
m(b, this.o) || (this.view.canvas.style.cursor = this.c.l(b)); m(b, this.o) || (this.view.canvas.style.cursor = this.c.l(b));
@ -454,14 +454,14 @@ W.prototype.p = function(a) {
} }
this.o = b; this.o = b;
}; };
function X(a) { function W(a) {
2 == a.mode && a.c.end(); 2 == a.mode && a.c.end();
a.mode = 0; a.mode = 0;
a.t = null; a.t = null;
a.u = null; a.u = null;
a.o = null; a.o = null;
} }
W.prototype.n = function() { V.prototype.n = function() {
var a = this; var a = this;
$(window).resize(function() { $(window).resize(function() {
A(a.view); A(a.view);
@ -475,7 +475,7 @@ W.prototype.n = function() {
"box-button" == a && (this.c = new J(this.state)); "box-button" == a && (this.c = new J(this.state));
"line-button" == a && (this.c = new M(this.state)); "line-button" == a && (this.c = new M(this.state));
"freeform-button" == a && (this.c = new N(this.state, "+")); "freeform-button" == a && (this.c = new N(this.state, "+"));
"erase-button" == a && (this.c = new Q(this.state)); "erase-button" == a && (this.c = new P(this.state));
"move-button" == a && (this.c = new R(this.state)); "move-button" == a && (this.c = new R(this.state));
"text-button" == a && (this.c = new O(this.state)); "text-button" == a && (this.c = new O(this.state));
L(this.state); L(this.state);
@ -485,10 +485,10 @@ W.prototype.n = function() {
a = a.target.id; a = a.target.id;
$(".dialog").removeClass("visible"); $(".dialog").removeClass("visible");
$("#" + a + "-dialog").toggleClass("visible"); $("#" + a + "-dialog").toggleClass("visible");
"export-button" == a && ($("#export-area").val(ga(this.state)), $("#export-area").focus(), $("#export-area").select()); "export-button" == a && ($("#export-area").val(ha(this.state)), $("#export-area").focus(), $("#export-area").select());
"clear-button" == a && this.state.clear(); "clear-button" == a && this.state.clear();
"undo-button" == a && U(this.state); "undo-button" == a && U(this.state);
"redo-button" == a && V(this.state); "redo-button" == a && ga(this.state);
}.bind(this)); }.bind(this));
$("button.close-dialog-button").click(function() { $("button.close-dialog-button").click(function() {
$(".dialog").removeClass("visible"); $(".dialog").removeClass("visible");
@ -525,7 +525,7 @@ W.prototype.n = function() {
$(window).keydown(function(a) { $(window).keydown(function(a) {
var c = null; var c = null;
if (a.ctrlKey || a.metaKey) { if (a.ctrlKey || a.metaKey) {
67 == a.keyCode && (c = "<copy>"), 86 == a.keyCode && (c = "<paste>"), 90 == a.keyCode && U(this.state), 89 == a.keyCode && V(this.state), 88 == a.keyCode && (c = "<cut>"); 67 == a.keyCode && (c = "<copy>"), 86 == a.keyCode && (c = "<paste>"), 90 == a.keyCode && U(this.state), 89 == a.keyCode && ga(this.state), 88 == a.keyCode && (c = "<cut>");
} }
8 == a.keyCode && (c = "<backspace>"); 8 == a.keyCode && (c = "<backspace>");
13 == a.keyCode && (c = "<enter>"); 13 == a.keyCode && (c = "<enter>");
@ -546,21 +546,34 @@ W.prototype.n = function() {
L(this.state); L(this.state);
}.bind(this)); }.bind(this));
}; };
function ha(a) { function ia(a) {
this.v = !1;
this.state = a; this.state = a;
this.file = null; this.file = null;
ja(this);
$("#save-button").click(function() { $("#save-button").click(function() {
this.save(); this.save();
}.bind(this)); }.bind(this));
$("#drive-button").click(function() {
this.v || (X(!1), ka(this));
}.bind(this));
} }
function ia(a) { function X(a) {
window.gapi.auth.authorize({client_id:"125643747010-9s9n1ne2fnnuh5v967licfkt83r4vba5.apps.googleusercontent.com", scope:"https://www.googleapis.com/auth/drive", immediate:!0}, function(b) { window.gapi.auth.authorize({client_id:"125643747010-9s9n1ne2fnnuh5v967licfkt83r4vba5.apps.googleusercontent.com", scope:"https://www.googleapis.com/auth/drive", immediate:a}, function(a) {
b && !b.error ? a(!0) : window.gapi.auth.authorize({client_id:"125643747010-9s9n1ne2fnnuh5v967licfkt83r4vba5.apps.googleusercontent.com", scope:"https://www.googleapis.com/auth/drive", immediate:!1}, function(b) { a && !a.error && (this.v = !0, $("#drive-button").addClass("active"));
a(b && !b.error);
});
}); });
} }
function ja(a, b) { function ja(a) {
window.gapi && window.gapi.auth && window.gapi.auth.authorize ? X(!0) : window.setTimeout(function() {
ja(this);
}.bind(a), 2E3);
}
function ka(a) {
window.setTimeout(function() {
this.v || (X(!0), ka(this));
}.bind(a), 2E3);
}
function la(a, b) {
a.file = b; a.file = b;
$("#drive-filename").text(b.title); $("#drive-filename").text(b.title);
$("#drive-filename").editable(function(a) { $("#drive-filename").editable(function(a) {
@ -570,24 +583,24 @@ function ja(a, b) {
return a; return a;
}.bind(a), {type:"text", submit:"OK"}); }.bind(a), {type:"text", submit:"OK"});
} }
ha.prototype.save = function() { ia.prototype.save = function() {
window.gapi.client.load("drive", "v2", function() { window.gapi.client.load("drive", "v2", function() {
ia(function(a) { X(function(a) {
a && ka(this).execute(function(a) { a && ma(this).execute(function(a) {
ja(this, a); la(this, a);
}.bind(this)); }.bind(this));
}.bind(this)); }.bind(this));
}.bind(this)); }.bind(this));
}; };
function ka(a) { function ma(a) {
var b = ga(a.state), b = "\r\n---------314159265358979323846\r\nContent-Type: application/json\r\n\r\n" + JSON.stringify({title:null == a.file ? "Untitled ASCII Diagram" : a.file.title, mimeType:"text/plain"}) + "\r\n---------314159265358979323846\r\nContent-Type: text/plain\r\n\r\n" + b + "\r\n---------314159265358979323846--"; var b = ha(a.state), b = "\r\n---------314159265358979323846\r\nContent-Type: application/json\r\n\r\n" + JSON.stringify({title:null == a.file ? "Untitled ASCII Diagram" : a.file.title, mimeType:"text/plain"}) + "\r\n---------314159265358979323846\r\nContent-Type: text/plain\r\n\r\n" + b + "\r\n---------314159265358979323846--";
return window.gapi.client.request({path:"/upload/drive/v2/files" + (null == a.file ? "" : "/" + a.file.id), method:null == a.file ? "POST" : "PUT", params:{uploadType:"multipart"}, headers:{"Content-Type":'multipart/mixed; boundary="-------314159265358979323846"'}, body:b}); return window.gapi.client.request({path:"/upload/drive/v2/files" + (null == a.file ? "" : "/" + a.file.id), method:null == a.file ? "POST" : "PUT", params:{uploadType:"multipart"}, headers:{"Content-Type":'multipart/mixed; boundary="-------314159265358979323846"'}, body:b});
} }
;function la(a) { ;function na(a) {
this.b = a; this.b = a;
this.n(); this.n();
} }
la.prototype.n = function() { na.prototype.n = function() {
var a = this.b.view.canvas; var a = this.b.view.canvas;
$(a).bind("mousewheel", function(a) { $(a).bind("mousewheel", function(a) {
a = this.b.view.zoom * (0 < a.originalEvent.wheelDelta ? 1.1 : 0.9); a = this.b.view.zoom * (0 < a.originalEvent.wheelDelta ? 1.1 : 0.9);
@ -608,10 +621,10 @@ la.prototype.n = function() {
} }
}.bind(this)); }.bind(this));
$(a).mouseup(function() { $(a).mouseup(function() {
X(this.b); W(this.b);
}.bind(this)); }.bind(this));
$(a).mouseleave(function() { $(a).mouseleave(function() {
X(this.b); W(this.b);
}.bind(this)); }.bind(this));
$(a).mousemove(function(a) { $(a).mousemove(function(a) {
this.b.p(new l(a.clientX, a.clientY)); this.b.p(new l(a.clientX, a.clientY));
@ -622,12 +635,12 @@ function Y(a) {
this.r = this.k = !1; this.r = this.k = !1;
this.n(); this.n();
} }
function ma(a, b) { function oa(a, b) {
a.v = b; a.w = b;
a.F = $.now(); a.G = $.now();
a.k = !1; a.k = !1;
window.setTimeout(function() { window.setTimeout(function() {
if (!this.k && !this.r && null != this.v) { if (!this.k && !this.r && null != this.w) {
var a = this.b; var a = this.b;
a.mode = 2; a.mode = 2;
a.c.start(B(a.view, b)); a.c.start(B(a.view, b));
@ -635,7 +648,7 @@ function ma(a, b) {
}.bind(a), 130); }.bind(a), 130);
} }
Y.prototype.p = function(a) { Y.prototype.p = function(a) {
if (!this.k && 130 > $.now() - this.F && 3 < n(a, this.v).length()) { if (!this.k && 130 > $.now() - this.G && 3 < n(a, this.w).length()) {
this.k = !0; this.k = !0;
var b = this.b; var b = this.b;
b.mode = 1; b.mode = 1;
@ -646,23 +659,23 @@ Y.prototype.p = function(a) {
}; };
Y.prototype.reset = function() { Y.prototype.reset = function() {
this.r = this.k = !1; this.r = this.k = !1;
this.v = null; this.w = null;
}; };
Y.prototype.n = function() { Y.prototype.n = function() {
var a = this.b.view.canvas; var a = this.b.view.canvas;
$(a).bind("touchstart", function(a) { $(a).bind("touchstart", function(a) {
a.preventDefault(); a.preventDefault();
if (1 == a.originalEvent.touches.length) { if (1 == a.originalEvent.touches.length) {
ma(this, new l(a.originalEvent.touches[0].pageX, a.originalEvent.touches[0].pageY)); oa(this, new l(a.originalEvent.touches[0].pageX, a.originalEvent.touches[0].pageY));
} else { } else {
if (1 < a.originalEvent.touches.length) { if (1 < a.originalEvent.touches.length) {
var c = new l(a.originalEvent.touches[0].pageX, a.originalEvent.touches[0].pageY); var c = new l(a.originalEvent.touches[0].pageX, a.originalEvent.touches[0].pageY);
a = new l(a.originalEvent.touches[1].pageX, a.originalEvent.touches[1].pageY); a = new l(a.originalEvent.touches[1].pageX, a.originalEvent.touches[1].pageY);
X(this.b); W(this.b);
this.r = !0; this.r = !0;
this.k = !1; this.k = !1;
this.G = n(c, a).length(); this.H = n(c, a).length();
this.D = this.b.view.zoom; this.F = this.b.view.zoom;
} }
} }
}.bind(this)); }.bind(this));
@ -674,19 +687,19 @@ Y.prototype.n = function() {
if (1 < a.originalEvent.touches.length) { if (1 < a.originalEvent.touches.length) {
var c = new l(a.originalEvent.touches[0].pageX, a.originalEvent.touches[0].pageY); var c = new l(a.originalEvent.touches[0].pageX, a.originalEvent.touches[0].pageY);
a = new l(a.originalEvent.touches[1].pageX, a.originalEvent.touches[1].pageY); a = new l(a.originalEvent.touches[1].pageX, a.originalEvent.touches[1].pageY);
this.r && (c = this.D * n(c, a).length() / this.G, c = Math.max(Math.min(c, 5), 0.5), a = this.b.view, a.zoom = c, a.d = !0); this.r && (c = this.F * n(c, a).length() / this.H, c = Math.max(Math.min(c, 5), 0.5), a = this.b.view, a.zoom = c, a.d = !0);
} }
} }
}.bind(this)); }.bind(this));
$(a).bind("touchend", function(a) { $(a).bind("touchend", function(a) {
a.preventDefault(); a.preventDefault();
this.reset(); this.reset();
X(this.b); W(this.b);
}.bind(this)); }.bind(this));
}; };
var Z = new T, na = new z(Z), oa = new W(na, Z); var Z = new T, pa = new z(Z), qa = new V(pa, Z);
new Y(oa); new Y(qa);
new la(oa); new na(qa);
new ha(Z); new ia(Z);
na.animate(); pa.animate();

View File

@ -10,38 +10,66 @@ var DEVELOPER_KEY = 'AIzaSyBbKO_v9p-G9StQjYmtUYLP6Px4MkGions';
* @constructor * @constructor
*/ */
ascii.DriveController = function(state) { ascii.DriveController = function(state) {
/** @type {boolean} */
this.driveEnabled = false;
/** @type {ascii.State} */ /** @type {ascii.State} */
this.state = state; this.state = state;
// This is a file resource, as defined by the Drive API. // This is a file resource, as defined by the Drive API.
/** @type {Object} */ /** @type {Object} */
this.file = null; this.file = null;
this.tryInitialAuth();
$('#save-button').click(function(e) { $('#save-button').click(function(e) {
this.save(); this.save();
}.bind(this)); }.bind(this));
$('#drive-button').click(function() {
if (!this.driveEnabled) {
// Haven't been able to immediately auth yet, so try full auth.
this.checkAuth(false);
this.waitForFullAuth();
} else {
this.loadDialog();
}
}.bind(this));
}; };
/** /**
* Check if the current user has authorized the application. * Check if the current user has authorized the application.
*/ */
ascii.DriveController.prototype.checkAuth = function(callback) { ascii.DriveController.prototype.checkAuth = function(immediate) {
window['gapi']['auth']['authorize']({ window['gapi']['auth']['authorize']({
'client_id': CLIENT_ID, 'client_id': CLIENT_ID,
'scope': SCOPES, 'scope': SCOPES,
'immediate': true}, 'immediate': immediate},
function(result) { function(result) {
if (result && !result.error) { if (result && !result.error) {
callback(true); this.driveEnabled = true;
} else { $('#drive-button').addClass('active');
window['gapi']['auth']['authorize']({
'client_id': CLIENT_ID,
'scope': SCOPES,
'immediate': false},
function(result) {
callback(result && !result.error);
});
} }
}); }.bind(this));
};
ascii.DriveController.prototype.tryInitialAuth = function() {
if (window['gapi'] && window['gapi']['auth'] && window['gapi']['auth']['authorize']) {
this.checkAuth(true);
} else {
window.setTimeout(function() {
this.tryInitialAuth();
}.bind(this), 2000);
}
};
ascii.DriveController.prototype.waitForFullAuth = function() {
window.setTimeout(function() {
if (!this.driveEnabled) {
this.checkAuth(true);
this.waitForFullAuth();
} else {
this.loadDialog();
}
}.bind(this), 2000);
}; };
/** /**
@ -65,36 +93,18 @@ ascii.DriveController.prototype.handleFile = function(file) {
/** /**
* Loads the picker. * Loads the drive dialog.
* TODO: Implement this...
*/ */
ascii.DriveController.prototype.load = function() { ascii.DriveController.prototype.loadDialog = function() {
/* $('#drive-dialog').addClass('visible');
window['gapi']['client']['load']('picker',
{'callback': function() {
var picker = new window['google']['picker']['PickerBuilder']().
addView(google.picker.ViewId.PHOTOS).
setOAuthToken(oauthToken).
setDeveloperKey(developerKey).
setCallback(pickerCallback).
build();
picker.setVisible(true);
}});
*/
}; };
/** /**
* Saves the current diagram to drive. * Saves the current diagram to drive.
*/ */
ascii.DriveController.prototype.save = function() { ascii.DriveController.prototype.save = function() {
window['gapi']['client']['load']('drive', 'v2', function() { this.getSaveRequest().execute(function(result) {
this.checkAuth(function(authed) { this.handleFile(result);
if (authed) {
this.getSaveRequest().execute(function(result) {
this.handleFile(result);
}.bind(this));
}
}.bind(this))
}.bind(this)); }.bind(this));
}; };