Merge branch 'dev'

app/account/layouts/content.js

@@ -9,6 +9,7 @@ module.exports = Z.Layout.extend({
     detail: require('account/regions/card-detail'),
     detailInfo: require('account/regions/card-detail-info'),
     createNote: require('account/regions/create-note'),
+    createLink: require('account/regions/create-link'),
     fileUploader: require('account/regions/file-uploader')
   },
 
@@ -46,6 +47,10 @@ module.exports = Z.Layout.extend({
         board: options.board.attributes
       });
 
+      this.showCreateLinkModal({
+        board: options.board.attributes
+      });
+
       this.toggleLoadingContentState();
     }
 
@@ -120,6 +125,11 @@ module.exports = Z.Layout.extend({
     return this;
   },
 
+  showCreateLinkModal: function(options) {
+    this.getRegion('createLink').showModal(options);
+    return this;
+  },
+
   onCreateFirstFileClick: function() {
     this.broadcast('fileUploader:trigger');
   },

app/account/regions/card-detail.js

@@ -2,14 +2,7 @@ module.exports = Z.Region.extend({
   el: 'div.card-detail-left',
 
   showDetail: function(card) {
-    var DetailView;
-
-    if (card.get('type') === 'note') {
-      DetailView = require('account/views/note-detail');
-    } else if (card.get('type') === 'file') {
-      DetailView = require('account/views/file-detail');
-    }
-
+    var DetailView = require('account/views/' + card.get('type') + '-detail');
     this.setView(DetailView, {model: card}).show();
     return this;
   }

app/account/regions/create-link.js

@@ -0,0 +1,8 @@
+module.exports = Z.Region.extend({
+  el: 'div.create-link-container',
+
+  showModal: function(options) {
+    this.setView(require('account/views/create-link'), options).show();
+    return this;
+  }
+});

app/account/styles/_create-link.styl

@@ -0,0 +1,3 @@
+.create-link-container {
+  margin-bottom: -15px;
+}

app/account/styles/_link.styl

@@ -0,0 +1,5 @@
+@require '_file';
+
+.card[data-type="link"] {
+  @extends .card[data-type="file"];
+}

app/account/styles/account.styl

@@ -34,6 +34,7 @@
 
 @import '_card'
 @import '_file'
+@import '_link'
 @import '_note'
 @import '_board'
 @import '_comment'
@@ -42,6 +43,7 @@
 @import '_boards-list'
 @import '_note-editor'
 @import '_card-detail'
+@import '_create-link'
 @import '_create-board'
 @import '_board-detail'
 @import '_collaborator'

app/account/templates/board-detail.hbs

@@ -27,6 +27,7 @@
     <ul class="dropdown-menu" role="menu">
       <li><a class="item-action" href="#" data-action="createFile">File</a></li>
       <li><a class="item-action" href="#" data-action="createNote" data-toggle="modal" data-target="#create-note-modal">Note</a></li>
+      <li><a class="item-action" href="#" data-action="createLink" data-toggle="modal" data-target="#create-link-modal">Link</a></li>
     </ul> {{! .dropdown-menu }}
   </div> {{! .dropdown }}
   <button type="button" class="btn btn-link item-action" data-action="share" data-toggle="modal" data-target="#share-board-modal">{{icon-share}} Share</button>

app/account/templates/create-link-modal.hbs

@@ -0,0 +1,8 @@
+<div class="link-modal modal" id="create-link-modal">
+  <div class="create-link-modal modal-dialog">
+    <div class="modal-content">
+      <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
+      <div class="create-link-container" class="modal-body"></div>
+    </div> {{! .modal-content }}
+  </div> {{! .modal-dialog }}
+</div> {{! #create-link-modal }}

app/account/templates/create-link.hbs

@@ -0,0 +1,16 @@
+<form class="create-link-form">
+  <div class="create-link-form-title form-group">
+    <input name="name" type="text" class="form-control" placeholder="Title" autofocus>
+    <div data-error="name" class="help-block"></div>
+  </div> {{! .create-link-form-title }}
+
+  <div class="create-link-form-content form-group">
+    <input name="content" type="text" class="form-control" placeholder="http://">
+    <div data-error="content" class="help-block"></div>
+  </div> {{! .create-link-form-content }}
+
+  <div class="create-link-form-actions">
+    <button class="btn btn-default" data-action="submit">Done</button>
+    <button type="button" class="btn btn-link btn-cancel" data-action="cancel">Cancel</button>
+  </div> {{! .create-link-form-actions }}
+</form> {{! .create-link-form }}

app/account/templates/file-detail-preview.hbs

@@ -1,7 +1,7 @@
 {{#if hasPreview}}
-    <a href="{{original_html_url}}" data-action="view-original">
-        <img src="{{preview.image}}" class="card-preview card-preview-loader">
-    </a>
+  <a href="{{original_html_url}}" data-action="view-original">
+    <img src="{{preview.image}}" class="card-preview card-preview-loader">
+  </a>
 {{else}}
   <img src="{{asset-url}}images/patterns/{{preview.pattern}}.svg" class="card-preview-loader">
   <div class="card-preview-extension">{{preview.extension}}</div>

app/account/templates/layout-content.hbs

@@ -20,6 +20,7 @@
 </div> {{! .card-detail-container }}
 
 {{partial "account/templates/create-note-modal"}}
+{{partial "account/templates/create-link-modal"}}
 <div class="file-uploader"></div>
 <div class="share-board"></div>
 <div class="board-collaborators"></div>

app/account/templates/link-detail-actions.hbs

@@ -0,0 +1,20 @@
+<button type="button" class="navbar-toggle pull-left" data-action="toggleSidebar">
+  {{icon-sidebar-close}} {{! TODO: toggle this icon with icon-sidebar-open }}
+</button> {{! [data-action="toggleSidebar"] }}
+
+<div class="pull-left">
+  <a href="{{boardUrl}}" class="card-detail-actions-back" data-action="back">
+    <span class="board-thumbnail-partial card-detail-actions-back-avatar">
+      {{partial "account/templates/board-preview" boardPreview}}
+    </span> {{! .board-thumbnail-partial }}
+    <div class="card-detail-actions-back-text">
+      <small class="text-muted">BACK TO</small>
+      <strong class="card-detail-actions-board">{{boardName}}</strong>
+    </div> {{! .card-detail-actions-back-text }}
+  </a> {{! .card-detail-actions-back }}
+</div> {{! .pull-left }}
+
+<div class="pull-right">
+  <a href="{{content}}" class="btn btn-link item-action" target="_blank">{{icon-visit}} Visit</a>
+  <button type="button" class="btn btn-link item-action" data-action="delete">{{icon-delete}} Delete</button>
+</div> {{! .pull-right }}

app/account/templates/link-detail-preview.hbs

@@ -0,0 +1,11 @@
+{{#if hasPreview}}
+  <a href="{{content}}" target="_blank">
+    <img src="{{preview.image}}" class="card-preview card-preview-loader">
+  </a>
+{{else}}
+  <a href="{{content}}" target="_blank">
+    <img src="{{asset-url}}images/patterns/{{preview.pattern}}.svg" class="card-preview-loader">
+    <div class="card-preview-extension">{{preview.extension}}</div>
+    <div class="card-preview" data-pattern="{{preview.pattern}}" style="background-color:{{preview.color}};"></div>
+  </a>
+{{/if}}

app/account/templates/link-detail.hbs

@@ -0,0 +1,3 @@
+<div class="card-preview-wrapper">
+  {{partial "account/templates/link-detail-preview" this}}
+</div> {{! .card-preview-wrapper }}

app/account/templates/link.hbs

@@ -0,0 +1,16 @@
+<a href="{{html_url}}" class="card-link">
+  <div class="card-actions">
+    <button type="button" class="btn btn-link btn-xs" data-action="highlight">{{icon-star}}</button>
+    <button type="button" class="btn btn-link btn-xs" data-action="delete">{{icon-delete}}</button>
+  </div> {{! .card-actions }}
+
+  <div class="card-preview-wrapper">
+    {{partial "account/templates/file-preview" this}}
+  </div> {{! .card-preview-wrapper }}
+
+  <div class="card-info">
+    <div class="card-info-item card-name">{{name}}</div>
+    <div class="card-info-item card-author">Added by {{created_by.username}}</div>
+    <div class="card-info-item card-comments">{{inflect comments_count "comment" "comments" true}}</div>
+  </div> {{! .card-info }}
+</a> {{! .card-link }}

app/account/views/create-link.js

@@ -0,0 +1,49 @@
+module.exports = Zeppelin.FormView.extend({
+  className: 'create-link',
+
+  formSelector: 'form.create-link-form',
+
+  template: require('account/templates/create-link'),
+
+  model: require('core/models/link'),
+
+  events: {
+    'click [data-action=cancel]': 'close',
+    'click [data-action=submit]': 'submit'
+  },
+
+  initialize: function() {
+    $('#create-link-modal').on('hide.bs.modal', _.bind(function() {
+      this.reset();
+    }, this));
+
+    this.prepareModel();
+  },
+
+  prepareModel: function() {
+    this.setModel(require('core/models/link'));
+    this.model.set('board', this.options.board.id);
+    return this;
+  },
+
+  close: function() {
+    this.reset();
+    $('#create-link-modal').modal('hide');
+  },
+
+  onValidationSuccess: function() {
+    this.broadcast('card:created', this.model);
+  },
+
+  onSubmit: function() {
+    if (!this.model.validationError) {
+      this.prepareModel();
+      this.close();
+    }
+  },
+
+  onUnplug: function() {
+    $('#create-link-modal').off('hide.bs.modal');
+  }
+});
+

app/account/views/create-note.js

@@ -5,7 +5,7 @@ module.exports = Zeppelin.FormView.extend({
 
   template: require('account/templates/note-editor'),
 
-  model: require('core/models/card'),
+  model: require('core/models/note'),
 
   events: {
     'keydown [name=content]': 'onKeydown',

app/account/views/file.js

@@ -67,7 +67,7 @@ module.exports = Card.extend({
 
   setPreview: function() {
     var context = {
-          preview: this.model.getPreview() ,
+          preview: this.model.getPreview(),
           hasPreview: this.model.hasPreview()
         },
         template = require('account/templates/file-preview');

app/account/views/link-detail.js

@@ -0,0 +1,9 @@
+FileDetail = require('account/views/file-detail');
+
+module.exports = FileDetail.extend({
+  attributes: {
+    'data-type': 'link'
+  },
+
+  template: require('account/templates/link-detail')
+});

app/account/views/link.js

@@ -0,0 +1,5 @@
+var File = require('account/views/file');
+
+module.exports = File.extend({
+  template: require('account/templates/link')
+});

app/core/collections/cards.js

@@ -2,13 +2,9 @@ module.exports = Zeppelin.Collection.extend({
   url: App.API_URL + '/cards/',
 
   model: function(attrs, options) {
-    var Model;
+    var Model = require('core/models/' + attrs.type);
 
-    if (attrs.type === 'file') {
-      Model = require('core/models/file');
-    } else if (attrs.type === 'note') {
-      Model = require('core/models/note');
-    } else {
+    if (!Model) {
       Model = require('core/models/card');
     }
 

app/core/models/link.js

@@ -0,0 +1,23 @@
+var File = require('core/models/file');
+
+module.exports = File.extend({
+  defaults: function() {
+    return _.extend(File.prototype.defaults(), {
+      type: 'link'
+    });
+  },
+
+  validations: _.extend({}, File.prototype.validations, {
+    content: function(content) {
+      if (!content) {
+        return 'Every card requires some type of content.';
+      } else if (!Z.Validations.isUrl(content)) {
+        return 'Please provide a valid url.';
+      }
+    }
+  }),
+
+  getExtension: function() {
+    return _.last(this.get('content').split('.')).replace(/\/.+|\//, '');
+  }
+});

app/core/models/user.js

@@ -353,6 +353,12 @@ module.exports = Person.extend({
       });
     }
 
+    if (typeof olark !== 'undefined') {
+      olark('api.chat.updateVisitorNickname', {
+          snippet: this.get('email') + ' #' + this.id
+      });
+    }
+
     return this;
   },
 

app/core/styles/_modals.styl

@@ -23,7 +23,8 @@
 }
 
 .sharing-modal,
-.create-note-modal {
+.create-note-modal,
+.create-link-modal {
   [data-dismiss="modal"] {
     position: absolute;
     right: 10px;

app/lib/helpers.js

@@ -316,3 +316,8 @@ Handlebars.registerHelper('icon-blimp-logo', function() {
   var icon = '<svg class="icon-blimp-logo svg-icon-wrapper" width="49" height="25" viewBox="0 0 49 25" xmlns="http://www.w3.org/2000/svg"><path d="M26.192.259c-3.875.531-8.738 2.361-13.218 4.602-1.95-.993-4.133-2.037-4.733-2.062-1.149-.049-4.694 2.36-4.694 2.36l1.793 4.181c-3.323 2.312-5.504 4.492-5.331 5.757.084.609.753 1.276 1.849 1.953-.742.548-1.111.979-1.122 1.306 0 .369.086 1.205.332 1.266 1.076.278 3.338.249 5.571.025l-.545 4.082s4.062 1.366 5.156 1.01c.572-.186 2.401-1.787 4.014-3.271 1.421.275 2.863.507 4.289.686.185.877.459 1.855.803 2.158.327.288 3.529.848 6.754.644 3.365-.212 6.755-1.201 7.058-1.506.326-.328.411-1.445.424-2.385 8.038-2.678 14.958-8.407 14.372-12.681-.714-5.209-12.754-9.499-22.773-8.125zm-15.601 16.93c-2.167.9-8.566 1.552-9.596.844-.597-.411.696-1.346 1.885-2.058 1.421.077 3.513.002 5.833-.239 1.835-.19 3.507-.453 4.805-.737-.605.684-1.623 1.648-2.927 2.189zm12.814 6.964c-.693.105-1.333-.431-1.428-1.198-.019-.156-.014-.309.013-.456.791.128 1.631.211 2.511.244.01.698-.453 1.312-1.095 1.409zm4.224.001c-.694.097-1.333-.396-1.428-1.102-.019-.137-.014-.272.008-.401.796-.013 1.619-.064 2.458-.151l.045.202c.095.706-.39 1.356-1.083 1.453zm4.221-.833c-.696.096-1.337-.397-1.433-1.103l-.004-.043c.855-.137 1.683-.308 2.477-.509l.045.201c.095.706-.391 1.356-1.086 1.453zm-8.304-16.529c-13.518 1.781-22.644 8.593-22.702 8.19-.058-.403 12.877-10.431 26.396-12.212 13.52-1.781 20.857 5.782 20.914 6.185.058.403-11.089-3.944-24.608-2.163z" fill="#000" class="svg-icon-color" fill-rule="evenodd"/></svg>';
   return new Handlebars.SafeString(icon);
 });
+
+Handlebars.registerHelper('icon-visit', function() {
+  var icon = '<svg class="svg-icon-wrapper" width="16" height="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><g fill="#000" class="svg-icon-color" fill-rule="evenodd"><path d="M.009 10c.001.26.093.516.284.707l5 5c.19.191.446.283.707.283v.01h9c.553 0 1-.447 1-1v-14c0-.553-.447-1-1-1h-14c-.553 0-1 .447-1 1v9h.009zm4.991 2.586l-1.586-1.586h1.586v1.586zm-3-10.586h12v12h-7v-4c0-.553-.447-1-1-1h-4v-7zM12.447 3h-3.874c-.611 0-.757.351-.324.782l1.277 1.278-2.233 2.233c-.195.195-.195.512 0 .707l.707.707c.195.195.512.195.707 0l2.233-2.233 1.277 1.277c.433.433.783.288.783-.324v-3.873c0-.307-.248-.554-.553-.554z"/></g></svg>';
+  return new Handlebars.SafeString(icon);
+});

app/lib/socket.js

@@ -58,8 +58,8 @@ _.extend(Socket.prototype, {
   onMessage: function(message) {
     var collection;
 
-    if ((message.data.type === 'file' && message.method === 'update') ||
-    message.data.modified_by.id !== App.User.id) {
+    if (((message.data.type === 'file' || message.data.type === 'link') &&
+    message.method === 'update') || message.data.modified_by.id !== App.User.id) {
       if (message.data_type === 'board') {
         collection = App.Boards;
       } else if (message.data_type === 'card') {

app/public-board/templates/file.hbs

@@ -1,10 +1,11 @@
-<div class="card-preview-wrapper">
-  {{partial "account/templates/file-preview" this}}
-</div> {{! .card-preview-wrapper }}
-
-<div class="card-info">
-  <div class="card-info-item card-name">{{name}}</div>
-  <div class="card-info-item card-author">Added by {{created_by.username}}</div>
-  <div class="card-info-item card-comments">{{inflect comments_count "comment" "comments" true}}</div>
-</div> {{! .card-info }}
+<a href="{{html_url}}" class="card-link">
+  <div class="card-preview-wrapper">
+    {{partial "account/templates/file-preview" this}}
+  </div> {{! .card-preview-wrapper }}
 
+  <div class="card-info">
+    <div class="card-info-item card-name">{{name}}</div>
+    <div class="card-info-item card-author">Added by {{created_by.username}}</div>
+    <div class="card-info-item card-comments">{{inflect comments_count "comment" "comments" true}}</div>
+  </div> {{! .card-info }}
+</a> {{! .card-link }}

app/public-board/templates/link-detail-actions.hbs

@@ -0,0 +1,15 @@
+<div class="pull-left">
+  <a href="{{boardUrl}}" class="card-detail-actions-back" data-action="back">
+    <span class="board-thumbnail-partial card-detail-actions-back-avatar">
+      {{partial "account/templates/board-preview" boardPreview}}
+    </span> {{! .board-thumbnail-partial }}
+    <div class="card-detail-actions-back-text">
+      <small class="text-muted">BACK TO</small>
+      <strong class="card-detail-actions-board">{{boardName}}</strong>
+    </div> {{! .card-detail-actions-back-text }}
+  </a> {{! .card-detail-actions-back }}
+</div> {{! .pull-left }}
+
+<div class="pull-right">
+  <a href="{{content}}" class="btn btn-link item-action" target="_blank">{{icon-visit}} Visit</a>
+</div> {{! .pull-right }}