refactoring (rename modules, clean code, remove useless files, ...etc) + improve the inline editor module (locale picker + better ui workflow)

This commit is contained in:
did 2012-01-17 17:04:45 +01:00
parent 801f7bfca5
commit 09d6060633
47 changed files with 435 additions and 520 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.9 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.1 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 492 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 780 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 235 B

Binary file not shown.

Before

Width:  |  Height:  |  Size: 525 B

View File

@ -23,10 +23,12 @@
return this.replace(/\s/g, sep).replace(alphaNumRegexp, '').replace(avoidDuplicateRegexp, sep).toLowerCase()
}
window.addParameterToURL = function(key, value) { // code from http://stackoverflow.com/questions/486896/adding-a-parameter-to-the-url-with-javascript
window.addParameterToURL = function(key, value, context) { // code from http://stackoverflow.com/questions/486896/adding-a-parameter-to-the-url-with-javascript
if (typeof context == 'undefined') context = document;
key = encodeURIComponent(key); value = encodeURIComponent(value);
var kvp = document.location.search.substr(1).split('&');
var kvp = context.location.search.substr(1).split('&');
var i = kvp.length; var x; while(i--) {
x = kvp[i].split('=');
@ -41,7 +43,7 @@
if (i < 0) { kvp[kvp.length] = [key,value].join('='); }
//this will reload the page, it's likely better to store this until finished
document.location.search = kvp.join('&');
context.location.search = kvp.join('&');
}
window.addJavascript = function(doc, src, options) {

View File

@ -11,59 +11,24 @@ class Locomotive.Views.InlinEditor.ApplicationView extends Backbone.View
@iframe = @$('#page iframe')
_.bindAll(@, '_$')
@toolbar_view = new Locomotive.Views.InlinEditor.ToolbarView(target: @iframe)
render: ->
super
@decorate_iframe()
@enable_iframe_autoheight()
set_page: (attributes) ->
@page = new Locomotive.Models.Page(attributes)
@toolbar_view.render()
window.foo = @page
@toolbar_view.model = @page
if @$('#toolbar .inner .toolbar-view').size() == 0
@$('#toolbar .inner').html(@toolbar_view.render().el) # first time we render it
else
@toolbar_view.refresh()
decorate_iframe: ->
enable_iframe_autoheight: ->
iframe = @iframe
iframe.load =>
# add js / css
doc = iframe[0].contentWindow.document
window.addStylesheet doc, '/assets/locomotive/aloha/css/aloha.css'
window.addJavascript doc, '/assets/locomotive/utils/aloha_settings.js'
window.addJavascript doc, '/assets/locomotive/aloha/lib/aloha.js',
'data-aloha-plugins': 'common/format,common/highlighteditables,common/list,common/link,common/undo,common/paste'
onload: =>
console.log('loading target iframe')
# wake up the toolbar
@toolbar_view.enable()
# keep the user in the admin mode
_$ = iframe[0].contentWindow.Aloha.jQuery
_$('a').each ->
link = _$(this)
url = link.attr('href')
if url != '#' && /^(www|http)/.exec(url) == null && /(\/_edit)$/.exec(url) == null
url = '/index' if url == '/'
if url.indexOf('?') > 0
link.attr('href', url.replace('?', '/_edit?'))
else
link.attr('href', "#{url}/_edit")
link.bind 'click', ->
window.history.pushState('Object', 'Title', link.attr('href').replace('_edit', '_admin'))
# notify the toolbar about changes
iframe[0].contentWindow.Aloha.bind 'aloha-editable-deactivated', (event, editable) =>
@toolbar_view.notify editable.editable
console.log('iframe loading')
if @_$('meta[name=inline-editor]').size() > 0
# bind the resize event. When the iFrame's size changes, update its height
iframe_content = iframe.contents().find('body')
iframe_content.resize ->
@ -74,3 +39,56 @@ class Locomotive.Views.InlinEditor.ApplicationView extends Backbone.View
# Resize the iFrame immediately.
iframe_content.resize()
else
@toolbar_view.show_status('disabled', true).hide_editing_mode_block()
# keep the user in the admin mode
@enhance_iframe_links()
set_page: (attributes) ->
console.log('set_page')
@page = new Locomotive.Models.Page(attributes)
@toolbar_view.model = @page
@enhance_iframe()
@toolbar_view.refresh()
enhance_iframe: ->
_window = @iframe[0].contentWindow
_window.Aloha.settings.locale = window.locale
# set main window title
window.document.title = _window.document.title
# keep the user in the admin mode
@enhance_iframe_links _window.Aloha.jQuery
# notify the toolbar about changes
_window.Aloha.bind 'aloha-editable-deactivated', (event, editable) =>
@toolbar_view.notify editable.editable
enhance_iframe_links: (_jQuery) ->
toolbar_view = @toolbar_view
_jQuery ||= @_$
_jQuery('a').each ->
link = _jQuery(this)
url = link.attr('href')
if url? && url != '#' && /^(www|http)/.exec(url) == null && /(\/_edit)$/.exec(url) == null
url = '/index' if url == '/'
if url.indexOf('?') > 0
link.attr('href', url.replace('?', '/_edit?'))
else
link.attr('href', "#{url}/_edit")
link.bind 'click', ->
toolbar_view.show_status 'loading'
window.history.pushState('Object', 'Title', link.attr('href').replace('_edit', '_admin'))
_$: (selector) ->
$(selector, @iframe[0].contentWindow.document)

View File

@ -2,25 +2,23 @@ Locomotive.Views.InlinEditor ||= {}
class Locomotive.Views.InlinEditor.ToolbarView extends Backbone.View
tagName: 'div'
className: 'toolbar-view'
el: '#toolbar .inner'
events:
'change .editing-mode input[type=checkbox]': 'toggle_editing_mode'
'click .back a': 'back'
'click .element-actions a.save': 'save_modifications'
'click .element-actions a.cancel': 'cancel_modifications'
initialize: ->
super
'click .element-actions a.save': 'save_changes'
'click .element-actions a.cancel': 'cancel_changes'
render: ->
super
$(@el).html(ich.toolbar(@model.toJSON()))
console.log('render toolbar')
@enable_editing_mode_checkbox()
@enable_content_locale_picker()
@
notify: (aloha_editable) ->
@ -34,7 +32,19 @@ class Locomotive.Views.InlinEditor.ToolbarView extends Backbone.View
@$('.element-actions').show()
save_modifications: (event) ->
@hide_editing_mode_block()
show_status: (status, growl) ->
growl ||= false
message = @$('h1').attr("data-#{status}-status")
@$('h1').html(message).removeClass().addClass(status)
$.growl('error', message) if growl
@
save_changes: (event) ->
event.stopPropagation() & event.preventDefault()
previous_attributes = _.clone @model.attributes
@ -43,10 +53,11 @@ class Locomotive.Views.InlinEditor.ToolbarView extends Backbone.View
success: (model, response, xhr) =>
model.attributes = previous_attributes
@$('.element-actions').hide()
@show_editing_mode_block()
error: (model, xhr) =>
@$('.element-actions').hide()
cancel_modifications: (event) ->
cancel_changes: (event) ->
event.stopPropagation() & event.preventDefault()
@options.target[0].contentWindow.location.href = @options.target[0].contentWindow.location.href
@ -54,10 +65,12 @@ class Locomotive.Views.InlinEditor.ToolbarView extends Backbone.View
event.stopPropagation() & event.preventDefault()
window.location.href = @model.get('edit_url')
enable: ->
@options.target[0].contentWindow.Aloha.settings.locale = window.locale;
show_editing_mode_block: ->
@$('.editing-mode').show()
hide_editing_mode_block: ->
@$('.editing-mode').hide()
toggle_editing_mode: (event) ->
return if @editable_elements() == null
@ -77,16 +90,43 @@ class Locomotive.Views.InlinEditor.ToolbarView extends Backbone.View
on_label_color: '#fff'
off_label_color: '#bbb'
enable_content_locale_picker: ->
_window = @options.target[0].contentWindow
link = @$('#content-locale-picker-link')
picker = $('#content-locale-picker')
return if picker.size() == 0
link.bind 'click', (event) ->
event.stopPropagation() & event.preventDefault()
picker.toggle()
picker.find('li').bind 'click', (event) =>
current = @get_locale_attributes(link)
selected = @get_locale_attributes($(event.target).closest('li'))
@set_locale_attributes(link, selected)
@set_locale_attributes($(event.target).closest('li'), current)
picker.toggle()
window.addParameterToURL 'content_locale', selected[1], _window.document
get_locale_attributes: (context) ->
[context.find('img').attr('src'), context.find('span.text').html()]
set_locale_attributes: (context, values) ->
context.find('img').attr('src', values[0])
context.find('span.text').html(values[1])
refresh: ->
console.log('refreshing toolbar...')
@$('h1').html(@model.get('title'))
@$('h1').html(@model.get('title')).removeClass()
if @$('.editing-mode input[type=checkbox]').is(':checked')
@$('.editing-mode div.switchArea').trigger('click')
@$('.element-actions').hide()
remove: ->
super
@show_editing_mode_block()

View File

@ -2,7 +2,7 @@
@import "compass/css3/images";
@import "compass/css3/border-radius";
@import "compass/css3/text-shadow";
@import "helpers";
@import "locomotive/shared/helpers";
@import "buttons";
@mixin box-header {

View File

@ -2,7 +2,7 @@
@import "compass/css3/border-radius";
@import "compass/css3/images";
@import "compass/css3/text-shadow";
@import "helpers";
@import "locomotive/shared/helpers";
@import "box";
/* ___ boxes ___ */

View File

@ -1,4 +1,4 @@
@import "helpers";
@import "locomotive/shared/helpers";
.CodeMirror {
@include default-input-style;

View File

@ -2,7 +2,7 @@
@import "compass/css3/border-radius";
@import "compass/css3/images";
@import "compass/css3/text-shadow";
@import "helpers";
@import "locomotive/shared/helpers";
ul.content-assets {

View File

@ -2,8 +2,8 @@
@import "compass/css3/border-radius";
@import "compass/css3/images";
@import "compass/css3/text-shadow";
@import "locomotive/shared/helpers";
@import "buttons";
@import "helpers";
.ui-widget-overlay {
background: #000;

View File

@ -2,8 +2,8 @@
@import "compass/css3/border-radius";
@import "compass/css3/text-shadow";
@import "compass/css3/box-shadow";
@import "locomotive/shared/helpers";
@import "buttons";
@import "helpers";
@import "box";
#editable-elements {

View File

@ -2,7 +2,7 @@
@import "compass/css3/border-radius";
@import "compass/css3/images";
@import "compass/css3/text-shadow";
@import "helpers";
@import "locomotive/shared/helpers";
@import "buttons";
form.formtastic {

View File

@ -2,7 +2,7 @@
@import "compass/css3/border-radius";
@import "compass/css3/images";
@import "compass/css3/text-shadow";
@import "helpers";
@import "locomotive/shared/helpers";
#panel {
.inner {

View File

@ -2,7 +2,7 @@
@import "compass/css3/border-radius";
@import "compass/css3/images";
@import "compass/css3/text-shadow";
@import "helpers";
@import "locomotive/shared/helpers";
@import "buttons";
body {

View File

@ -4,204 +4,3 @@
#{$vside}: $vvalue;
#{$hside}: $hvalue;
}
/* ___ icons ___ */
// @import "compass/css3";
// @import "compass/css3/border-radius";
// @import "compass/css3/images";
// @import "compass/css3/text-shadow";
//
// @mixin clearfix {
// &:after {
// content: ".";
// display: block;
// height: 0;
// clear: both;
// visibility: hidden;
// };
// }
//
// @mixin reset {
// padding: 0px;
// margin: 0px;
// list-style: none;
//
// a {
// text-decoration: none;
// }
// }
//
// @mixin absolute-position($vside, $vvalue, $hside, $hvalue, $display: block) {
// display: $display;
// position: absolute;
// #{$vside}: $vvalue;
// #{$hside}: $hvalue;
// }
//
// /* ___ shadows ___ */
//
// @mixin box-shadow-with-inset($color_top, $color_bottom: $color_top) {
// $color_bottom: $color_top !default;
// @include box-shadow($color_top 0 1px 0 0 inset, $color_bottom 0 1px 0 0);
// }
//
// @mixin no-box-shadow($important: false) {
// @if $important == true {
// $important: " !important"; }
// @else {
// $important: ""; }
//
// box-shadow: none $important;
// -moz-box-shadow: none $important;
// -webkit-box-shadow: none $important;
// }
//
// @mixin popup-box {
// @include border-radius(4px);
// @include box-shadow(rgba(255, 255, 255, 0.17) 0 1px 0 0 inset, rgba(0, 0, 0, 0.41) 3px 3px 5px 0);
// }
//
// /* ___ icons ___ */
//
// @mixin icon($where, $width, $height, $enabled: false, $top: 0, $left: 0) {
// position: relative;
// width: $width;
// height: $height;
// line-height: $height + 1;
// @if $enabled == true {
// background-position: -#{$width} $where; }
// @else {
// background-position: 0 $where; }
// top: $top;
// left: $left;
// }
//
// @mixin menu-contents-icon($enabled: false) {
// @include icon(-64px, 16px, 12px, $enabled, 10px);
// }
//
// @mixin menu-assets-icon($enabled: false) {
// @include icon(-48px, 20px, 16px, $enabled, 11px);
// }
//
// @mixin menu-settings-icon($enabled: false) {
// @include icon(-32px, 14px, 13px, $enabled, 11px);
// }
//
// /* ___ colors ___ */
//
// @mixin menu-color($color) {
// $color-index: 1;
// @if $color == green { $color-index: 1; }
// @if $color == black { $color-index: 2; }
// @if $color == blue { $color-index: 3; }
// @if $color == orange { $color-index: 4; }
// @if $color == red { $color-index: 5; }
//
// z-index: 999;
//
// a {
// background-position: right -39px * $color-index;
//
// span {
// color: #fff;
// text-shadow: none;
// }
// }
//
// & > span { background-position: -40px * $color-index -39px; }
//
// &.first > span { background-position: -18px * $color-index 0px; }
// }
//
// @mixin black-submenu {
// & > ul {
// background: #23242b image-url("locomotive/menu/submenu/black-bg.png") repeat-x 0 0;
// border-color: rgba(255, 255, 255, 0.2);
// }
//
// & > ul > li > a, & > .action a {
// border: 1px solid rgba(0, 0, 0, 0.2);
// border-top: 1px solid rgba(0, 0, 0, 0.1);
// border-bottom: 1px solid rgba(0, 0, 0, 0.6);
// @include box-shadow-with-inset(rgba(255, 255, 255, 0.1));
// @include background-image(linear-gradient(#303138, #1e1e24));
//
// &.on, &:active {
// border: 1px solid rgba(0, 0, 0, 0.4);
// border-top: 1px solid rgba(0, 0, 0, 0.6);
// @include background-image(linear-gradient(#1e1e24, #212229));
// @include box-shadow-with-inset(rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.2));
// }
// }
//
// & > .action {
// background-image: image-url("locomotive/menu/submenu/black-action-border.png") !important;
//
// a:hover {
// border: 1px solid rgba(255, 255, 255, 0.5);
// }
// }
// }
//
// @mixin green-submenu {
// & > ul {
// background-color: #2e9a7d;
// & > li > a {
// @include background-image(linear-gradient(#258c70, #13604b));
//
// &.on, &:active {
// @include background-image(linear-gradient(#195e4b, #166d55));
// }
// }
// }
// }
//
// @mixin blue-submenu {
// & > ul {
// background-color: #2579ae;
// & > li > a {
// @include background-image(linear-gradient(#1f6ea1, #135179));
//
// &.on, &:active {
// @include background-image(linear-gradient(#13496c, #175b88));
// }
// }
// }
// }
//
// @mixin orange-submenu {
// & > ul {
// background-color: #ed8102;
// & > li > a {
// @include background-image(linear-gradient(#e07a02, #a25804));
//
// &.on, &:active {
// @include background-image(linear-gradient(#965201, #9d5603));
// }
// }
// }
// }
//
// @mixin red-submenu {
// & > ul {
// background-color: #d23c45;
// & > li > a {
// @include background-image(linear-gradient(#b63e45, #89272d));
//
// &.on, &:active {
// @include background-image(linear-gradient(#7b292e, #972e35));
// }
// }
// }
// }
//
// @mixin submenu-color($color) {
// @if $color == black { @include black-submenu; }
// @if $color == green { @include green-submenu; }
// @if $color == blue { @include blue-submenu; }
// @if $color == orange { @include orange-submenu; }
// @if $color == red { @include red-submenu; }
// }

View File

@ -1,4 +1,4 @@
@import "picker";
@import "locomotive/shared/picker";
#sites-picker {

View File

@ -4,6 +4,6 @@
* the top of the compiled file, but it's generally better to create a new file per style scope.
*= require locomotive/blueprint/screen.css
*= require locomotive/toggle.css
*= require locomotive/shared/growl.css
*= require_tree ./shared
*= require_tree ./inline_editor
*/

View File

@ -0,0 +1,70 @@
@import "compass/css3/images";
@import "compass/css3/opacity";
@import "compass/css3/box-shadow";
@import "compass/css3/text-shadow";
@import "compass/css3/border-radius";
@mixin button {
display: inline-block;
height: 22px;
line-height: 22px;
margin: 0 5px;
padding: 0 14px;
@include border-radius(14px);
@include background-image(linear-gradient(#303138, #1e1e24));
@include box-shadow(rgba(255, 255, 255, 0.1) 0 1px 0 0 inset, rgba(255, 255, 255, 0.1) 0 1px 0 0);
border: 1px solid rgba(0, 0, 0, 0.2);
border-top: 1px solid rgba(0, 0, 0, 0.1);
border-bottom: 1px solid rgba(0, 0, 0, 0.6);
color: #fff;
font-size: 12px;
text-decoration: none;
@include single-text-shadow(rgba(0, 0, 0, 1), 1px, 1px, 1px);
em {
display: inline-block;
position: relative;
background: transparent image-url("locomotive/menu/icons.png") no-repeat 0 0px;
height: 11px;
width: 11px;
top: 2px;
left: -5px;
}
&:hover {
border: 1px solid rgba(255, 255, 255, 0.5);
border-top: 1px solid rgba(255, 255, 255, 0.4);
}
&.on, &:active {
border: 1px solid rgba(0, 0, 0, 0.4);
border-top: 1px solid rgba(0, 0, 0, 0.6);
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
@include background-image(linear-gradient(#1e1e24, #212229));
@include box-shadow(rgba(0, 0, 0, 0) 0 1px 0 0 inset, rgba(255, 255, 255, 0.2) 0 1px 0 0);
}
&.blue {
@include single-text-shadow(rgba(0, 0, 0, 0.6), 1px, 1px, 1px);
@include background-image(linear-gradient(#2abaf1, #228dda));
@include box-shadow(rgba(255, 255, 255, 0.4) 0 1px 0 0 inset, rgba(127, 177, 211, 0.3) 0 1px 0 0);
border: 1px solid rgba(13, 56, 87, 1);
border-top: 1px solid rgba(13, 56, 87, 1);
border-bottom: 1px solid rgba(13, 56, 87, 1);
&.on, &:active {
@include box-shadow(rgba(0, 0, 0, 0) 0 1px 0 0 inset, rgba(255, 255, 255, 0.2) 0 1px 0 0);
@include background-image(linear-gradient(#26a1e9, #26a1e9));
}
&:hover {
border: 1px solid rgba(255, 255, 255, 0.5);
border-top: 1px solid rgba(255, 255, 255, 0.4);
}
}
}

View File

@ -1,7 +1,6 @@
body {
position: relative;
background: transparent;
// overflow: hidden;
}
#page {
@ -14,3 +13,9 @@ body {
display: block;
}
}
#content-locale-picker {
position: fixed;
top: 46px;
right: 70px;
}

View File

@ -2,7 +2,7 @@
@import "compass/css3/opacity";
@import "compass/css3/box-shadow";
@import "compass/css3/text-shadow";
@import "compass/css3/border-radius";
@import "buttons";
#toolbar {
position: fixed;
@ -46,11 +46,22 @@
font-weight: bold;
color: #fff;
@include single-text-shadow(#000, 0px, 1px, 0px);
&.disabled {
font-style: italic;
color: #999;
}
&.loading, &.disabled {
top: -1px;
font-size: 14px;
}
}
.col {
float: right;
height: 50px;
line-height: 50px;
margin-right: 10px;
@ -64,14 +75,18 @@
}
}
.lang {
#content-locale-picker-link {
@include button;
top: 7px;
}
}
.back {
a {
color: #1F82BC;
@include single-text-shadow(#000, 0px, 1px, 0px);
text-decoration: none;
&:hover {
text-decoration: underline;
}
position: relative;
top: 9px;
}
}
@ -90,70 +105,7 @@
.element-actions {
.button {
display: inline-block;
height: 22px;
line-height: 22px;
margin: 0 5px;
padding: 0 14px;
@include border-radius(14px);
@include background-image(linear-gradient(#303138, #1e1e24));
@include box-shadow(rgba(255, 255, 255, 0.1) 0 1px 0 0 inset, rgba(255, 255, 255, 0.1) 0 1px 0 0);
border: 1px solid rgba(0, 0, 0, 0.2);
border-top: 1px solid rgba(0, 0, 0, 0.1);
border-bottom: 1px solid rgba(0, 0, 0, 0.6);
text-decoration: none;
// font-size: 13px;
color: #fff;
font-size: 12px;
@include single-text-shadow(rgba(0, 0, 0, 1), 1px, 1px, 1px);
em {
display: inline-block;
position: relative;
background: transparent image-url("locomotive/menu/icons.png") no-repeat 0 0px;
height: 11px;
width: 11px;
top: 2px;
left: -5px;
}
&:hover {
border: 1px solid rgba(255, 255, 255, 0.5);
border-top: 1px solid rgba(255, 255, 255, 0.4);
}
&.on, &:active {
border: 1px solid rgba(0, 0, 0, 0.4);
border-top: 1px solid rgba(0, 0, 0, 0.6);
border-bottom: 1px solid rgba(0, 0, 0, 0.2);
@include background-image(linear-gradient(#1e1e24, #212229));
@include box-shadow(rgba(0, 0, 0, 0) 0 1px 0 0 inset, rgba(255, 255, 255, 0.2) 0 1px 0 0);
}
&.save {
@include single-text-shadow(rgba(0, 0, 0, 0.6), 1px, 1px, 1px);
@include background-image(linear-gradient(#2abaf1, #228dda));
@include box-shadow(rgba(255, 255, 255, 0.4) 0 1px 0 0 inset, rgba(127, 177, 211, 0.3) 0 1px 0 0);
border: 1px solid rgba(13, 56, 87, 1);
border-top: 1px solid rgba(13, 56, 87, 1);
border-bottom: 1px solid rgba(13, 56, 87, 1);
&.on, &:active {
@include box-shadow(rgba(0, 0, 0, 0) 0 1px 0 0 inset, rgba(255, 255, 255, 0.2) 0 1px 0 0);
@include background-image(linear-gradient(#26a1e9, #26a1e9));
}
&:hover {
border: 1px solid rgba(255, 255, 255, 0.5);
border-top: 1px solid rgba(255, 255, 255, 0.4);
}
}
@include button;
} // .button
} // .element-actions
}

View File

@ -2,8 +2,9 @@ module Locomotive
class BaseController < ApplicationController
include Locomotive::Routing::SiteDispatcher
include Locomotive::ActionController::Helpers
include Locomotive::ActionController::LocaleHelpers
include Locomotive::ActionController::SectionHelpers
include Locomotive::ActionController::UrlHelpers
layout '/locomotive/layouts/application'

View File

@ -3,8 +3,9 @@ module Locomotive
class BaseController < ApplicationController
include Locomotive::Routing::SiteDispatcher
include Locomotive::ActionController::Helpers
include Locomotive::ActionController::LocaleHelpers
include Locomotive::ActionController::SectionHelpers
include Locomotive::ActionController::UrlHelpers
before_filter :require_site

View File

@ -3,8 +3,8 @@ module Locomotive
class PagesController < ApplicationController
include Locomotive::Routing::SiteDispatcher
include Locomotive::Render
include Locomotive::ActionController::LocaleHelpers
before_filter :require_site
@ -12,6 +12,10 @@ module Locomotive
before_filter :validate_site_membership, :only => [:show_toolbar]
before_filter :set_ui_locale, :only => :show_toolbar
before_filter :set_locale, :only => [:show, :edit]
def show_toolbar
render :layout => false
end
@ -25,6 +29,17 @@ module Locomotive
render_locomotive_page
end
protected
def set_ui_locale
::I18n.locale = current_locomotive_account.locale rescue Locomotive.config.default_locale
end
def set_locale
self.set_current_content_locale
::I18n.locale = ::Mongoid::Fields::I18n.locale
end
end
end
end

View File

@ -3,7 +3,6 @@
= render '/locomotive/theme_assets/picker'
= render 'editable_elements'
- if @page.persisted?
- content_for :backbone_view_data do
:plain
{ page: #{@page.to_presenter.as_json_for_html_view.to_json} }

View File

@ -29,22 +29,6 @@
});
%script{ :type => 'text/html', :id => 'toolbar' }
%h1 {{title}}
.back.col
= link_to t('.buttons.back'), '#', :class => 'button back'
.editing-mode.col{ :style => 'display: none' }
%label= t('.editing_mode')
= check_box_tag 'edit', '1', false
.element-actions.col{ :style => 'display: none' }
%label= t('.save_modifications')
= link_to t('.buttons.confirm'), '#', :class => 'button save'
= link_to t('.buttons.cancel'), '#', :class => 'button cancel'
%body
#page
%iframe{ :src => request.fullpath.gsub('_admin', '_edit'), :scrolling => 'no', :frameborder => '0' }
@ -52,5 +36,24 @@
#toolbar
.background
.inner
%h1{ :class => 'loading', :'data-disabled-status' => t('.statuses.disabled'), :'data-loading-status' => t('.statuses.loading') }= t('.statuses.loading')
.back.col
= link_to image_tag('locomotive/inline_editor/back.png'), '#', :class => 'button back', :title => t('.buttons.back'), :alt => t('.buttons.back')
- if current_site.locales.size > 1
.lang.col
%label= t('.labels.lang')
= render '/locomotive/shared/locale_picker_link'
.editing-mode.col
%label= t('.labels.editing_mode')
= check_box_tag 'edit', '1', false
.element-actions.col{ :style => 'display: none' }
%label= t('.labels.save_changes')
= link_to t('.buttons.confirm'), '#', :class => 'button blue save'
= link_to t('.buttons.cancel'), '#', :class => 'button cancel'
= render_cell 'locomotive/content_locale_picker', :show, :site => current_site, :locale => current_content_locale

View File

@ -0,0 +1,7 @@
= link_to '#', :id => 'content-locale-picker-link', :class => 'button' do
%span.hand
&nbsp;
= image_tag "locomotive/icons/flags/#{current_content_locale}.png", :class => 'flag'
%span.text= current_content_locale

View File

@ -4,10 +4,11 @@
- if current_site.locales.size > 1
.action
= link_to '#', :id => 'content-locale-picker-link', :class => 'button' do
%span.hand
&nbsp;
= image_tag "locomotive/icons/flags/#{current_content_locale}.png", :class => 'flag'
%span.text= current_content_locale
= render 'locomotive/shared/locale_picker_link'
/ = link_to '#', :id => 'content-locale-picker-link', :class => 'button' do
/ %span.hand
/ &nbsp;
/
/ = image_tag "locomotive/icons/flags/#{current_content_locale}.png", :class => 'flag'
/
/ %span.text= current_content_locale

View File

@ -306,8 +306,13 @@ en:
public:
pages:
show_toolbar:
save_modifications: "Save modifications: "
statuses:
loading: "Loading...."
disabled: "Inline Editor disabled"
labels:
save_changes: "Save changes: "
editing_mode: "Editing mode: "
lang: "Lang: "
buttons:
back: Return to back-office
confirm: Confirm

View File

@ -75,14 +75,15 @@ x edit my site
x rack
x iframe
(- remove inline-editor tag)
- save editable elements
- notification (growl)
x save editable elements
x notification (growl)
x change page
- i18n
- change page
- aloha:
x remove sidebar
- i18n
- insert image
- remove sidebar
- bugs:

View File

@ -1,3 +1,5 @@
require 'locomotive/action_controller/helpers'
require 'locomotive/action_controller/locale_helpers'
require 'locomotive/action_controller/section_helpers'
require 'locomotive/action_controller/url_helpers'
require 'locomotive/action_controller/responder'
require 'locomotive/action_controller/public_responder'

View File

@ -1,89 +0,0 @@
module Locomotive
module ActionController
module Helpers
extend ActiveSupport::Concern
included do
helper_method :current_site_public_url, :switch_to_site_url, :public_page_url, :current_content_locale
end
module InstanceMethods
# ___ locales ___
def current_content_locale
::Mongoid::Fields::I18n.locale
end
def set_current_content_locale
if params[:content_locale].present?
session[:content_locale] = params[:content_locale]
end
unless current_site.locales.include?(session[:content_locale])
session[:content_locale] = current_site.default_locale
end
::Mongoid::Fields::I18n.locale = session[:content_locale]
(current_site.locales || []).each do |locale|
::Mongoid::Fields::I18n.fallbacks_for(locale, current_site.locale_fallbacks(locale))
end
logger.debug "*** content locale = #{session[:content_locale]} / #{::Mongoid::Fields::I18n.locale}"
end
def set_back_office_locale
::I18n.locale = current_locomotive_account.locale rescue Locomotive.config.default_locale
end
def sections(key = nil)
if !key.nil? && key.to_sym == :sub
@locomotive_sections[:sub] || self.controller_name.dasherize
else
@locomotive_sections[:main]
end
end
# ___ site/page urls builder ___
def current_site_public_url
request.protocol + request.host_with_port
end
def switch_to_site_url(site, options = {})
options = { :fullpath => true, :protocol => true }.merge(options)
url = "#{site.subdomain}.#{Locomotive.config.domain}"
url += ":#{request.port}" if request.port != 80
url = File.join(url, request.fullpath) if options[:fullpath]
url = "http://#{url}" if options[:protocol]
url
end
def public_page_url(page, options = {})
if content = options.delete(:content)
File.join(current_site_public_url, page.fullpath.gsub('content_type_template', ''), content._slug)
else
File.join(current_site_public_url, page.fullpath)
end
end
end
module ClassMethods
def sections(main, sub = nil)
before_filter do |c|
sub = sub.call(c) if sub.respond_to?(:call)
sections = { :main => main, :sub => sub }
c.instance_variable_set(:@locomotive_sections, sections)
end
end
end
end
end
end

View File

@ -0,0 +1,42 @@
module Locomotive
module ActionController
module LocaleHelpers
extend ActiveSupport::Concern
included do
helper_method :current_content_locale
end
module InstanceMethods
def current_content_locale
::Mongoid::Fields::I18n.locale
end
def set_current_content_locale
if params[:content_locale].present?
session[:content_locale] = params[:content_locale]
end
unless current_site.locales.include?(session[:content_locale])
session[:content_locale] = current_site.default_locale
end
::Mongoid::Fields::I18n.locale = session[:content_locale]
(current_site.locales || []).each do |locale|
::Mongoid::Fields::I18n.fallbacks_for(locale, current_site.locale_fallbacks(locale))
end
logger.debug "*** content locale = #{session[:content_locale]} / #{::Mongoid::Fields::I18n.locale}"
end
def set_back_office_locale
::I18n.locale = current_locomotive_account.locale rescue Locomotive.config.default_locale
end
end
end
end
end

View File

@ -0,0 +1,33 @@
module Locomotive
module ActionController
module SectionHelpers
extend ActiveSupport::Concern
module InstanceMethods
def sections(key = nil)
if !key.nil? && key.to_sym == :sub
@locomotive_sections[:sub] || self.controller_name.dasherize
else
@locomotive_sections[:main]
end
end
end
module ClassMethods
def sections(main, sub = nil)
before_filter do |c|
sub = sub.call(c) if sub.respond_to?(:call)
sections = { :main => main, :sub => sub }
c.instance_variable_set(:@locomotive_sections, sections)
end
end
end
end
end
end

View File

@ -0,0 +1,40 @@
module Locomotive
module ActionController
module UrlHelpers
extend ActiveSupport::Concern
included do
helper_method :current_site_public_url, :switch_to_site_url, :public_page_url
end
module InstanceMethods
def current_site_public_url
request.protocol + request.host_with_port
end
def switch_to_site_url(site, options = {})
options = { :fullpath => true, :protocol => true }.merge(options)
url = "#{site.subdomain}.#{Locomotive.config.domain}"
url += ":#{request.port}" if request.port != 80
url = File.join(url, request.fullpath) if options[:fullpath]
url = "http://#{url}" if options[:protocol]
url
end
def public_page_url(page, options = {})
if content = options.delete(:content)
File.join(current_site_public_url, page.fullpath.gsub('content_type_template', ''), content._slug)
else
File.join(current_site_public_url, page.fullpath)
end
end
end
end
end
end

View File

@ -6,53 +6,20 @@ module Liquid
def render(context)
if context.registers[:current_locomotive_account] && context.registers[:inline_editor]
%{
<meta content="true" name="inline-editor" />
<link href="/assets/locomotive/aloha/css/aloha.css" media="screen" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/assets/locomotive/utils/aloha_settings.js"></script>
<script type="text/javascript" src="/assets/locomotive/aloha/lib/aloha.js" data-aloha-plugins="common/format,common/highlighteditables,common/list,common/link,common/undo,common/paste"></script>
<script type="text/javascript">
Aloha.ready(function() \{
window.parent.application_view.set_page(#{context.registers[:page].to_presenter.as_json_for_html_view.to_json});
\});
</script>
}
else
''
end
# if context.registers[:current_locomotive_account]
# output = %{
# <meta name="locale" content="#{context.registers[:current_locomotive_account].locale}" />
# <meta name="page-fullpath" content="/#{context.registers[:page].fullpath}" />
# <meta name="edit-page-url" content="#{context.registers[:controller].send(:edit_page_url, context.registers[:page])}" />
# }
#
# if context.registers[:inline_editor]
# controller = context.registers[:controller]
#
# output << %{
# <meta name="page-url" content="#{context.registers[:controller].send(:page_url, context.registers[:page], :json)}" />
# <meta name="page-elements-count" content="#{context.registers[:page].editable_elements.size}" />
#
# <script type="text/javascript" src="/javascripts/admin/aloha/aloha.js"></script>
# <script type="text/javascript" src="/javascripts/admin/aloha/plugins/com.gentics.aloha.plugins.Format/plugin.js"></script>
# <script type="text/javascript" src="/javascripts/admin/aloha/plugins/com.gentics.aloha.plugins.Table/plugin.js"></script>
# <script type="text/javascript" src="/javascripts/admin/aloha/plugins/com.gentics.aloha.plugins.List/plugin.js"></script>
# <script type="text/javascript" src="/javascripts/admin/aloha/plugins/com.gentics.aloha.plugins.Link/plugin.js"></script>
# <script type="text/javascript" src="/javascripts/admin/aloha/plugins/com.gentics.aloha.plugins.HighlightEditables/plugin.js"></script>
# }
#
# if controller.send(:protect_against_forgery?)
# output << %(<meta name="csrf-param" content="#{Rack::Utils.escape_html(controller.send(:request_forgery_protection_token))}"/>\n<meta name="csrf-token" content="#{Rack::Utils.escape_html(controller.send(:form_authenticity_token))}"/>).html_safe
# end
# else
# output << %{
# <script src="/javascripts/admin/jquery.js" type="text/javascript"></script>
# <script src="/javascripts/admin/plugins/cookie.js" type="text/javascript"></script>
# }
# end
#
# output << %{
# <script src="/javascripts/admin/rails.js" type="text/javascript"></script>
# <script type="text/javascript" src="/javascripts/admin/inline_editor_toolbar.js"></script>
# <script type="text/javascript" src="/javascripts/admin/inline_editor.js"></script>
# <link href="/stylesheets/admin/inline_editor.css" media="screen" rel="stylesheet" type="text/css" />
# }
# end
end
end

View File

@ -30,10 +30,10 @@
settings = $.extend({
on_label : 'Yes',
on_label_color : '#cccccc',
on_label_color : '#333333',
on_bg_color : '#8FE38D',
off_label : 'No',
off_label_color : '#333333',
off_label_color : '#cccccc',
off_bg_color: '#F8837C',
skin_dir : "skin/",
bypass_skin : false,