port publisher and bookmarklet to bootstrap
This commit is contained in:
Steffen van Bergerem
parent
7fbf508165
commit
0cc3b10b1f
25 changed files with 1356 additions and 482 deletions
|
|
@ -12,6 +12,7 @@
|
|||
* Update forgot_password and reset_password pages [#4707](https://github.com/diaspora/diaspora/pull/4707)
|
||||
* Change jQuery CDN to jquery.com from googleapis.com [#4765](https://github.com/diaspora/diaspora/pull/4765)
|
||||
* Update to jQuery 10
|
||||
* Port publisher and bookmarklet to Bootstrap [#4678](https://github.com/diaspora/diaspora/pull/4678)
|
||||
|
||||
## Bug fixes
|
||||
* Improve time agos by updating the plugin [#4280](https://github.com/diaspora/diaspora/issues/4280)
|
||||
|
|
|
|||
50
app/assets/javascripts/app/views/aspects_dropdown_view.js
Normal file
50
app/assets/javascripts/app/views/aspects_dropdown_view.js
Normal file
|
|
@ -0,0 +1,50 @@
|
|||
/*
|
||||
* Aspects view for the publishers aspect dropdown and the aspect membership dropdown.
|
||||
*/
|
||||
app.views.AspectsDropdown = app.views.Base.extend({
|
||||
_toggleCheckbox: function(target) {
|
||||
this.$('.dropdown-menu > li.radio').removeClass('selected');
|
||||
target.toggleClass('selected');
|
||||
},
|
||||
|
||||
_toggleRadio: function(target) {
|
||||
this.$('.dropdown-menu > li').removeClass('selected');
|
||||
target.toggleClass('selected');
|
||||
},
|
||||
|
||||
// select aspects in the dropdown by a given list of ids
|
||||
_selectAspects: function(ids) {
|
||||
this.$('.dropdown-menu > li').each(function(){
|
||||
var el = $(this);
|
||||
if(_.contains(ids, el.data('aspect_id'))){
|
||||
el.addClass('selected');
|
||||
}
|
||||
else {
|
||||
el.removeClass('selected');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// change class and text of the dropdown button
|
||||
_updateButton: function(inAspectClass) {
|
||||
var button = this.$('.btn.dropdown-toggle'),
|
||||
selectedAspects = this.$(".dropdown-menu > li.selected").length,
|
||||
buttonText;
|
||||
|
||||
if(selectedAspects == 0){
|
||||
button.removeClass(inAspectClass).addClass('btn-default');
|
||||
buttonText = Diaspora.I18n.t("aspect_dropdown.select_aspects");
|
||||
}
|
||||
else{
|
||||
button.removeClass('btn-default').addClass(inAspectClass);
|
||||
if(selectedAspects == 1){
|
||||
buttonText = this.$(".dropdown-menu > li.selected .text").first().text();
|
||||
}
|
||||
else{
|
||||
buttonText = Diaspora.I18n.t("aspect_dropdown.toggle", { count: selectedAspects.toString() });
|
||||
}
|
||||
}
|
||||
|
||||
button.find('.text').text(buttonText);
|
||||
}
|
||||
});
|
||||
|
|
@ -16,7 +16,7 @@ app.views.Location = Backbone.View.extend({
|
|||
|
||||
locator = new OSM.Locator();
|
||||
locator.getAddress(function(address, latlng){
|
||||
$(element).html('<input id="location_address" value="' + address + '"/>');
|
||||
$(element).html('<input id="location_address" type="text" class="input-block-level" value="' + address + '"/>');
|
||||
$('#location_coords').val(latlng.latitude + "," + latlng.longitude);
|
||||
$(element).append('<a id="hide_location"><img alt="delete location" src="/assets/deletelabel.png"></a>');
|
||||
});
|
||||
|
|
|
|||
|
|
@ -0,0 +1,91 @@
|
|||
/* Copyright (c) 2010-2012, Diaspora Inc. This file is
|
||||
* licensed under the Affero General Public License version 3 or later. See
|
||||
* the COPYRIGHT file.
|
||||
*/
|
||||
|
||||
// Aspects view for the publisher.
|
||||
// Provides the ability to specify the visibility of posted content as public
|
||||
// or limited to selected aspects
|
||||
app.views.PublisherAspectSelectorBlueprint = Backbone.View.extend({
|
||||
|
||||
events: {
|
||||
"click .dropdown_list > li": "toggleAspect"
|
||||
},
|
||||
|
||||
initialize: function(opts) {
|
||||
this.form = opts.form;
|
||||
},
|
||||
|
||||
// event handler for aspect selection
|
||||
toggleAspect: function(evt) {
|
||||
var el = $(evt.target);
|
||||
var btn = el.parent('.dropdown').find('.button');
|
||||
|
||||
// visually toggle the aspect selection
|
||||
if( el.is('.radio') ) {
|
||||
AspectsDropdown.toggleRadio(el);
|
||||
} else {
|
||||
AspectsDropdown.toggleCheckbox(el);
|
||||
}
|
||||
|
||||
// update the selection summary
|
||||
this._updateAspectsNumber(el);
|
||||
|
||||
this._updateSelectedAspectIds();
|
||||
},
|
||||
|
||||
// select a (list of) aspects in the dropdown selector by the given list of ids
|
||||
updateAspectsSelector: function(ids){
|
||||
var el = this.$("ul.dropdown_list");
|
||||
this.$('.dropdown_list > li').each(function(){
|
||||
var el = $(this);
|
||||
var aspectId = el.data('aspect_id');
|
||||
if (_.contains(ids, aspectId)) {
|
||||
el.addClass('selected');
|
||||
}
|
||||
else {
|
||||
el.removeClass('selected');
|
||||
}
|
||||
});
|
||||
|
||||
this._updateAspectsNumber(el);
|
||||
this._updateSelectedAspectIds();
|
||||
},
|
||||
|
||||
// take care of the form fields that will indicate the selected aspects
|
||||
_updateSelectedAspectIds: function() {
|
||||
var self = this;
|
||||
|
||||
// remove previous selection
|
||||
this.form.find('input[name="aspect_ids[]"]').remove();
|
||||
|
||||
// create fields for current selection
|
||||
this.$('.dropdown_list li.selected').each(function() {
|
||||
var el = $(this);
|
||||
var aspectId = el.data('aspect_id');
|
||||
|
||||
self._addHiddenAspectInput(aspectId);
|
||||
|
||||
// close the dropdown when a radio item was selected
|
||||
if( el.is('.radio') ) {
|
||||
el.closest('.dropdown').removeClass('active');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
_updateAspectsNumber: function(el){
|
||||
AspectsDropdown.updateNumber(
|
||||
el.closest(".dropdown_list"),
|
||||
null,
|
||||
el.parent().find('li.selected').length,
|
||||
''
|
||||
);
|
||||
},
|
||||
|
||||
_addHiddenAspectInput: function(id) {
|
||||
var uid = _.uniqueId('aspect_ids_');
|
||||
this.form.append(
|
||||
'<input id="'+uid+'" name="aspect_ids[]" type="hidden" value="'+id+'">'
|
||||
);
|
||||
}
|
||||
});
|
||||
|
|
@ -1,15 +1,14 @@
|
|||
/* Copyright (c) 2010-2012, Diaspora Inc. This file is
|
||||
* licensed under the Affero General Public License version 3 or later. See
|
||||
* the COPYRIGHT file.
|
||||
*/
|
||||
// require ../aspects_dropdown_view
|
||||
|
||||
// Aspects view for the publisher.
|
||||
// Provides the ability to specify the visibility of posted content as public
|
||||
// or limited to selected aspects
|
||||
app.views.PublisherAspectSelector = Backbone.View.extend({
|
||||
/*
|
||||
* Aspects view for the publisher.
|
||||
* Provides the ability to specify the visibility of posted content as public
|
||||
* or limited to selected aspects
|
||||
*/
|
||||
app.views.PublisherAspectSelector = app.views.AspectsDropdown.extend({
|
||||
|
||||
events: {
|
||||
"click .dropdown_list > li": "toggleAspect"
|
||||
"click .dropdown-menu > li": "toggleAspect"
|
||||
},
|
||||
|
||||
initialize: function(opts) {
|
||||
|
|
@ -18,38 +17,27 @@ app.views.PublisherAspectSelector = Backbone.View.extend({
|
|||
|
||||
// event handler for aspect selection
|
||||
toggleAspect: function(evt) {
|
||||
var el = $(evt.target);
|
||||
var btn = el.parent('.dropdown').find('.button');
|
||||
var target = $(evt.target).closest('li');
|
||||
|
||||
// visually toggle the aspect selection
|
||||
if( el.is('.radio') ) {
|
||||
AspectsDropdown.toggleRadio(el);
|
||||
} else {
|
||||
AspectsDropdown.toggleCheckbox(el);
|
||||
if( target.is('.radio') ) {
|
||||
this._toggleRadio(target);
|
||||
}
|
||||
else if( target.is('.aspect_selector') ) {
|
||||
// don't close the dropdown
|
||||
evt.stopPropagation();
|
||||
this._toggleCheckbox(target);
|
||||
}
|
||||
|
||||
// update the selection summary
|
||||
this._updateAspectsNumber(el);
|
||||
|
||||
this._updateSelectedAspectIds();
|
||||
this._updateButton('btn-default');
|
||||
},
|
||||
|
||||
// select a (list of) aspects in the dropdown selector by the given list of ids
|
||||
updateAspectsSelector: function(ids){
|
||||
var el = this.$("ul.dropdown_list");
|
||||
this.$('.dropdown_list > li').each(function(){
|
||||
var el = $(this);
|
||||
var aspectId = el.data('aspect_id');
|
||||
if (_.contains(ids, aspectId)) {
|
||||
el.addClass('selected');
|
||||
}
|
||||
else {
|
||||
el.removeClass('selected');
|
||||
}
|
||||
});
|
||||
|
||||
this._updateAspectsNumber(el);
|
||||
this._selectAspects(ids);
|
||||
this._updateSelectedAspectIds();
|
||||
this._updateButton('btn-default');
|
||||
},
|
||||
|
||||
// take care of the form fields that will indicate the selected aspects
|
||||
|
|
@ -60,32 +48,12 @@ app.views.PublisherAspectSelector = Backbone.View.extend({
|
|||
this.form.find('input[name="aspect_ids[]"]').remove();
|
||||
|
||||
// create fields for current selection
|
||||
this.$('.dropdown_list li.selected').each(function() {
|
||||
var el = $(this);
|
||||
var aspectId = el.data('aspect_id');
|
||||
|
||||
self._addHiddenAspectInput(aspectId);
|
||||
|
||||
// close the dropdown when a radio item was selected
|
||||
if( el.is('.radio') ) {
|
||||
el.closest('.dropdown').removeClass('active');
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
_updateAspectsNumber: function(el){
|
||||
AspectsDropdown.updateNumber(
|
||||
el.closest(".dropdown_list"),
|
||||
null,
|
||||
el.parent().find('li.selected').length,
|
||||
''
|
||||
);
|
||||
},
|
||||
|
||||
_addHiddenAspectInput: function(id) {
|
||||
this.$('li.selected').each(function() {
|
||||
var uid = _.uniqueId('aspect_ids_');
|
||||
this.form.append(
|
||||
var id = $(this).data('aspect_id');
|
||||
self.form.append(
|
||||
'<input id="'+uid+'" name="aspect_ids[]" type="hidden" value="'+id+'">'
|
||||
);
|
||||
});
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -23,7 +23,7 @@ app.views.PublisherServices = Backbone.View.extend({
|
|||
|
||||
// visually toggle the icon and handle all other actions for cross-posting
|
||||
toggleService: function(evt) {
|
||||
var el = $(evt.target);
|
||||
var el = $(evt.target).closest('.service_icon');
|
||||
var provider = el.attr('id');
|
||||
|
||||
el.toggleClass("dim");
|
||||
|
|
|
|||
|
|
@ -41,6 +41,9 @@ app.views.PublisherUploader = Backbone.View.extend({
|
|||
progressHandler: function(id, fileName, loaded, total) {
|
||||
var progress = Math.round(loaded / total * 100);
|
||||
this.el_info.text(fileName + ' ' + progress + '%').fadeTo(200, 1);
|
||||
this.publisher.el_photozone
|
||||
.find('li.loading').first().find('.bar')
|
||||
.width(progress + '%');
|
||||
},
|
||||
|
||||
submitHandler: function(id, fileName) {
|
||||
|
|
@ -56,7 +59,8 @@ app.views.PublisherUploader = Backbone.View.extend({
|
|||
publisher.el_wrapper.addClass('with_attachments');
|
||||
publisher.el_photozone.append(
|
||||
'<li class="publisher_photo loading" style="position:relative;">' +
|
||||
' <img src="'+Handlebars.helpers.imageUrl('ajax-loader2.gif')+'" alt="" />'+
|
||||
' <div class="progress progress-striped active"><div class="bar"></div></div>' +
|
||||
' <img src="'+Handlebars.helpers.imageUrl('ajax-loader2.gif')+'" class="ajax-loader" alt="" />'+
|
||||
'</li>'
|
||||
);
|
||||
},
|
||||
|
|
@ -74,6 +78,11 @@ app.views.PublisherUploader = Backbone.View.extend({
|
|||
this._cancelPhotoUpload();
|
||||
this.trigger('change');
|
||||
this.el_info.text(Diaspora.I18n.t('photo_uploader.error', {file: fileName}));
|
||||
this.publisher.el_wrapper.find('#photodropzone_container').first().after(
|
||||
'<div id="upload_error">' +
|
||||
Diaspora.I18n.t('photo_uploader.error', {file: fileName}) +
|
||||
'</div>'
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -91,11 +100,13 @@ app.views.PublisherUploader = Backbone.View.extend({
|
|||
var placeholder = publisher.el_photozone.find('li.loading').first();
|
||||
placeholder
|
||||
.removeClass('loading')
|
||||
.append(
|
||||
'<div class="x">X</div>'+
|
||||
.prepend(
|
||||
'<div class="x"></div>'+
|
||||
'<div class="circle"></div>'
|
||||
)
|
||||
.find('img').attr({'src': url, 'data-id': id});
|
||||
.find('img').attr({'src': url, 'data-id': id}).removeClass('ajax-loader');
|
||||
placeholder
|
||||
.find('div.progress').remove();
|
||||
|
||||
// no more placeholders? enable buttons
|
||||
if( publisher.el_photozone.find('li.loading').length == 0 ) {
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@
|
|||
|
||||
//= require ./publisher/services_view
|
||||
//= require ./publisher/aspect_selector_view
|
||||
//= require ./publisher/aspect_selector_blueprint_view
|
||||
//= require ./publisher/getting_started_view
|
||||
//= require ./publisher/uploader_view
|
||||
//= require jquery.textchange
|
||||
|
|
@ -81,6 +82,11 @@ app.views.Publisher = Backbone.View.extend({
|
|||
});
|
||||
|
||||
this.view_aspect_selector = new app.views.PublisherAspectSelector({
|
||||
el: this.$('.public_toggle .aspect_dropdown'),
|
||||
form: form
|
||||
});
|
||||
|
||||
this.view_aspect_selector_blueprint = new app.views.PublisherAspectSelectorBlueprint({
|
||||
el: this.$('.public_toggle > .dropdown'),
|
||||
form: form
|
||||
});
|
||||
|
|
@ -102,6 +108,7 @@ app.views.Publisher = Backbone.View.extend({
|
|||
// set the selected aspects in the dropdown by their ids
|
||||
setSelectedAspects: function(ids) {
|
||||
this.view_aspect_selector.updateAspectsSelector(ids);
|
||||
this.view_aspect_selector_blueprint.updateAspectsSelector(ids);
|
||||
},
|
||||
|
||||
// show the "getting started" popups around the publisher
|
||||
|
|
@ -148,7 +155,8 @@ app.views.Publisher = Backbone.View.extend({
|
|||
// creates the location
|
||||
showLocation: function(){
|
||||
if($('#location').length == 0){
|
||||
$('#publisher_textarea_wrapper').after('<div id="location"></div>');
|
||||
$('#location_container').append('<div id="location"></div>');
|
||||
this.el_wrapper.addClass('with_location');
|
||||
this.view_locator = new app.views.Location();
|
||||
}
|
||||
},
|
||||
|
|
@ -157,6 +165,7 @@ app.views.Publisher = Backbone.View.extend({
|
|||
destroyLocation: function(){
|
||||
if(this.view_locator){
|
||||
this.view_locator.remove();
|
||||
this.el_wrapper.removeClass('with_location');
|
||||
delete this.view_locator;
|
||||
}
|
||||
},
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
@import 'opengraph'
|
||||
@import 'help'
|
||||
@import 'profile'
|
||||
@import 'publisher'
|
||||
@import 'publisher_blueprint'
|
||||
@import 'facebox'
|
||||
@import 'aspects'
|
||||
@import 'popover'
|
||||
|
|
|
|||
|
|
@ -1,3 +1,27 @@
|
|||
.aspect_dropdown {
|
||||
|
||||
li {
|
||||
.status_indicator {
|
||||
width: 19px;
|
||||
height: 14px;
|
||||
display: inline-block;
|
||||
}
|
||||
.icon-ok, .icon-refresh {
|
||||
padding-right: 5px;
|
||||
display: none;
|
||||
}
|
||||
&.selected {
|
||||
.icon-ok { display: inline-block;}
|
||||
.icon-refresh { display: none;}
|
||||
}
|
||||
&.loading {
|
||||
.icon-refresh { display: inline-block;}
|
||||
.icon-ok { display: none;}
|
||||
}
|
||||
a { cursor: pointer; }
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* -- Used in contacts/index.html.haml -- */
|
||||
#aspect_controls {
|
||||
|
|
|
|||
1
app/assets/stylesheets/bookmarklet.css.scss
Normal file
1
app/assets/stylesheets/bookmarklet.css.scss
Normal file
|
|
@ -0,0 +1 @@
|
|||
#bookmarklet { padding:10px 10px 30px 10px; margin-top: 0; }
|
||||
12
app/assets/stylesheets/buttons.css.scss
Normal file
12
app/assets/stylesheets/buttons.css.scss
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
.btn.creation {
|
||||
$button-border-color: #aaa;
|
||||
@include button-gradient($creation-blue);
|
||||
color: #fff;
|
||||
border: 1px solid darken($button-border-color,20%);
|
||||
|
||||
&:hover {
|
||||
@include button-gradient-hover($creation-blue);
|
||||
background: $creation-blue;
|
||||
border: 1px solid darken($button-border-color,35%);
|
||||
}
|
||||
}
|
||||
|
|
@ -3,30 +3,6 @@
|
|||
font-style: normal;
|
||||
color: black;
|
||||
|
||||
&.heart:before {
|
||||
content: '\2665';
|
||||
}
|
||||
|
||||
&.heart-empty:before {
|
||||
content: '\2661';
|
||||
}
|
||||
|
||||
&.retweet:before {
|
||||
content: '\e717';
|
||||
}
|
||||
|
||||
&.comment:before {
|
||||
content: '\e718';
|
||||
}
|
||||
|
||||
&.globe:before {
|
||||
content: '\1f30e';
|
||||
}
|
||||
|
||||
&.lock:before {
|
||||
content: '\1f512';
|
||||
}
|
||||
|
||||
&.red {
|
||||
color: #A40802;
|
||||
}
|
||||
|
|
@ -51,4 +27,296 @@
|
|||
&.small {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
/* main icon map */
|
||||
&.add-to-list:before { content: '\e003'; } /* e003 */
|
||||
&.add-user:before { content: '\e700'; } /* e700 */
|
||||
&.address:before { content: '\e723'; } /* e723 */
|
||||
&.adjust:before { content: '\25d1'; } /* 25d1 */
|
||||
&.air:before { content: '\e753'; } /* e753 */
|
||||
&.airplane:before { content: '\2708'; } /* 2708 */
|
||||
&.archive:before { content: '\e738'; } /* e738 */
|
||||
&.area-graph:before { content: '\1f53e'; } /* 1f53e */
|
||||
&.arrow-combo:before { content: '\e74f'; } /* e74f */
|
||||
&.attach:before { content: '\1f4ce'; } /* 1f4ce */
|
||||
&.back-in-time:before { content: '\e771'; } /* e771 */
|
||||
&.back:before { content: '\1f519'; } /* 1f519 */
|
||||
&.bag:before { content: '\1f45c'; } /* 1f45c */
|
||||
&.bar-graph:before { content: '\1f4ca '; } /* 1f4ca */
|
||||
&.battery:before { content: '\1f50b'; } /* 1f50b */
|
||||
&.beamed-note:before { content: '\266b'; } /* 266b */
|
||||
&.bell:before { content: '\1f514'; } /* 1f514 */
|
||||
&.block:before { content: '\1f6ab'; } /* 1f6ab */
|
||||
&.book:before { content: '\1f4d5 '; } /* 1f4d5 */
|
||||
&.bookmark:before { content: '\1f516'; } /* 1f516 */
|
||||
&.bookmarks:before { content: '\1f4d1'; } /* 1f4d1 */
|
||||
&.box:before { content: '\1f4e6'; } /* 1f4e6 */
|
||||
&.briefcase:before { content: '\1f4bc'; } /* 1f4bc */
|
||||
&.browser:before { content: '\e74e'; } /* e74e */
|
||||
&.brush:before { content: '\e79a'; } /* e79a */
|
||||
&.bucket:before { content: '\e756'; } /* e756 */
|
||||
&.calendar:before { content: '\1f4c5'; } /* 1f4c5 */
|
||||
&.camera:before { content: '\1f4f7'; } /* 1f4f7 */
|
||||
&.cart:before { content: '\e73d'; } /* e73d */
|
||||
&.cc-by:before { content: '\e7a6'; } /* e7a6 */
|
||||
&.cc-nc-eu:before { content: '\e7a8'; } /* e7a8 */
|
||||
&.cc-nc-jp:before { content: '\e7a9'; } /* e7a9 */
|
||||
&.cc-nc:before { content: '\e7a7'; } /* e7a7 */
|
||||
&.cc-nd:before { content: '\e7ab'; } /* e7ab */
|
||||
&.cc-pd:before { content: '\e7ac'; } /* e7ac */
|
||||
&.cc-remix:before { content: '\e7af'; } /* e7af */
|
||||
&.cc-sa:before { content: '\e7aa'; } /* e7aa */
|
||||
&.cc-share:before { content: '\e7ae'; } /* e7ae */
|
||||
&.cc-zero:before { content: '\e7ad'; } /* e7ad */
|
||||
&.cc:before { content: '\e7a5'; } /* e7a5 */
|
||||
&.ccw:before { content: '\27f2'; } /* 27f2 */
|
||||
&.cd:before { content: '\1f4bf'; } /* 1f4bf */
|
||||
&.chat:before { content: '\e720'; } /* e720 */
|
||||
&.check:before { content: '\2713'; } /* 2713 */
|
||||
&.chevron-down:before { content: '\e75c'; } /* e75c */
|
||||
&.chevron-left:before { content: '\e75d'; } /* e75d */
|
||||
&.chevron-right:before { content: '\e75e'; } /* e75e */
|
||||
&.chevron-small-down:before { content: '\e760'; } /* e760 */
|
||||
&.chevron-small-left:before { content: '\e761'; } /* e761 */
|
||||
&.chevron-small-right:before { content: '\e762'; } /* e762 */
|
||||
&.chevron-small-up:before { content: '\e763'; } /* e763 */
|
||||
&.chevron-thin-down:before { content: '\e764'; } /* e764 */
|
||||
&.chevron-thin-left:before { content: '\e765'; } /* e765 */
|
||||
&.chevron-thin-right:before { content: '\e766'; } /* e766 */
|
||||
&.chevron-thin-up:before { content: '\e767'; } /* e767 */
|
||||
&.chevron-up:before { content: '\e75f'; } /* e75f */
|
||||
&.circled-cross:before { content: '\2716'; } /* 2716 */
|
||||
&.circled-down:before { content: '\e758'; } /* e758 */
|
||||
&.circled-help:before { content: '\e704'; } /* e704 */
|
||||
&.circled-info:before { content: '\e705'; } /* e705 */
|
||||
&.circled-left:before { content: '\e759'; } /* e759 */
|
||||
&.circled-minus:before { content: '\2796'; } /* 2796 */
|
||||
&.circled-plus:before { content: '\2795'; } /* 2795 */
|
||||
&.circled-right:before { content: '\e75a'; } /* e75a */
|
||||
&.circled-up:before { content: '\e75b'; } /* e75b */
|
||||
&.clipboard:before { content: '\1f4cb'; } /* 1f4cb */
|
||||
&.clock:before { content: '\1f554'; } /* 1f554 */
|
||||
&.cloud:before { content: '\2601'; } /* 2601 */
|
||||
&.code:before { content: '\e714'; } /* e714 */
|
||||
&.cog:before { content: '\2699'; } /* 2699 */
|
||||
&.comment:before { content: '\e718'; } /* e718 */
|
||||
&.compass:before { content: '\e728'; } /* e728 */
|
||||
&.credit-card:before { content: '\1f4b3'; } /* 1f4b3 */
|
||||
&.cross-hair:before { content: '\1f3af'; } /* 1f3af */
|
||||
&.cross:before { content: '\2715'; } /* 2715 */
|
||||
&.cup:before { content: '\2615'; } /* 2615 */
|
||||
&.cw:before { content: '\27f3'; } /* 27f3 */
|
||||
&.cycle:before { content: '\1f504'; } /* 1f504 */
|
||||
&.database:before { content: '\e754'; } /* e754 */
|
||||
&.db-logo:before { content: '\f603'; } /* f603 */
|
||||
&.db-shape:before { content: '\f600'; } /* f600 */
|
||||
&.direction:before { content: '\27a2'; } /* 27a2 */
|
||||
&.doc:before { content: '\e730'; } /* e730 */
|
||||
&.docs:before { content: '\e736'; } /* e736 */
|
||||
&.dot:before { content: '\e78b'; } /* e78b */
|
||||
&.down-1:before { content: '\2b07'; } /* 2b07 */
|
||||
&.down-bold:before { content: '\e4b0'; } /* e4b0 */
|
||||
&.down-thin:before { content: '\2193'; } /* 2193 */
|
||||
&.down:before { content: '\261f'; } /* 261f */
|
||||
&.download:before { content: '\1f4e5'; } /* 1f4e5 */
|
||||
&.drive:before { content: '\e755'; } /* e755 */
|
||||
&.droplet:before { content: '\1f4a7'; } /* 1f4a7 */
|
||||
&.erase:before { content: '\232b'; } /* 232b */
|
||||
&.export:before { content: '\e715'; } /* e715 */
|
||||
&.eye:before { content: '\e70a'; } /* e70a */
|
||||
&.fb:before { content: '\23ea'; } /* 23ea */
|
||||
&.feather:before { content: '\2712'; } /* 2712 */
|
||||
&.ff:before { content: '\23e9'; } /* 23e9 */
|
||||
&.flag:before { content: '\2691'; } /* 2691 */
|
||||
&.flash:before { content: '\26a1'; } /* 26a1 */
|
||||
&.flashlight:before { content: '\1f526'; } /* 1f526 */
|
||||
&.flow-branch:before { content: '\e791'; } /* e791 */
|
||||
&.flow-cascade:before { content: '\e790'; } /* e790 */
|
||||
&.flow-line:before { content: '\e793'; } /* e793 */
|
||||
&.flow-parallel:before { content: '\e794'; } /* e794 */
|
||||
&.flow-tree:before { content: '\e792'; } /* e792 */
|
||||
&.folder:before { content: '\1f4c1 '; } /* 1f4c1 */
|
||||
&.forward:before { content: '\27a6'; } /* 27a6 */
|
||||
&.gauge:before { content: '\e7a2'; } /* e7a2 */
|
||||
&.globe:before { content: '\1f30e'; } /* 1f30e */
|
||||
&.graduation-cap:before { content: '\1f393 '; } /* 1f393 */
|
||||
&.heart-empty:before { content: '\2661'; } /* 2661 */
|
||||
&.heart:before { content: '\2665'; } /* 2665 */
|
||||
&.help:before { content: '\2753'; } /* 2753 */
|
||||
&.home:before { content: '\2302'; } /* 2302 */
|
||||
&.hourglass:before { content: '\23f3'; } /* 23f3 */
|
||||
&.inbox:before { content: '\e777'; } /* e777 */
|
||||
&.infinity:before { content: '\221e'; } /* 221e */
|
||||
&.info:before { content: '\2139'; } /* 2139 */
|
||||
&.install:before { content: '\e778'; } /* e778 */
|
||||
&.key:before { content: '\1f511'; } /* 1f511 */
|
||||
&.keyboard:before { content: '\2328'; } /* 2328 */
|
||||
&.landscape-doc:before { content: '\e737'; } /* e737 */
|
||||
&.language:before { content: '\e752'; } /* e752 */
|
||||
&.layout:before { content: '\268f'; } /* 268f */
|
||||
&.leaf:before { content: '\1f342 '; } /* 1f342 */
|
||||
&.left-1:before { content: '\2b05'; } /* 2b05 */
|
||||
&.left-bold:before { content: '\e4ad'; } /* e4ad */
|
||||
&.left-thin:before { content: '\2190'; } /* 2190 */
|
||||
&.left:before { content: '\261c'; } /* 261c */
|
||||
&.level-down:before { content: '\21b3'; } /* 21b3 */
|
||||
&.level-up:before { content: '\21b0'; } /* 21b0 */
|
||||
&.lifebuoy:before { content: '\e788'; } /* e788 */
|
||||
&.light-bulb:before { content: '\1f4a1'; } /* 1f4a1 */
|
||||
&.light-down:before { content: '\1f505'; } /* 1f505' */
|
||||
&.light-up:before { content: '\1f506'; } /* 1f506 */
|
||||
&.line-graph:before { content: '\1f4c8'; } /* 1f4c8 */
|
||||
&.link:before { content: '\1f517'; } /* 1f517 */
|
||||
&.list:before { content: '\2630'; } /* 2630 */
|
||||
&.location:before { content: '\e724'; } /* e724 */
|
||||
&.lock-open:before { content: '\1f513'; } /* 1f513 */
|
||||
&.lock:before { content: '\1f512'; } /* 1f512 */
|
||||
&.login:before { content: '\e740'; } /* e740 */
|
||||
&.logout:before { content: '\e741'; } /* e741 */
|
||||
&.loop:before { content: '\1f501'; } /* 1f501 */
|
||||
&.magnet:before { content: '\e7a1'; } /* e7a1 */
|
||||
&.mail:before { content: '\2709'; } /* 2709 */
|
||||
&.map:before { content: '\e727'; } /* e727 */
|
||||
&.megaphone:before { content: '\1f4e3'; } /* 1f4e3 */
|
||||
&.mic:before { content: '\1f3a4'; } /* 1f3a4 */
|
||||
&.minus:before { content: '\2d'; } /* 2d */
|
||||
&.mobile:before { content: '\1f4f1'; } /* 1f4f1 */
|
||||
&.monitor:before { content: '\1f4bb'; } /* 1f4bb */
|
||||
&.moon:before { content: '\263d'; } /* 263d */
|
||||
&.mouse:before { content: '\e789'; } /* e789 */
|
||||
&.music:before { content: '\1f3b5'; } /* 1f3b5 */
|
||||
&.mute:before { content: '\1f507'; } /* 1f507 */
|
||||
&.network:before { content: '\e776'; } /* e776 */
|
||||
&.new:before { content: '\1f4a5'; } /* 1f4a5 */
|
||||
&.newspaper:before { content: '\1f4f0'; } /* 1f4f0 */
|
||||
&.note:before { content: '\266a'; } /* 266a */
|
||||
&.numbered-list:before { content: '\e005'; } /* e005 */
|
||||
&.open-book:before { content: '\1f4d6'; } /* 1f4d6 */
|
||||
&.palette:before { content: '\1f3a8'; } /* 1f3a8 */
|
||||
&.paper-plane:before { content: '\e79b'; } /* e79b */
|
||||
&.paus:before { content: '\2389'; } /* 2389 */
|
||||
&.pencil:before { content: '\270e'; } /* 270e */
|
||||
&.phone:before { content: '\1f4de'; } /* 1f4de */
|
||||
&.picture:before { content: '\1f304'; } /* 1f304 */
|
||||
&.pie-chart:before { content: '\e751'; } /* e751 */
|
||||
&.play:before { content: '\25b6'; } /* 25b6 */
|
||||
&.plus:before { content: '\2b'; } /* 2b */
|
||||
&.popup:before { content: '\e74c'; } /* e74c */
|
||||
&.print:before { content: '\e716'; } /* e716 */
|
||||
&.progress-0:before { content: '\e768'; } /* e768 */
|
||||
&.progress-1:before { content: '\e769'; } /* e769 */
|
||||
&.progress-2:before { content: '\e76a'; } /* e76a */
|
||||
&.progress-3:before { content: '\e76b'; } /* e76b */
|
||||
&.publish:before { content: '\e74d'; } /* e74d */
|
||||
&.quote:before { content: '\275e'; } /* 275e */
|
||||
&.record:before { content: '\26ab'; } /* 26ab */
|
||||
&.reply-all:before { content: '\e713'; } /* e713 */
|
||||
&.reply:before { content: '\e712'; } /* e712 */
|
||||
&.resize-full:before { content: '\e744'; } /* e744 */
|
||||
&.resize-small:before { content: '\e746'; } /* e746 */
|
||||
&.retweet:before { content: '\e717'; } /* e717 */
|
||||
&.right-1:before { content: '\27a1'; } /* 27a1 */
|
||||
&.right-bold:before { content: '\e4ae'; } /* e4ae */
|
||||
&.right-thin:before { content: '\2192'; } /* 2192 */
|
||||
&.right:before { content: '\261e'; } /* 261e */
|
||||
&.rocket:before { content: '\1f680'; } /* 1f680 */
|
||||
&.rss:before { content: '\e73a'; } /* e73a */
|
||||
&.save:before { content: '\1f4be'; } /* 1f4be */
|
||||
&.search:before { content: '\1f50d'; } /* 1f50d */
|
||||
&.share:before { content: '\e73c'; } /* e73c */
|
||||
&.shareable:before { content: '\e73e'; } /* e73e */
|
||||
&.shuffle:before { content: '\1f500'; } /* 1f500 */
|
||||
&.signal:before { content: '\1f4f6'; } /* 1f4f6 */
|
||||
&.sound:before { content: '\1f50a'; } /* 1f50a */
|
||||
&.squared-cross:before { content: '\274e'; } /* 274e */
|
||||
&.squared-minus:before { content: '\229f'; } /* 229f */
|
||||
&.squared-plus:before { content: '\229e'; } /* 229e */
|
||||
&.star-empty:before { content: '\2606'; } /* 2606 */
|
||||
&.star:before { content: '\2605'; } /* 2605 */
|
||||
&.stop:before { content: '\25a0'; } /* 25a0 */
|
||||
&.suitcase:before { content: '\e78e'; } /* e78e */
|
||||
&.sweden:before { content: '\f601'; } /* f601 */
|
||||
&.switch:before { content: '\21c6'; } /* 21c6 */
|
||||
&.tag:before { content: '\e70c'; } /* e70c */
|
||||
&.text-doc-inverted:before { content: '\e731'; } /* e731 */
|
||||
&.text-doc:before { content: '\1f4c4'; } /* 1f4c4 */
|
||||
&.thermometer:before { content: '\e757'; } /* e757 */
|
||||
&.three-dots:before { content: '\e78d'; } /* e78d */
|
||||
&.thumbs-down:before { content: '\1f44e'; } /* 1f44e */
|
||||
&.thumbs-up:before { content: '\1f44d'; } /* 1f44d */
|
||||
&.thunder-cloud:before { content: '\26c8'; } /* 26c8 */
|
||||
&.ticket:before { content: '\1f3ab'; } /* 1f3ab */
|
||||
&.to-end:before { content: '\23ed'; } /* 23ed */
|
||||
&.to-start:before { content: '\23ee'; } /* 23ee */
|
||||
&.tools:before { content: '\2692'; } /* 2692 */
|
||||
&.traffic-cone:before { content: '\e7a3'; } /* e7a3 */
|
||||
&.trash:before { content: '\e729'; } /* e729 */
|
||||
&.triangle-down:before { content: '\25be'; } /* 25be */
|
||||
&.triangle-left:before { content: '\25c2'; } /* 25c2 */
|
||||
&.triangle-right:before { content: '\25b8'; } /* 25b8 */
|
||||
&.triangle-up:before { content: '\25b4'; } /* 25b4 */
|
||||
&.trophy:before { content: '\1f3c6'; } /* 1f3c6 */
|
||||
&.two-dots:before { content: '\e78c'; } /* e78c */
|
||||
&.up-1:before { content: '\2b06'; } /* 2b06 */
|
||||
&.up-bold:before { content: '\e4af'; } /* e4af */
|
||||
&.up-thin:before { content: '\2191'; } /* 2191 */
|
||||
&.up:before { content: '\261d'; } /* 261d */
|
||||
&.upload-cloud:before { content: '\e711'; } /* e711 */
|
||||
&.upload:before { content: '\1f4e4'; } /* 1f4e4 */
|
||||
&.user:before { content: '\1f464'; } /* 1f464 */
|
||||
&.users:before { content: '\1f465'; } /* 1f465 */
|
||||
&.vcard:before { content: '\e722'; } /* e722 */
|
||||
&.video:before { content: '\1f3ac'; } /* 1f3ac */
|
||||
&.voicemail:before { content: '\2707'; } /* 2707 */
|
||||
&.volume:before { content: '\e742'; } /* e742 */
|
||||
&.warning:before { content: '\26a0'; } /* 26a0 */
|
||||
&.water:before { content: '\1f4a6'; } /* 1f4a6 */
|
||||
|
||||
/* social extention map */
|
||||
&.behance:before { content: '\f34e'; } /* f34e */
|
||||
&.c-dribbble:before { content: '\f31c'; } /* f31c */
|
||||
&.c-facebook:before { content: '\f30d'; } /* f30d */
|
||||
&.c-flickr:before { content: '\f304'; } /* f304 */
|
||||
&.c-google+:before { content: '\f310'; } /* f310 */
|
||||
&.c-lastfm:before { content: '\f322'; } /* f322 */
|
||||
&.c-linkedin:before { content: '\f319'; } /* f319 */
|
||||
&.c-pinterest:before { content: '\f313'; } /* f313 */
|
||||
&.c-rdio:before { content: '\f325'; } /* f325 */
|
||||
&.c-skype:before { content: '\f33a'; } /* f33a */
|
||||
&.c-spotify:before { content: '\f328'; } /* f328 */
|
||||
&.c-stumbleupon:before { content: '\f31f'; } /* f31f */
|
||||
&.c-tumblr:before { content: '\f316'; } /* f316 */
|
||||
&.c-twitter:before { content: '\f30a'; } /* f30a */
|
||||
&.c-vimeo:before { content: '\f307'; } /* f307 */
|
||||
&.dribbble:before { content: '\f31b'; } /* f31b */
|
||||
&.dropbox:before { content: '\f330'; } /* f330 */
|
||||
&.evernote:before { content: '\f333'; } /* f333 */
|
||||
&.facebook:before { content: '\f30c'; } /* f30c */
|
||||
&.flattr:before { content: '\f336'; } /* f336 */
|
||||
&.flickr:before { content: '\f303'; } /* f303 */
|
||||
&.github:before { content: '\f300'; } /* f300 */
|
||||
&.google+:before { content: '\f30f'; } /* f30f */
|
||||
&.google-circles:before { content: '\f351'; } /* f351 */
|
||||
&.instagram:before { content: '\f32d'; } /* f32d */
|
||||
&.lastfm:before { content: '\f321'; } /* f321 */
|
||||
&.linkedin:before { content: '\f318'; } /* f318 */
|
||||
&.mixi:before { content: '\f34b'; } /* f34b */
|
||||
&.paypal:before { content: '\f342'; } /* f342 */
|
||||
&.picasa:before { content: '\f345'; } /* f345 */
|
||||
&.pinterest:before { content: '\f312'; } /* f312 */
|
||||
&.qq:before { content: '\f32a'; } /* f32a */
|
||||
&.rdio:before { content: '\f324'; } /* f324 */
|
||||
&.renren:before { content: '\f33c'; } /* f33c */
|
||||
&.s-facebook:before { content: '\f30e'; } /* f30e */
|
||||
&.sina-weibo:before { content: '\f33f'; } /* f33f */
|
||||
&.skype:before { content: '\f339'; } /* f339 */
|
||||
&.smashing:before { content: '\f357'; } /* f357 */
|
||||
&.social-c-github:before { content: '\f301'; } /* f301 */
|
||||
&.soundcloud:before { content: '\f348'; } /* f348 */
|
||||
&.spotify:before { content: '\f327'; } /* f327 */
|
||||
&.stumbleupon:before { content: '\f31e'; } /* f31e */
|
||||
&.tumblr:before { content: '\f315'; } /* f315 */
|
||||
&.twitter:before { content: '\f309'; } /* f309 */
|
||||
&.vimeo:before { content: '\f306'; } /* f306 */
|
||||
&.vk:before { content: '\f354'; } /* f354 */
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@
|
|||
|
||||
@import 'new_styles/base';
|
||||
@import 'new_styles/viewer_nav';
|
||||
@import 'buttons';
|
||||
|
||||
/* font overrides */
|
||||
@import 'new_styles/typography';
|
||||
|
|
@ -30,3 +31,10 @@
|
|||
/* conversations */
|
||||
@import 'conversations';
|
||||
@import 'facebox';
|
||||
|
||||
/* publisher */
|
||||
@import 'publisher';
|
||||
@import 'aspects';
|
||||
|
||||
/* bookmarklet */
|
||||
@import 'bookmarklet';
|
||||
|
|
|
|||
|
|
@ -1,265 +1,203 @@
|
|||
#publisher {
|
||||
z-index: 1;
|
||||
color: $text-grey;
|
||||
position: relative;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
padding: 0 12px 22px 12px;
|
||||
top: 0;
|
||||
border-bottom: 1px #eee solid;
|
||||
|
||||
form {
|
||||
textarea {
|
||||
resize: none;
|
||||
height: 50px;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.mention_popup {
|
||||
padding: 1px 12px;
|
||||
margin-bottom: 0;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
&.closed {
|
||||
#button_container,
|
||||
#location_container,
|
||||
#hide_publisher,
|
||||
#photodropzone_container,
|
||||
.options_and_submit {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.counter {
|
||||
display: none;
|
||||
}
|
||||
#publisher_textarea_wrapper { border: 1px solid $border-grey !important; }
|
||||
}
|
||||
|
||||
&:not(.closed) {
|
||||
textarea {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
.mentions-autocomplete-list ul { width: 100% !important; }
|
||||
|
||||
.mentions-autocomplete-list ul {
|
||||
width: 483px;
|
||||
form {
|
||||
margin: 0;
|
||||
#fileInfo { display: none !important; }
|
||||
#hide_publisher {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.options_and_submit {
|
||||
min-height: 21px;
|
||||
clear: both;
|
||||
position: relative;
|
||||
padding-top: 6px;
|
||||
margin-bottom: -2px;
|
||||
|
||||
input {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.public_toggle {
|
||||
text-align: right;
|
||||
.dropdown {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.icons-monotone_wrench_settings {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
a.question_mark {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
#publisher_service_icons {
|
||||
position: relative;
|
||||
top: 3px;
|
||||
margin-right: 10px;
|
||||
|
||||
.social_media_logos-facebook-16x16,
|
||||
.social_media_logos-twitter-16x16,
|
||||
.social_media_logos-tumblr-16x16,
|
||||
.social_media_logos-wordpress-16x16,
|
||||
.social_media_logos-email-16x16,
|
||||
.social_media_logos-feed-16x16,
|
||||
.social_media_logos-website-16x16 {
|
||||
.btn-link { text-decoration: none; }
|
||||
.btn-link.question_mark .entypo { color: $text-grey; }
|
||||
.btn-link.question_mark:hover .entypo { color: $black; }
|
||||
.btn-link.service_icon {
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.dim { @include opacity(0.3); }
|
||||
.social_media_logos-wordpress-16x16 {
|
||||
display: inline-block;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
#fileInfo {
|
||||
display: inline;
|
||||
position: relative;
|
||||
top: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
#status_message_fake_text {
|
||||
min-height: 20px;
|
||||
#publisher_textarea_wrapper {
|
||||
background-color: white;
|
||||
border-radius: 3px;
|
||||
border: 1px solid $border-dark-grey;
|
||||
|
||||
input[type='text'] {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
margin: none;
|
||||
}
|
||||
|
||||
.content_creation {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
#file-upload {
|
||||
bottom: 1px !important;
|
||||
display: inline-block;
|
||||
textarea {
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: .3em .3em 3px;
|
||||
position: absolute !important;
|
||||
right: 6px;
|
||||
cursor: pointer;
|
||||
box-shadow: none;
|
||||
resize: none;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
&.active textarea {
|
||||
min-height: 70px;
|
||||
}
|
||||
|
||||
.help-block {
|
||||
font-size: 13px;
|
||||
line-height: 30px;
|
||||
padding-left: 10px;
|
||||
margin-bottom: 0;
|
||||
color: lighten($text-grey,20%);
|
||||
a { color: lighten($blue,20%); }
|
||||
}
|
||||
|
||||
.mentions-input-box .mentions {
|
||||
padding: 4px 6px !important;
|
||||
line-height: 20px !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
&.with_attachments .row-fluid#photodropzone_container {
|
||||
border-top: 1px dashed $border-grey;
|
||||
}
|
||||
&.with_location .row-fluid#location_container {
|
||||
height: 30px;
|
||||
#hide_location { display: none !important; }
|
||||
border-top: 1px dashed $border-grey;
|
||||
input[type='text'] {
|
||||
margin-bottom: 0;
|
||||
color: $text-grey;
|
||||
}
|
||||
}
|
||||
&.active .row-fluid#button_container {
|
||||
border-top: 1px solid $border-grey;
|
||||
}
|
||||
|
||||
#photodropzone {
|
||||
margin: 0;
|
||||
> li.publisher_photo {
|
||||
list-style: none;
|
||||
float: left;
|
||||
margin: 10px;
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
overflow: hidden;
|
||||
line-height: 100px;
|
||||
vertical-align: middle;
|
||||
|
||||
img {
|
||||
vertical-align: middle;
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.x {
|
||||
display: none;
|
||||
width: 70px;
|
||||
height: 70px;
|
||||
border-radius: 35px;
|
||||
text-align: center;
|
||||
background-color: white;
|
||||
color: black;
|
||||
font-size: 70px;
|
||||
line-height: 70px;
|
||||
font-style: bold;
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
@include opacity(0.85);
|
||||
cursor: pointer;
|
||||
top: 15px;
|
||||
left: 15px;
|
||||
|
||||
&:before {
|
||||
content: '\2716';
|
||||
font-family: 'entypo';
|
||||
}
|
||||
}
|
||||
|
||||
&:hover .x {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.progress {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
margin: 40px 0;
|
||||
}
|
||||
|
||||
.ajax-loader { display: none; }
|
||||
}
|
||||
}
|
||||
|
||||
#upload_error {
|
||||
color: white;
|
||||
font-style: bold;
|
||||
border-top: 1px solid white;
|
||||
background-color: $red;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#publisher-images {
|
||||
margin-right: 5px;
|
||||
#file-upload,
|
||||
#locator,
|
||||
#hide_location {
|
||||
text-decoration: none !important;
|
||||
font-size: 16px;
|
||||
padding: 4px 5px;
|
||||
i {
|
||||
color: $text-grey;
|
||||
}
|
||||
&:hover{
|
||||
i { color: black; }
|
||||
}
|
||||
input[type='file'] {
|
||||
cursor: pointer;
|
||||
right: initial !important;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
&::-webkit-file-upload-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
@include opacity(0.4);
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $text-dark-grey;
|
||||
cursor: pointer;
|
||||
|
||||
img {
|
||||
@include opacity(0.8);
|
||||
}
|
||||
}
|
||||
|
||||
&:active {
|
||||
color: #444;
|
||||
text-shadow: 0 1px 0 #fafafa;
|
||||
|
||||
img {
|
||||
@include opacity(1);
|
||||
}
|
||||
}
|
||||
|
||||
&.loading {
|
||||
@include opacity(0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#publisher_textarea_wrapper {
|
||||
#hide_publisher {
|
||||
@include opacity(0.3);
|
||||
z-index: 5;
|
||||
padding: 3px;
|
||||
position: absolute;
|
||||
right: 6px;
|
||||
margin-top: 9px;
|
||||
|
||||
.icons-deletelabel {
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include opacity(1);
|
||||
}
|
||||
}
|
||||
|
||||
.markdownIndications {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
}
|
||||
|
||||
@include border-radius(2px);
|
||||
|
||||
border: 1px solid #ccc;
|
||||
background: #fff;
|
||||
|
||||
&.active {
|
||||
border: 1px solid $border-dark-grey;
|
||||
}
|
||||
|
||||
position: relative;
|
||||
padding-right: 10px;
|
||||
|
||||
textarea {
|
||||
z-index: 2;
|
||||
border: none;
|
||||
|
||||
&:focus {
|
||||
outline: 0;
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
&.with_attachments {
|
||||
padding-bottom: 38px;
|
||||
}
|
||||
|
||||
#photodropzone {
|
||||
z-index: 3;
|
||||
position: absolute;
|
||||
bottom: 15px;
|
||||
right: 35px;
|
||||
width: 430px;
|
||||
left: 5px;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
margin-right: 4px;
|
||||
img {
|
||||
width: 50px;
|
||||
max-height: 55px;
|
||||
}
|
||||
.circle {
|
||||
@include border-radius(20px);
|
||||
|
||||
#hide_location {
|
||||
display: none;
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
right: -7px;
|
||||
top: -5px;
|
||||
background-color: #333;
|
||||
|
||||
width: 20px;
|
||||
max-width: 20px;
|
||||
height: 20px;
|
||||
max-height: 20px;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
|
||||
.x {
|
||||
display: none;
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
right: -1px;
|
||||
font-size: small;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
cursor: default;
|
||||
.circle {
|
||||
display: block;
|
||||
}
|
||||
.x {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.with_location #publisher-images {
|
||||
#hide_location { display: inline-block; }
|
||||
#locator { display: none; }
|
||||
}
|
||||
|
||||
.counter {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
position: absolute;
|
||||
right: 70px;
|
||||
bottom: -31px;
|
||||
font-size: 13px;
|
||||
padding: 12px 0 0 5px;
|
||||
}
|
||||
&.with_location .counter {
|
||||
bottom: -62px;
|
||||
}
|
||||
.warning {
|
||||
color: orange;
|
||||
|
|
@ -267,47 +205,13 @@
|
|||
.exceeded {
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#publisher.closed {
|
||||
#publisher_textarea_wrapper #hide_publisher,
|
||||
.markdownIndications {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#publisher_photo_upload {
|
||||
position: absolute;
|
||||
display: inline;
|
||||
left: 600px;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#publisher-images {
|
||||
padding-left: 5px;
|
||||
|
||||
#locator {
|
||||
bottom: 1px !important;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
position: absolute !important;
|
||||
right: 30px;
|
||||
cursor: pointer;
|
||||
img {
|
||||
padding-top: 2px;
|
||||
@include opacity(0.4);
|
||||
}
|
||||
&:hover {
|
||||
color: $text-dark-grey;
|
||||
cursor: pointer;
|
||||
img {
|
||||
@include opacity(0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
height: 19px;
|
||||
width: 19px;
|
||||
.aspect_dropdown {
|
||||
.radio {
|
||||
min-height: 0px;
|
||||
padding-left: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
316
app/assets/stylesheets/publisher_blueprint.css.scss
Normal file
316
app/assets/stylesheets/publisher_blueprint.css.scss
Normal file
|
|
@ -0,0 +1,316 @@
|
|||
#publisher {
|
||||
z-index: 1;
|
||||
color: $text-grey;
|
||||
position: relative;
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
padding: 0 12px 22px 12px;
|
||||
top: 0;
|
||||
border-bottom: 1px #eee solid;
|
||||
|
||||
form {
|
||||
textarea {
|
||||
resize: none;
|
||||
height: 50px;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.mention_popup {
|
||||
padding: 1px 12px;
|
||||
margin-bottom: 0;
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
&.closed {
|
||||
.options_and_submit {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.counter {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.closed) {
|
||||
textarea {
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
.mentions-autocomplete-list ul {
|
||||
width: 483px;
|
||||
}
|
||||
|
||||
.options_and_submit {
|
||||
min-height: 21px;
|
||||
clear: both;
|
||||
position: relative;
|
||||
padding-top: 6px;
|
||||
margin-bottom: -2px;
|
||||
|
||||
input {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.public_toggle {
|
||||
text-align: right;
|
||||
.dropdown {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.icons-monotone_wrench_settings {
|
||||
display: inline-block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
a.question_mark {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
#publisher_service_icons {
|
||||
position: relative;
|
||||
top: 3px;
|
||||
margin-right: 10px;
|
||||
|
||||
.social_media_logos-facebook-16x16,
|
||||
.social_media_logos-twitter-16x16,
|
||||
.social_media_logos-tumblr-16x16,
|
||||
.social_media_logos-wordpress-16x16,
|
||||
.social_media_logos-email-16x16,
|
||||
.social_media_logos-feed-16x16,
|
||||
.social_media_logos-website-16x16 {
|
||||
display: inline-block;
|
||||
height: 16px;
|
||||
width: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
#fileInfo {
|
||||
display: inline;
|
||||
position: relative;
|
||||
top: -2px;
|
||||
}
|
||||
}
|
||||
|
||||
#status_message_fake_text {
|
||||
min-height: 20px;
|
||||
}
|
||||
|
||||
.content_creation {
|
||||
margin-top: 1em;
|
||||
}
|
||||
|
||||
#file-upload {
|
||||
bottom: 1px !important;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
padding: .3em .3em 3px;
|
||||
position: absolute !important;
|
||||
right: 6px;
|
||||
cursor: pointer;
|
||||
|
||||
input[type='file'] {
|
||||
cursor: pointer;
|
||||
right: initial !important;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
&::-webkit-file-upload-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
@include opacity(0.4);
|
||||
vertical-align: bottom;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $text-dark-grey;
|
||||
cursor: pointer;
|
||||
|
||||
img {
|
||||
@include opacity(0.8);
|
||||
}
|
||||
}
|
||||
|
||||
&:active {
|
||||
color: #444;
|
||||
text-shadow: 0 1px 0 #fafafa;
|
||||
|
||||
img {
|
||||
@include opacity(1);
|
||||
}
|
||||
}
|
||||
|
||||
&.loading {
|
||||
@include opacity(0.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#publisher_textarea_wrapper {
|
||||
#hide_publisher {
|
||||
@include opacity(0.3);
|
||||
z-index: 5;
|
||||
padding: 3px;
|
||||
position: absolute;
|
||||
right: 6px;
|
||||
margin-top: 9px;
|
||||
|
||||
.icons-deletelabel {
|
||||
height: 14px;
|
||||
width: 14px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@include opacity(1);
|
||||
}
|
||||
}
|
||||
|
||||
.markdownIndications {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
}
|
||||
|
||||
@include border-radius(2px);
|
||||
|
||||
border: 1px solid #ccc;
|
||||
background: #fff;
|
||||
|
||||
&.active {
|
||||
border: 1px solid $border-dark-grey;
|
||||
}
|
||||
|
||||
position: relative;
|
||||
padding-right: 10px;
|
||||
|
||||
textarea {
|
||||
z-index: 2;
|
||||
border: none;
|
||||
|
||||
&:focus {
|
||||
outline: 0;
|
||||
background: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
&.with_attachments {
|
||||
padding-bottom: 38px;
|
||||
}
|
||||
|
||||
#photodropzone {
|
||||
z-index: 3;
|
||||
position: absolute;
|
||||
bottom: 15px;
|
||||
right: 35px;
|
||||
width: 430px;
|
||||
left: 5px;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
margin-right: 4px;
|
||||
img {
|
||||
width: 50px;
|
||||
max-height: 55px;
|
||||
}
|
||||
.circle {
|
||||
@include border-radius(20px);
|
||||
|
||||
display: none;
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
right: -7px;
|
||||
top: -5px;
|
||||
background-color: #333;
|
||||
|
||||
width: 20px;
|
||||
max-width: 20px;
|
||||
height: 20px;
|
||||
max-height: 20px;
|
||||
border: 1px solid #fff;
|
||||
}
|
||||
|
||||
.x {
|
||||
display: none;
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
right: -1px;
|
||||
font-size: small;
|
||||
font-weight: bold;
|
||||
&:before {
|
||||
content: 'X';
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
cursor: default;
|
||||
.circle {
|
||||
display: block;
|
||||
}
|
||||
.x {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.counter {
|
||||
position: absolute;
|
||||
font-size: 13px;
|
||||
padding: 12px 0 0 5px;
|
||||
}
|
||||
.warning {
|
||||
color: orange;
|
||||
}
|
||||
.exceeded {
|
||||
color: red;
|
||||
}
|
||||
}
|
||||
|
||||
#publisher.closed {
|
||||
#publisher_textarea_wrapper #hide_publisher,
|
||||
.markdownIndications {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
#publisher_photo_upload {
|
||||
position: absolute;
|
||||
display: inline;
|
||||
left: 600px;
|
||||
top: 0;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
#publisher-images {
|
||||
padding-left: 5px;
|
||||
|
||||
#locator {
|
||||
bottom: 1px !important;
|
||||
display: inline-block;
|
||||
margin: 0;
|
||||
position: absolute !important;
|
||||
right: 30px;
|
||||
cursor: pointer;
|
||||
img {
|
||||
padding-top: 2px;
|
||||
@include opacity(0.4);
|
||||
}
|
||||
&:hover {
|
||||
color: $text-dark-grey;
|
||||
cursor: pointer;
|
||||
img {
|
||||
@include opacity(0.8);
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
height: 19px;
|
||||
width: 19px;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,27 +0,0 @@
|
|||
<div class="btn-group aspects_dropdown check-group">
|
||||
<a class="btn btn-info dropdown-toggle" data-toggle="dropdown" href="#">
|
||||
<span class="text"></span> <span class="caret"></span>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<form class="necessaryForJS">
|
||||
<li>
|
||||
<input id="aspect_ids_public" type="checkbox" name="Public" class="aspect_ids public" value="public" {{#if public}}checked="checked"{{/if}}/>
|
||||
<label for="aspect_ids_public"><i class='icon-ok'/><span>Public</span></label></li>
|
||||
<li>
|
||||
<input id="aspect_ids_all_aspects" type="checkbox" name="All Aspects" class="aspect_ids all_aspects" value="all_aspects" {{#if all-aspects}}checked="checked"{{/if}}/>
|
||||
<label for="aspect_ids_all_aspects"><i class='icon-ok'/><span>All Aspects</span></label></li>
|
||||
</li>
|
||||
|
||||
<li class="divider"></li>
|
||||
{{#each aspects}}
|
||||
<li>
|
||||
<input id="aspect_ids_{{id}}" type="checkbox" name="{{name}}" class="aspect_ids" value="{{id}}" {{#if checked}}checked="checked"{{/if}}/>
|
||||
<label for="aspect_ids_{{id}}"><i class='icon-ok'/><span>{{name}}</span></label>
|
||||
</li>
|
||||
{{/each}}
|
||||
</form>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<input type="hidden" class="aspect_ids"/>
|
||||
|
||||
|
|
@ -7,6 +7,8 @@ class StatusMessagesController < ApplicationController
|
|||
|
||||
before_filter :remove_getting_started, :only => [:create]
|
||||
|
||||
before_filter -> { @css_framework = :bootstrap }, :only => [:bookmarklet]
|
||||
|
||||
respond_to :html,
|
||||
:mobile,
|
||||
:json
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ module ApplicationHelper
|
|||
raw_bookmarklet
|
||||
end
|
||||
|
||||
def raw_bookmarklet( height = 250, width = 620)
|
||||
def raw_bookmarklet( height = 400, width = 620)
|
||||
"javascript:(function(){f='#{AppConfig.pod_uri.to_s}bookmarklet?url='+encodeURIComponent(window.location.href)+'&title='+encodeURIComponent(document.title)+'¬es='+encodeURIComponent(''+(window.getSelection?window.getSelection():document.getSelection?document.getSelection():document.selection.createRange().text))+'&v=1&';a=function(){if(!window.open(f+'noui=1&jump=doclose','diasporav1','location=yes,links=no,scrollbars=no,toolbar=no,width=#{width},height=#{height}'))location.href=f+'jump=yes'};if(/Firefox/.test(navigator.userAgent)){setTimeout(a,0)}else{a()}})()"
|
||||
end
|
||||
|
||||
|
|
|
|||
|
|
@ -27,4 +27,4 @@
|
|||
.bd
|
||||
= form_for [conversation, Message.new] do |message|
|
||||
= message.text_area :text, :class => 'span12', :rows => 5, :tabindex => 1
|
||||
= message.submit t('.reply').capitalize, 'data-disable-with' => t('.replying'), :class => 'btn btn-primary', :tabindex => 2
|
||||
= message.submit t('.reply').capitalize, 'data-disable-with' => t('.replying'), :class => 'btn btn-primary creation', :tabindex => 2
|
||||
|
|
|
|||
|
|
@ -8,7 +8,110 @@
|
|||
if( app.publisher ) app.publisher.triggerGettingStarted();
|
||||
});
|
||||
|
||||
#publisher{:class => ((aspect == :profile || publisher_open) ? "mention_popup" : "closed")}
|
||||
-unless defined?(bootstrap).nil?
|
||||
.row-fluid#publisher{:class => ((aspect == :profile || publisher_open) ? "mention_popup" : "closed")}
|
||||
.content_creation
|
||||
= form_for(StatusMessage.new) do |status|
|
||||
= status.error_messages
|
||||
%params
|
||||
#publisher_textarea_wrapper
|
||||
- if current_user.getting_started?
|
||||
= status.text_area :fake_text, :rows => 2, :value => h(publisher_formatted_text), :tabindex => 1, :placeholder => "#{t('contacts.index.start_a_conversation')}...",
|
||||
'data-title' => popover_with_close_html( '1. ' + t('shared.public_explain.share') ),
|
||||
'data-content' => t('shared.public_explain.new_user_welcome_message')
|
||||
- else
|
||||
= status.text_area :fake_text, :rows => 2, :value => h(publisher_formatted_text), :tabindex => 1, :placeholder => "#{t('contacts.index.start_a_conversation')}..."
|
||||
= status.hidden_field :text, :value => h(publisher_hidden_text), :class => 'clear_on_submit'
|
||||
|
||||
.row-fluid#photodropzone_container
|
||||
%ul#photodropzone
|
||||
.row-fluid#location_container
|
||||
= hidden_field :location, :coords
|
||||
.row-fluid#button_container
|
||||
#publisher-images.pull-right
|
||||
#file-upload.btn.btn-link{:title => t('.upload_photos')}
|
||||
%i.entypo.camera.publisher_image
|
||||
#locator.btn.btn-link{:title => t('.get_location')}
|
||||
%i.entypo.location.publisher_image
|
||||
#hide_location.btn.btn-link{:title => t('.remove_location')}
|
||||
%i.entypo.cross.publisher_image
|
||||
%span.help-block.markdownIndications
|
||||
!= t('.formatWithMarkdown', markdown_link: link_to(t('help.markdown'), 'https://diasporafoundation.org/formatting', target: :blank))
|
||||
|
||||
- if publisher_public
|
||||
= hidden_field_tag 'aspect_ids[]', "public"
|
||||
- elsif all_aspects_selected?(selected_aspects)
|
||||
= hidden_field_tag 'aspect_ids[]', "all_aspects"
|
||||
- else
|
||||
- for aspect_id in aspect_ids
|
||||
= hidden_field_tag 'aspect_ids[]', aspect_id.to_s
|
||||
|
||||
.row-fluid.options_and_submit
|
||||
.public_toggle
|
||||
%button.btn.btn-default.pull-left#hide_publisher{:title => t('.discard_post')}
|
||||
=t('cancel')
|
||||
|
||||
.btn-toolbar.pull-right
|
||||
%span#publisher_service_icons
|
||||
- if current_user.services
|
||||
- for service in current_user.services
|
||||
.btn.btn-link.service_icon.dim{ :title => "#{service.provider.titleize} (#{service.nickname})", :id => "#{service.provider}", :maxchar => "#{service.class::MAX_CHARACTERS}", :data => {:toggle=>'tooltip', :placement=>'bottom'} }
|
||||
-if service.provider == 'wordpress'
|
||||
%span.social_media_logos-wordpress-16x16
|
||||
-else
|
||||
%i.entypo.small{ :class => service.provider }
|
||||
%a.btn.btn-link{ :href => "#question_mark_pane", :class => 'question_mark', :rel => 'facebox', :title => t('shared.public_explain.manage') }
|
||||
%i.entypo.small.cog
|
||||
.btn-group.aspect_dropdown
|
||||
%button.btn.btn-default.dropdown-toggle{ ! current_user.getting_started? ? {'data-toggle' => 'dropdown'} : {'data-toggle' => 'dropdown', :title => popover_with_close_html("2. #{t('shared.public_explain.control_your_audience')}"), 'data-content'=> t('shared.public_explain.visibility_dropdown')} }
|
||||
%span.text
|
||||
- if publisher_public
|
||||
= t('public')
|
||||
- elsif all_aspects_selected?(selected_aspects)
|
||||
= t('all_aspects')
|
||||
- elsif selected_aspects.size == 1
|
||||
= selected_aspects.first.name
|
||||
- else
|
||||
= t('shared.aspect_dropdown.toggle', :count => selected_aspects.size)
|
||||
%span.caret
|
||||
%ul.dropdown-menu.pull-right{:unSelectable => 'on', 'data-person_id' => (person.id if defined?(person) && person), 'data-service_uid' => (service_uid if defined?(service_uid))}
|
||||
|
||||
%li.public.radio{"data-aspect_id" => "public", :class => ("selected" if publisher_public)}
|
||||
%a
|
||||
%span.status_indicator
|
||||
%i.icon-ok
|
||||
%span.text
|
||||
= t('public')
|
||||
%li.all_aspects.radio{"data-aspect_id" => "all_aspects", :class => ("selected" if (!publisher_public && all_aspects_selected?(selected_aspects)))}
|
||||
%a
|
||||
%span.status_indicator
|
||||
%i.icon-ok
|
||||
%span.text
|
||||
= t('all_aspects')
|
||||
%li.divider
|
||||
- for aspect in all_aspects
|
||||
%li.aspect_selector{ 'data-aspect_id' => aspect.id, :class => !all_aspects_selected?(selected_aspects) && selected_aspects.include?(aspect) ? "selected" : "" }
|
||||
%a
|
||||
%span.status_indicator
|
||||
%i.icon-ok
|
||||
%span.text
|
||||
= aspect.name
|
||||
|
||||
%button{ :disabled => ("disabled" if publisher_hidden_text.blank?), :class => 'btn btn-default post_preview_button'}
|
||||
= t('.preview')
|
||||
|
||||
= status.submit t('.share'), :disabled => publisher_hidden_text.blank?, :class => 'btn btn-primary creation', :tabindex => 2
|
||||
|
||||
.facebox_content
|
||||
#question_mark_pane
|
||||
= render 'shared/public_explain'
|
||||
= link_to '', contacts_path(:aspect_ids => aspect_ids), :class => 'selected_contacts_link hidden'
|
||||
|
||||
|
||||
#publisher_photo_upload
|
||||
|
||||
- else
|
||||
#publisher{:class => ((aspect == :profile || publisher_open) ? "mention_popup" : "closed")}
|
||||
.content_creation
|
||||
= form_for(StatusMessage.new) do |status|
|
||||
= status.error_messages
|
||||
|
|
@ -33,6 +136,7 @@
|
|||
#file-upload.btn{:title => t('.upload_photos')}
|
||||
= image_tag 'icons/camera.png', :alt => t('.upload_photos').titleize, :class => 'publisher_image'
|
||||
= hidden_field :location, :coords
|
||||
#location_container
|
||||
|
||||
- if publisher_public
|
||||
= hidden_field_tag 'aspect_ids[]', "public"
|
||||
|
|
|
|||
|
|
@ -4,11 +4,11 @@
|
|||
|
||||
= javascript_include_tag :home
|
||||
|
||||
#new_status_message_pane
|
||||
.span-15.last
|
||||
.container-fluid#bookmarklet
|
||||
.row-fluid
|
||||
%h4
|
||||
=t('bookmarklet.post_something')
|
||||
= render :partial => 'shared/publisher', :locals => { :aspect => :profile, :selected_aspects => @aspects, :aspect_ids => @aspect_ids }
|
||||
= render :partial => 'shared/publisher', :locals => { :aspect => :profile, :selected_aspects => @aspects, :aspect_ids => @aspect_ids, :bootstrap => 'true' }
|
||||
|
||||
:javascript
|
||||
app.publisher = new app.views.Publisher({
|
||||
|
|
@ -36,11 +36,5 @@
|
|||
$("#publisher #status_message_fake_text").val(contents);
|
||||
$("#publisher #status_message_text").val(contents);
|
||||
$('input.button')[0].removeAttribute('disabled');
|
||||
$('#publisher #publisher_textarea_wrapper').addClass('active');
|
||||
});
|
||||
|
||||
- content_for(:head) do
|
||||
:css
|
||||
body { padding:0; margin-top: 0; }
|
||||
.container { width: auto; }
|
||||
#new_status_message_pane { margin: 1em 0 0; }
|
||||
#new_status_message_pane h4 { margin: 0 0 0 1em; }
|
||||
|
|
|
|||
|
|
@ -1015,6 +1015,7 @@ en:
|
|||
all: "all"
|
||||
upload_photos: "Upload photos"
|
||||
get_location: "Get your location"
|
||||
remove_location: "Remove location"
|
||||
all_contacts: "all contacts"
|
||||
share_with: "share with"
|
||||
whats_on_your_mind: "What's on your mind?"
|
||||
|
|
|
|||
137
spec/javascripts/app/views/aspects_dropdown_view_spec.js
Normal file
137
spec/javascripts/app/views/aspects_dropdown_view_spec.js
Normal file
|
|
@ -0,0 +1,137 @@
|
|||
describe("app.views.AspectsDropdown", function(){
|
||||
beforeEach(function() {
|
||||
spec.content().html(
|
||||
'<div class="btn-group aspect_dropdown">'+
|
||||
' <button class="btn dropdown-toggle" data-toggle="dropdown">'+
|
||||
' <span class="text">'+ Diaspora.I18n.t('all_aspects') +'</span>'+
|
||||
' <span class="caret"></span>'+
|
||||
' </button>'+
|
||||
' <ul class="dropdown-menu">'+
|
||||
' <li class="public radio" data-aspect_id="public">'+
|
||||
' <a>'+
|
||||
' <span class="status_indicator"><i class="icon-ok"></i></span>'+
|
||||
' <span class="text">'+ Diaspora.I18n.t('public') +'</span>'+
|
||||
' </a>'+
|
||||
' </li>'+
|
||||
' <li class="all_aspects radio" data-aspect_id="all_aspects">'+
|
||||
' <a>'+
|
||||
' <span class="status_indicator"><i class="icon-ok"></i></span>'+
|
||||
' <span class="text">'+ Diaspora.I18n.t('all_aspects') +'</span>'+
|
||||
' </a>'+
|
||||
' </li>'+
|
||||
' <li class="divider"></li>'+
|
||||
' <li class="aspect_selector" data-aspect_id="10">'+
|
||||
' <a>'+
|
||||
' <span class="status_indicator"><i class="icon-ok"></i></span>'+
|
||||
' <span class="text">Aspect 10</span>'+
|
||||
' </a>'+
|
||||
' </li>'+
|
||||
' <li class="aspect_selector" data-aspect_id="12">'+
|
||||
' <a>'+
|
||||
' <span class="status_indicator"><i class="icon-ok"></i></span>'+
|
||||
' <span class="text">Aspect 12</span>'+
|
||||
' </a>'+
|
||||
' </li>'+
|
||||
' </ul>'+
|
||||
'</div>'
|
||||
);
|
||||
|
||||
this.view = new app.views.AspectsDropdown({el: spec.content()});
|
||||
});
|
||||
|
||||
context('_toggleCheckbox', function() {
|
||||
beforeEach(function() {
|
||||
this.view.$('li.selected').removeClass('selected');
|
||||
this.view.$('li.all_aspects.radio').addClass('selected');
|
||||
});
|
||||
|
||||
it('deselects all radio buttons', function() {
|
||||
this.view._toggleCheckbox(this.view.$('li.aspect_selector:eq(0)'));
|
||||
expect(this.view.$('li.all_aspects.radio').hasClass('selected')).toBeFalsy();
|
||||
});
|
||||
|
||||
it('selects the clicked aspect', function() {
|
||||
this.view._toggleCheckbox(this.view.$('li.aspect_selector:eq(0)'));
|
||||
expect(this.view.$('li.aspect_selector:eq(0)').hasClass('selected')).toBeTruthy();
|
||||
});
|
||||
|
||||
it('selects multiple aspects', function() {
|
||||
this.view._toggleCheckbox(this.view.$('li.aspect_selector:eq(0)'));
|
||||
this.view._toggleCheckbox(this.view.$('li.aspect_selector:eq(1)'));
|
||||
expect(this.view.$('li.aspect_selector:eq(0)').hasClass('selected')).toBeTruthy();
|
||||
expect(this.view.$('li.aspect_selector:eq(1)').hasClass('selected')).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
||||
context('_toggleRadio', function(){
|
||||
beforeEach(function() {
|
||||
this.view.$('li.selected').removeClass('selected');
|
||||
this.view.$('li.aspect_selector:eq(0)').addClass('selected');
|
||||
this.view.$('li.aspect_selector:eq(1)').addClass('selected');
|
||||
});
|
||||
|
||||
it('deselects all checkboxes', function() {
|
||||
this.view._toggleRadio(this.view.$('li.all_aspects.radio'));
|
||||
expect(this.view.$('li.aspect_selector:eq(0)').hasClass('selected')).toBeFalsy();
|
||||
expect(this.view.$('li.aspect_selector:eq(1)').hasClass('selected')).toBeFalsy();
|
||||
});
|
||||
|
||||
it('toggles the clicked radio buttons', function() {
|
||||
this.view._toggleRadio(this.view.$('li.all_aspects.radio'));
|
||||
expect(this.view.$('li.all_aspects.radio').hasClass('selected')).toBeTruthy();
|
||||
expect(this.view.$('li.public.radio').hasClass('selected')).toBeFalsy();
|
||||
this.view._toggleRadio(this.view.$('li.public.radio'));
|
||||
expect(this.view.$('li.all_aspects.radio').hasClass('selected')).toBeFalsy();
|
||||
expect(this.view.$('li.public.radio').hasClass('selected')).toBeTruthy();
|
||||
this.view._toggleRadio(this.view.$('li.all_aspects.radio'));
|
||||
expect(this.view.$('li.all_aspects.radio').hasClass('selected')).toBeTruthy();
|
||||
expect(this.view.$('li.public.radio').hasClass('selected')).toBeFalsy();
|
||||
});
|
||||
});
|
||||
|
||||
context('_selectAspects', function(){
|
||||
beforeEach(function() {
|
||||
this.view.$('li.selected').removeClass('selected');
|
||||
this.view.$('li.aspect_selector:eq(0)').addClass('selected');
|
||||
});
|
||||
|
||||
it('select aspects in the dropdown by a given list of ids', function() {
|
||||
this.ids = [12,'public'];
|
||||
this.view._selectAspects(this.ids);
|
||||
expect(this.view.$('li.all_aspects.radio').hasClass('selected')).toBeFalsy();
|
||||
expect(this.view.$('li.public.radio').hasClass('selected')).toBeTruthy();
|
||||
expect(this.view.$('li.aspect_selector:eq(0)').hasClass('selected')).toBeFalsy();
|
||||
expect(this.view.$('li.aspect_selector:eq(1)').hasClass('selected')).toBeTruthy();
|
||||
});
|
||||
});
|
||||
|
||||
context('_updateButton', function() {
|
||||
beforeEach(function() {
|
||||
this.view.$('li.selected').removeClass('selected');
|
||||
});
|
||||
|
||||
it('shows "Select aspects" when nothing is selected', function() {
|
||||
this.view._updateButton('inAspectClass');
|
||||
expect(this.view.$('.btn.dropdown-toggle > .text').text()).toContain(Diaspora.I18n.t('aspect_dropdown.select_aspects'));
|
||||
});
|
||||
|
||||
it('shows the name of the selected radio button', function() {
|
||||
this.view.$('li.all_aspects.radio').addClass('selected');
|
||||
this.view._updateButton('inAspectClass');
|
||||
expect(this.view.$('.btn.dropdown-toggle > .text').text()).toContain(Diaspora.I18n.t('aspect_dropdown.all_aspects'));
|
||||
});
|
||||
|
||||
it('shows the name of the selected aspect ( == 1 )', function() {
|
||||
this.view.$('li.aspect_selector:eq(1)').addClass('selected');
|
||||
this.view._updateButton('inAspectClass');
|
||||
expect(this.view.$('.btn.dropdown-toggle > .text').text()).toContain("Aspect 12");
|
||||
});
|
||||
|
||||
it('shows the number of selected aspects ( > 1)', function() {
|
||||
this.view.$('li.aspect_selector:eq(0)').addClass('selected');
|
||||
this.view.$('li.aspect_selector:eq(1)').addClass('selected');
|
||||
this.view._updateButton('inAspectClass');
|
||||
expect(this.view.$('.btn.dropdown-toggle > .text').text()).toContain(Diaspora.I18n.t('aspect_dropdown.toggle', { 'count':2 }));
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
@ -290,7 +290,7 @@ describe("app.views.Publisher", function() {
|
|||
it("Show location", function(){
|
||||
|
||||
// inserts location to the DOM; it is the location's view element
|
||||
setFixtures('<div id="publisher_textarea_wrapper"></div>');
|
||||
setFixtures('<div id="location_container"></div>');
|
||||
|
||||
// creates a fake Locator
|
||||
OSM = {};
|
||||
|
|
|
|||
Loading…
Reference in a new issue