octodmin 0.1.0

data/app/assets/javascripts/components/posts.js.cjsx

@@ -0,0 +1,309 @@
+# @cjsx React.DOM
+
+@Posts = React.createClass(
+  propTypes:
+    site: React.PropTypes.object.isRequired
+
+  getInitialState: ->
+    { alert: null, loading: false, posts: null }
+
+  fetchPosts: ->
+    return if @state.loading
+    @setState(loading: true)
+    $.get("/api/posts").always(@handleResponse).done(@handleSuccess).fail(@handleError)
+
+  handleResponse: ->
+    @setState(loading: false) if @isMounted()
+
+  handleSuccess: (response) ->
+    @setState(alert: null, posts: response.posts) if @isMounted()
+
+  handleError: (error) ->
+    @setState(alert: "Could not load posts: #{error.statusText} (#{error.status})") if @isMounted()
+
+  componentWillMount: ->
+    @fetchPosts()
+    $(document).on("fetchPosts", @fetchPosts)
+    @timer = setInterval(@fetchPosts, 5000)
+
+  componentWillUnmount: ->
+    $(document).off("fetchPosts", @fetchPosts)
+    clearInterval(@timer)
+
+  render: ->
+    <div>
+      {<div className="alert alert-danger">{@state.alert}</div> if @state.alert}
+      <NewPostPartial site={@props.site} />
+
+      <Loader loaded={!!@state.posts}>
+        {@state.posts?.map(((post) ->
+          <PostPartial key={post.identifier} site={@props.site} post={post} />
+        ).bind(this))}
+      </Loader>
+
+      <footer className="row">
+        <div className="col-sm-3">
+          <iframe src="http://ghbtns.com/github-btn.html?user=krasnoukhov&repo=octodmin&type=watch&count=true" allowTransparency="true" frameBorder="0" scrolling="no" style={border: "none", overflow: "hidden", width: "170px", height: "20px"}></iframe>
+        </div>
+        <div className="col-sm-9" style={textAlign: "right"}>
+          <a href="https://github.com/krasnoukhov/octodmin" target="_blank">Octodmin</a>, open source project by <a href="http://www.krasnoukhov.com"  target="_blank">Dmitry Krasnoukhov</a>
+        </div>
+      </footer>
+    </div>
+)
+
+@NewPostPartial = React.createClass(
+  mixins: [ReactRouter.Navigation]
+
+  propTypes:
+    site: React.PropTypes.object.isRequired
+
+  getInitialState: ->
+    { alert: null, loading: false }
+
+  form: ->
+    $(@refs.form.getDOMNode())
+
+  handleSubmit: (event) ->
+    event.preventDefault()
+    return if @state.loading
+
+    @setState(loading: true)
+    $.post("/api/posts", @form().serialize()).always(@handleResponse).done(@handleSuccess).fail(@handleError)
+
+  handleResponse: ->
+    @setState(loading: false)
+
+  handleSuccess: (response) ->
+    @setState(alert: null)
+    @form()[0].reset()
+    $(document).trigger("fetchPosts")
+    @transitionTo("post_edit", post_id: response.posts.identifier)
+
+  handleError: (error) ->
+    @setState(alert: error.responseJSON?.errors.join(", "))
+
+  render: ->
+    <div className="panel panel-default">
+      <div className="panel-body">
+        {<div className="alert alert-danger">{@state.alert}</div> if @state.alert}
+
+        <form ref="form" className="form-inline" onSubmit={@handleSubmit}>
+          <fieldset className="row" disabled={@state.loading}>
+            <div className="col-sm-9 form-group form-group-lg">
+              <input className="form-control" style={width: '100%'} name="title" placeholder="Type the title of your new post here" required />
+            </div>
+            <div className="col-sm-3 buttons">
+              <button type="submit" className="btn btn-lg btn-default">Create</button>
+            </div>
+          </fieldset>
+        </form>
+      </div>
+    </div>
+)
+
+@PostPartial = React.createClass(
+  mixins: [ReactRouter.Navigation]
+
+  propTypes:
+    site: React.PropTypes.object.isRequired
+    post: React.PropTypes.object.isRequired
+
+  getInitialState: ->
+    { alert: null, loading: false }
+
+  panelClass: ->
+    if @props.post.added
+      "success"
+    else if @props.post.changed
+      "warning"
+    else if @props.post.deleted
+      "danger"
+    else
+      "default"
+
+  handleEdit: ->
+    @transitionTo("post_edit", post_id: @props.post.identifier)
+
+  handleRevert: ->
+    return if @state.loading
+    @setState(loading: true)
+
+    $.ajax(type: "PATCH", url: "/api/posts/#{@props.post.identifier}/revert").
+      always(@handleResponse).
+      done(@handleSuccess).
+      fail(@handleError)
+
+  handleDelete: ->
+    if @props.post.added
+      return unless confirm("Are you sure? This can't be undone")
+
+    return if @state.loading
+    @setState(loading: true)
+
+    $.ajax(type: "DELETE", url: "/api/posts/#{@props.post.identifier}").
+      always(@handleResponse).
+      done(@handleSuccess).
+      fail(@handleError)
+
+  handleRestore: ->
+    return if @state.loading
+    @setState(loading: true)
+
+    $.ajax(type: "PATCH", url: "/api/posts/#{@props.post.identifier}/restore").
+      always(@handleResponse).
+      done(@handleSuccess).
+      fail(@handleError)
+
+  handleResponse: ->
+    @setState(loading: false)
+
+  handleSuccess: (response) ->
+    @setState(alert: null)
+    $(document).trigger("fetchPosts")
+
+  handleError: (error) ->
+    @setState(alert: "Could not load post: #{error.statusText} (#{error.status})")
+
+  render: ->
+    <div className="panel panel-#{@panelClass()}">
+      <div className="panel-heading clearfix">
+        <h3 className="panel-title pull-left">{@props.post.title}</h3>
+        <div className="pull-right">
+          {moment((new Date(@props.post.date)).toISOString()).format("LLL")}
+        </div>
+      </div>
+      <div className="panel-body">
+        {<div className="alert alert-danger">{@state.alert}</div> if @state.alert}
+
+        <div className="row">
+          <div className="col-sm-9 excerpt" dangerouslySetInnerHTML={{__html: @props.post.excerpt }} />
+          <div className="col-sm-3 buttons">
+            {if @props.post.deleted
+              <div className="btn-group btn-group-sm">
+                <button className="btn btn-default #{'disabled' if @state.loading}" onClick={@handleRestore}>Restore</button>
+              </div>
+            else
+              <div className="btn-group btn-group-sm">
+                <button className="btn btn-default #{'disabled' if @state.loading}" onClick={@handleEdit}>Edit</button>
+                {if @props.post.changed
+                  <button className="btn btn-warning #{'disabled' if @state.loading}" onClick={@handleRevert}>Revert</button>
+                }
+                <button className="btn btn-danger #{'disabled' if @state.loading}" onClick={@handleDelete}>Delete</button>
+              </div>
+            }
+          </div>
+        </div>
+      </div>
+    </div>
+)
+
+@PostEdit = React.createClass(
+  mixins: [ReactRouter.State, ReactRouter.Navigation]
+
+  propTypes:
+    site: React.PropTypes.object.isRequired
+
+  getInitialState: ->
+    { alert: null, success: null, loading: false, post: null }
+
+  form: ->
+    $(@refs.form.getDOMNode())
+
+  frontMatter: ->
+    @props.site.octodmin.front_matter
+
+  fetchPost: ->
+    return if @state.loading
+    @setState(loading: true)
+    $.get("/api/posts/#{@getParams().post_id}").always(@handleResponse).done(@handleSuccess).fail(@handleError)
+
+  handleBack: (event) ->
+    event.preventDefault()
+    @transitionTo("app")
+
+  handleSubmit: (event) ->
+    event.preventDefault()
+    return if @state.loading
+    @setState(loading: true)
+
+    data = @form().serializeObject()
+    $.ajax(type: "PATCH", url: "/api/posts/#{@state.post.identifier}", data: data).
+      always(@handleResponse).
+      done(@handleFormSuccess).
+      fail(@handleError)
+
+  handleResponse: ->
+    @setState(loading: false)
+
+  handleSuccess: (response) ->
+    @setState(alert: null, post: response.posts)
+
+  handleFormSuccess: (response) ->
+    @setState(alert: null, success: "Post is updated")
+    setTimeout(@removeSuccess, 5000)
+    @transitionTo("post_edit", post_id: response.posts.identifier)
+
+  handleError: (error) ->
+    @setState(alert: error.responseJSON?.errors.join(", "))
+
+  removeSuccess: ->
+    @setState(success: null) if @isMounted()
+
+  componentWillMount: ->
+    @fetchPost()
+
+  componentDidUpdate: ->
+    return if !@state.post || !@refs.editor
+    return if !/markdown$/.test(@state.post.path) && !/md$/.test(@state.post.path)
+
+    $(@refs.editor.getDOMNode()).markdown(
+      autofocus: false
+      savable: false
+      iconlibrary: "fa"
+      resize: "vertical"
+      fullscreen:
+        enable: false
+    )
+
+  render: ->
+    <Loader loaded={!!@state.post}>
+      {<div className="alert alert-danger">{@state.alert}</div> if @state.alert}
+      {<div className="alert alert-success">{@state.success}</div> if @state.success}
+
+      {if @state.post
+        <form ref="form" className="form-horizontal post-edit" onSubmit={@handleSubmit}>
+          <fieldset disabled={@state.loading}>
+            <div className="form-group">
+              <div className="col-sm-8">
+                <input type={@frontMatter().title.type} className="form-control" name="title" placeholder="Title" defaultValue={@state.post.title} required />
+              </div>
+              <div className="col-sm-4">
+                <input type={@frontMatter().date.type} className="form-control" name="date" placeholder="Date" defaultValue={@state.post.date} required />
+              </div>
+            </div>
+
+            <textarea ref="editor" className="md-content" name="content" rows="15" defaultValue={@state.post.content} placeholder="Post content" required></textarea>
+
+            {Object.keys(@frontMatter()).map(((key) ->
+              if key != "title" && key != "date"
+                config = @frontMatter()[key]
+                title = key.charAt(0).toUpperCase() + key.slice(1)
+
+                <div key={key} className="form-group">
+                  <label htmlFor={key} className="col-sm-1 control-label">{title}</label>
+                  <div className="col-sm-11">
+                    <input type={config.type} className="form-control" name={key} placeholder={title} defaultValue={@state.post[key]} />
+                  </div>
+                </div>
+            ).bind(this))}
+
+            <div className="buttons">
+              <button type="submit" className="btn btn-lg btn-success pull-right">Save</button>
+              <button className="btn btn-lg btn-default pull-right" onClick={@handleBack}>Back</button>
+            </div>
+          </fieldset>
+        </form>
+      }
+    </Loader>
+)

