carte-server 1.0.0 → 1.0.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 13eacfbd43450a6c4a02c30a1fad54602c8b8608
-  data.tar.gz: 4f844b0e8b46149bfa6376d075bae7217b542207
+  metadata.gz: 132ae5812e302de8c0d26fa7fc7f976317aadc02
+  data.tar.gz: f8c1dbf6608dc043567eb942351be1f8d9b60b07
 SHA512:
-  metadata.gz: e841dd58143bdf917dd51931bc9e39f73e5c992fc11bba6fcee2da03ef7d2447abda686fd822186f194b513be8d0041b91c13e8b9832973705a933c131fc1ea9
-  data.tar.gz: 362ec4bddeafea8a8987b668e8877a81c4245480c074ae56c09e02f83737a4b73155295fad59b580df04a5622b327e6fb2701571159e50e996c3f83dd4afbe0c
+  metadata.gz: 379fe71b54212b0a6e5c5a7841ce43429aafea15ae5109488766848566f5a9e400c530f83308c4a02e6430b7274b1dfe3ae59f5f85cb306aec14e09425f93dc5
+  data.tar.gz: cb3eb492d5e6ad1f97cead588ea87d8593816ff078a743accc4e19eda483aaa2c57cd0566d831592a9990c2748df02599c67553fb0de0da4fd320b971e6d9de4

data/lib/carte/client.css

@@ -106,10 +106,12 @@ ul.nav-pills li a {
 }
 
 .carte-slideshow {
-  height: 100%;
-  width: 100%;
   background-color: white;
   position : absolute;
+  left: 0;
+  top: 0;
+  right: 0;
+  bottom: 0;
 }
 
 /* http://stackoverflow.com/questions/24511887/css-animation-works-in-chrome-but-not-in-firefox-resolved */

data/lib/carte/client.jade

@@ -2,7 +2,9 @@ doctype html
 html
   head
     meta(charset="utf-8")
-    meta(name="viewport",content="width=device-width,initial-scale=1.0")
+    meta(name="viewport",content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,minimal-ui")
+    meta(name="apple-mobile-web-app-capable",content="yes")
+    meta(name="apple-mobile-web-app-status-bar-style",content="black-translucent")
     meta(name="description",content=config.description)
     title= config.title
     script(type="text/javascript",src=config.script_path)

data/lib/carte/client/router.coffee

@@ -3,8 +3,9 @@ Backbone = require('backbone')
 
 module.exports = class Router extends Backbone.Router
   routes:
-    ':title' : 'show'
-    ''       : 'list'
+    '': 'list'
+    'slideshow': 'slideshow'
+    ':title': 'show'
 
   list: (string)->
     console.log '[router] list', string
@@ -16,3 +17,8 @@ module.exports = class Router extends Backbone.Router
     console.log '[router] show', title
     @current = 'show'
     @title = title
+
+  slideshow: (string)->
+    console.log 'slideshow', string
+    @current = 'slideshow'
+    @query = querystring.parse(string)

data/lib/carte/client/views/content.cjsx

@@ -2,6 +2,7 @@
 $ = require('jquery')
 React = require('react')
 List = require('./list')
+Slideshow = require('./slideshow')
 CardCollection = require('../models/cards')
 CardModel = require('../models/card')
 String = require('string')
@@ -34,8 +35,12 @@ module.exports = React.createClass
             #title = title.join(', ')
             #title = config.title + ' (' + title + ')'
             #document.title = title
-            document.title = config.title
-            <List key='list' router={@props.router} cards={cards} />
+            if cards.query.mode == 'flash'
+              document.title = config.title + '、スライドショー'
+              <Slideshow key='slideshow' router={@props.router} cards={cards} />
+            else
+              document.title = config.title
+              <List key='list' router={@props.router} cards={cards} />
           when "show"
             cards = new CardCollection()
             cards.fetching = true
@@ -57,16 +62,6 @@ module.exports = React.createClass
                 cards.fetching = false
             document.title = config.title + '、' + card.get('title')
             <List key='show' cards={cards} card={card} />
-          when "slideshow"
-            console.log 'slideshow', @props.router.query
-            cards = new CardCollection()
-            cards.query = $.extend {}, config.default_query, @props.router.query
-            cards.fetching = true
-            cards.fetch success: ()-> cards.fetching = false
-            document.title = config.title + '、スライドショー'
-            e = React.createElement(Slideshow, cards: cards)
-            React.render(e, document.body)
-            #<Slideshow key='slideshow' router={@props.router} cards={cards} />
           else
             <div>Loading ...</div>
       }

