1
0
mirror of https://github.com/amix/vimrc synced 2025-07-10 03:25:00 +08:00

add Previm and window management

This commit is contained in:
Max Alcala
2016-02-23 14:35:43 -06:00
parent f3143286d3
commit 14bf4d01c6
45 changed files with 3967 additions and 77 deletions

View File

@ -0,0 +1,124 @@
/*
github.com style (c) Vasily Polovnyov <vast@whiteants.net>
*/
.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
color: #333;
background: #f8f8f8;
-webkit-text-size-adjust: none;
}
.hljs-comment,
.diff .hljs-header,
.hljs-javadoc {
color: #998;
font-style: italic;
}
.hljs-keyword,
.css .rule .hljs-keyword,
.hljs-winutils,
.nginx .hljs-title,
.hljs-subst,
.hljs-request,
.hljs-status {
color: #333;
font-weight: bold;
}
.hljs-number,
.hljs-hexcolor,
.ruby .hljs-constant {
color: #008080;
}
.hljs-string,
.hljs-tag .hljs-value,
.hljs-phpdoc,
.hljs-dartdoc,
.tex .hljs-formula {
color: #d14;
}
.hljs-title,
.hljs-id,
.scss .hljs-preprocessor {
color: #900;
font-weight: bold;
}
.hljs-list .hljs-keyword,
.hljs-subst {
font-weight: normal;
}
.hljs-class .hljs-title,
.hljs-type,
.vhdl .hljs-literal,
.tex .hljs-command {
color: #458;
font-weight: bold;
}
.hljs-tag,
.hljs-tag .hljs-title,
.hljs-rules .hljs-property,
.django .hljs-tag .hljs-keyword {
color: #000080;
font-weight: normal;
}
.hljs-attribute,
.hljs-variable,
.lisp .hljs-body {
color: #008080;
}
.hljs-regexp {
color: #009926;
}
.hljs-symbol,
.ruby .hljs-symbol .hljs-string,
.lisp .hljs-keyword,
.clojure .hljs-keyword,
.scheme .hljs-keyword,
.tex .hljs-special,
.hljs-prompt {
color: #990073;
}
.hljs-built_in {
color: #0086b3;
}
.hljs-preprocessor,
.hljs-pragma,
.hljs-pi,
.hljs-doctype,
.hljs-shebang,
.hljs-cdata {
color: #999;
font-weight: bold;
}
.hljs-deletion {
background: #fdd;
}
.hljs-addition {
background: #dfd;
}
.diff .hljs-change {
background: #0086b3;
}
.hljs-chunk {
color: #aaa;
}

View File