data/app/assets/javascripts/components/router.js.cjsx

@@ -0,0 +1,56 @@
+# @cjsx React.DOM
+
+@Router = ReactRouter
+@Link = Router.Link
+@Routes = Router.Routes
+@Route = Router.Route
+@DefaultRoute = Router.DefaultRoute
+@RouteHandler = Router.RouteHandler
+
+@Container = React.createClass(
+  render: ->
+    <div className="container">
+      {@props.children}
+    </div>
+)
+
+@App = React.createClass(
+  getInitialState: ->
+    { site: null }
+
+  fetchSite: ->
+    $.get("/api/site").done(@handleSuccess).fail(@handleError)
+
+  handleSuccess: (response) ->
+    @setState(site: response.sites)
+    $("title").text("Octodmin – #{response.sites.title}")
+
+  handleError: (error) ->
+    alert("Could not load site: #{error.statusText} (#{error.status})")
+
+  componentWillMount: ->
+    @fetchSite()
+    $(document).on("fetchSite", @fetchSite)
+
+  componentWillUnmount: ->
+    $(document).off("fetchSite", @fetchSite)
+
+  render: ->
+    <Loader loaded={!!@state.site}>
+      <Container>
+        <Header site={@state.site} />
+        <RouteHandler site={@state.site} />
+      </Container>
+    </Loader>
+)
+
+routes =
+  <Route path="/" name="app" handler={@App}>
+    <Route path="/posts/:post_id/edit" name="post_edit" handler={@PostEdit} />
+    <DefaultRoute handler={@Posts} />
+  </Route>
+
+
+Router.run(routes, Router.HistoryLocation, (Handler) ->
+  React.render(<Handler />, document.getElementById("app"))
+)