data/lib/carte/client/views/list.cjsx

@@ -29,7 +29,7 @@ module.exports = React.createClass
     @queryParam {order: 'random'}, ['sort', 'page']
 
   tagParam: (tag)->
-    @queryParam {tag: tag}, ['seed']
+    @queryParam {tag: tag}, []
 
   queryParam: (param, deleteKeys)->
     query = $.extend {}, @props.cards.query, param
@@ -85,6 +85,11 @@ module.exports = React.createClass
                   <i className="fa fa-rss" />
                 </a>
               </li>
+              <li>
+                <a href={"#/?" + @queryParam({'mode': 'flash'}, [])}>
+                  <i className="fa fa-arrows-alt" />
+                </a>
+              </li>
             </ul>
           </div>
           <div className="col-sm-4">

data/lib/carte/client/views/slideshow.cjsx

@@ -0,0 +1,203 @@
+# @cjsx React.DOM 
+$ = require('jquery')
+Backbone = require('backbone')
+React = require('react')
+CardCollection = require('../models/cards')
+config = require('../config')
+helpers = require('../helpers')
+classnames = require('classnames')
+markdownIt = require('markdown-it')(linkify: true)
+
+#window.onerror = (error, url, line) -> alert error
+
+Portal = React.createClass
+  componentDidMount: ->
+    console.log '[views/slideshow] Portal#componentDidMount'
+    @setState currCards: @props.cards
+    $(document).on 'keydown', @onKeyDown
+    @props.cards.on 'sync', =>
+      @setState currCard: @props.cards.at(0)
+      @loadNextCards()
+      @loadPrevCards()
+      @forceUpdate.bind(@, null)
+
+  componentWillUnmount: ->
+    $(document).off 'keydown', @onKeyDown
+
+  onKeyDown: (event)->
+    switch event.keyCode
+      when 37 then @onClickPrev()
+      when 39 then @onClickNext()
+
+  getInitialState: ->
+    currCard: null
+    currCards: null
+    nextCards: null
+    prevCards: null
+    hideValue: 'none'
+    hiding: true
+
+  prevCard: ->
+    _prevCard = @state.currCards.at(@currCardIndex() - 1)
+    console.log '[views/slideshow] prevCard', _prevCard
+    _prevCard
+
+  nextCard: ->
+    _nextCard = @state.currCards.at(@currCardIndex() + 1)
+    console.log '[views/slideshow] nextCard', _nextCard
+    _nextCard
+
+  currCardIndex: ->
+    _currCardIndex = @state.currCards.indexOf(@state.currCard)
+    console.log '[views/slideshow] currCardIndex, @state.currCard', @state.currCard
+    console.log '[views/slideshow] currCardIndex', _currCardIndex
+    _currCardIndex
+
+  currPage: ->
+    _currPage = @state.currCards.pagination.current_page
+    console.log '[views/slideshow] currPage', _currPage
+    _currPage
+
+  totalPages: ->
+    @state.currCards.pagination.total_pages
+
+  nextPage: ->
+    _nextPage = if @currPage() < @totalPages() then @currPage() + 1 else 1
+    console.log '[views/slideshow] nextPage', _nextPage
+    _nextPage
+
+  prevPage: ->
+    _prevPage = if @currPage() > 1 then @currPage() - 1 else @totalPages()
+    console.log '[views/slideshow] prevPage', _prevPage
+    _prevPage
+
+  loadNextCards: ->
+    console.log '[views/slideshow] loadNextCards'
+    nextCards = new CardCollection()
+    nextCards.query = $.extend {}, @state.currCards.query, {page: @nextPage()}
+    nextCards.fetching = true
+    nextCards.fetch success: ()-> nextCards.fetching = false
+    @setState nextCards: nextCards
+
+  loadPrevCards: ->
+    console.log '[views/slideshow] loadPrevCards'
+    prevCards = new CardCollection()
+    prevCards.query = $.extend {}, @state.currCards.query, {page: @prevPage()}
+    prevCards.fetching = true
+    prevCards.fetch success: ()-> prevCards.fetching = false
+    @setState prevCards: prevCards
+
+  onTouchStart: (event)->
+    @touchStartX = event.changedTouches[0].pageX
+
+  onTouchEnd: (event)->
+    touchEndX = event.changedTouches[0].pageX
+    distance = touchEndX - @touchStartX
+    if Math.abs(distance) > 100
+      if distance > 0
+        @onClickNext()
+      else
+        @onClickPrev()
+
+  onClickNext: ->
+    if @state.hideValue != 'none' && @state.hiding
+      @setState hiding: false
+    else
+      @setState hiding: true
+      if nextCard = @nextCard()
+        @setState currCard: nextCard
+      else
+        return if @state.nextCards.fetching
+        @setState currCards: @state.nextCards, prevCards: @state.currCards, ()=>
+          @setState currCard: @state.currCards.at(0), ()=>
+            @loadNextCards()
+
+  onClickPrev: ->
+    if @state.hideValue != 'none' && @state.hiding
+      @setState hiding: false
+    else
+      @setState hiding: true
+      if prevCard = @prevCard()
+        @setState currCard: prevCard
+      else
+        return if @state.prevCards.fetching
+        @setState currCards: @state.prevCards, nextCards: @state.currCards, ()=>
+          @setState currCard: @state.currCards.at(@state.currCards.length - 1), ()=>
+            @loadPrevCards()
+
+  closeLink: ->
+    params = $.extend {}, @props.cards.query
+    delete params.mode
+    '#/?' + $.param(params)
+
+  onChangeHide: (event)->
+    @setState hideValue: event.target.value
+
+  render: ->
+    <div className="carte-slideshow" onTouchStart={@onTouchStart} onTouchEnd={@onTouchEnd}>
+      <div style={fontSize:'10vh',padding:'1vh 5vh',overflow:'hidden'}>
+        <div>
+          <strong>
+            {
+              if @state.currCard
+                if @state.hideValue == 'title' && @state.hiding == true
+                  '?????'
+                else
+                  @state.currCard.get('title')
+              else
+                <i className="glyphicon glyphicon-refresh glyphicon-refresh-animate" />
+            }
+          </strong>
+          <span className="pull-right tools" style={fontSize:'0.5em'}>
+            hide:
+            <select value={@state.hideValue} onChange={@onChangeHide}>
+              <option value="none">none</option>
+              <option value="title">title</option>
+              <option value="content">content</option>
+            </select>
+            <a href={@closeLink()}>
+              <strong>&times;</strong>
+            </a>
+          </span>
+        </div>
+        <div style={paddingTop:'5vh'}>
+          {
+            if @state.currCard
+              if @state.hideValue == 'content' && @state.hiding == true
+                '???????'
+              else
+                <div dangerouslySetInnerHTML={__html: markdownIt.render @state.currCard.get('content')} />
+            else
+              <i className="glyphicon glyphicon-refresh glyphicon-refresh-animate" />
+          }
+        </div>
+      </div>
+    </div>
+
+MyPortal = React.createFactory Portal
+
+module.exports = React.createClass
+  displayName: 'Slideshow'
+
+  componentDidMount: ->
+    console.log '[views/slideshow] componentDidMount'
+    @props.cards.on 'sync', @forceUpdate.bind(@, null)
+    @node = document.createElement('div')
+    @node.className = 'carte-slideshow'
+    document.body.appendChild(@node)
+    @renderSlideshow()
+
+  componentWillReceiveProps: (nextProps)->
+    console.log '[views/slideshow] componentWillReceiveProps', nextProps
+    nextProps.cards.on 'sync', @forceUpdate.bind(@, null)
+
+  componentWillUnmount: ->
+    console.log '[views/slideshow] componentWillUnmount'
+    document.body.removeChild(@node)
+
+  renderSlideshow: ->
+    React.render(MyPortal(@props), @node)
+
+  render: ->
+    console.log '[views/slideshow] render', @props
+    null

data/package.json

@@ -1,7 +1,7 @@
 {
   "name": "carte-client",
   "description": "something like dictionary, wiki, or information card",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "main": "lib/carte.coffee",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: carte-server
 version: !ruby/object:Gem::Version
-  version: 1.0.0
+  version: 1.0.1
 platform: ruby
 authors:
 - tily
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2015-05-12 00:00:00.000000000 Z
+date: 2015-05-14 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: bundler
@@ -277,6 +277,7 @@ files:
 - lib/carte/client/views/list.cjsx
 - lib/carte/client/views/message.cjsx
 - lib/carte/client/views/pagination.cjsx
+- lib/carte/client/views/slideshow.cjsx
 - lib/carte/server.rb
 - lib/carte/server/models.rb
 - lib/carte/server/models/card.rb