Open morlay opened 10 years ago
The script can be translated to a StackEdit extension. You will have the same result by copy/pasting the following script in Settings->Extensions->UserCustom:
userCustom.onReady = function() {
var styles = [];
console.log('add some styles')
styles.push('#preview-contents{width:50%!important;margin:0!important;}');
styles.push('#preview-contents p,#preview-contents h1,#preview-contents h2,#preview-contents h3,#preview-contents h4,#preview-contents h5,#preview-contents h6,#preview-contents li{position:relative;}');
styles.push('#preview-contents .zh{display:block;position:absolute;top:0;right:0;width:98%;margin-right: -100%;font-size:0.8em;font-family:"微软雅黑"}');
styles.push('#preview-contents pre,#preview-contents blockquote{width: 200%;}');
styles.push('#preview-contents blockquote p{width: 46%;}');
styles.push('#preview-contents blockquote .zh{margin-right: -110%;}');
var styleNode = document.createElement("style");
styleNode.innerHTML = styles.join('');
document.getElementsByTagName('head')[0].appendChild(styleNode);
};
Errrr ……
I delete the script from userscripts
and update it tonight
https://gist.github.com/morlay/8236968
and it can be switched by a button and localStorage will store the state of isTransMode.
But how to share this to my friends, is it the only way that telling them copy the script to 'Settings->Extensions->UserCustom' ?
Could I publish the script as an extension of Stack Edit ? and other user can install it easier.
Thanks.
And another question: Is there some way to add some edition button (or shortcut) to quickly switch custom snippets?
Thanks again.
Hi @morlay
Unfortunately there is no "StackEdit market" right now to share extensions and I think this extension is too specific to be integrated in the application. If it's for a restricted group of person, you can still fork the repo, create your own extension and deploy the app on your server (or on heroku for free). I can help with deployment and configuration although it should be straight forward.
To create shortcuts, you can use mousetrap:
require(['mousetrap'], function(mousetrap) {
mousetrap.bind('ctrl+1', function() {
alert('You just hit ctrl+1!');
});
});
Hi @benweet,
Thank you very much. It works well now. And I can quick add or remove custom snippets now ( the code maybe dirty )
I think the script can be enough to easily edit(translate) some content. Thanks again. Stack Edit is awesome tool !
https://gist.github.com/morlay/8236968
userCustom.onAceCreated = function(aceEditor) {
// show line number
aceEditor.renderer.setShowGutter(true);
require(['mousetrap'], function(mousetrap) {
var zhTag = ['<span class="zh">', '</span>', 'type trans content here'];
function switchTag(aceEditor, tag) {
var selectionRange, selectionString, isEmpty, warperSelectionRange, warperSelectionString, isWraper, cursorPosition;
selectionRange = aceEditor.getSelectionRange();
selectionString = aceEditor.session.getTextRange(selectionRange);
isEmpty = (selectionString.length === 0) || (selectionString == tag[2]);
warperSelectionRange = selectionRange.clone();
warperSelectionRange.start.column = warperSelectionRange.start.column - tag[0].length;
if (warperSelectionRange.start.column < 0) {
isWraper = false;
} else {
warperSelectionRange.end.column = warperSelectionRange.end.column + tag[1].length;
warperSelectionString = aceEditor.session.getTextRange(warperSelectionRange);
isWraper = (warperSelectionString.match(new RegExp(['(', tag[0], ').*(', tag[1], ')'].join(''))) !== null);
}
if (isWraper) {
if (isEmpty) {
selectionString = '';
}
aceEditor.session.doc.replace(warperSelectionRange, selectionString);
} else {
if (isEmpty) {
selectionString = tag[2];
}
aceEditor.session.doc.replace(selectionRange, tag[0] + selectionString + tag[1]);
}
cursorPosition = aceEditor.getCursorPosition();
selectionRange.start.column = cursorPosition.column - selectionString.length - (isWraper ? 0 : tag[1].length);
selectionRange.end.column = cursorPosition.column - (isWraper ? 0 : tag[1].length);
aceEditor.selection.setSelectionRange(selectionRange);
}
mousetrap.bind('ctrl+1', function() {
// add or remove '<span class="zh"></span>' you can change the shortcut
switchTag(aceEditor, zhTag);
});
});
}
Hi Stackedit Team,
Thanks for all your good jobs.
Last night I add some style to make translated docs(both English and Chinese) to preview well by userscripts
Please add the script from http://userscripts.org/scripts/show/187329 and you can see https://stackedit.io/viewer#!url=https://gist.github.com/morlay/8208604/raw/Modular+JavaScript.md like below:
This is not a good way, and could you add a function instead ?
Thanks again. Happy new year.