From 4161954c173f55ccbd939304fc7179f19d43c4cb Mon Sep 17 00:00:00 2001
From: Galen Wolfe-Pauly <root@office-for.com>
Date: Thu, 27 Aug 2015 16:16:55 -0700
Subject: [PATCH 1/2] mobile login, lite mobile work, mark done in store

---
 arvo/eyre.hoon                                |  3 +
 lib/base.css                                  | 14 +++
 pub/work/src/css/main.css                     | 90 ++++++++++++++++++-
 pub/work/src/css/main.styl                    | 15 +++-
 pub/work/src/css/mobile.styl                  | 74 ++++++++++++++-
 pub/work/src/js/actions/WorkActions.coffee    |  3 +-
 .../src/js/components/FilterComponent.coffee  |  4 +-
 .../src/js/components/ItemComponent.coffee    | 12 +--
 pub/work/src/js/main.js                       | 34 ++++---
 pub/work/src/js/stores/WorkStore.coffee       |  4 +-
 10 files changed, 222 insertions(+), 31 deletions(-)

diff --git a/arvo/eyre.hoon b/arvo/eyre.hoon
index 22d4fa5c11..42a268adf3 100644
--- a/arvo/eyre.hoon
+++ b/arvo/eyre.hoon
@@ -510,6 +510,9 @@
     ;html
       ;head
         ;meta(charset "utf-8");
+        ;meta(name "viewport", content "width=device-width, ".
+        "height=device-height, initial-scale=1.0, user-scalable=0, ".
+        "minimum-scale=1.0, maximum-scale=1.0");
         ;title:"{(trip a)}" 
         ;script(type "text/javascript", src "//cdnjs.cloudflare.com/ajax/".
           "libs/jquery/2.1.1/jquery.min.js");
diff --git a/lib/base.css b/lib/base.css
index 10a49bc171..bf2f4752e2 100644
--- a/lib/base.css
+++ b/lib/base.css
@@ -166,3 +166,17 @@ input {
   outline: none;
   border-bottom: 3px solid #555;
 }
