Update the styling and workflow around publishing a template

This commit is contained in:
James Allen 2014-03-14 14:42:38 +00:00
parent 7b2eef22a9
commit 5efd19ffc4
3 changed files with 58 additions and 28 deletions

View file

@ -290,22 +290,29 @@
-if(session && session.user && session.user.isAdmin)
.box
.page-header
h2 Publish Project
h2 Publish project as template
#publishedAsTemplateArea.show-when-published.alert.alert-success
p
.btn.btn-warning#unPublishProjectAsTemplate.pull-right Unpublish
i.icon-ok
| Your project is currently published.
a#templateLink(href='{{canonicalUrl}}') View in template gallery.
p
| Lastest version: {{publishedDate}}.
#publishedAsTemplateArea(style="display:none;")
a#templateLink(href='{{canonicalUrl}}') View Template
p published at {{publishedDate}}
.btn.btn-warning#unPublishProjectAsTemplate unpublish project as template
.btn.btn-success#republishProjectAsTemplate re publish project as template
#problemWithPublishingArea(style="display:none;")
#problemWithPublishingArea
p There is a problem with our publishing service, please try again in a few minutes.
#publishWorkingArea(style="display:none;")
p Working.....
#unpublishedAsTemplateArea(style="display:none;")
.btn.btn-success#publishProjectAsTemplate Publish project as template
div
textarea.span6#projectDescription {{description}}
#publishWorkingArea
p Working...
div.show-when-published.show-when-unpublished.project-description
label(for="project-description") Description
.row-fluid
textarea(placeholder="Template description", name="project-description").span12#projectDescription {{description}}
#unpublishedAsTemplateArea.show-when-unpublished
.btn.btn-success#publishProjectAsTemplate Publish
p.show-when-published
button.btn.btn-success#republishProjectAsTemplate Re-Publish
script(type="text/template")#settingsPanelTemplate

View file

@ -3,9 +3,10 @@ define [
"models/ProjectMemberList"
"account/AccountManager"
"utils/Modal"
"moment"
"libs/backbone"
"libs/mustache"
], (User, ProjectMemberList, AccountManager, Modal) ->
], (User, ProjectMemberList, AccountManager, Modal, moment) ->
INFINITE_COLLABORATORS = -1
class ProjectMembersManager
@ -20,6 +21,8 @@ define [
name: "Share"
content : $(@templates.userPanel)
lock: true
onShown: () =>
@publishProjectView.refreshPublishStatus()
setupPublish = _.once =>
@publishProjectView = new PublishProjectView
@ -179,25 +182,32 @@ define [
initialize: () ->
@ide = @options.ide
@model = @ide.project
_.bindAll(this, "render");
this.model.bind('change', this.render)
@refreshPublishStatus()
@render()
render: ->
viewModel =
description: @model.get("description")
canonicalUrl: @model.get("template.canonicalUrl")
isPublished: @model.get("template.isPublished")
publishedDate: @model.get("template.publishedDate")
publishedDate: moment(@model.get("template.publishedDate")).format("Do MMM YYYY, h:mm a")
$(@el).html $(Mustache.to_html(@template, viewModel))
@publishedArea = $('#publishedAsTemplateArea')
@unpublishedArea = $('#unpublishedAsTemplateArea')
@$el.html $(Mustache.to_html(@template, viewModel))
@publishedArea = $('.show-when-published')
@unpublishedArea = $('.show-when-unpublished')
$('#problemWithPublishingArea').hide()
$('#publishWorkingArea').hide()
refreshView: () ->
if @model.get("template.isPublished")
@$("a#templateLink").attr("href", @model.get("template.canonicalUrl"))
@publishedArea.show()
else
@unpublishedArea.show()
refreshPublishStatus: ->
@showWorking()
@ide.socket.emit "getPublishedDetails", @ide.user.get("id"), (err, details)=>
@hideWorking()
if err?
return @showError()
@ -205,16 +215,17 @@ define [
if details.exists
@model.set("template.canonicalUrl", details.canonicalUrl)
@model.set("template.publishedDate", details.publishedDate)
@publishedArea.show()
@unpublishedArea.hide()
else
@publishedArea.hide()
@unpublishedArea.show()
@refreshView()
showError: ->
@publishedArea.hide()
@unpublishedArea.hide()
$('#problemWithPublishingArea').show()
showWorking: ->
@publishedArea.hide()
@unpublishedArea.hide()
$('#publishWorkingArea').show()
hideWorking: ->

View file

@ -891,6 +891,18 @@ i[class*="sprite-"] {
}
}
.project-description {
textarea {
min-height: 120px;
}
label {
border-bottom: 1px solid #eeeeee;
font-size: 1.2em;
line-height: 1.8em;
margin-bottom: 6px;
}
}
.btn-facebook {
color: #ffffff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);