sproutcore 1.4.0-java

data/lib/frameworks/sproutcore/apps/greenhouse/english.lproj/app_page.js

@@ -0,0 +1,377 @@
+// ==========================================================================
+// Project:   Greenhouse - appPage
+// Copyright: ©2010 Mike Ball
+// ==========================================================================
+/*globals Greenhouse */
+require('views/list_item');
+require('views/web');
+require('views/tear_off_picker');
+require('mixins/drop_down');
+require('views/simple_button');
+// This page has the main UI layout
+Greenhouse.appPage = SC.Page.design({
+  
+  mainView: SC.View.design({
+    layout: { top: -1, bottom: 0, left: 0, right: 0 },
+    childViews: 'mainContainer toolBar'.w(),
+    defaultResponder: "Greenhouse",
+    
+    mainContainer: SC.ContainerView.design({
+      layout: { left: 0, top: 46, right: 0, bottom: 0 },
+      nowShowingBinding: 'Greenhouse.fileController.editorMode' 
+    }),
+    
+    toolBar: SC.ToolbarView.design({
+      layout: { left: 0, right: 0, top: 0, height: 46 },
+      anchorLocation: SC.ANCHOR_TOP,
+      classNames: ['toolbar'],
+
+      childViews: 'logo project save run title library inspector action '.w(),
+      
+      logo: SC.View.design({
+        layout: {left: 20, width: 131, height: 32, centerY: -1},
+        classNames: ['greenhouse-logo-s']
+      }),
+      
+      project: SC.ButtonView.design({
+        toolTip: "_Project".loc(),
+        classNames: ['dark'],
+        layout: {left: 171, width: 47, height: 24, centerY: -1},
+        titleMinWidth: 37,
+        hasIcon: YES,
+        icon: 'projects',
+        action: 'openProjectPicker'
+      }),
+      
+      save: SC.ButtonView.design({
+        toolTip: "_Save".loc(),
+        classNames: ['dark'],
+        layout: {left: 251, centerY: -1, width: 47, height: 24},
+        titleMinWidth: 37,
+        hasIcon: YES,
+        icon: 'save',
+        action: 'save'
+      }),
+      
+      run: SC.ButtonView.design({
+        toolTip: "_Run".loc(),
+        classNames: ['dark'],
+        layout: {left: 304, centerY: -1, width: 47, height: 24},
+        titleMinWidth: 37,
+        hasIcon: YES,
+        icon: 'run',
+        action: 'run'
+      }),
+      
+      title: SC.LabelView.design({
+        layout: {centerX: 75, centerY: -2, height: 24, width: 300 },
+        classNames: ['title'],
+        textAlign: SC.ALIGN_CENTER,
+        valueBinding: SC.Binding.oneWay('Greenhouse.fileController.name')
+      }),
+      
+      library: SC.ButtonView.design({
+        toolTip: "_Library".loc(),
+        classNames: ['dark'],
+        layout: {right: 153, width: 47, height: 24, centerY: -1},
+        titleMinWidth: 37,
+        hasIcon: YES,
+        icon: 'library',
+        action: 'openLibrary'
+      }),
+      
+      inspector: SC.ButtonView.design({
+        toolTip: "_Inspector".loc(),
+        classNames: ['dark'],
+        layout: {right: 100, width: 47, height: 24, centerY: -1},
+        titleMinWidth: 37,
+        hasIcon: YES,
+        icon: 'inspector',
+        action: 'openInspector'
+      }),
+      
+      action: SC.ButtonView.design(Greenhouse.DropDown, {
+        classNames: ['dark'],
+        layout: {right: 20, centerY: -1, width: 47, height: 24},
+        titleMinWidth: 37,
+        hasIcon: YES,
+        toolTip: "_Actions".loc(),
+        icon: 'actions',
+        dropDown: SC.MenuPane.design({
+          defaultResponder: 'Orion',
+          layout: { width: 140, height: 0 },
+          itemTitleKey: 'title',
+          itemTargetKey: 'target',
+          itemActionKey: 'action',
+          itemSeparatorKey: 'isSeparator',
+          itemIsEnabledKey: 'isEnabled',
+          items:[
+            {title: "_Run".loc(), action: 'run', isEnabled: YES},
+            {title: "_Reload App".loc(), action: 'reloadIframe', isEnabled: YES},
+            {title: "_Dock Library".loc(), action: 'toggleDockedLibrary', isEnabled: YES},
+            {title: "_Dock Inspector".loc(), action: 'toggleDockedInspector', isEnabled: YES},
+            {title: "_Save".loc(), action: 'save', isEnabled: YES }
+          ]
+        })
+      })
+      
+    })
+    
+  }),
+  
+  // Outlets to design views
+  designAreaView: SC.outlet('pageDesigner.designArea'),
+  webView: SC.outlet('pageDesigner.designArea.web'),
+  eventBlocker: SC.outlet('pageDesigner.designArea.eventBlocker'),
+  
+  // Outlets to Docks
+  dockView: SC.outlet('pageDesigner.dock'),
+  libraryDockView: SC.outlet('pageDesigner.dock.libraryArea'),
+  inspectorDockView: SC.outlet('pageDesigner.dock.inspectorArea'),
+  
+  pageDesigner: SC.View.design({
+    layout: { left: 0, top: 0, right: 0, bottom: 0 },
+    childViews: 'designArea dock'.w(),
+    
+    designArea: SC.View.design({
+      layout: {top: 0, left: 0, right: 0, bottom: 0},
+      classNames: ['workspace'],
+      childViews: 'web eventBlocker'.w(),
+
+      web: Greenhouse.WebView.design({
+        valueBinding:'Greenhouse.targetController.appUrl'
+      }),
+
+      eventBlocker: Greenhouse.EventBlocker.design({})
+    }),
+    
+    dock: SC.View.design({
+      layout: {top: 0, bottom: 0, right: 0, width: 0},
+      childViews: 'libraryArea inspectorArea'.w(),
+      classNames: ['anchored'],
+      
+      libraryArea: SC.ContainerView.design({
+        classNames: ['library-docked'],
+        layout: { left: 0, top: 0, right: 0, bottom: 386 },
+        nowShowing: null
+      }),
+
+      inspectorArea: SC.ContainerView.design({
+        classNames: ['inspector-docked'],
+        layout: { right: 0, bottom: 0, left: 0, height: 385 },
+        nowShowing: null
+      })
+    })
+  }),
+  
+  inspectorContentView: SC.View.design({
+    childViews: 'toolbar content'.w(),
+  
+    toolbar: SC.View.design({
+      layout: {top:0, left: 0, right:0, height: 28},
+      isVisible: NO,
+      childViews: 'title remove'.w(),
+      title: SC.LabelView.design({
+        layout: {centerX: 0, top: 2, height: 24, width: 50},
+        title: "_Inspector".loc()
+      }),
+      
+      remove: SC.View.design(Greenhouse.SimpleButton,{
+        classNames: ['close-button'],
+        layout: {right: 1, top: 6, width: 18, height: 17},
+        action: 'closeInspector'
+      })
+    }),
+  
+    content: SC.TabView.design({
+      layout: { left: 6, right: 6, bottom: 6, height: 368 },
+      itemTitleKey: 'title',
+      itemValueKey: 'value',
+      nowShowing: 'Greenhouse.inspectorsPage.layoutInspector',
+      items: [
+        {title: "Layout", value: 'Greenhouse.inspectorsPage.layoutInspector'},
+        {title: "All Properties", value: 'Greenhouse.inspectorsPage.propertiesInspector'}]
+    })
+  }),
+  
+  // inspectorTab: SC.TabView.design({
+  //   layout: {left: 0, right:0, bottom: 0, height:350},
+  //   itemTitleKey: 'title',
+  //   itemValueKey: 'value',
+  //   nowShowing: 'Greenhouse.inspectorsPage.layoutInspector',
+  //   items: [
+  //     {title: "Layout", value: 'Greenhouse.inspectorsPage.layoutInspector'},
+  //     {title: "All Properties", value: 'Greenhouse.inspectorsPage.propertiesInspector'}]
+  // }),
+  
+  inspectorPickerContentView: SC.outlet('inspectorPicker.contentView'), 
+  inspectorPicker: Greenhouse.TearOffPicker.design({
+    classNames: ['gh-picker', 'inspector'],
+    layout: {width: 230, height: 380},
+    defaultResponder: 'Greenhouse',
+    dragAction: 'floatInspector',
+    contentView: SC.ContainerView.design({
+      nowShowing: 'Greenhouse.appPage.inspectorContentView'
+    })
+  }),
+  
+  // ..........................................................
+  // Library Views
+  // 
+  libraryContentView: SC.View.design({
+    childViews: 'controlBar toolbar content'.w(),
+    
+    controlBar: SC.View.design({
+      classNames: ['control-bar'],
+      layout: { left: 10, right: 10, top: 12, height: 24 },
+      childViews: 'search'.w(),
+      
+      search: SC.TextFieldView.design({
+        classNames: ['search'],
+        layout: {top: 0, centerX: 0, width: 180, height: 24 },
+        valueBinding: 'Greenhouse.libraryController.search'
+      })
+    }),
+    
+    toolbar: SC.View.design({
+      layout: {top:0, left: 0, right:0, height: 28},
+      isVisible: NO,
+      childViews: 'remove'.w(),
+      remove: SC.View.design(Greenhouse.SimpleButton,{
+        classNames: ['close-button'],
+        layout: {right: 1, top: 6, width: 18, height: 17},
+        action: 'closeLibrary'
+      })
+    }),
+    
+    content: SC.View.design({
+      classNames: ['content'],
+      layout: { top: 49, bottom: 11, left: 8, right: 8 },
+      childViews: 'library addCustomView'.w(),
+    
+      library: SC.ScrollView.design({
+        classNames: ['library-list'],
+        layout: {top: 0, bottom: 32, left: 0, right: 0 },
+        hasHorizontalScroller: NO,
+        contentView: SC.ListView.design({
+          rowHeight: 36,
+          isEditable: NO,
+          contentValueKey: 'name',
+          contentBinding: 'Greenhouse.libraryController.arrangedObjects',
+          selectionBinding: 'Greenhouse.libraryController.selection',
+          delegate: Greenhouse.libraryController,
+          canReorderContent: YES,
+          dragDidBegin: function(drag, loc) {
+            Greenhouse.sendAction('cancel');
+          }
+        })
+      }),
+    
+      addCustomView: SC.ButtonView.design({
+        classNames: ['dark'],
+        layout: { bottom: 1, right: 0, height: 24, width: 90 },
+        titleMinWidth: 0,
+        hasIcon: NO,
+        title: "_Add Design".loc(),
+        action: 'newCustomView'
+      })
+    })
+  }),
+  
+  libraryPickerContentView: SC.outlet('libraryPicker.contentView'),
+  libraryPicker: Greenhouse.TearOffPicker.design({
+    classNames: ['gh-picker'],
+    layout: {width: 230, height: 400},
+    dragAction: 'floatLibrary',
+    defaultResponder: 'Greenhouse',
+    contentView: SC.ContainerView.design({
+      nowShowing: 'Greenhouse.appPage.libraryContentView'
+    })
+  }),
+  
+  // ..........................................................
+  // Project Views
+  // 
+  projectPicker: SC.PickerPane.design({
+    classNames: ['gh-picker'],
+    layout: {width: 200, height: 500},
+    defaultResponder: 'Greenhouse',
+    computeAnchorRect: function(anchor) {
+      var ret = SC.viewportOffset(anchor); // get x & y
+      var cq = SC.$(anchor);
+      var wsize = SC.RootResponder.responder.computeWindowSize() ;
+      ret.width = cq.outerWidth();
+      ret.height = (wsize.height-ret.y) < cq.outerHeight() ? (wsize.height-ret.y) : cq.outerHeight();
+      ret.y = ret.y -11;
+      return ret ;
+    },
+    modalPaneDidClick: function(evt) {
+      var f = this.get("frame");
+      if(!this.clickInside(f, evt)){ 
+        Greenhouse.sendAction('cancel');
+      }
+      return YES ; 
+    },
+    contentView: SC.View.design({
+      childViews: 'controlBar fileList'.w(),
+      
+      controlBar: SC.View.design({
+        classNames: ['control-bar'],
+        layout: { left: 10, right: 10, top: 12, height: 24 },
+        childViews: 'addPage'.w(),
+        
+        addPage: SC.ButtonView.design({
+          classNames: ['dark'],
+          layout: { width: 90, height: 24, left: 0 },
+          titleMinWidth: 0,
+          hasIcon: NO,
+          title: "_Add Page...".loc(),
+          action: 'newPageFile'
+        })
+      }),
+
+      fileList: SC.ScrollView.design({
+        classNames: ['content'],
+        layout: { top: 49, bottom: 11, left: 8, right: 8 },
+        hasHorizontalScroller: NO,
+        contentView: SC.ListView.design({
+          exampleView: Greenhouse.ListItem,
+          isEditable: NO,
+          canEditContent: YES,
+          actOnSelect: YES,
+          //canReorderContent: YES,
+          deelegate: Greenhouse.filesController,
+          contentValueKey: 'name',
+          contentBinding: 'Greenhouse.filesController.arrangedObjects',
+          selectionBinding: 'Greenhouse.filesController.selection',
+          action: 'selectFile'
+       })
+      })
+
+
+      // fileActions: SC.ButtonView.design(Greenhouse.DropDown, {
+      //   layout: { bottom: 5, left: 10, height: 24, width: 35 },
+      //   titleMinWidth: 0,
+      //   hasIcon: NO,
+      //   title: '+',
+      //   icon: 'file-actions-icon',
+      //   dropDown: SC.MenuPane.design({
+      //     defaultResponder: 'Greenhouse',
+      //     contentView: SC.View.design({}),
+      //     layout: { width: 140, height: 0 },
+      //     itemTitleKey: 'title',
+      //     itemActionKey: 'action',
+      //     itemSeparatorKey: 'isSeparator',
+      //     itemIsEnabledKey: 'isEnabled',
+      //     items: [
+      //       { title: "_New File".loc(), action: 'newFile', isEnabled: YES },
+      //       { title: "_New Page File".loc(), action: 'newPageFile', isEnabled: YES },
+      //       { title: "_New Folder".loc(), action: 'newFolder', isEnabled: YES },
+      //       { title: "_Delete".loc(), action: 'deleteFile', isEnabled: YES }
+      // 
+      //     ]
+      //   })
+      // })
+    })
+  })
+});