+
+@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
+  #c {
+    width: 16rem;
+    margin-left: -8rem;
+  }
+  #pass {
+    width: 16rem;
+  }
+  input {
+    -webkit-appearance: none;
+    border-radius: 0;
+  }
+}
diff --git a/pub/work/src/css/main.css b/pub/work/src/css/main.css
index 73de3f1ec6..cd0b0b3b02 100644
--- a/pub/work/src/css/main.css
+++ b/pub/work/src/css/main.css
@@ -167,9 +167,12 @@ h1.leader:after {
 }
 .input-bool,
 .item .done {
-  width: 0.7rem;
-  height: 0.7rem;
+  width: 1rem;
+  height: 1rem;
   border: 0.2rem solid #ccc;
+  padding: 0;
+  outline: none;
+  background-color: #fff;
 }
 .input-bool.true,
 .item .done-true {
@@ -205,9 +208,11 @@ h1.leader:after {
   cursor: pointer;
   transform-origin: 6px 12px;
   transition: transform 200ms linear;
+  -webkit-transform-origin: 6px 12px;
 }
 .item.expand .expand {
   transform: rotate(90deg);
+  -webkit-transform: rotate(90deg);
   transition: transform 200ms linear;
 }
 .item .header {
@@ -314,11 +319,12 @@ h1.leader:after {
 }
 .item .submit {
   font-size: 0.7rem;
-  text-transform: uppercase;
+  font-weight: 500;
   display: inline-block;
   background-color: #b9b9b9;
   letter-spacing: 0.07rem;
   color: #fff;
+  border: 0;
   padding: 0 0.3rem;
   margin-top: 0.5rem;
 }
@@ -358,7 +364,10 @@ h1.leader:after {
   border: 0;
   font: inherit;
   resize: none;
+  -webkit-user-select: text;
+  user-select: text;
 }
+textarea:focus,
 .input:focus {
   background-color: #e6e6e6;
 }
@@ -397,3 +406,78 @@ h1.leader:after {
   width: 3rem;
   background-color: #ccc;
 }
+@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
+  #c {
+    width: 100%;
+    margin: 0;
+    left: 0.6rem;
+  }
+  h1 {
+    font-size: 1rem;
+  }
+  input,
+  textarea {
+    -webkit-appearance: none;
+    border-radius: 0;
+  }
+  .input {
+    padding: 0 0.3rem 0 0.1rem;
+  }
+  .ctrl {
+    margin-top: 1rem;
+  }
+  .ctrl .sorts,
+  .ctrl .filters {
+    margin-left: 0;
+  }
+  .ctrl .filters .done label {
+    display: none;
+  }
+  .ctrl .sort {
+    padding: 0.2rem 0.3rem;
+  }
+  .ctrl .filter {
+    line-height: 1.3rem;
+  }
+  .ctrl .sort label,
+  .ctrl .filter label {
+    font-size: 0.7rem;
+    letter-spacing: 0.05rem;
+    line-height: 1.3rem;
+  }
+  .items {
+    margin-left: 0;
+  }
+  .item {
+    width: auto;
+  }
+  .item .sort {
+    display: none;
+  }
+  .item .title,
+  .item .date,
+  .item .tags {
+    min-width: 4rem;
+    max-width: 4rem;
+    margin-left: 0.3rem;
+  }
+  .item .expand {
+    float: right;
+    margin-right: 0.6rem;
+  }
+  .item .description,
+  .item .discussion {
+    margin: 0.5rem 0;
+  }
+  .item .description textarea {
+    min-width: 18rem;
+    margin: 0;
+  }
+  .item .comment.new {
+    max-width: 18rem;
+  }
+  .item .submit {
+    line-height: 1.6rem;
+    letter-spacing: 0;
+  }
+}
diff --git a/pub/work/src/css/main.styl b/pub/work/src/css/main.styl
index 2539bf5692..966d723a24 100644
--- a/pub/work/src/css/main.styl
+++ b/pub/work/src/css/main.styl
@@ -91,9 +91,12 @@ h1.leader:after
 
 .input-bool
 .item .done
-  width .7rem
-  height .7rem
+  width 1rem
+  height 1rem
   border .2rem solid #ccc
+  padding 0
+  outline none
+  background-color #fff
 
 .input-bool.true
 .item .done-true
@@ -129,9 +132,11 @@ h1.leader:after
     cursor pointer
     transform-origin 6px 12px
     transition transform 200ms linear
+    -webkit-transform-origin 6px 12px
 
   &.expand .expand
     transform rotate(90deg)
+    -webkit-transform rotate(90deg)
     transition transform 200ms linear
   
   .header
@@ -237,11 +242,12 @@ h1.leader:after
     
   .submit
     font-size .7rem
-    text-transform uppercase
+    font-weight 500
     display inline-block
     background-color #b9b9b9
     letter-spacing .07rem
     color #fff
+    border 0
     padding 0 .3rem
     margin-top .5rem
 
@@ -282,7 +288,10 @@ h1.leader:after
   border 0
   font inherit
   resize none
+  -webkit-user-select text
+  user-select text
   
+textarea:focus
 .input:focus
   background-color #e6e6e6
 
diff --git a/pub/work/src/css/mobile.styl b/pub/work/src/css/mobile.styl
index b34151fedb..c8d34d9b28 100644
--- a/pub/work/src/css/mobile.styl
+++ b/pub/work/src/css/mobile.styl
@@ -10,4 +10,76 @@
 // @media only screen and (min-width: 320px) and (max-width: 1024px)
 
 /* phones portrait and landscape ----------- */