@ -0,0 +1,260 @@
/* Flowchart variables */
/* Sequence Diagram variables */
/* Gantt chart variables */
.mermaid .label {
color: #333333;
}
.node rect,
.node circle,
.node polygon {
fill: #ececff;
stroke: #ccccff;
stroke-width: 1px;
}
.edgePath .path {
stroke: #333333;
}
.cluster rect {
fill: #ffffde !important;
rx: 4 !important;
stroke: #aaaa33 !important;
stroke-width: 1px !important;
}
.cluster text {
fill: #333333;
}
.actor {
stroke: #ccccff;
fill: #ececff;
}
text.actor {
fill: black;
stroke: none;
}
.actor-line {
stroke: grey;
}
.messageLine0 {
stroke-width: 1.5;
stroke-dasharray: "2 2";
marker-end: "url(#arrowhead)";
stroke: #333333;
}
.messageLine1 {
stroke-width: 1.5;
stroke-dasharray: "2 2";
stroke: #333333;
}
#arrowhead {
fill: #333333;
}
#crosshead path {
fill: #333333 !important;
stroke: #333333 !important;
}
.messageText {
fill: #333333;
stroke: none;
}
.labelBox {
stroke: #ccccff;
fill: #ececff;
}
.labelText {
fill: black;
stroke: none;
}
.loopText {
fill: black;
stroke: none;
}
.loopLine {
stroke-width: 2;
stroke-dasharray: "2 2";
marker-end: "url(#arrowhead)";
stroke: #ccccff;
}
.note {
stroke: #aaaa33;
fill: #fff5ad;
}
.noteText {
fill: black;
stroke: none;
font-family: 'trebuchet ms', verdana, arial;
font-size: 14px;
}
/** Section styling */
.section {
stroke: none;
opacity: 0.2;
}
.section0 {
fill: rgba(102, 102, 255, 0.49);
}
.section2 {
fill: #fff400;
}
.section1,
.section3 {
fill: white;
opacity: 0.2;
}
.sectionTitle0 {
fill: #333333;
}
.sectionTitle1 {
fill: #333333;
}
.sectionTitle2 {
fill: #333333;
}
.sectionTitle3 {
fill: #333333;
}
.sectionTitle {
text-anchor: start;
font-size: 11px;
text-height: 14px;
}
/* Grid and axis */
.grid .tick {
stroke: lightgrey;
opacity: 0.3;
shape-rendering: crispEdges;
}
.grid path {
stroke-width: 0;
}
/* Today line */
.today {
fill: none;
stroke: red;
stroke-width: 2px;
}
/* Task styling */
/* Default task */
.task {
stroke-width: 2;
}
.taskText {
text-anchor: middle;
font-size: 11px;
}
.taskTextOutsideRight {
fill: black;
text-anchor: start;
font-size: 11px;
}
.taskTextOutsideLeft {
fill: black;
text-anchor: end;
font-size: 11px;
}
/* Specific task settings for the sections*/
.taskText0,
.taskText1,
.taskText2,
.taskText3 {
fill: white;
}
.task0,
.task1,
.task2,
.task3 {
fill: #8a90dd;
stroke: #534fbc;
}
.taskTextOutside0,
.taskTextOutside2 {
fill: black;
}
.taskTextOutside1,
.taskTextOutside3 {
fill: black;
}
/* Active task */
.active0,
.active1,
.active2,
.active3 {
fill: #bfc7ff;
stroke: #534fbc;
}
.activeText0,
.activeText1,
.activeText2,
.activeText3 {
fill: black !important;
}
/* Completed task */
.done0,
.done1,
.done2,
.done3 {
stroke: grey;
fill: lightgrey;
stroke-width: 2;
}
.doneText0,
.doneText1,
.doneText2,
.doneText3 {
fill: black !important;
}
/* Tasks on the critical line */
.crit0,
.crit1,
.crit2,
.crit3 {
stroke: #ff8888;
fill: red;
stroke-width: 2;
}
.activeCrit0,
.activeCrit1,
.activeCrit2,
.activeCrit3 {
stroke: #ff8888;
fill: #bfc7ff;
stroke-width: 2;
}
.doneCrit0,
.doneCrit1,
.doneCrit2,
.doneCrit3 {
stroke: #ff8888;
fill: lightgrey;
stroke-width: 2;
cursor: pointer;
shape-rendering: crispEdges;
}
.doneCritText0,
.doneCritText1,
.doneCritText2,
.doneCritText3 {
fill: black !important;
}
.activeCritText0,
.activeCritText1,
.activeCritText2,
.activeCritText3 {
fill: black !important;
}
.titleText {
text-anchor: middle;
font-size: 18px;
fill: black;
}
/*
*/
text {
font-family: 'trebuchet ms', verdana, arial;
font-size: 14px;
}
.mermaid {
width:1200px;
}

View File

