Complete rewrite of the organize module in Javascript using the Sencha

JavaScript library.  It's got all the functionality from the Flash
version except it doesn't support creating new albums or uploading
photos.

Only tested in Chrome 10.0.x so far.

2 files changed, 60 insertions, 18 deletions

diff --git a/modules/organize/css/organize.css b/modules/organize/css/organize.css
new file mode 100644
index 00000000..00395520
--- /dev/null
+++ b/modules/organize/css/organize.css
@@ -0,0 +1,60 @@
+.g-organize {
+  font-family: 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
+}
+
+.g-organize div.thumb {
+  padding: 8px;
+  margin: 8px;
+}
+
+.g-organize div.selected {
+  background: #C9D8EB;
+}
+
+.g-organize div.thumb img {
+  border: 4px solid white;
+}
+
+.g-organize div.thumb:hover {
+  border: 2px solid #eee;
+  margin: 6px;
+  cursor: pointer;
+}
+
+.g-organize div.thumb {
+  display: inline-block;
+}
+
+.g-organize div.thumb div.icon {
+  position: relative;
+  padding: 0px;
+  margin: 0px;
+  visibility: hidden;
+  width: 16px;
+  height: 16px;
+  top: -16px;
+  margin-bottom: -16px;
+  padding-bottom: -16px;
+}
+
+.g-organize div.thumb-album div.icon {
+  visibility: visible;
+}
+
+.g-organize div.drop-target {
+  background: #eee;
+}
+
+.g-organize div.active {
+  border-left: 4px solid #C9D8EB;
+  margin-left: 4px;
+}
+
+div.multi-proxy div {
+  display: inline-block;
+}
+
+.g-organize .x-tree-node-el {
+  font-size: 12px;
+  line-height: 20px;
+}
diff --git a/modules/organize/css/organize_theme.css b/modules/organize/css/organize_theme.css
deleted file mode 100644
index e698f88d..00000000
--- a/modules/organize/css/organize_theme.css
+++ /dev/null
@@ -1,18 +0,0 @@
-/** *******************************************************************
- * Organize styles that are theme overrideable
- *********************************************************************/
-#g-organize {
-  background-color: #FFFFFF;
-  border: 0px solid #000000;
-  color: #0E2B52;
-}
-
-#g-organize-hover {
-  background-color: #CFDEFF;
-  display: none;
-}
-
-#g-organize-active {
-  background-color: #6699CC;
-  display: none;
-}