-// @media only screen and (min-device-width: 320px) and (max-device-width: 480px)
+@media only screen and (min-device-width: 320px) and (max-device-width: 480px)
+  #c
+    width 100%
+    margin 0
+    left .6rem
+  
+  h1
+    font-size 1rem
+    
+  input
+  textarea
+    -webkit-appearance none
+    border-radius 0
+  
+  .input
+    padding 0 .3rem 0 .1rem
+  
+  .ctrl
+    margin-top 1rem
+  
+  .ctrl .sorts
+  .ctrl .filters
+    margin-left 0
+  
+  .ctrl .filters .done label
+    display none
+  
+  .ctrl .sort
+    padding .2rem .3rem
+  
+  .ctrl .filter
+    line-height 1.3rem
+
+  .ctrl .sort label
+  .ctrl .filter label
+    font-size .7rem
+    letter-spacing .05rem
+    line-height 1.3rem
+  
+  .items
+    margin-left 0
+    
+  .item
+    width auto
+  
+  .item .sort
+    display none
+  
+  .item .title
+  .item .date
+  .item .tags
+    min-width 4rem
+    max-width 4rem
+    margin-left .3rem
+  
+  .item .expand
+    float right
+    margin-right .6rem
+  
+  .item .description
+  .item .discussion
+    margin .5rem 0
+  
+  .item .description textarea
+    min-width 18rem
+    margin 0
+  
+  .item .comment.new
+    max-width 18rem
+  
+  .item .submit
+    line-height 1.6rem 
+    letter-spacing 0
\ No newline at end of file
diff --git a/pub/work/src/js/actions/WorkActions.coffee b/pub/work/src/js/actions/WorkActions.coffee
index f963f56dd6..73f73fe59f 100644
--- a/pub/work/src/js/actions/WorkActions.coffee
+++ b/pub/work/src/js/actions/WorkActions.coffee
@@ -30,8 +30,7 @@ module.exports =
     key = key.split('_').join '-'
     set = "#{key}": val
     Persistence.put old:{id,version,dif:{set}}
-    Dispatcher.handleViewAction {type:'updateItem',id,version}
-
+    Dispatcher.handleViewAction {type:'updateItem',id,version,key,val}
 
   ownItem: ({id,version},own) ->
     o = {}
diff --git a/pub/work/src/js/components/FilterComponent.coffee b/pub/work/src/js/components/FilterComponent.coffee
index 732b68c8a2..741ecf995b 100644
--- a/pub/work/src/js/components/FilterComponent.coffee
+++ b/pub/work/src/js/components/FilterComponent.coffee
@@ -1,6 +1,6 @@
 recl = React.createClass
 rece = React.createElement
-{div,h1,label} = React.DOM
+{div,h1,label,button} = React.DOM
 
 module.exports = recl
   onClick: (e) ->
@@ -41,7 +41,7 @@ module.exports = recl
         (label {}, title)
         switch filter
           when 'done'
-            (div {
+            (button {
                   className:'input-bool ib '+@props.filters[key],
                   @onClick
                 },"")
diff --git a/pub/work/src/js/components/ItemComponent.coffee b/pub/work/src/js/components/ItemComponent.coffee
index 0deb340b1c..b93e901d6d 100644
--- a/pub/work/src/js/components/ItemComponent.coffee
+++ b/pub/work/src/js/components/ItemComponent.coffee
@@ -1,6 +1,6 @@
 recl = React.createClass
 rece = React.createElement
-{div,textarea} = React.DOM
+{div,textarea,button} = React.DOM
 
 WorkActions   = require '../actions/WorkActions.coffee'
 Field         = require './FieldComponent.coffee'
@@ -37,10 +37,12 @@ module.exports = recl
       e.preventDefault()
       return
 
-  onFocus: (e) -> @props._focus e,@
+  onFocus: (e) -> 
+    @props._focus e,@
+    return true
 
   _markDone: (e) -> 
-    WorkActions.setItem @props.item,'done',(not @props.item.done?)
+    WorkActions.setItem @props.item,'done',(not (@props.item.done is true))
 
   _changeStatus: (e) ->
     return if @props.item.status is 'released'
@@ -118,7 +120,7 @@ module.exports = recl
             (@renderField 'audience', {}, @formatAudience)
           )
         (div {className:'sort ib top'}, @props.item.sort)
-        (div {className:'done ib done-'+@props.item.done?, onClick:@_markDone}, '')
+        (button {className:'done ib done-'+(@props.item.done is true), onClick:@_markDone}, '')
         (@renderTopField 'title', {@onFocus,@onKeyDown})
         (@renderTopField 'date_due', {className:'date'}, @formatDate)
         (@renderTopField 'tags', {}, (tags=[])-> tags.join(" "))
@@ -147,7 +149,7 @@ module.exports = recl
                 (div {
                   contentEditable:true,
                   className:'input'})
-                (div {className:'submit',onClick:@_submitComment},'Post')
+                (button {className:'submit',onClick:@_submitComment},'Post')
             )
           )
     )
