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

Add image background

Browse Source
This commit is contained in:
benweet 2013-03-26 23:32:36 +00:00
parent 41de5de606
commit 5bd0925a2b
4 changed files with 85 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
css/main.css
View File

@ -1,6 +1,6 @@
body { body {
background-color: White; background-image: url(../img/honeycomb.png);
font-family: sans-serif; background-repeat: repeat;
} }
#navbar { #navbar {
@ -40,16 +40,6 @@ body {
display: inline-block; display: inline-block;
} }
.wmd-button>span {
background-image: url(../img/wmd-buttons.png);
background-repeat: no-repeat;
background-position: 0px 0px;
width: 20px;
height: 20px;
display: inline-block;
border: 1px solid #f2f2f2;
}
.wmd-prompt-background { .wmd-prompt-background {
background-color: Black; background-color: Black;
} }
@ -97,6 +87,15 @@ body {
height: 18px !important; height: 18px !important;
} }
.ui-layout-toggler-south {
margin-top: 3px !important;
height: 18px !important;
}
.ui-layout-toggler-south .caret {
margin-top: 6px;
}
.ui-layout-toggler-north-open .caret, .ui-layout-toggler-north-open .caret,
.ui-layout-toggler-south-closed .caret { .ui-layout-toggler-south-closed .caret {
border-bottom: 5px solid #525252; border-bottom: 5px solid #525252;
@ -119,13 +118,17 @@ body {
width: 18px !important; width: 18px !important;
} }
.ui-layout-toggler-east .caret,
.ui-layout-toggler-west .caret {
margin-top: 40px;
}
.ui-layout-toggler-east-open .caret, .ui-layout-toggler-east-open .caret,
.ui-layout-toggler-west-closed .caret { .ui-layout-toggler-west-closed .caret {
border-bottom: 5px solid transparent; border-bottom: 5px solid transparent;
border-top: 5px solid transparent; border-top: 5px solid transparent;
border-left: 5px solid #525252; border-left: 5px solid #525252;
border-right: 0; border-right: 0;
margin-top: 40px;
} }
.ui-layout-toggler-east-closed .caret, .ui-layout-toggler-east-closed .caret,
@ -134,5 +137,4 @@ body {
border-top: 5px solid transparent; border-top: 5px solid transparent;
border-right: 5px solid #525252; border-right: 5px solid #525252;
border-left: 0; border-left: 0;
margin-top: 40px;
} }

BIN
img/honeycomb.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 484 B

2
index.html
View File

@ -82,7 +82,7 @@
</div> </div>
</div> </div>
<textarea id="wmd-input" class="ui-layout-center"></textarea> <textarea id="wmd-input" class="ui-layout-center"></textarea>
<div id="wmd-preview" class="well ui-layout-east"></div> <div class="ui-layout-east"></div>
<div class="ui-layout-south"></div> <div class="ui-layout-south"></div>
<div id="remove-file-confirm" class="modal hide"> <div id="remove-file-confirm" class="modal hide">
<div class="modal-header"> <div class="modal-header">

122
js/main.js
View File

