Merge lp:~mttronchetti/novacut/help into lp:novacut

[Matteo Ronchetti]

Added the commands/shortcuts window and fixed a small bug

[lp:~mttronchetti/novacut/help]

283. By Matteo Ronchetti on 2012-07-20

added a new shortcut in the window

[Jason Gerard DeRose (jderose)]

Overall it looks good, but there's one change I'd like: can you remove the novacut.com link and replace it with this help instead (same place in the grid). Also, can you change the text from help to Keyboard Shortcuts?

review: Needs Fixing

[lp:~mttronchetti/novacut/help]

284. By Matteo Ronchetti on 2012-07-23

changed name in keyboard shortcuts

[Jason Gerard DeRose (jderose)]

Looks great, thanks!

One note: I'd like to hold off on adding any more keyboard shortcuts till we've done detailed design work on this, really have a plan.

review: Approve

=== modified file 'ui/bucket.css'
--- ui/bucket.css	2012-04-29 22:12:50 +0000
+++ ui/bucket.css	2012-07-23 07:59:18 +0000
@@ -539,3 +539,22 @@
     margin: 0;
     pointer-events: none;
 }
+
+#shortcuts{
+	position:fixed;
+    background-color: rgba(15, 15, 15, 0.85);
+text-shadow: 2px 2px 3px rgba(255, 0, 0, 0.5);
+    box-shadow: 0px 0px 10px 0px #e81f3b;
+    border-radius: 12px;
+    font-size: 16px;
+	display:none;
+	z-index:999;
+}
+#shortcuts table{
+	padding: 20px;
+}
+#shortcuts td{
+	padding-top :4px;
+	padding-left: 15px;
+	padding-right: 15px;
+}

=== modified file 'ui/bucket.html'
--- ui/bucket.html	2012-07-23 01:54:11 +0000
+++ ui/bucket.html	2012-07-23 07:59:18 +0000
@@ -45,14 +45,48 @@
     <div class="fgrid_row"><strong class="fgrid_2">.</strong></div>
 
     <div class="fgrid_row">
+<<<<<<< TREE
     <strong class="fgrid_4 version">Novacut 12.08.0</strong>
     <a href="http://novacut.com" class="fgrid_3">novacut.com</a>
+=======
+    <strong class="fgrid_4 version">Novacut 12.07.0</strong>
+<a onclick="showShort(event);" style="cursor: pointer; margin-right:135px;">Keyboard Shortcuts</a>
+>>>>>>> MERGE-SOURCE
     <a href="http://www.kickstarter.com/projects/novacut/novacut-pro-video-editor/backers" class="fgrid_5">Thanks to our Kickstarter backers!</a>
     </div>
 </div>
 </div>
 
-<div id="bucket"></div>
+<div id="bucket">
+<div id="shortcuts" >
+<table border="0">
+  <tr>
+    <td>D</td>
+    <td>Duplicate slice</td>
+  </tr>
+  <tr>
+    <td>Del</td>
+    <td>Delete slice</td>
+  </tr>
+  <tr>
+    <td>Space bar</td>
+    <td>Play/Pause</td>
+  </tr>
+  <tr>
+    <td>Esc</td>
+    <td>Close</td>
+  </tr>
+  <tr>
+    <td>Mouse wheel</td>
+    <td>Move of one frame</td>
+  </tr>
+  <tr>
+    <td>Shift+Mouse Wheel</td>
+    <td>Move of ten frames</td>
+  </tr> 
+</table> 
+</div>
+</div>
 <div id="sequence" clas="lower"></div>
 <div id="roughcut" class="hide">
     <div class="grid_row">

=== modified file 'ui/bucket.js'
--- ui/bucket.js	2012-06-15 10:20:06 +0000
+++ ui/bucket.js	2012-07-23 07:59:18 +0000
@@ -1661,6 +1661,8 @@
         window.addEventListener('keyup', UI.on_keyup);
         UI.bucket = $('bucket');
         UI.orb = new LoveOrb();
+	    document.getElementById('shortcuts').style.marginTop = window.innerHeight/2-200+"px";
+	    document.getElementById('shortcuts').style.marginLeft = window.innerWidth/2-255+"px";
 
         // Create and start the CouchDB session 
         UI.session = new couch.Session(UI.db, UI.on_new_doc);       
@@ -1947,6 +1949,20 @@
     },
 }
 
+function showShort(event){
+    console.log('show');
+    UI.orb.toggle();
+    document.getElementById("shortcuts").style.display = "block";
+    event.stopPropagation();
+    document.body.onclick = $bind(hideShort);
+}
+
+function hideShort(event){
+    console.log('hide');
+    document.getElementById("shortcuts").style.display = "none";
+    event.stopPropagation();
+}
+
 window.addEventListener('load', UI.init);
 
 

=== modified file 'ui/projects.html'
--- ui/projects.html	2012-07-16 16:40:20 +0000
+++ ui/projects.html	2012-07-23 07:59:18 +0000
@@ -172,6 +172,6 @@
 		</li></ul>
             </div>
         </form>
-<ul style="height: 800px;width = 800px;" id="projects" ondragenter="enter(event)" ondragleave="leave(event)" ondrop="d(event)" ondragover="over(event);"></ul>
+<ul style="min-width = 800px;" id="projects" ondragenter="enter(event)" ondragleave="leave(event)" ondrop="d(event)" ondragover="over(event);"></ul>
     </body>
 </html>

=== modified file 'ui/projects.js'
--- ui/projects.js	2012-07-16 13:17:30 +0000
+++ ui/projects.js	2012-07-23 07:59:18 +0000
@@ -45,6 +45,7 @@
         
 	UI.hist = document.getElementById('list');
 	UI.proj = document.getElementById('projects');
+	UI.proj.style.height = window.innerHeight-50+"px";
 
 
 	UI.binDesc ="<p>Here you can find your removed projects<br>Click on <img style=\"width:13px;\" src=\"delete.png\"></img>&nbsp;&nbsp;&nbsp;to remove a project<br>Drag a project out of here to restore it</p>";