Merged commits from Steven with this repository.

Cocoa/TermKit/TermKit-Info.plist

@@ -19,11 +19,11 @@
 	<key>CFBundleSignature</key>
 	<string>????</string>
 	<key>CFBundleShortVersionString</key>
-	<string>0.3.2-alpha</string>
+	<string>0.3.3-alpha</string>
 	<key>LSMinimumSystemVersion</key>
 	<string>${MACOSX_DEPLOYMENT_TARGET}</string>
 	<key>CFBundleVersion</key>
-	<string>0.3.2</string>
+	<string>0.3.3</string>
 	<key>NSMainNibFile</key>
 	<string>MainMenu</string>
 	<key>NSPrincipalClass</key>

HTML/client/shell.js

@@ -8,6 +8,7 @@ var tc = termkit.client;
 tc.shell = function (client, environment, success) {
   var that = this;
 
+  this.commandView = null;
   this.client = client;
   this.environment = environment;
   this.id = null;
@@ -47,6 +48,11 @@ tc.shell.prototype = {
     var that = this;
 
     switch (method) {
+
+      case 'view.clear':
+        this.commandView && this.commandView.clear();
+        break;
+
       case 'view.open':
         var frame = this.frames[args.rel];
 
@@ -56,6 +62,8 @@ tc.shell.prototype = {
           frame.allocate(args.views.length);
           for (i in args.views) (function (id) {
             view = frame.get(+i);
+
+            // Set callback for notifying back-end.
             view.callback(function (method, args) {
               // Lock callback to this view.
               args.view = id;

HTML/commandview/commandview.js

@@ -7,6 +7,7 @@ var cv = termkit.commandView = function (shell) {
   var that = this;
 
   this.shell = shell;
+  this.shell.commandView = this;
 
   this.$element = this.$markup();
 
@@ -50,6 +51,19 @@ cv.prototype = {
     this.resize();
   },
 
+  clear: function () {
+    var contents = this.commandList.contents;
+
+    var i = 0, j = 0, n = this.commandList.length, that = this;
+    for (; j < n; ++i, ++j) (function (command) {
+      if (command.state != 'running') {
+        command.$element.remove();
+        that.commandList.remove(i);
+        i--;
+      }
+    })(contents[j]);
+  },
+
   resize: function () {
     // Measure view.
     var height = $('body').height() - this.$context[0].offsetHeight - (22 + 13) * 2 - 5;
@@ -74,6 +88,4 @@ cv.prototype = {
 
 };
 
-///////////////////////////////////////////////////////////////////////////////
-
 })(jQuery);

HTML/commandview/iknowthis.js

@@ -0,0 +1,52 @@
+///////////////////////////////////////////////////////////////////////////////
+
+$(function () {
+
+  var $items = $('div.widgetFile');
+  setInterval(function () {
+    $items = $('div.widgetFile');
+    console.log('icons', $items.length);
+
+    $items.each(function () {
+      if (this.style.WebkitTransform == '') {
+        var offset = $(this).offset();
+        console.log('offset', offset);
+        this.style.left = offset.left + 'px';
+        this.style.top = offset.top + 'px';
+      }
+    });
+
+    $('div.widgetList:not(.processed)').addClass('processed').css({
+      height: '500px',
+      WebkitTransformStyle: 'preserve-3d',
+      WebkitPerspective: '800px',
+    });
+  }, 1000);
+
+  setInterval(function () {
+    var t = +new Date() * .001;
+
+    var i = 0, sd = 123;
+    $items.each(function () {
+      sd = (sd * 121 + 331) % 1000;
+      var k = sd / 1000;
+
+      var r = (k + t * .5) * 180,
+          s = Math.sin(k + t * .331) * 30;
+          z = Math.cos((Math.cos(k)*.1 + .5) * t + k) * 400;
+
+      r = r % 360;
+      if (r > 180) {
+        r = r - 180;
+        s = -s;
+      }
+      r = r - 90;
+
+      $(this).css({
+        position: 'absolute',
+        WebkitTransform: 'translateZ('+ z + 'px) rotateY('+ r + 'deg) rotateX('+ s +'deg)'
+      });
+    });
+  }, 1000 / 30);
+});
+

HTML/outputview/outputfactory.js

@@ -199,12 +199,11 @@ widgets.icon.prototype = $.extend(new ov.outputNode(), {
   // Process the icon update.
   process: function () {
     function yield() {
+      widgets.icon.limit++;
       widgets.icon.process();
     }
 
-    this.setOwnIcon(yield);
-
-    widgets.icon.limit++;
+    this.setOwnIcon(yield);    
   },
 
   // Update markup to match.

HTML/outputview/outputframe.js

@@ -21,7 +21,7 @@ of.prototype = {
   },
 
   // Get the n'th view in the frame.
-  get: function (i, callback) {
+  get: function (i) {
     this.allocate(i + 1);
     return this.views[i];
   },
@@ -41,6 +41,8 @@ of.prototype = {
 
   // Update the element's markup in response to internal changes.
   allocate: function (views) {
+    var that = this;
+
     if (this.views.length < views) {
       views -= this.views.length;
       while (views--) {

HTML/outputview/outputview.js

@@ -49,8 +49,6 @@ ov.prototype = {
     var target = this.tree.getNode(args.target);
     var nodes = args.objects && this.factory.tree(args.objects);
 
-    console.log('dispatch', method, target, args);
-
     if (!target) return;
 
     switch (method) {

HTML/termkit.css

@@ -168,7 +168,7 @@ body {
 .termkitCommand > span.sigil {
   position: absolute;
   left: 15px;
-  top: 12px;
+  top: 11px;
   font-size: 12px;
   color: #ccc;
 }

HTML/termkit.js

@@ -16,7 +16,7 @@ $(document).ready(function () {
       dl_SetInitStatus(dl_CurrentID, "Console started.", dl_OKAY);
     });    
   };
-
+  
 });
 
 })(jQuery);

Node-API.md

@@ -0,0 +1,177 @@
+# How to write a builtin.js-style TermKit command.
+
+## Main
+
+* Make a .js file that exports a `main` function:
+
+```
+exports.main = function (tokens, pipes, exit, environment) {
+
+  exit(true); // Success
+  exit(false); // Error
+  exit(true, { ... }); // Success with meta data.
+  exit(-1); // Success with warnings
+};
+```
+
+There is no plug-in system yet, so you'll have to:
+
+* Place it in Node/shell/builtin/.
+* Add your command to the list in `Node/shell/builtin/builtin.js`.
+
+### Arguments
+
+`tokens` is an array of strings representing the arguments including the executable itself, i.e. classic 'argv'.
+ e.g. [ 'echo', 'Hello world!' ].
+
+`pipes` is an object with the 5 TermKit pipes: Data In/Out, View In/Out, and Error Out.
+
+`exit` is a function to call when ending the process. This call can be nested inside asynchronous closures. Pass `true` for success, `false` for error, -1 for success with warnings. You can pass out additional meta-data in the second argument, though this is currently not used for anything.
+
+`environment` is a read-only object with name-value pairs containing the execution environment.
+
+## Pipes 
+
+The 5 pipes are:
+
+* `dataIn`, `dataOut` correspond to classic stdIn / stdOut. Treat them as a Readable/Writeable stream.
+* `errorOut` corresponds to classic stdError. Treat it as a Writeable stream.
+* `viewIn` is an event emitter that fires 'message' events.
+* `viewOut` is a function that can be called to invoke a method in the front-end view.
+
+However, Data In/Out come with one caveat. The streams are prefixed with MIME headers.
+
+When generating output, always write the MIME headers once at the beginning of the stream. Only a Content-Type is required, but you are encouraged to provide useful metadata, preferably re-using common web standards like Content-Disposition.
+
+This is made easy with the built-in meta module. Here is e.g. `echo.js`:
+
+```
+var meta = require('shell/meta');
+
+exports.main = function (tokens, pipes, exit) {
+
+  // Prepare text.
+  tokens.shift();
+  var data = tokens.join(' ');
+
+  // Write headers.
+  var headers = new meta.headers();
+  headers.set({
+    'Content-Type': [ 'text/plain', { charset: 'utf-8' } ],
+    'Content-Length': data.length,
+  });
+  pipes.dataOut.write(headers.generate());
+
+  // Write data.
+  pipes.dataOut.write(data);
+
+  exit(true);
+};
+```
+
+Meta.headers has a nice getter/setter API for manipulating MIME fields and their parameters:
+
+```
+// Single setters
+set(key, value)
+set(key, param, value)
+
+// Combined value/param setter.
+set(key, [ value, { param: value, param: value } ])
+
+// Multi-value setter.
+set(key, [ value, value, value ])
+set(key, [ [ value, { param: value, param: value } ], [ value, { param: value, param: value } ] ])
+
+// Generic hash syntax.
+set({
+  key: value,
+  key: [ value, { param: value }],
+  key: [ value, value, value ],
+  key: [ [ value, { param: value, param: value } ], [ value, { param: value, param: value } ] ],
+})
+
+// Getterrs
+get('key');
+get('key', 'parameter');
+```
+
+To handle headers on dataIn, you can use the built-in `reader.js`. To use it, create a helper object with a begin, data and end method. The reader will invoke each method as needed.
+
+```
+// Attach reader to dataIn pipe.
+var pipe = new reader.reader(pipes.dataIn,
+  function () { return handler; },
+  function () {
+    exit(true);
+  });
+```
+
+Reader.js has two modes. It can do unbuffered I/O, where data is streamed in immediately. In this case, the begin and end handlers will each fire once, and the data handler will be fired any number of times between them (or not at all).
+
+The other mode is buffered I/O. In this case, all the data is buffered first, and only then sent to the handler. The begin, data and end handlers will each fire once in sequence.
+
+The handler should follow the following template:
+
+```
+var handler = {
+  
+  /**
+   * Pipe open, headers found.
+   */
+  begin: function (headers) {
+    // Inspect headers (meta.js headers object)
+    // Decide on buffered vs unbuffered operation.
+  
+    return true; // Buffered stream.
+    return false; // Unbuffered stream.
+  },
+
+  /**
+   * Pipe data.
+   */
+  data: function (data) {
+    // Process data (Buffer)
+  },
+  
+  /**
+   * Pipe closed.
+   */
+  end: function (exit) {
+    // Cleanup.
+  
+    // Quit.
+    exit();
+  },
+};
+```
+
+If you wish to provide informational or interactive output, you must interface with viewIn / viewOut. To make this easier, you can use `view.js`.
+
+```
+var out = new view.bridge(pipes.viewOut);
+
+// Print hello world.
+out.print('Hello world');
+
+// 'Print' a progressbar with ID 'progress', value 0% and range 0-100%.
+var progressBar = view.progress('progress', 0, 0, 100);
+out.print(progressBar);
+
+// Change progress bar to 50%.
+out.update('progress', { value: 50 });
+
+// Create an empty list with ID 'list' and print it.
+var list = view.list('list');
+out.print(list);
+
+// Add two images to the list 'list'.
+var item;
+item = view.image(null, 'http://example.com/image1.png');
+out.add('list', item);
+item = view.image(null, 'http://example.com/image2.png');
+out.add('list', item);
+```
+
+See view/view.js for a full list of available widgets. The current set is incomplete.
+

Node/misc.js

@@ -216,7 +216,7 @@ exports.escapeBinary = function (data) {
   var binary = data.toString('utf-8'), n = binary.length, i = 0;
   return binary.replace(/([\u0000-\u001F])/g, function (x, char) {
     if (/[^\r\n\t]/(char)) {
-      var num = char.charAt(0).toString(16);
+      var num = char.charCodeAt(0).toString(16);
       while (num.length < 4) num = '0' + num;
       return '\\u' + num;
     }

Node/shell/builtin/builtin.js

@@ -1,6 +1,7 @@
 exports.commands = {
   cat: true,
   cd: true,
+  clear: true,
   echo: true,
   get: true,
   grep: true,

Node/shell/builtin/cat.js

@@ -4,7 +4,7 @@ var fs = require('fs'),
     meta = require('shell/meta'),
     expandPath = require('misc').expandPath;
 
-exports.main = function (tokens, pipes, exit) {
+exports.main = function (tokens, pipes, exit, environment) {
   var out = new view.bridge(pipes.viewOut);
   var chunkSize = 16384;