@ -26,7 +26,7 @@ var fileManager = (function($) {
}); });
$("#file-title-input").blur(function() { $("#file-title-input").blur(function() {
var title = $.trim($(this).val()); var title = $.trim($(this).val());
if(title) { if (title) {
var fileIndex = localStorage["file.current"]; var fileIndex = localStorage["file.current"];
localStorage[fileIndex + ".title"] = title; localStorage[fileIndex + ".title"] = title;
} }
@ -36,39 +36,39 @@ var fileManager = (function($) {
fileManager.updateFileTitleUI(); fileManager.updateFileTitleUI();
}); });
}; };
fileManager.selectFile = function() { fileManager.selectFile = function() {
// If file system does not exist // If file system does not exist
if(!localStorage["file.count"]) { if (!localStorage["file.count"]) {
localStorage.clear(); localStorage.clear();
localStorage["file.count"] = 0; localStorage["file.count"] = 0;
} }
this.updateFileDescList(); this.updateFileDescList();
// If no file create one // If no file create one
if(this.fileDescList.length === 0) { if (this.fileDescList.length === 0) {
this.createFile(); this.createFile();
this.updateFileDescList(); this.updateFileDescList();
} }
// If no default file take first one // If no default file take first one
if(!localStorage["file.current"]) { if (!localStorage["file.current"]) {
localStorage["file.current"] = this.fileDescList[0].index; localStorage["file.current"] = this.fileDescList[0].index;
} }
// Update the editor and the file title // Update the editor and the file title
var fileIndex = localStorage["file.current"]; var fileIndex = localStorage["file.current"];
$("#wmd-input").val(localStorage[fileIndex + ".content"]); $("#wmd-input").val(localStorage[fileIndex + ".content"]);
createEditor(); createEditor();
this.updateFileTitleUI(); this.updateFileTitleUI();
}; };
fileManager.createFile = function(title) { fileManager.createFile = function(title) {
if(!title) { if (!title) {
title = "Filename"; title = "Filename";
} }
// Find a fileIndex // Find a fileIndex
var fileCount = parseInt(localStorage["file.count"]); var fileCount = parseInt(localStorage["file.count"]);
var i; var i;
for(i=0; i<fileCount; i++) { for (i = 0; i < fileCount; i++) {
if(!localStorage["file." + i + ".title"]) { if (!localStorage["file." + i + ".title"]) {
break; break;
} }
} }
@ -77,29 +77,30 @@ var fileManager = (function($) {
localStorage[fileIndex + ".content"] = ""; localStorage[fileIndex + ".content"] = "";
localStorage[fileIndex + ".title"] = title; localStorage[fileIndex + ".title"] = title;
localStorage["file.current"] = fileIndex; localStorage["file.current"] = fileIndex;
if(i == fileCount) { if (i == fileCount) {
localStorage["file.count"] = fileCount + 1; localStorage["file.count"] = fileCount + 1;
} }
}; };
fileManager.deleteFile = function() { fileManager.deleteFile = function() {
var fileIndex = localStorage["file.current"]; var fileIndex = localStorage["file.current"];
localStorage.removeItem("file.current"); localStorage.removeItem("file.current");
localStorage.removeItem(fileIndex + ".title"); localStorage.removeItem(fileIndex + ".title");
localStorage.removeItem(fileIndex + ".content"); localStorage.removeItem(fileIndex + ".content");
}; };
fileManager.updateFileDescList = function() { fileManager.updateFileDescList = function() {
var fileCount = parseInt(localStorage["file.count"]); var fileCount = parseInt(localStorage["file.count"]);
var lastIndex = -1; var lastIndex = -1;
this.fileDescList = []; this.fileDescList = [];
$("#file-selector").empty(); $("#file-selector").empty();
for(var i=0; i<fileCount; i++) { for ( var i = 0; i < fileCount; i++) {
var fileIndex = "file." + i; var fileIndex = "file." + i;
var title = localStorage[fileIndex + ".title"]; var title = localStorage[fileIndex + ".title"];
if(title) { if (title) {
lastIndex = i; lastIndex = i;
this.fileDescList.push({"index": fileIndex, "title": title}); this.fileDescList
.push({ "index" : fileIndex, "title" : title });
} }
} }
localStorage["file.count"] = lastIndex + 1; localStorage["file.count"] = lastIndex + 1;
@ -111,41 +112,40 @@ var fileManager = (function($) {
return 0; return 0;
}); });
}; };
fileManager.updateFileTitleUI = function() { fileManager.updateFileTitleUI = function() {
// Update the editor and the file title // Update the editor and the file title
var fileIndex = localStorage["file.current"]; var fileIndex = localStorage["file.current"];
var title = localStorage[fileIndex + ".title"]; var title = localStorage[fileIndex + ".title"];
document.title = "StackEdit - " + title; document.title = "StackEdit - " + title;
$(".file-title").text(title); $(".file-title").text(title);
$("#file-title-input").val(title); $("#file-title-input").val(title);
$("#file-selector").empty(); $("#file-selector").empty();
for(var i=0; i<this.fileDescList.length; i++) { for ( var i = 0; i < this.fileDescList.length; i++) {
var fileDesc = this.fileDescList[i]; var fileDesc = this.fileDescList[i];
var a = $("<a>").text(fileDesc.title); var a = $("<a>").text(fileDesc.title);
var li = $("<li>").append(a); var li = $("<li>").append(a);
if(fileDesc.index == fileIndex) { if (fileDesc.index == fileIndex) {
li.addClass("disabled"); li.addClass("disabled");
} } else {
else { a.attr("href", "javascript:void(0);").click(
a.attr("href", "javascript:void(0);") (function(fileIndex) {
.click((function(fileIndex) { return function() {
return function() { localStorage["file.current"] = fileIndex;
localStorage["file.current"] = fileIndex; fileManager.selectFile();
fileManager.selectFile(); };
}; })(fileDesc.index));
})(fileDesc.index));
} }
$("#file-selector").append(li); $("#file-selector").append(li);
} }
}; };
fileManager.saveFile = function() { fileManager.saveFile = function() {
var content = $("#wmd-input").val(); var content = $("#wmd-input").val();
var fileIndex = localStorage["file.current"]; var fileIndex = localStorage["file.current"];
localStorage[fileIndex + ".content"] = content; localStorage[fileIndex + ".content"] = content;
//insertFile(this.currentFile, this.content); // insertFile(this.currentFile, this.content);
}; };
return fileManager; return fileManager;
@ -168,7 +168,8 @@ var gdrive = (function($) {
var state = JSON.parse(decodeURI((/state=(.+?)(&|$)/ var state = JSON.parse(decodeURI((/state=(.+?)(&|$)/
.exec(location.search) || [ , null ])[1])); .exec(location.search) || [ , null ])[1]));
if (state.action == 'create') { if (state.action == 'create') {
gdrive.createFile(state.folderId, fileManager.currentFile, fileManager.content); gdrive.createFile(state.folderId, fileManager.currentFile,
fileManager.content);
} }
} catch (e) { } catch (e) {
@ -197,7 +198,8 @@ var gdrive = (function($) {
var close_delim = "\r\n--" + boundary + "--"; var close_delim = "\r\n--" + boundary + "--";
var contentType = 'text/x-markdown'; var contentType = 'text/x-markdown';
var metadata = { 'title' : title, 'mimeType' : contentType, 'parents' : [ { 'kind' : 'drive#fileLink', 'id' : folderId } ] }; var metadata = { 'title' : title, 'mimeType' : contentType,
'parents' : [ { 'kind' : 'drive#fileLink', 'id' : folderId } ] };
var base64Data = btoa(content); var base64Data = btoa(content);
var multipartRequestBody = delimiter var multipartRequestBody = delimiter
@ -222,23 +224,24 @@ var gdrive = (function($) {
function createEditor() { function createEditor() {
$("#wmd-button-bar").empty(); $("#wmd-button-bar").empty();
var converter = Markdown.getSanitizingConverter(); var converter = Markdown.getSanitizingConverter();
var editor = new Markdown.Editor(converter); var editor = new Markdown.Editor(converter);
editor.run(); editor.run();
$(".wmd-button-row").addClass("btn-group").find("li:not(.wmd-spacer)").addClass("btn").css("left", 0).find("span").hide(); $(".wmd-button-row").addClass("btn-group").find("li:not(.wmd-spacer)")
$("#wmd-bold-button").append($("<i>").addClass("icon-bold")); .addClass("btn").css("left", 0).find("span").hide();
$("#wmd-italic-button").append($("<i>").addClass("icon-italic")); $("#wmd-bold-button").append($("<i>").addClass("icon-bold"));
$("#wmd-link-button").append($("<i>").addClass("icon-globe")); $("#wmd-italic-button").append($("<i>").addClass("icon-italic"));
$("#wmd-quote-button").append($("<i>").addClass("icon-indent-left")); $("#wmd-link-button").append($("<i>").addClass("icon-globe"));
$("#wmd-code-button").append($("<i>").addClass("icon-code")); $("#wmd-quote-button").append($("<i>").addClass("icon-indent-left"));
$("#wmd-image-button").append($("<i>").addClass("icon-picture")); $("#wmd-code-button").append($("<i>").addClass("icon-code"));
$("#wmd-olist-button").append($("<i>").addClass("icon-numbered-list")); $("#wmd-image-button").append($("<i>").addClass("icon-picture"));
$("#wmd-ulist-button").append($("<i>").addClass("icon-list")); $("#wmd-olist-button").append($("<i>").addClass("icon-numbered-list"));
$("#wmd-heading-button").append($("<i>").addClass("icon-text-height")); $("#wmd-ulist-button").append($("<i>").addClass("icon-list"));
$("#wmd-hr-button").append($("<i>").addClass("icon-hr")); $("#wmd-heading-button").append($("<i>").addClass("icon-text-height"));
$("#wmd-undo-button").append($("<i>").addClass("icon-undo")); $("#wmd-hr-button").append($("<i>").addClass("icon-hr"));
$("#wmd-redo-button").append($("<i>").addClass("icon-share-alt")); $("#wmd-undo-button").append($("<i>").addClass("icon-undo"));
$("#wmd-redo-button").append($("<i>").addClass("icon-share-alt"));
} }
var layoutOrientation = 0; var layoutOrientation = 0;
@ -247,16 +250,27 @@ function createLayout() {
var layoutGlobalConfig = { closable : true, resizable : false, var layoutGlobalConfig = { closable : true, resizable : false,
slidable : false, livePaneResizing : true, spacing_open : 20, slidable : false, livePaneResizing : true, spacing_open : 20,
spacing_closed : 20, togglerLength_open : 90, spacing_closed : 20, togglerLength_open : 90,
togglerLength_closed : 90, center__minWidth : 200, togglerLength_closed : 90, center__minWidth : 100, center__minHeight : 100,
stateManagement__enabled : false, }; stateManagement__enabled : false, };
if (layoutOrientation === 0) { if (layoutOrientation === 0) {
$(".ui-layout-east").addClass("well").attr("id", "wmd-preview");
layout = $('body').layout( layout = $('body').layout(
$.extend(layoutGlobalConfig, $.extend(layoutGlobalConfig,
{ east__resizable : true, east__size : .5, east__minSize : 200, { east__resizable : true, east__size : .5, east__minSize : 200,
south__closable : false, })); south__closable : false, }));
} else if (layoutOrientation === 1) {
$(".ui-layout-east").remove();
$(".ui-layout-south").addClass("well").attr("id", "wmd-preview");
layout = $('body').layout(
$.extend(layoutGlobalConfig, { south__resizable : true,
south__size : .5, south__minSize : 200, }));
} }
$(".ui-layout-toggler-north").addClass("btn").append($("<b>").addClass("caret")); $(".ui-layout-toggler-north").addClass("btn").append(
$(".ui-layout-toggler-east").addClass("btn").append($("<b>").addClass("caret")); $("<b>").addClass("caret"));
$(".ui-layout-toggler-south").addClass("btn").append(
$("<b>").addClass("caret"));
$(".ui-layout-toggler-east").addClass("btn").append(
$("<b>").addClass("caret"));
} }
(function($) { (function($) {