@ -0,0 +1,224 @@
#header {
border-bottom: 1px solid #ccc;
}
#last-modified {
padding-left: 10px;
}
/* GitHub-like styles based on ghf_marked.css of Docter (https://github.com/alampros/Docter) */
html {
background: #fff;
margin: 0;
padding: 0;
}
body {
font: 14px helvetica,arial,freesans,clean,sans-serif;
line-height: 1.6;
margin: 0 auto;
padding: 20px;
text-align: left;
color: #333;
width: auto;
max-width: 920px;
}
body > *:first-child {
margin-top: 0 !important;
}
body > *:last-child {
margin-bottom: 0 !important;
}
h1 {
font-size: 28px;
margin-bottom: 10px;
color: black;
}
h2 {
font-size: 24px;
margin: 20px 0 10px;
color: black;
border-bottom: 1px solid #ccc;
}
h3 {
font-size: 18px;
margin: 20px 0 10px;
}
h4 {
font-size: 16px;
font-weight: bold;
margin: 20px 0 10px;
}
h5 {
font-size: 14px;
font-weight: bold;
margin: 20px 0 10px;
}
h6 {
color: #777;
font-size: 14px;
font-weight: bold;
margin: 20px 0 10px;
}
hr {
}
p {
margin: 15px 0;
}
pre, code {
font: 12px 'Bitstream Vera Sans Mono','Courier',monospace;
}
.highlight pre, pre {
background-color: #f8f8f8;
border: 1px solid #ccc;
font-size: 13px;
line-height: 19px;
overflow: auto;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
padding: 6px 10px;
}
code {
white-space: nowrap;
border: 1px solid #eaeaea;
background-color: #f8f8f8;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
margin: 0 2px;
padding: 0 5px;
}
pre code
{
white-space: pre;
border: none;
background: transparent;
margin: 0;
padding: 0;
}
a, a code {
color: #4183C4;
text-decoration: none;
}
blockquote
{
border-left: 4px solid #ddd;
padding: 0 15px;
color: #777777;
margin: 15px 0;
}
blockquote > :first-child {
margin-top: 0;
}
blockquote > :last-child {
margin-bottom: 0;
}
table
{
font-size: 14px;
border-collapse: collapse;
margin: 20px 0 0;
padding: 0;
}
table tr
{
border-top: 1px solid #ccc;
background-color: #fff;
margin: 0;
padding: 0;
}
table tr:nth-child(2n)
{
background-color: #f8f8f8;
}
table tr th[align="center"], table tr td[align="center"] {
text-align: center;
}
table tr th[align="right"], table tr td[align="right"] {
text-align: right;
}
table tr th, table tr td
{
border: 1px solid #ccc;
text-align: left;
margin: 0;
padding: 6px 13px;
}
ul, ol
{
margin: 15px 0;
}
ul li, ol li
{
margin-top: 7px;
margin-bottom: 7px;
}
dl {
padding: 0;
}
dl dt {
font-size: 14px;
font-weight: bold;
font-style: italic;
padding: 0;
margin: 15px 0 5px;
}
dl dt:first-child {
padding: 0;
}
dl dt > :first-child {
margin-top: 0;
}
dl dt > :last-child {
margin-bottom: 0;
}
dl dd {
margin: 0 0 15px;
padding: 0 15px;
}
dl dd > :first-child {
margin-top: 0;
}
dl dd > :last-child {
margin-bottom: 0;
}
.shadow {
-webkit-box-shadow: 0 5px 15px #000;
-moz-box-shadow: 0 5px 15px #000;
box-shadow: 0 5px 15px #000;
}
@media screen and (min-width: 914px) {
body {
width: 854px;
margin:0 auto;
}
}
@media print {
table, pre {
page-break-inside: avoid;
}
}

View File

