sproutcore 1.4.5 → 1.5.0.pre.3

data/lib/frameworks/sproutcore/apps/greenhouse/states/library.js

@@ -13,121 +13,130 @@
   @since RC1
 */
 Greenhouse.mixin( /** @scope Greenhouse */{
-  libraryClosed: SC.State.create({
-    parallelStatechart: 'library',
-   
-    // ..........................................................
-    // Events
-    //
-    openLibrary: function(){
-      this.goState('openLibraryPicker');
-    },
-   
-    toggleDockedLibrary: function(){
-      this.goState('dockedLibrary');
-    }
-  }),
   
-  openLibraryPicker: SC.State.create({
+  libraryStates: SC.State.design({
+    initialSubstate: 'libraryClosed',
     
-    parallelStatechart: 'library',
-    
-    enterState: function(){
-      var picker = Greenhouse.appPage.get('libraryPicker'),
-          button = Greenhouse.appPage.getPath('mainView.toolBar.library'),
-          pickerContentView = Greenhouse.appPage.get('libraryPickerContentView');
-      
-      pickerContentView.setIfChanged('nowShowing', 'Greenhouse.appPage.libraryContentView');
-      picker.popup(button, SC.PICKER_POINTER);
-      picker.becomeFirstResponder();
-    },
-   
-    exitState: function(){
-      var picker = Greenhouse.appPage.get('libraryPicker'),
-          pickerContentView = Greenhouse.appPage.get('libraryPickerContentView');
-      pickerContentView.setIfChanged('nowShowing', null);
-      picker.remove();
-    },
-   
-    cancel: function(){
-      this.goState('libraryClosed');
-    },
-    
-    floatLibrary: function(){
-      this.goState('libraryPalette');
-    },
-    
-    toggleDockedLibrary: function(){
-      this.goState('dockedLibrary');
-    }
-  }),
- 
-  libraryPalette: SC.State.create({
-    parallelStatechart: 'library',
-
-    enterState: function(){
-      var ap = Greenhouse.appPage;
-      var picker = ap.get('libraryPicker'),
-          pickerContentView = ap.get('libraryPickerContentView');
-          
-      pickerContentView.setIfChanged('nowShowing', 'Greenhouse.appPage.libraryContentView');
-      picker.append();
-      picker.set('isModal', NO);
-      picker.set('isAnchored', NO);
-      picker.$().toggleClass('sc-picker', NO);
-      var content = ap.getPath('libraryContentView.content'),
-          toolbar = ap.getPath('libraryContentView.toolbar');
-     
-      content.adjust('top', 49);    
-      toolbar.set('isVisible', YES); 
-    },
-    exitState: function(){
-      var ap = Greenhouse.appPage;
-      var picker = ap.get('libraryPicker'),
-          pickerContentView = ap.get('libraryPickerContentView');
-      
-      pickerContentView.setIfChanged('nowShowing', null);
-      picker.set('isModal', YES);
-      picker.set('isAnchored', YES);
-      picker.remove();
-     
-      var content = ap.getPath('libraryContentView.content'),
-          toolbar = ap.getPath('libraryContentView.toolbar');
-     
-      content.adjust('top', 49);    
-      toolbar.set('isVisible', NO);
-    },
+    libraryClosed: SC.State.design({
+      parallelStatechart: 'library',
+
+      // ..........................................................
+      // Events
+      //
+      openLibrary: function(){
+        this.gotoState('openLibraryPicker');
+      },
+
+      toggleDockedLibrary: function(){
+        this.gotoState('dockedLibrary');
+      }
+    }),
+
+    openLibraryPicker: SC.State.design({
+
+      parallelStatechart: 'library',
+
+      enterState: function(){
+        var picker = Greenhouse.appPage.get('libraryPicker'),
+            button = Greenhouse.appPage.getPath('mainView.toolBar.library'),
+            pickerContentView = Greenhouse.appPage.get('libraryPickerContentView');
+
+        pickerContentView.setIfChanged('nowShowing', 'Greenhouse.appPage.libraryContentView');
+        picker.popup(button, SC.PICKER_POINTER);
+        picker.becomeFirstResponder();
+      },
+
+      exitState: function(){
+        var picker = Greenhouse.appPage.get('libraryPicker'),
+            pickerContentView = Greenhouse.appPage.get('libraryPickerContentView');
+        pickerContentView.setIfChanged('nowShowing', null);
+        picker.remove();
+      },
+
+      cancel: function(){
+        this.gotoState('libraryClosed');
+      },
+
+      floatLibrary: function(){
+        this.gotoState('libraryPalette');
+      },
+
+      toggleDockedLibrary: function(){
+        this.gotoState('dockedLibrary');
+      }
+    }),
+
+    libraryPalette: SC.State.design({
+      parallelStatechart: 'library',
+
+      enterState: function(){
+        var ap = Greenhouse.appPage;
+        var picker = ap.get('libraryPicker'),
+            pickerContentView = ap.get('libraryPickerContentView');
+
+        pickerContentView.setIfChanged('nowShowing', 'Greenhouse.appPage.libraryContentView');
+        picker.append();
+        picker.set('isModal', NO);
+        picker.set('isAnchored', NO);
+        picker.$().toggleClass('sc-picker', NO);
+        var content = ap.getPath('libraryContentView.content'),
+            toolbar = ap.getPath('libraryContentView.toolbar');
+
+        content.adjust('top', 49);    
+        toolbar.set('isVisible', YES); 
+      },
+      exitState: function(){
+        var ap = Greenhouse.appPage;
+        var picker = ap.get('libraryPicker'),
+            pickerContentView = ap.get('libraryPickerContentView');
+
+        pickerContentView.setIfChanged('nowShowing', null);
+        picker.set('isModal', YES);
+        picker.set('isAnchored', YES);
+        picker.remove();
+
+        var content = ap.getPath('libraryContentView.content'),
+            toolbar = ap.getPath('libraryContentView.toolbar');
+
+        content.adjust('top', 49);    
+        toolbar.set('isVisible', NO);
+      },
+
+      closeLibrary: function(){
+        this.gotoState('libraryClosed');
+      },
+
+      toggleDockedLibrary: function(){
+        this.gotoState('dockedLibrary');
+      }
+    }),
+
+    dockedLibrary: SC.State.design({
+
+      parallelStatechart: 'library',
+
+      enterState: function(){
+        var libDock = Greenhouse.appPage.get('libraryDockView');
+        libDock.setIfChanged('nowShowing', 'Greenhouse.appPage.libraryContentView');
+      },
+      exitState: function(){
+        var libDock = Greenhouse.appPage.get('libraryDockView');
+        libDock.setIfChanged('nowShowing', null);
+      },
+
+      // ..........................................................
+      // Events
+      //
+      toggleDockedLibrary: function(){
+        var states = Greenhouse.get('currentStates') || [];
+        if (states.indexOf(Greenhouse.getState('dockedInspector'))) Greenhouse.sendEvent('undock');
+
+        this.gotoState('libraryClosed');
+      }
+    })
     
-    closeLibrary: function(){
-      this.goState('libraryClosed');
-    },
     
-    toggleDockedLibrary: function(){
-      this.goState('dockedLibrary');
-    }
-  }),
- 
-  dockedLibrary: SC.State.create({
-
-    parallelStatechart: 'library',
-
-    enterState: function(){
-      var libDock = Greenhouse.appPage.get('libraryDockView');
-      libDock.setIfChanged('nowShowing', 'Greenhouse.appPage.libraryContentView');
-    },
-    exitState: function(){
-      var libDock = Greenhouse.appPage.get('libraryDockView');
-      libDock.setIfChanged('nowShowing', null);
-    },
-  
-    // ..........................................................
-    // Events
-    //
-    toggleDockedLibrary: function(){
-      var iState = Greenhouse.get('inspectorClosed').state();
-      if (iState !== Greenhouse.get('dockedInspector')) Greenhouse.sendEvent('undock');
-      
-      this.goState('libraryClosed');
-    }
   })
+  
+  
 });

data/lib/frameworks/sproutcore/apps/greenhouse/states/main.js

@@ -11,214 +11,256 @@
   @since RC1
 */
 Greenhouse.mixin( /** @scope Greenhouse */{
-    
-  loading: SC.State.create({
-    
-    enterState: function(){
-      console.log('greenhouse is loading');
-      var c = Greenhouse.getPath('mainPage.mainPane.container');
-      c.set('nowShowing', Greenhouse.getPath('mainPage.loading'));
-    },
-    exitState: function(){
-      
-    },
-    
-    // ..........................................................
-    // Events
-    //
-    /*
-      called when the file list call completes
-    */
-    fileListCallDidComplete: function(){
-      //eval all the appropriate files
-      this.goState('iframeLoading');
-    },
-
-    /*
-      called when the file choose call completes
-    */
-    fetchTargetsDidComplete: function(){
-      //eval all the appropriate files
-      this.goState('chooseApp');
-    }
-    
-  }),
   
-  chooseApp: SC.State.create({
+  rootState: SC.State.design({    
+    substatesAreConcurrent: YES,
     
-    enterState: function(){
-      var c = Greenhouse.getPath('mainPage.mainPane.container');
-      c.set('nowShowing', Greenhouse.getPath('mainPage.appPicker'));
-    },
-    exitState: function(){
-      
-    },
+    mainStates: SC.State.plugin('Greenhouse.mainStates'),
     
-    // ..........................................................
-    // Events
-    //
-    loadApplication: function(){
-      Greenhouse.filesController.reload();
-      Greenhouse.viewConfigsController.reload();
-      this.goState('loading');
-    }
-  }),
-  
-  iframeLoading: SC.State.create({
+    modalStates: SC.State.plugin('Greenhouse.modalStates'),
     
-    enterState: function(){
-      var c = Greenhouse.getPath('mainPage.mainPane.container');
-      c.set('nowShowing', Greenhouse.getPath('appPage.mainView'));
-      //TODO disable views and display a loading spinner
-    },
-    exitState: function(){
-      
-    },
+    libraryStates: SC.State.plugin('Greenhouse.libraryStates'),
     
-    // ..........................................................
-    // Events
-    //
-    iframeLoaded: function(){
-      this.goState('syncRunLoops');
-    }
+    inspectorStates: SC.State.plugin('Greenhouse.inspectorStates')    
   }),
   
-  syncRunLoops: SC.State.create({
+  mainStates: SC.State.design({
     
-    enterState: function(){
-      this._setupRunLoops();
-      this._grabDropTargets();
-      this._setupGreenhouse();
-      this._setupEventBlocker();
-      this.invokeLater(function(){this.goState('readyWaiting');}); //totally cheating!!
-    },
-    exitState: function(){
-      
-    },
+    initialSubstate: 'loading',
+    
+    loading: SC.State.design({
+
+      enterState: function(){
+        console.log('greenhouse is loading');
+        var c = Greenhouse.getPath('mainPage.mainPane.container');
+        c.set('nowShowing', Greenhouse.getPath('mainPage.loading'));
+      },
+      exitState: function(){
+
+      },
+
+      // ..........................................................
+      // Events
+      //
+      /*
+        called when the file list call completes
+      */
+      fileListCallDidComplete: function(){
+        //eval all the appropriate files
+        this.gotoState('iframeLoading');
+      },
+
+      /*
+        called when the file choose call completes
+      */
+      fetchTargetsDidComplete: function(){
+        //eval all the appropriate files
+        this.gotoState('chooseApp');
+      }
+
+    }),
+
+    chooseApp: SC.State.design({
+
+      enterState: function(){
+        var c = Greenhouse.getPath('mainPage.mainPane.container');
+        c.set('nowShowing', Greenhouse.getPath('mainPage.appPicker'));
+      },
+      exitState: function(){
+
+      },
+
+      // ..........................................................
+      // Events
+      //
+      loadApplication: function(){
+        Greenhouse.filesController.reload();
+        Greenhouse.viewConfigsController.reload();
+        this.gotoState('loading');
+      }
+    }),
     
     // ..........................................................
-    // Monkey-Patch Run Loop
+    // sub states
     // 
-    _setupRunLoops: function(){
-      var iframe = Greenhouse.get('iframe'), innerBegin, outerBegin, innerEnd, outerEnd, outerSC = SC;
-
-
-      outerBegin = outerSC.RunLoop.begin = function() { 
-        //console.log('outer begin');
-        var runLoop = this.currentRunLoop;
-        if (!runLoop) runLoop = this.currentRunLoop = outerSC.RunLoop.runLoopClass.create();
-        runLoop.beginRunLoop();
-
-        //begin the iframe's run loop...
-        var runLoopIframe = iframe.SC.RunLoop.currentRunLoop;
-        if (!runLoopIframe) runLoopIframe = iframe.SC.RunLoop.currentRunLoop = iframe.SC.RunLoop.runLoopClass.create();
-        runLoopIframe.beginRunLoop();
-
-        return this ;
-      };
-      innerBegin = iframe.SC.RunLoop.begin = function() {
-        //console.log('inner begin');
-        outerBegin(); //inner run loop always triggers both loops
-        return this ;
-      };
-
-      outerEnd = outerSC.RunLoop.end = function() {
-        //end any inner run loops if they exist.
-        var innerLoop = iframe.SC.RunLoop.currentRunLoop;
-        if(innerLoop) innerLoop.endRunLoop();
-
-
-        //console.log('outer end');
-        var runLoop = this.currentRunLoop;
-        if (!runLoop) {
-          throw "SC.RunLoop.end() called outside of a runloop!";
-        }
-        runLoop.endRunLoop();
-        return this ;
-      };
-
-      innerEnd = iframe.SC.RunLoop.end = function() {
-        //console.log('inner end');
-        var runLoop = this.currentRunLoop;
-        if (!runLoop) {
-          throw "SC.RunLoop.end() called outside of a runloop!";
-        }
-        runLoop.endRunLoop();
-        outerEnd();
-        return this ;
-      };
-    },
+    ready: SC.State.plugin('Greenhouse.readyStates'),
 
-    _grabDropTargets: function(){
-      var iframe = Greenhouse.get('iframe'), 
-          innerTargets,
-          webViewFrame,
-          webView = Greenhouse.appPage.get('webView');
 
-      var pv = webView.get('parentView');
-        webViewFrame = webView.get('frame');
-      webViewFrame = pv.convertFrameToView(webViewFrame, null);
+    iframeLoading: SC.State.design({
 
+      enterState: function(){
+        var c = Greenhouse.getPath('mainPage.mainPane.container');
+        c.set('nowShowing', Greenhouse.getPath('appPage.mainView'));
+        //TODO disable views and display a loading spinner
+      },
+      exitState: function(){
 
-      //add existing targets
-      innerTargets = iframe.SC.Drag._dropTargets;
+      },
 
-      for(var dt in innerTargets){
-        if(innerTargets.hasOwnProperty(dt)){
-          SC.Drag.addDropTarget(innerTargets[dt]);
-        }
+      // ..........................................................
+      // Events
+      //
+      iframeLoaded: function(){
+        this.gotoState('syncRunLoops');
       }
+    }),
 
-      //make sure we get any new ones
-      iframe.SC.Drag.addDropTarget = function(target) {
-        iframe.SC.Drag._dropTargets[iframe.SC.guidFor(target)] = target ;
-        SC.Drag._dropTargets[iframe.SC.guidFor(target)] = target ;
-      };
-
-
-      iframe.SC.Drag.removeDropTarget = function(target) {
-        delete iframe.SC.Drag._dropTargets[iframe.SC.guidFor(target)] ;
-        delete SC.Drag._dropTargets[iframe.SC.guidFor(target)];
-      };
-
-
-      SC.Drag.prototype._findDropTarget = function(evt) {
-        var loc = { x: evt.pageX, y: evt.pageY } ;
-
-        var target, frame ;
-        var ary = this._dropTargets() ;
-        for (var idx=0, len=ary.length; idx<len; idx++) {
-          target = ary[idx] ;
-
-          // If the target is not visible, it is not valid.
-          if (!target.get('isVisibleInWindow')) continue ;
-
-          // get clippingFrame, converted to the pane.
-          frame = target.convertFrameToView(target.get('clippingFrame'), null) ;
-
-          //if this is in the iframe adjust the frame accordingly
-          if(target.get('targetIsInIFrame')){
-             frame.x = frame.x + webViewFrame.x;
-             frame.y = frame.y + webViewFrame.y;
-           }
-          // check to see if loc is inside.  If so, then make this the drop target
-          // unless there is a drop target and the current one is not deeper.
-          if (SC.pointInRect(loc, frame)) return target;
-        } 
-        return null ;
-      };
-      //all inner drags are actually outer drags
-      iframe.SC.Drag.start = SC.Drag.start;
-    },
-
-    _setupGreenhouse: function(){
-      var iframe = Greenhouse.get('iframe');
-      iframe.SC._Greenhouse = Greenhouse;
-    },
-    
-    _setupEventBlocker: function(){
-      var eventBlocker = Greenhouse.appPage.get('eventBlocker');
-      Greenhouse.set('eventBlocker', eventBlocker);
-    }
+    syncRunLoops: SC.State.design({
+
+      enterState: function(){
+        this._setupRunLoops();
+        this._grabDropTargets();
+        this._setupGreenhouse();
+        this._setupEventBlocker();
+        this.gotoState('readyWaiting');
+        //this.invokeLater(function(){this.gotoState('readyWaiting');}); //totally cheating!!
+      },
+      exitState: function(){
+
+      },
+
+      // ..........................................................
+      // Monkey-Patch Run Loop
+      // 
+      _setupRunLoops: function(){
+        var iframe = Greenhouse.get('iframe'), innerBegin, outerBegin, innerEnd, outerEnd, outerSC = SC;
+
+        // ..........................................................
+        // run loop patches...
+        // 
+        outerBegin = function() {    
+          var runLoop = outerSC.RunLoop.currentRunLoop;
+          if (!runLoop) runLoop = outerSC.RunLoop.currentRunLoop = outerSC.RunLoop.runLoopClass.create();
+          runLoop.beginRunLoop();
+          return outerSC.RunLoop ;
+        };
+        outerEnd = function() {
+          var runLoop = outerSC.RunLoop.currentRunLoop;
+          if (!runLoop) {
+            throw "SC.RunLoop.end() called outside of a runloop!";
+          }
+          runLoop.endRunLoop();
+          return outerSC.RunLoop ;
+        };
+
+        innerBegin = function() {    
+          var runLoop = iframe.SC.RunLoop.currentRunLoop;
+          if (!runLoop) runLoop = iframe.SC.RunLoop.currentRunLoop = iframe.SC.RunLoop.runLoopClass.create();
+          runLoop.beginRunLoop();
+          return iframe.SC.RunLoop ;
+        };
+
+        innerEnd = function() {
+          var runLoop = iframe.SC.RunLoop.currentRunLoop;
+          if (!runLoop) {
+            throw "SC.RunLoop.end() called outside of a runloop!";
+          }
+          runLoop.endRunLoop();
+          return iframe.SC.RunLoop ;
+        };
+
+        //outer begin
+        outerSC.RunLoop.begin = function() { 
+          //console.log('outer begin');
+          var outer = outerBegin();
+          innerBegin();
+          return outer;
+        };
+
+        //inner begin
+        iframe.SC.RunLoop.begin = function() {
+          //console.log('inner begin');
+          var inner = innerBegin();
+          outerBegin();
+          return inner;
+        };
+
+        //inner end
+        iframe.SC.RunLoop.end = function() {
+          //console.log('inner end');
+          outerEnd();
+          return innerEnd();
+        };
+
+        //Outer End
+        outerSC.RunLoop.end = function() {
+          //console.log('outer end');
+          innerEnd();
+          return outerEnd();
+        };
+       },
+
+      _grabDropTargets: function(){
+        var iframe = Greenhouse.get('iframe'), 
+            innerTargets,
+            webViewFrame,
+            webView = Greenhouse.appPage.get('webView');
+
+        var pv = webView.get('parentView');
+          webViewFrame = webView.get('frame');
+        webViewFrame = pv.convertFrameToView(webViewFrame, null);
+
+
+        //add existing targets
+        innerTargets = iframe.SC.Drag._dropTargets;
+
+        for(var dt in innerTargets){
+          if(innerTargets.hasOwnProperty(dt)){
+            SC.Drag.addDropTarget(innerTargets[dt]);
+          }
+        }
+
+        //make sure we get any new ones
+        iframe.SC.Drag.addDropTarget = function(target) {
+          iframe.SC.Drag._dropTargets[iframe.SC.guidFor(target)] = target ;
+          SC.Drag._dropTargets[iframe.SC.guidFor(target)] = target ;
+        };
+
+
+        iframe.SC.Drag.removeDropTarget = function(target) {
+          delete iframe.SC.Drag._dropTargets[iframe.SC.guidFor(target)] ;
+          delete SC.Drag._dropTargets[iframe.SC.guidFor(target)];
+        };
+
+
+        SC.Drag.prototype._findDropTarget = function(evt) {
+          var loc = { x: evt.pageX, y: evt.pageY } ;
+
+          var target, frame ;
+          var ary = this._dropTargets() ;
+          for (var idx=0, len=ary.length; idx<len; idx++) {
+            target = ary[idx] ;
+
+            // If the target is not visible, it is not valid.
+            if (!target.get('isVisibleInWindow')) continue ;
+
+            // get clippingFrame, converted to the pane.
+            frame = target.convertFrameToView(target.get('clippingFrame'), null) ;
+
+            //if this is in the iframe adjust the frame accordingly
+            if(target.get('targetIsInIFrame')){
+               frame.x = frame.x + webViewFrame.x;
+               frame.y = frame.y + webViewFrame.y;
+             }
+            // check to see if loc is inside.  If so, then make this the drop target
+            // unless there is a drop target and the current one is not deeper.
+            if (SC.pointInRect(loc, frame)) return target;
+          } 
+          return null ;
+        };
+        //all inner drags are actually outer drags
+        iframe.SC.Drag.start = SC.Drag.start;
+      },
+
+      _setupGreenhouse: function(){
+        var iframe = Greenhouse.get('iframe');
+        iframe.SC._Greenhouse = Greenhouse;
+      },
+
+      _setupEventBlocker: function(){
+        var eventBlocker = Greenhouse.appPage.get('eventBlocker');
+        Greenhouse.set('eventBlocker', eventBlocker);
+      }
+    })
   })
 });