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
|
.input-prepend .add-on
|
||||||
{
|
{
|
||||||
border: 1px solid #ebebeb !important;
|
border: 1px solid #ebebeb !important;
|
||||||
<<<<<<< HEAD
|
|
||||||
}
|
}
|
||||||
|
|
||||||
input.error {
|
input.error {
|
||||||
border-color: #ee5f5b !important;
|
border-color: #ff6661 !important;
|
||||||
=======
|
|
||||||
>>>>>>> branch 'gh-pages' of https://github.com/benweet/stackedit.git
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar-inner .btn {
|
.navbar-inner .btn {
|
||||||
@ -184,7 +181,7 @@ hr {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.wmd-prompt-background {
|
.wmd-prompt-background {
|
||||||
background-color: Black;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wmd-prompt-dialog {
|
.wmd-prompt-dialog {
|
||||||
|
38
index.html
38
index.html
@ -86,6 +86,44 @@
|
|||||||
<div class="ui-layout-east hide"></div>
|
<div class="ui-layout-east hide"></div>
|
||||||
<div class="ui-layout-south 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 id="modal-remove-file-confirm" class="modal hide">
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<button type="button" class="close" data-dismiss="modal"
|
<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
|
* 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.
|
* 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; }
|
this.getConverter = function () { return markdownConverter; }
|
||||||
|
|
||||||
@ -1782,7 +1783,8 @@
|
|||||||
ui.prompt(this.getString("imagedialog"), imageDefaultText, linkEnteredCallback);
|
ui.prompt(this.getString("imagedialog"), imageDefaultText, linkEnteredCallback);
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
ui.prompt(this.getString("linkdialog"), linkDefaultText, linkEnteredCallback);
|
if (!this.hooks.insertLinkDialog(linkEnteredCallback))
|
||||||
|
ui.prompt(this.getString("linkdialog"), linkDefaultText, linkEnteredCallback);
|
||||||
}
|
}
|
||||||
return true;
|
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) {
|
if (value === undefined || value.length === 0) {
|
||||||
element.stop(true, true).addClass("error").delay(400)
|
element.stop(true, true).addClass("error").delay(400)
|
||||||
.switchClass("error");
|
.switchClass("error");
|
||||||
event.stopPropagation();
|
if(event !== undefined) {
|
||||||
|
event.stopPropagation();
|
||||||
|
}
|
||||||
return undefined;
|
return undefined;
|
||||||
}
|
}
|
||||||
return value;
|
return value;
|
||||||
@ -171,6 +173,7 @@ define(["jquery", "bootstrap", "jgrowl", "layout", "Markdown.Editor"], function(
|
|||||||
};
|
};
|
||||||
|
|
||||||
// Create the PageDown editor
|
// Create the PageDown editor
|
||||||
|
var insertLinkCallback = undefined;
|
||||||
core.createEditor = function(onTextChange) {
|
core.createEditor = function(onTextChange) {
|
||||||
$("#wmd-button-bar").empty();
|
$("#wmd-button-bar").empty();
|
||||||
var converter = Markdown.getSanitizingConverter();
|
var converter = Markdown.getSanitizingConverter();
|
||||||
@ -182,6 +185,17 @@ define(["jquery", "bootstrap", "jgrowl", "layout", "Markdown.Editor"], function(
|
|||||||
return text;
|
return text;
|
||||||
});
|
});
|
||||||
var editor = new Markdown.Editor(converter);
|
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();
|
editor.run();
|
||||||
firstChange = false;
|
firstChange = false;
|
||||||
|
|
||||||
@ -277,6 +291,23 @@ define(["jquery", "bootstrap", "jgrowl", "layout", "Markdown.Editor"], function(
|
|||||||
e.stopPropagation();
|
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");
|
$("#menu-bar, .ui-layout-center, .ui-layout-east, .ui-layout-south").removeClass("hide");
|
||||||
this.loadSettings();
|
this.loadSettings();
|
||||||
this.createLayout();
|
this.createLayout();
|
||||||
|
@ -18,7 +18,8 @@ require(["jquery", "core", "file-manager", "config", "custo"], function($, core,
|
|||||||
$(function() {
|
$(function() {
|
||||||
|
|
||||||
// If browser downloaded a new app cache.
|
// 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.applicationCache.swapCache();
|
||||||
window.location.reload();
|
window.location.reload();
|
||||||
return;
|
return;
|
||||||
|
Loading…
Reference in New Issue
Block a user