Added custom link dialog
This commit is contained in:
parent
4fec6dcc97
commit
48b048053c
@ -42,13 +42,10 @@ div, span, a, ul, li, textarea, input, button {
|
||||
.input-prepend .add-on
|
||||
{
|
||||
border: 1px solid #ebebeb !important;
|
||||
<<<<<<< HEAD
|
||||
}
|
||||
|
||||
input.error {
|
||||
border-color: #ee5f5b !important;
|
||||
=======
|
||||
>>>>>>> branch 'gh-pages' of https://github.com/benweet/stackedit.git
|
||||
border-color: #ff6661 !important;
|
||||
}
|
||||
|
||||
.navbar-inner .btn {
|
||||
@ -184,7 +181,7 @@ hr {
|
||||
}
|
||||
|
||||
.wmd-prompt-background {
|
||||
background-color: Black;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.wmd-prompt-dialog {
|
||||
|
38
index.html
38
index.html
@ -86,6 +86,44 @@
|
||||
<div class="ui-layout-east hide"></div>
|
||||
<div class="ui-layout-south hide"></div>
|
||||
|
||||
<div id="modal-insert-link" class="modal hide">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close action-close-insert-link" data-dismiss="modal"
|
||||
aria-hidden="true">×</button>
|
||||
<h3>Hyperlink</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>Please provide the link URL and an optional title:</p>
|
||||
<div class="input-prepend">
|
||||
<span class="add-on"><i class="icon-globe"></i></span><input
|
||||
id="input-insert-link" type="text" class="span5" placeholder='http://example.com/ "optional title"'></input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#" class="btn action-close-insert-link" data-dismiss="modal">Cancel</a> <a href="#"
|
||||
class="btn btn-primary action-insert-link" data-dismiss="modal">OK</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="modal-insert-image" class="modal hide">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close action-close-insert-link" data-dismiss="modal"
|
||||
aria-hidden="true">×</button>
|
||||
<h3>Image</h3>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>Please provide the image URL and an optional title:</p>
|
||||
<div class="input-prepend">
|
||||
<span class="add-on"><i class="icon-picture"></i></span><input
|
||||
id="input-insert-image" type="text" class="span5" placeholder='http://example.com/image.jpg "optional title"'></input>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a href="#" class="btn action-close-insert-link" data-dismiss="modal">Cancel</a> <a href="#"
|
||||
class="btn btn-primary action-insert-image" data-dismiss="modal">OK</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="modal-remove-file-confirm" class="modal hide">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="close" data-dismiss="modal"
|
||||
|
@ -111,6 +111,7 @@
|
||||
* its own image insertion dialog, this hook should return true, and the callback should be called with the chosen
|
||||
* image url (or null if the user cancelled). If this hook returns false, the default dialog will be used.
|
||||
*/
|
||||
hooks.addFalse("insertLinkDialog");
|
||||
|
||||
this.getConverter = function () { return markdownConverter; }
|
||||
|
||||
@ -1782,7 +1783,8 @@
|
||||
ui.prompt(this.getString("imagedialog"), imageDefaultText, linkEnteredCallback);
|
||||
}
|
||||
else {
|
||||
ui.prompt(this.getString("linkdialog"), linkDefaultText, linkEnteredCallback);
|
||||
if (!this.hooks.insertLinkDialog(linkEnteredCallback))
|
||||
ui.prompt(this.getString("linkdialog"), linkDefaultText, linkEnteredCallback);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
33
js/core.js
33
js/core.js
@ -22,7 +22,9 @@ define(["jquery", "bootstrap", "jgrowl", "layout", "Markdown.Editor"], function(
|
||||
if (value === undefined || value.length === 0) {
|
||||
element.stop(true, true).addClass("error").delay(400)
|
||||
.switchClass("error");
|
||||
event.stopPropagation();
|
||||
if(event !== undefined) {
|
||||
event.stopPropagation();
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
return value;
|
||||
@ -171,6 +173,7 @@ define(["jquery", "bootstrap", "jgrowl", "layout", "Markdown.Editor"], function(
|
||||
};
|
||||
|
||||
// Create the PageDown editor
|
||||
var insertLinkCallback = undefined;
|
||||
core.createEditor = function(onTextChange) {
|
||||
$("#wmd-button-bar").empty();
|
||||
var converter = Markdown.getSanitizingConverter();
|
||||
@ -182,6 +185,17 @@ define(["jquery", "bootstrap", "jgrowl", "layout", "Markdown.Editor"], function(
|
||||
return text;
|
||||
});
|
||||
var editor = new Markdown.Editor(converter);
|
||||
editor.hooks.set("insertLinkDialog", function (callback) {
|
||||
insertLinkCallback = callback;
|
||||
$("#modal-insert-link").modal('show');
|
||||
return true;
|
||||
});
|
||||
editor.hooks.set("insertImageDialog", function (callback) {
|
||||
insertLinkCallback = callback;
|
||||
$("#modal-insert-image").modal('show');
|
||||
return true;
|
||||
});
|
||||
|
||||
editor.run();
|
||||
firstChange = false;
|
||||
|
||||
@ -277,6 +291,23 @@ define(["jquery", "bootstrap", "jgrowl", "layout", "Markdown.Editor"], function(
|
||||
e.stopPropagation();
|
||||
});
|
||||
|
||||
// Click events on "insert link" and "insert image" dialog buttons
|
||||
$(".action-insert-link").click(function(e) {
|
||||
var value = core.getInputValue($("#input-insert-link"), e);
|
||||
if(value !== undefined) {
|
||||
insertLinkCallback(value);
|
||||
}
|
||||
});
|
||||
$(".action-insert-image").click(function(e) {
|
||||
var value = core.getInputValue($("#input-insert-image"), e);
|
||||
if(value !== undefined) {
|
||||
insertLinkCallback(value);
|
||||
}
|
||||
});
|
||||
$(".action-close-insert-link").click(function(e) {
|
||||
insertLinkCallback(null);
|
||||
});
|
||||
|
||||
$("#menu-bar, .ui-layout-center, .ui-layout-east, .ui-layout-south").removeClass("hide");
|
||||
this.loadSettings();
|
||||
this.createLayout();
|
||||
|
@ -18,7 +18,8 @@ require(["jquery", "core", "file-manager", "config", "custo"], function($, core,
|
||||
$(function() {
|
||||
|
||||
// If browser downloaded a new app cache.
|
||||
if (window.applicationCache.status == window.applicationCache.UPDATEREADY) {
|
||||
if (window.applicationCache
|
||||
&& window.applicationCache.status == window.applicationCache.UPDATEREADY) {
|
||||
window.applicationCache.swapCache();
|
||||
window.location.reload();
|
||||
return;
|
||||
|
Loading…
Reference in New Issue
Block a user