caojiezi2003/Stackedit
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Updated UI for publishing understandability

Browse Source
This commit is contained in:
benweet 2014-03-14 15:00:11 +00:00
parent ca05d89a10
commit 296f24eaa5
17 changed files with 102 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
.jshintrc Normal file
View File

@ -0,0 +1,14 @@
{
"curly": true,
"browser": true,
"devel": true,
"indent": 4,
"latedef": true,
"undef": true,
"unused": true,
"expr": true,
"globals": {
"define": false,
"require": false
}
}

13
Gruntfile.js
View File

@ -15,18 +15,7 @@ module.exports = function(grunt) {
pkg: grunt.file.readJSON('package.json'),
jshint: {
options: {
curly: true,
browser: true,
devel: true,
indent: 4,
latedef: true,
undef: true,
unused: true,
expr: true,
globals: {
"define": false,
"require": false,
},
jshintrc: true,
ignores: [
'node_modules/**/*.js',
'public/libs/**/*.js',

2
bower.json
View File

@ -17,7 +17,7 @@
"stacktrace": "~0.5.3",
"requirejs-text": "~2.0.10",
"bootstrap-tour": "~0.7.1",
"ace": "4bbe5346f2ae5ad35c0c47defa244ab27aedd451",
"ace": "https://github.com/benweet/ace.git#798a03b2f8b1315fa8ba2d867cee242b90960557",
"pagedown-ace": "https://github.com/benweet/pagedown-ace.git#84d5e1b7ff233a1c8cafa9716e825228d275120c",
"pagedown-extra": "https://github.com/jmcmanus/pagedown-extra.git#bd0870e3e871e15bde1fa5a427e3e10028a09789",
"crel": "https://github.com/KoryNunn/crel.git#8dbda04b129fc0aec01a2a080d1cab26816e11c1",

17
public/res/core.js
View File

@ -704,7 +704,7 @@ define([
screenWidth = screenWidth || 0;
//var codeFontSize = settings.editorFontSize;
//var codeLineHeight = Math.round(codeFontSize * 20 / 12);
var previewFontSize = Math.round(size * 8 / 7);
var previewFontSize = size * 13 / 12;
styleContent += [
'@media (min-width: ' + screenWidth + 'px) {',
'#wmd-input, .textarea-helper {',
@ -717,9 +717,9 @@ define([
'}',
].join('\n');
}
applyFont(14);
applyFont(15, 600);
applyFont(16, 1200);
applyFont(15);
applyFont(16, 600);
applyFont(17, 1200);
function applyMaxWidth(maxWidth, screenWidth) {
styleContent += [
@ -837,7 +837,14 @@ define([
});
// Editor
if(window.lightMode) {
if(window.preMode) {
// In light mode, we replace ACE with a textarea
$('#wmd-input').addClass('form-control').attr('contenteditable', true);
// Create UI layout after textarea
createLayout();
}
else if(window.lightMode) {
// In light mode, we replace ACE with a textarea
$('#wmd-input').replaceWith(function() {
return $('<textarea id="wmd-input">').addClass(this.className).addClass('form-control');

17
public/res/extensions/dialogManagePublication.js
View File

@ -14,21 +14,13 @@ define([
var fileDesc;
var publishListElt;
var $msgPublishListElt;
var $msgNoPublishElt;
var $showAlreadyPublishedElt;
var refreshDialog = function(fileDescParameter) {
if(fileDescParameter !== undefined && fileDescParameter !== fileDesc) {
return;
}
if(_.size(fileDesc.publishLocations) > 0) {
$msgPublishListElt.removeClass("hide");
$msgNoPublishElt.addClass("hide");
}
else {
$msgPublishListElt.addClass("hide");
$msgNoPublishElt.removeClass("hide");
}
$showAlreadyPublishedElt.toggleClass("hide", _.size(fileDesc.publishLocations) === 0);
var publishListHtml = _.reduce(fileDesc.publishLocations, function(result, publishAttributes) {
var formattedAttributes = _.omit(publishAttributes, "provider", "publishIndex", "sharingLink");
@ -62,10 +54,9 @@ define([
dialogManagePublication.onReady = function() {
var modalElt = document.querySelector(".modal-manage-publish");
publishListElt = modalElt.querySelector(".publish-list");
$msgPublishListElt = $(modalElt.querySelectorAll(".msg-publish-list"));
$msgNoPublishElt = $(modalElt.querySelectorAll(".msg-no-publish"));
$showAlreadyPublishedElt = $(document.querySelectorAll(".show-already-published"));
};
return dialogManagePublication;
});

2
public/res/extensions/documentPanel.js
View File

@ -178,7 +178,7 @@ define([
// Scroll to the active file
var activeElt = documentListElt.querySelector('.file.active');
activeElt && (panelContentElt.scrollTop += activeElt.getBoundingClientRect().top - 120);
activeElt && (panelContentElt.scrollTop += activeElt.getBoundingClientRect().top - 240);
}
});

BIN
public/res/font/AnonymousPro-Bold-webfont.woff Normal file
View File

Binary file not shown.

BIN
public/res/font/AnonymousPro-BoldItalic-webfont.woff Normal file
View File

Binary file not shown.

BIN
public/res/font/AnonymousPro-Italic-webfont.woff Normal file
View File

Binary file not shown.

BIN
public/res/font/AnonymousPro-Regular-webfont.woff Normal file
View File

Binary file not shown.

39
public/res/html/bodyIndex.html
View File

@ -90,22 +90,23 @@
class="icon-provider-dropbox"></i> Export to Dropbox</a></li>
<li><a href="#" class="submenu-sync-gdrive action-sync-export-dialog-gdrive"><i
class="icon-provider-gdrive"></i> Export to Google Drive</a></li>
<li><a href="#" class="submenu-sync-gdrivesec action-sync-export-dialog-gdrivesec"><i
class="icon-provider-gdrive"></i> Export to Google Drive <small>(2nd account)</small></a></li>
<li><a href="#" class="submenu-sync-gdriveter action-sync-export-dialog-gdriveter"><i
class="icon-provider-gdrive"></i> Export to Google Drive <small>(3rd account)</small></a></li>
<li><a href="#" class="submenu-sync-gdrive action-autosync-dialog-gdrive"><i
class="icon-provider-gdrive"></i> Google Drive AutoSync</a></li>
<li><a href="#" class="submenu-sync-gdrivesec action-sync-export-dialog-gdrivesec"><i
class="icon-provider-gdrive"></i> Export to Google Drive<br>(2nd account)</a></li>
<li><a href="#" class="submenu-sync-gdrivesec action-autosync-dialog-gdrivesec"><i
class="icon-provider-gdrive"></i> Google Drive AutoSync<br>(2nd account)</a></li>
<li><a href="#" class="submenu-sync-gdriveter action-sync-export-dialog-gdriveter"><i
class="icon-provider-gdrive"></i> Export to Google Drive<br>(3rd account)</a></li>
class="icon-provider-gdrive"></i> Google Drive AutoSync <small>(2nd account)</small></a></li>
<li><a href="#" class="submenu-sync-gdriveter action-autosync-dialog-gdriveter"><i
class="icon-provider-gdrive"></i> Google Drive AutoSync<br>(3rd account)</a></li>
class="icon-provider-gdrive"></i> Google Drive AutoSync <small>(3rd account)</small></a></li>
</ul>
</div>
<a href="#" data-toggle="collapse" data-target=".collapse-publish-on"
class="list-group-item"><i class="icon-share"></i> Publish...</a>
<div class="sub-menu collapse collapse-publish-on clearfix">
<ul class="nav">
<ul class="nav alert alert-danger show-already-published">
<li><div>"<span class="file-title"></span>" is already published.</div></li>
<li><a href="#" class="action-update-publication"
data-toggle="collapse" data-target=".menu-panel"><i class="icon-share"></i>
Update publication</a></li>
@ -144,11 +145,11 @@
<a href="#" class="list-group-item submenu-sync-gdrivesec action-sync-import-gdrivesec"
data-toggle="collapse" data-target=".menu-panel"><i
class="icon-provider-gdrive"></i> Import from
Google Drive<br>(2nd account)</a>
Google Drive <small>(2nd account)</small></a>
<a href="#" class="list-group-item submenu-sync-gdriveter action-sync-import-gdriveter"
data-toggle="collapse" data-target=".menu-panel"><i
class="icon-provider-gdrive"></i> Import from
Google Drive<br>(3rd account)</a>
Google Drive <small>(3rd account)</small></a>
</div>
<ul class="nav">
<li><a href="#" data-toggle="modal"
@ -358,7 +359,7 @@
Are you sure you want to delete "<span class="file-title"></span>"?
</p>
<blockquote>
<b>NOTE:</b> This will not delete the file on synchronized
<b>Note:</b> This will not delete the file on synchronized
locations.
</blockquote>
</div>
@ -506,7 +507,7 @@
</div>
</div>
<blockquote>
<b>NOTE:</b>
<b>Note:</b>
<ul>
<li>Dropbox file path does not depend on document title.</li>
<li>The title of your document will not be synchronized.</li>
@ -541,7 +542,7 @@
</p>
<div class="msg-sync-list sync-list hide"></div>
<blockquote class="msg-sync-list hide">
<b>NOTE:</b> Removing a synchronized location will not delete any
<b>Note:</b> Removing a synchronized location will not delete any
file.
</blockquote>
<p class="msg-no-sync hide">"<span class="file-title"></span>" is not synchronized yet.</p>
@ -828,19 +829,13 @@
<h2 class="modal-title">Publication</h2>
</div>
<div class="modal-body">
<p class="msg-publish-list hide">
<p>
"<span class="file-title"></span>" is published on the following
location(s):
</p>
<div class="msg-publish-list publish-list hide"></div>
<blockquote class="msg-publish-list hide">
<b>NOTE:</b> Removing a publish location will not delete the actual publication.
</blockquote>
<p class="msg-no-publish hide">
"<span class="file-title"></span>" is not published yet.
</p>
<blockquote class="msg-no-publish hide">
<b>Tip:</b> You can add publications using the <i class="icon-share"></i> <code>Publish on</code> sub-menu.
<div class="publish-list"></div>
<blockquote>
<b>Note:</b> Removing a publish location will not delete the actual publication.
</blockquote>
</div>
<div class="modal-footer">

2
public/res/html/dialogAutoSyncGdrive.html
View File

@ -44,7 +44,7 @@
</div>
</div>
<blockquote>
<b>NOTE:</b> Removing a local document will not delete the linked file on Google
<b>Note:</b> Removing a local document will not delete the linked file on Google
Drive.
</blockquote>
</div>

2
public/res/html/partialRenderingSettingsBlock.html
View File

@ -1,5 +1,5 @@
<p>Renders modified sections only.</p>
<blockquote>
<b>NOTE:</b> Document sections are based on title elements (h1, h2...). Therefore if
<b>Note:</b> Document sections are based on title elements (h1, h2...). Therefore if
your document does not contain any title, performance will not be increased.
</blockquote>

2
public/res/html/scrollLinkSettingsBlock.html
View File

@ -1,6 +1,6 @@
<p>Binds together editor and preview scrollbars.</p>
<blockquote>
<b>NOTE:</b> The mapping between Markdown and HTML is based on the
<b>Note:</b> The mapping between Markdown and HTML is based on the
position of the title elements (h1, h2...) in the page. Therefore if
your document does not contain any title, the mapping will be linear and
consequently less accurate.

27
public/res/styles/base.less
View File

@ -68,9 +68,34 @@
src: local('Source Code Pro Bold'), local('SourceCodePro-Bold'), url("../font/SourceCodePro-Bold-webfont.woff") format('woff');
}
@font-face {
font-family: 'Anonymous Pro';
font-style: normal;
font-weight: 400;
src: local('Anonymous Pro'), local('AnonymousPro'), url("../font/AnonymousPro-Regular-webfont.woff") format('woff');
}
@font-face {
font-family: 'Anonymous Pro';
font-style: normal;
font-weight: 700;
src: local('Anonymous Pro Bold'), local('AnonymousPro-Bold'), url("../font/AnonymousPro-Bold-webfont.woff") format('woff');
}
@font-face {
font-family: 'Anonymous Pro';
font-style: italic;
font-weight: 400;
src: local('Anonymous Pro Italic'), local('AnonymousPro-Italic'), url("../font/AnonymousPro-Italic-webfont.woff") format('woff');
}
@font-face {
font-family: 'Anonymous Pro';
font-style: italic;
font-weight: 700;
src: local('Anonymous Pro Bold Italic'), local('AnonymousPro-BoldItalic'), url("../font/AnonymousPro-BoldItalic-webfont.woff") format('woff');
}
@font-family-sans-serif: "Source Sans Pro", sans-serif;
@font-family-monospace: "Source Code Pro", monospace;
@font-family-monospace-letter-spacing: -0.06em;
@font-family-monospace-letter-spacing: -0.02em;
body {
-webkit-font-smoothing: antialiased;

25
public/res/styles/main.less
View File

@ -57,7 +57,7 @@
@document-panel-width: 320px;
@jgrowl-width: 260px;
@resizer-size: 32px;
@editor-line-weight: 1.7;
@editor-line-weight: 1.6;
/* Bootstrap */
@body-bg: @secondary-bg-light;
@ -128,6 +128,7 @@
@popover-arrow-color: @secondary-bg;
@popover-arrow-outer-color: @secondary-border-color;
@popover-title-bg: @transparent;
@alert-border-radius: 0;
body {
@ -319,6 +320,11 @@ a {
* Input
********************/
@form-control-inset-shadow: inset 0 1px 1px rgba(0,0,0,.025);
.form-control {
.box-shadow(~"@{form-control-inset-shadow}");
}
// Fix form-inline broken since Bootstrap v3
.form-inline {
.form-control {
@ -344,13 +350,13 @@ a {
&:focus {
border-color: @input-border;
outline: 0;
.box-shadow(~"inset 0 1px 1px rgba(0,0,0,.05), 0 0 12px -1px @{color-rgba}");
.box-shadow(~"@{form-control-inset-shadow}, 0 0 12px -1px @{color-rgba}");
}
}
.form-control.error {
border-color: @error-border;
.box-shadow(~"inset 0 1px 1px rgba(0,0,0,.05), 0 0 8px rgba(255, 134, 97, 0.6)");
.box-shadow(~"@{form-control-inset-shadow}, 0 0 8px rgba(255, 134, 97, 0.6)");
}
.help-block {
@ -359,7 +365,7 @@ a {
// Input add-on
.input-group-addon {
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
.box-shadow(~"@{form-control-inset-shadow}");
a& {
color: @link-color;
}
@ -459,7 +465,7 @@ a {
overflow: hidden;
height: @input-height-slim;
width: 60px;
padding-top: 9px;
padding-top: 8px;
.bar {
display: inline-block;
width: 14px;
@ -553,10 +559,15 @@ a {
background-color: @secondary-bg-lighter;
.box-shadow(~"inset 1px 0 1px rgba(0,0,0,.1), inset 1px 1px 4px rgba(0,0,0,.025)");
}
.alert {
padding: 15px 0;
}
.nav {
margin: 20px 0;
> li > * {
padding: 8px 30px;
}
> li > a {
padding: 8px 15px 8px 25px;
&:hover,
&:focus {
background-color: @transparent;
@ -1152,7 +1163,7 @@ a {
vertical-align: middle;
background-color: @secondary-bg-lighter;
border-color: @input-border;
.box-shadow(inset 0 1px 1px rgba(0,0,0,.075));
.box-shadow(~"@{form-control-inset-shadow}");
}
.ace_searchbtn {
background-image: none;

7
public/res/themes/original.less
View File

@ -54,7 +54,7 @@
@panel-button-bg-color: #e0e0e0;
@panel-button-box-shadow: ~"0 0 1px rgba(255,255,255,0.75)";
@input-bg: #fff;
@modal-backdrop-bg: #505050;
@modal-backdrop-bg: #606060;
@input-color: @secondary-color-darkest;
@disabled-color: mix(@secondary-color, @input-bg, 50%);
@ -103,8 +103,9 @@ a.list-group-item,
&:hover,
&:focus {
color: #333;
border-top-color: fade(@secondary, 10%);
border-top-color: fade(@secondary, 15%);
border-bottom-color: fade(#fff, 85%);
.box-shadow(inset 1px 1px 4px rgba(0,0,0,.025))
}
}
@ -116,7 +117,7 @@ a.list-group-item,
color: #606060;
border-top-color: fade(@secondary, 10%);
border-bottom-color: fade(#fff, 80%);
.box-shadow(inset 1px 1px 4px rgba(0,0,0,.025))
}
}