data/lib/frameworks/sproutcore/apps/greenhouse/english.lproj/css/app-selector.css

@@ -0,0 +1,111 @@
+/*
+==========================================================================
+ Project: Greenhouse - Application Selector Page
+ Author: Matt Grantham - @MattGrantham
+==========================================================================
+*/
+
+/* Application Picker Page
+---------------------------------------------- */
+
+.sc-logo {
+  background: static_url('images/logos/sproutcore.png');
+}
+
+.greenhouse-logo-l {
+  background: static_url('images/logos/greenhouse-l.png');
+}
+
+.app-picker .helper {
+  background: static_url('images/app-selector/choose-app.png');
+}
+
+/* List of Application */
+
+.app-picker .sc-view.sc-scroll-view.sc-gray-border {
+  border-radius: 4px;
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+  background: #2c2c2c;
+  border: 1px solid #1d1d1d;
+  -moz-box-shadow: 0 1px 0 #494949;
+  -webkit-box-shadow: 0 1px 0 #494949;
+}
+
+.app-picker .sc-collection-view {
+  background: none;
+}
+
+.app-picker .sc-scroll-view .sc-list-item-view {
+  font-size: 16px;
+  color: #fff;
+  text-shadow: 0 1px 0 #000;
+  border-top: 1px solid #3d3d3d;
+  border-bottom: 1px solid #1c1c1c;
+}
+.sc-theme.focus .app-picker .sc-collection-view.focus .sc-collection-item.sel,
+.app-picker .sc-scroll-view .sc-list-item-view.sel {
+  color: #e8ffb0;
+  border-top: 1px solid #727272;
+  background: static_url('images/app-selector/list-item-sel.png') repeat-x;
+  border-bottom: 1px solid #1c1c1c;
+}
+.app-picker .sc-scroll-view .sc-list-item-view.first {
+  border-radius: 4px 4px 0 0;
+  -moz-border-radius: 4px 4px 0 0;
+  -webkit-border-radius: 4px 4px 0 0;
+  border-top: none;
+}
+
+.sc-theme.focus .app-picker .sc-collection-view.focus .sc-collection-item.sel.first, 
+.app-picker .sc-scroll-view .sc-list-item-view.sel.first {
+  border-radius: 4px 4px 0 0;
+  -moz-border-radius: 4px 4px 0 0;
+  -webkit-border-radius: 4px 4px 0 0;
+  border-top: none;
+}
+
+.app-picker .sc-list-item-view img {
+  margin-top: -8px !important;
+}
+
+.app-picker .sc-list-item-view label {
+  left: 26px !important;
+}
+
+/* Load App Button */
+
+/* HACK: Overriding Default Sproutcore button styling...quick and dirty */
+
+.app-picker .sc-button-view.def.capsule {
+  background: static_url('images/buttons/capsule-xl/regular-r.png') no-repeat right !important;
+  height: 28px !important;
+  max-height: 28px !important;
+}
+.app-picker .sc-button-view.def.capsule span {
+  background: static_url('images/buttons/capsule-xl/regular-l.png') no-repeat !important;
+  height: 28px !important;
+  max-height: 28px !important;
+}
+.app-picker .sc-button-view.def.capsule label {
+  background: static_url('images/buttons/capsule-xl/regular-m.png') repeat-x !important;
+  font-size: 14px !important;
+  color: #000 !important;
+  text-shadow: 0 1px 0 #c5c5c5 !important;
+  height: 28px !important;
+  max-height: 28px !important;
+  line-height: 28px;
+}
+
+.app-picker .sc-button-view.def.capsule.active {
+  background: static_url('images/buttons/capsule-xl/active-r.png') no-repeat right !important;
+  color: #313131 !important;
+}
+.app-picker .sc-button-view.def.capsule.active span {
+  background: static_url('images/buttons/capsule-xl/active-l.png') no-repeat !important;
+  color: #313131 !important;
+}
+.app-picker .sc-button-view.def.capsule.active label {
+  background: static_url('images/buttons/capsule-xl/active-m.png') repeat-x !important;
+  color: #313131 !important;
+}