data/app/assets/stylesheets/app.scss

@@ -0,0 +1,75 @@
+@charset "utf-8";
+$fa-font-path: "/assets/fontawesome/fonts";
+@import "bootswatch/paper/variables";
+$icon-font-path: "/assets/bootstrap/fonts/";
+//= require bootstrap-markdown
+@import
+  "bootstrap-sass/assets/stylesheets/bootstrap",
+  "bootswatch/paper/bootswatch",
+  "fontawesome/scss/font-awesome"
+;
+
+body {
+  padding-bottom: 20px;
+}
+
+a, button, input, textarea, *:focus {
+  outline: 0 !important;
+  outline-style: none !important;
+}
+
+.navbar {
+  margin-bottom: 20px;
+
+  .navbar-right {
+    margin-right: 0;
+
+    .btn {
+      margin-left: 10px;
+    }
+  }
+}
+
+.panel {
+  .panel-heading {
+    line-height: 26px;
+
+    h3 {
+      font-size: 26px;
+    }
+  }
+
+  .panel-body {
+    .excerpt {
+      :first-child {
+        margin-top: 0;
+      }
+
+      :last-child {
+        margin-bottom: 0;
+      }
+    }
+
+    .buttons {
+      text-align: center;
+    }
+  }
+}
+
+.post-edit {
+  .md-editor {
+    .md-header {
+      margin-bottom: 15px;
+    }
+  }
+
+  .md-content {
+    width: 100%;
+  }
+
+  .buttons {
+    .btn {
+      margin-left: 10px;
+    }
+  }
+}