@ -0,0 +1,24 @@
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>Preview</title>
<link type="text/css" href="css/previm.css" rel="stylesheet" media="all" />
<link type="text/css" href="css/lib/mermaid.css" rel="stylesheet" media="all" />
</head>
<body id="body">
<div id="header">
<span id="markdown-file-name">Loading...</span>
<small><span id="last-modified"></span></small>
</div>
<div id="preview"></div>
<div id="footer">
<script src="js/lib/marked.min.js"></script>
<script src="js/lib/highlight.pack.js"></script>
<script src="js/lib/textile.js"></script>
<script src="js/lib/mermaid.min.js"></script>
<script src="js/previm.js"></script>
<div id="monitor"></div>
</div>
</body>
</html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,119 @@
'use strict';
(function(_doc, _win) {
var REFRESH_INTERVAL = 1000;
var marked_renderer = new marked.Renderer();
var defaultCodeBlockRenderer = marked_renderer.code;
marked_renderer.code = function (code, language) {
if(language === 'mermaid'){
return '<div class="mermaid">' + code + '</div>';
} else {
return defaultCodeBlockRenderer.apply(this, arguments);
}
};
function transform(filetype, content) {
if(hasTargetFileType(filetype, ['markdown', 'mkd'])) {
return marked(content, { renderer: marked_renderer });
} else if(hasTargetFileType(filetype, ['rst'])) {
// It has already been converted by rst2html.py
return content;
} else if(hasTargetFileType(filetype, ['textile'])) {
return textile(content);
}
return 'Sorry. It is a filetype(' + filetype + ') that is not support<br /><br />' + content;
}
function hasTargetFileType(filetype, targetList) {
var ftlist = filetype.split('.');
for(var i=0;i<ftlist.length; i++) {
if(targetList.indexOf(ftlist[i]) > -1){
return true;
}
}
return false;
}
// NOTE: Experimental
// ここで動的にpageYOffsetを取得すると画像表示前の高さになってしまう
// そのため明示的にpageYOffsetを受け取るようにしている
function autoScroll(id, pageYOffset) {
var relaxed = 0.95;
var obj = document.getElementById(id);
if((_doc.documentElement.clientHeight + pageYOffset) / _doc.body.clientHeight > relaxed) {
obj.scrollTop = obj.scrollHeight;
} else {
obj.scrollTop = pageYOffset;
}
}
function style_header() {
if (typeof isShowHeader === 'function') {
var style = isShowHeader() ? '' : 'none';
_doc.getElementById('header').style.display = style;
}
}
function loadPreview() {
var needReload = false;
// These functions are defined as the file generated dynamically.
// generator-file: preview/autoload/previm.vim
// generated-file: preview/js/previm-function.js
if (typeof getFileName === 'function') {
if (_doc.getElementById('markdown-file-name').innerHTML !== getFileName()) {
_doc.getElementById('markdown-file-name').innerHTML = getFileName();
needReload = true;
}
} else {
needReload = true;
}
if (typeof getLastModified === 'function') {
if (_doc.getElementById('last-modified').innerHTML !== getLastModified()) {
_doc.getElementById('last-modified').innerHTML = getLastModified();
needReload = true;
}
} else {
needReload = true;
}
if (needReload && (typeof getContent === 'function') && (typeof getFileType === 'function')) {
var beforePageYOffset = _win.pageYOffset;
_doc.getElementById('preview').innerHTML = transform(getFileType(), getContent());
mermaid.init();
Array.prototype.forEach.call(_doc.querySelectorAll('pre code'), hljs.highlightBlock);
autoScroll('body', beforePageYOffset);
style_header();
}
}
_win.setInterval(function() {
var script = _doc.createElement('script');
script.type = 'text/javascript';
script.src = 'js/previm-function.js?t=' + new Date().getTime();
_addEventListener(script, 'load', (function() {
loadPreview();
_win.setTimeout(function() {
script.parentNode.removeChild(script);
}, 160);
})());
_doc.getElementsByTagName('head')[0].appendChild(script);
}, REFRESH_INTERVAL);
function _addEventListener(target, type, listener) {
if (target.addEventListener) {
target.addEventListener(type, listener, false);
} else if (target.attachEvent) {
// for IE6 - IE8
target.attachEvent('on' + type, function() { listener.apply(target, arguments); });
} else {
// do nothing
}
}
loadPreview();
})(document, window);