diff --git a/pub/work/src/js/main.js b/pub/work/src/js/main.js
index b5577f6d71..6e266db3c8 100644
--- a/pub/work/src/js/main.js
+++ b/pub/work/src/js/main.js
@@ -63,7 +63,9 @@ module.exports = {
     return Dispatcher.handleViewAction({
       type: 'updateItem',
       id: id,
-      version: version
+      version: version,
+      key: key,
+      val: val
     });
   },
   ownItem: function(arg, own) {
@@ -329,13 +331,13 @@ module.exports = recl({
 
 
 },{"../actions/WorkActions.coffee":1}],3:[function(require,module,exports){
-var div, h1, label, rece, recl, ref;
+var button, div, h1, label, rece, recl, ref;
 
 recl = React.createClass;
 
 rece = React.createElement;
 
-ref = React.DOM, div = ref.div, h1 = ref.h1, label = ref.label;
+ref = React.DOM, div = ref.div, h1 = ref.h1, label = ref.label, button = ref.button;
 
 module.exports = recl({
   onClick: function(e) {
@@ -420,7 +422,7 @@ module.exports = recl({
         }, label({}, title), (function() {
           switch (filter) {
             case 'done':
-              return div({
+              return button({
                 className: 'input-bool ib ' + this.props.filters[key],
                 onClick: this.onClick
               }, "");
@@ -440,13 +442,13 @@ module.exports = recl({
 
 
 },{}],4:[function(require,module,exports){
-var Field, WorkActions, div, rece, recl, ref, textarea;
+var Field, WorkActions, button, div, rece, recl, ref, textarea;
 
 recl = React.createClass;
 
 rece = React.createElement;
 
-ref = React.DOM, div = ref.div, textarea = ref.textarea;
+ref = React.DOM, div = ref.div, textarea = ref.textarea, button = ref.button;
 
 WorkActions = require('../actions/WorkActions.coffee');
 
@@ -491,10 +493,11 @@ module.exports = recl({
     }
   },
   onFocus: function(e) {
-    return this.props._focus(e, this);
+    this.props._focus(e, this);
+    return true;
   },
   _markDone: function(e) {
-    return WorkActions.setItem(this.props.item, 'done', this.props.item.done == null);
+    return WorkActions.setItem(this.props.item, 'done', !(this.props.item.done === true));
   },
   _changeStatus: function(e) {
     var own;
@@ -611,8 +614,8 @@ module.exports = recl({
       className: 'action a'
     }, action)), this.renderField('audience', {}, this.formatAudience)), div({
       className: 'sort ib top'
-    }, this.props.item.sort), div({
-      className: 'done ib done-' + (this.props.item.done != null),
+    }, this.props.item.sort), button({
+      className: 'done ib done-' + (this.props.item.done === true),
       onClick: this._markDone
     }, ''), this.renderTopField('title', {
       onFocus: this.onFocus,
@@ -669,7 +672,7 @@ module.exports = recl({
     }, this.formatDate(new Date)), div({
       contentEditable: true,
       className: 'input'
-    }), div({
+    }), button({
       className: 'submit',
       onClick: this._submitComment
     }, 'Post'))) : void 0);
@@ -1657,9 +1660,12 @@ WorkStore = assign({}, EventEmitter.prototype, {
     return _tasks[id].archived = true;
   },
   updateItem: function(arg) {
-    var id, version;
-    id = arg.id, version = arg.version;
-    return _tasks[id].version = version;
+    var id, key, val, version;
+    id = arg.id, version = arg.version, key = arg.key, val = arg.val;
+    _tasks[id].version = version;
+    if (key === 'done') {
+      return _tasks[id].done = val;
+    }
   }
 });
 
diff --git a/pub/work/src/js/stores/WorkStore.coffee b/pub/work/src/js/stores/WorkStore.coffee
index 08070c947f..c67551f2ce 100644
--- a/pub/work/src/js/stores/WorkStore.coffee
+++ b/pub/work/src/js/stores/WorkStore.coffee
@@ -114,7 +114,9 @@ WorkStore = assign {},EventEmitter.prototype,{
     _list = list
   setAudience: ({id,to})-> _tasks[id].audience = to
   archiveItem: ({id})-> _tasks[id].archived = true
-  updateItem: ({id,version})-> _tasks[id].version = version
+  updateItem: ({id,version,key,val})-> 
+    _tasks[id].version = version
+    _tasks[id].done = val if key is 'done'
 
 }
 

From 8d5d1befdc4fd03541a080f16750f480ebea2c35 Mon Sep 17 00:00:00 2001
From: Galen Wolfe-Pauly <root@office-for.com>
Date: Thu, 27 Aug 2015 16:18:58 -0700
Subject: [PATCH 2/2] owner -> creator

---
 .../src/js/components/ItemComponent.coffee    |  8 +++----
 pub/work/src/js/main.js                       | 21 ++++---------------
 2 files changed, 8 insertions(+), 21 deletions(-)

diff --git a/pub/work/src/js/components/ItemComponent.coffee b/pub/work/src/js/components/ItemComponent.coffee
index d3d01a5e01..95bfa80168 100644
--- a/pub/work/src/js/components/ItemComponent.coffee
+++ b/pub/work/src/js/components/ItemComponent.coffee
@@ -54,7 +54,7 @@ module.exports = recl
   _changeStatus: (e) ->
     return if @props.item.status is 'released'
     if @props.item.status is 'accepted' and 
-    @formatOwner(@props.item.creator) isnt window.urb.ship
+    @formatCreator(@props.item.creator) isnt window.urb.ship
       return
     WorkActions.ownItem @props.item,@getAction()
 
@@ -73,9 +73,9 @@ module.exports = recl
       _d += "..#{d.getHours()}.#{d.getMinutes()}.#{d.getSeconds()}"
     _d
 
-  formatOwner: (o="") -> o.replace /\~/g,""
+  formatCreator: (o="") -> o.replace /\~/g,""
 
-  formatAudience: (a=[]) -> @formatOwner a.join(" ")
+  formatAudience: (a=[]) -> @formatCreator a.join(" ")
 
   getInitialState: -> {expand:false}
 
@@ -110,7 +110,7 @@ module.exports = recl
         (div {
           className:'header'
           },
-            (div {className:'creator ib'}, @formatOwner(@props.item.owner))
+            (div {className:'creator ib'}, @formatCreator(@props.item.creator))
             (div {
               className:'status ib action-'+(action.length > 0)
               'data-key':'status'
diff --git a/pub/work/src/js/main.js b/pub/work/src/js/main.js
index cad3ab2d75..5345cdcd94 100644
--- a/pub/work/src/js/main.js
+++ b/pub/work/src/js/main.js
@@ -171,7 +171,6 @@ module.exports = {
 };
 
 
-
 },{"../dispatcher/Dispatcher.coffee":9,"../persistence/Persistence.coffee":15,"../util.coffee":17}],2:[function(require,module,exports){
 var WorkActions, div, rece, recl, ref, textarea,
   slice = [].slice;
@@ -336,7 +335,6 @@ module.exports = recl({
 });
 
 
-
 },{"../actions/WorkActions.coffee":1}],3:[function(require,module,exports){
 var button, div, h1, label, rece, recl, ref;
 
@@ -448,7 +446,6 @@ module.exports = recl({
 });
 
 
-
 },{}],4:[function(require,module,exports){
 var Field, WorkActions, button, div, rece, recl, ref, textarea;
 
@@ -522,7 +519,7 @@ module.exports = recl({
     if (this.props.item.status === 'released') {
       return;
     }
-    if (this.props.item.status === 'accepted' && this.formatOwner(this.props.item.creator) !== window.urb.ship) {
+    if (this.props.item.status === 'accepted' && this.formatCreator(this.props.item.creator) !== window.urb.ship) {
       return;
     }
     return WorkActions.ownItem(this.props.item, this.getAction());
@@ -548,7 +545,7 @@ module.exports = recl({
     }
     return _d;
   },
-  formatOwner: function(o) {
+  formatCreator: function(o) {
     if (o == null) {
       o = "";
     }
@@ -558,7 +555,7 @@ module.exports = recl({
     if (a == null) {
       a = [];
     }
-    return this.formatOwner(a.join(" "));
+    return this.formatCreator(a.join(" "));
   },
   getInitialState: function() {
     return {
@@ -612,7 +609,7 @@ module.exports = recl({
       className: 'header'
     }, div({
       className: 'creator ib'
-    }, this.formatOwner(this.props.item.owner)), div({
+    }, this.formatCreator(this.props.item.creator)), div({
       className: 'status ib action-' + (action.length > 0),
       'data-key': 'status',
       onClick: this._changeStatus
@@ -688,7 +685,6 @@ module.exports = recl({
 });
 
 
-
 },{"../actions/WorkActions.coffee":1,"./FieldComponent.coffee":2}],5:[function(require,module,exports){
 var FilterComponent, ItemComponent, ListeningComponent, SortComponent, WorkActions, WorkStore, div, h1, input, rece, recl, ref, textarea;
 
@@ -933,7 +929,6 @@ module.exports = recl({
 });
 
 
-
 },{"../actions/WorkActions.coffee":1,"../stores/WorkStore.coffee":16,"./FilterComponent.coffee":3,"./ItemComponent.coffee":4,"./ListeningComponent.coffee":6,"./SortComponent.coffee":7}],6:[function(require,module,exports){
 var div, h1, input, rece, recl, ref, textarea;
 
@@ -952,7 +947,6 @@ module.exports = recl({
 });
 
 
-
 },{}],7:[function(require,module,exports){
 var button, div, h1, label, rece, recl, ref;
 
@@ -997,7 +991,6 @@ module.exports = recl({
 });
 
 
-
 },{}],8:[function(require,module,exports){
 var ListComponent, div, h1, rece, recl, ref;
 
@@ -1020,7 +1013,6 @@ module.exports = recl({
 });
 
 
-
 },{"./ListComponent.coffee":5}],9:[function(require,module,exports){
 var Dispatcher;
 
@@ -1042,7 +1034,6 @@ module.exports = _.merge(new Dispatcher(), {
 });
 
 
-
 },{"flux":11}],10:[function(require,module,exports){
 var WorkComponent;
 
@@ -1055,7 +1046,6 @@ $(function() {
 });
 
 
-
 },{"./components/WorkComponent.coffee":8,"./util.coffee":17}],11:[function(require,module,exports){
 /**
  * Copyright (c) 2014-2015, Facebook, Inc.
@@ -1453,7 +1443,6 @@ module.exports = {
 };
 
 
-
 },{}],16:[function(require,module,exports){
 var Dispatcher, EventEmitter, WorkStore, _filters, _ghost, _list, _listening, _sorts, _tasks, _updated, assign, uuid32;
 
@@ -1707,7 +1696,6 @@ WorkStore.dispatchToken = Dispatcher.register(function(p) {
 module.exports = WorkStore;
 
 
-
 },{"../dispatcher/Dispatcher.coffee":9,"../util.coffee":17,"events":18,"object-assign":14}],17:[function(require,module,exports){
 module.exports = {
   uuid32: function() {
@@ -1766,7 +1754,6 @@ module.exports = {
 };
 
 
-
 },{}],18:[function(require,module,exports){
 // Copyright Joyent, Inc. and other Node contributors.
 //