data/app/config/environment.rb

@@ -0,0 +1,7 @@
+require "lotus/setup"
+ENV["RACK_ENV"] = ENV["LOTUS_ENV"] ||= "development"
+
+require_relative "../octodmin"
+Lotus::Container.configure do
+  mount Octodmin::App, at: "/"
+end

data/app/config/routes.rb

@@ -0,0 +1,19 @@
+namespace "api" do
+  resource  :version, only: [:show]
+  resource  :site, only: [:show]
+  resources :posts do
+    member do
+      patch :restore
+      patch :revert
+    end
+  end
+  resources :syncs, only: [:create]
+  resources :deploys, only: [:create]
+end
+
+if ENV["LOTUS_ENV"] != "production"
+  mount Octodmin.sprockets, at: "/assets"
+end
+
+get "/posts*", to: "frontend#index"
+get "/", to: "frontend#index", as: :home

data/app/config/sprockets.rb

@@ -0,0 +1,36 @@
+require "sprockets"
+require "coffee_script"
+require "coffee-react"
+require "bower"
+
+module Octodmin
+  module CjsxProcessor
+    VERSION = '1'
+    SOURCE_VERSION = ::CoffeeScript::Source.version
+
+    def self.cache_key
+      @cache_key ||= [name, SOURCE_VERSION, VERSION].freeze
+    end
+
+    def self.call(input)
+      data = input[:data]
+      input[:cache].fetch(self.cache_key + [data]) do
+        ::CoffeeScript.compile(::CoffeeReact.transform(data))
+      end
+    end
+  end
+
+  def self.sprockets
+    assets_path = File.expand_path("../../assets", __FILE__)
+    tmp_path = File.expand_path("../../../tmp", __FILE__)
+
+    sprockets = ::Sprockets::Environment.new
+    sprockets.append_path "#{assets_path}/stylesheets"
+    sprockets.append_path "#{assets_path}/javascripts"
+    sprockets.append_path "#{assets_path}/fonts"
+    sprockets.append_path Bower.environment.directory
+    sprockets.register_engine ".cjsx", CjsxProcessor
+    sprockets.cache = Sprockets::Cache::FileStore.new(tmp_path)
+    sprockets
+  end
+end

data/app/controllers/deploys/create.rb

