From: Scott Worley <scottworley@scottworley.com>
Date: Fri, 28 Feb 2014 21:22:24 +0000 (-0800)
Subject: 'r' to Rotate.
X-Git-Url: http://git.scottworley.com/picsort/commitdiff_plain/59a0fba182b1c592474e3c3c01730917b51828ea?ds=inline

'r' to Rotate.

This is janky.  The rotation is applied immediately, but changing the
src attribute to load new image data takes longer, so the two are not
applied at the same time.
---

diff --git a/picsorter.css b/picsorter.css
index 78e0d79..943bbd3 100644
--- a/picsorter.css
+++ b/picsorter.css
@@ -7,6 +7,28 @@
     to { opacity: 0; }
 }
 
+.rot90 {
+  rotation: 90deg;
+  -webkit-transform: rotate(90deg);
+  -moz-transform: rotate(90deg);
+  -o-transform: rotate(90deg);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
+}
+.rot180 {
+  rotation: 180deg;
+  -webkit-transform: rotate(180deg);
+  -moz-transform: rotate(180deg);
+  -o-transform: rotate(180deg);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
+}
+.rot270 {
+  rotation: 270deg;
+  -webkit-transform: rotate(270deg);
+  -moz-transform: rotate(270deg);
+  -o-transform: rotate(270deg);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+}
+
 #message {
   position: fixed;
   font-size: 18pt;
diff --git a/picsorter.js b/picsorter.js
index ec63cbc..24cc893 100644
--- a/picsorter.js
+++ b/picsorter.js
@@ -40,7 +40,12 @@ function setpic() {
   } else {
     display_filename = zoom + files[input_index];
   }
-  $("#pic").attr("src", display_filename);
+  var $pic = $("#pic");
+  $pic.attr("src", display_filename);
+  $pic.removeClass("rot90 rot180 rot270");
+  if ("rotate" in picinfo[files[input_index]]) {
+    $pic.addClass("rot" + picinfo[files[input_index]].rotate);
+  }
 }
 
 function say(message) {
@@ -117,6 +122,18 @@ function change_exposure(amount) {
   say((display_exposure >= 0 ? "+" : "") + display_exposure);
 }
 
+function rotate() {
+  var rotation = picinfo[files[input_index]].rotate || 0;
+  rotation = (rotation + 90) % 360;
+  if (rotation > 1e-5) {
+    picinfo[files[input_index]].rotate = rotation;
+  } else {
+    delete picinfo[files[input_index]].rotate;
+  }
+  save_picinfo();
+  setpic(); 
+}
+
 function set_name() {
   var name_input = $("#name").hide().get(0);
   var name = name_input.value;
@@ -143,4 +160,5 @@ Mousetrap.bind(['b', 'k'], function() { change_exposure(1); });
 Mousetrap.bind(['d', 'j'], function() { change_exposure(-1); });
 Mousetrap.bind('x', mark_deleted);
 Mousetrap.bind('X', mark_not_deleted);
+Mousetrap.bind('r', rotate);
 Mousetrap.bind('c', function() { $("#name").show().focus(); return false; });