@@ -0,0 +1,20 @@
+module Octodmin::Controllers::Deploys
+  class Create
+    include Octodmin::Action
+    expose :message
+
+    def call(params)
+      self.format = :json
+
+      site = Octodmin::Site.new
+      site.process
+
+      options = site.config["octodmin"]["deploys"].first
+      Octopress::Deploy.push(options)
+
+      @message = "Deployed successfully"
+    rescue SystemExit => e
+      halt 400, JSON.dump(errors: [e.message])
+    end
+  end
+end

data/app/controllers/frontend/index.rb

@@ -0,0 +1,8 @@
+module Octodmin::Controllers::Frontend
+  class Index
+    include Octodmin::Action
+
+    def call(params)
+    end
+  end
+end

data/app/controllers/posts/create.rb

@@ -0,0 +1,18 @@
+module Octodmin::Controllers::Posts
+  class Create
+    include Octodmin::Action
+    expose :post
+
+    params do
+      param :title, presence: true
+    end
+
+    def call(params)
+      self.format = :json
+      halt 400, JSON.dump(errors: ["Required param `title` is not specified"]) unless params.valid?
+
+      @post = Octodmin::Post.create(title: params[:title])
+      halt 400, JSON.dump(errors: ["Post with specified `title` already exists"]) unless @post
+    end
+  end
+end

data/app/controllers/posts/destroy.rb

@@ -0,0 +1,14 @@
+module Octodmin::Controllers::Posts
+  class Destroy
+    include Octodmin::Action
+    expose :post
+
+    def call(params)
+      self.format = :json
+
+      @post = Octodmin::Post.find(params[:id])
+      halt 400, JSON.dump(errors: ["Could not find post"]) unless @post
+      @post.delete
+    end
+  end
+end

data/app/controllers/posts/index.rb

@@ -0,0 +1,13 @@
+module Octodmin::Controllers::Posts
+  class Index
+    include Octodmin::Action
+    expose :posts
+
+    def call(params)
+      self.format = :json
+
+      site = Octodmin::Site.new
+      @posts = site.posts
+    end
+  end
+end

data/app/controllers/posts/restore.rb

@@ -0,0 +1,14 @@
+module Octodmin::Controllers::Posts
+  class Restore
+    include Octodmin::Action
+    expose :post
+
+    def call(params)
+      self.format = :json
+
+      @post = Octodmin::Post.find(params[:id])
+      halt 400, JSON.dump(errors: ["Could not find post"]) unless @post
+      @post.restore
+    end
+  end
+end

data/app/controllers/posts/revert.rb

@@ -0,0 +1,14 @@
+module Octodmin::Controllers::Posts
+  class Revert
+    include Octodmin::Action
+    expose :post
+
+    def call(params)
+      self.format = :json
+
+      @post = Octodmin::Post.find(params[:id])
+      halt 400, JSON.dump(errors: ["Could not find post"]) unless @post
+      @post.revert
+    end
+  end
+end

data/app/controllers/posts/show.rb

@@ -0,0 +1,13 @@
+module Octodmin::Controllers::Posts
+  class Show
+    include Octodmin::Action
+    expose :post
+
+    def call(params)
+      self.format = :json
+
+      @post = Octodmin::Post.find(params[:id])
+      halt 400, JSON.dump(errors: ["Could not find post"]) unless @post
+    end
+  end
+end

data/app/controllers/posts/update.rb

@@ -0,0 +1,23 @@
+module Octodmin::Controllers::Posts
+  class Update
+    include Octodmin::Action
+    expose :post
+
+    params do
+      param :layout, presence: true
+      param :title, presence: true
+      param :slug, presence: true
+      param :date, presence: true
+      param :content, presence: true
+    end
+
+    def call(params)
+      self.format = :json
+
+      @post = Octodmin::Post.find(params.env["router.params"][:id])
+      halt 400, JSON.dump(errors: ["Could not find post"]) unless @post
+      halt 400, JSON.dump(errors: ["Required params are not specified"]) unless params.valid?
+      @post.update(params.env["rack.request.form_hash"].dup)
+    end
+  end
+end

data/app/controllers/site/show.rb

@@ -0,0 +1,12 @@
+module Octodmin::Controllers::Site
+  class Show
+    include Octodmin::Action
+    expose :site
+
+    def call(params)
+      self.format = :json
+
+      @site = Octodmin::Site.new
+    end
+  end
+end