Commit 6eb881a6 by Urvil Shah

Neat Display on the Editor and beautify the code

parent 04a79333
Pipeline #7636 passed with stages
in 23 minutes 1 second
...@@ -11,11 +11,11 @@ ...@@ -11,11 +11,11 @@
<link rel="stylesheet" href="~/Scripts/CodeMirror/lib/codemirror.css" /> <link rel="stylesheet" href="~/Scripts/CodeMirror/lib/codemirror.css" />
<link rel="stylesheet" href="~/Content/panes.css" /> <link rel="stylesheet" href="~/Content/panes.css" />
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/pure-min.css"> <link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.6.0/pure-min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/plugins/paragraph_style.min.js" type="text/javascript"/> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/plugins/paragraph_style.min.js" type="text/javascript" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/plugins/video.min.js" type="text/javascript" /> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/plugins/video.min.js" type="text/javascript" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/plugins/inline_style.min.js" type="text/javascript"/> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/plugins/inline_style.min.js" type="text/javascript" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/third_party/image_aviary.min.js" type="text/javascript"/> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/third_party/image_aviary.min.js" type="text/javascript" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/plugins/table.min.js" type="text/javascript"/> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/js/plugins/table.min.js" type="text/javascript" />
<link rel="stylesheet" href="../css/plugins/table.min.css"> <link rel="stylesheet" href="../css/plugins/table.min.css">
<link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/css/plugins/table.css" rel="stylesheet" type="text/css" /> <link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/css/plugins/table.css" rel="stylesheet" type="text/css" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/css/plugins/table.min.css" rel="stylesheet" type="text/css" /> <link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.7.6/css/plugins/table.min.css" rel="stylesheet" type="text/css" />
...@@ -34,17 +34,18 @@ ...@@ -34,17 +34,18 @@
<style> <style>
/* Pane configuration */ /* Pane configuration */
.left.col { .left.col {
width: 550px; width: 33%;
} }
.right.col { .right.col {
left: 650px; left: 33%;
right: 0; right: 0;
} }
.header.row { .header.row {
height: 45px; height: 45px;
line-height: 45px; line-height: 45px;
text-align: center;
} }
.body.row { .body.row {
...@@ -92,7 +93,7 @@ ...@@ -92,7 +93,7 @@
</style> </style>
</head> </head>
<body> <body>
@using (Html.BeginForm("FroalaIndex", "Template", FormMethod.Post, new { @class = "pure-form pure-form-stacked"})) @using (Html.BeginForm("FroalaIndex", "Template", FormMethod.Post, new { @class = "pure-form pure-form-stacked" }))
{ {
<div class="left col"> <div class="left col">
...@@ -100,51 +101,67 @@ ...@@ -100,51 +101,67 @@
Options Options
</div> </div>
<div class="body row scroll-y"> <div class="body row scroll-y">
<div style="width: 60%; margin:auto "> <div style="width: 50%; margin-right:10px;margin-left:40px">
<div class="pure-control-group"> <div class="pure-control-group">
<label for="Key">Template Key</label> <label for="Key">Template Key</label>
@Html.TextBoxFor(x => x.Key, new { @class = "wide" ,id="KeyValue"}) @Html.TextBoxFor(x => x.Key, new { @class = "wide", id = "KeyValue" })
</div> </div>
<br />
<div class="pure-controls"> <div class="pure-controls">
<button type="submit" class="pure-button pure-button-primary">Save Changes</button> <button type="submit" class="pure-button pure-button-primary">Save Changes</button>
</div> </div>
</div> </div>
<br /> <br />
<div style="width: 100%; text-align: center" > <div style="width: 100%; margin-right:10px;margin-left:40px">
<h3>Send test Email </h3> <h3>Send test Email </h3>
@Html.TextBox("EmailId","", new {align= "center!important", style="display: inline-block !important" ,id="EmailId"}) @Html.TextBox("EmailId", "", new { align = "center!important", style = "display: inline-block !important", id = "EmailId" })
<br /><br /> <br /><br />
<div class="pure-controls"> <div class="pure-controls">
<button type="submit" id="SendEmail" class="pure-button pure-button-primary">Send Email</button> <button type="submit" id="SendEmail" class="pure-button pure-button-primary">Send Email</button>
</div> </div>
<br /> <br /> <br /> <br />
<div id="sent_to_email"> <div id="sent_to_email">
<div class="alert alert-success" role="alert"> <div class="alert alert-success" role="alert">
<strong>Email to : <u><strong id="email_id"></strong></u> Send Successfully</strong> <strong>Email to : <u><strong id="email_id"></strong></u> Send Successfully</strong>
</div> </div>
<br /> <br />
</div> </div>
<div id="sent_to_email_failed"> <div id="sent_to_email_failed">
<div class="alert alert-success" role="alert"> <div class="alert alert-success" role="alert">
<strong>Email to : <u><strong id="email_id_failed"></strong></u> Send Failed</strong> <strong>Email to : <u><strong id="email_id_failed"></strong></u> Send Failed</strong>
</div> </div>
<br /> <br />
</div> </div>
<!-- <iframe width="375" height="650" src="/search/template?templateKey=@Model.Key&keyword=audi+a4&debug=true" style="border: solid 1px black; margin: auto"></iframe>--> <!-- <iframe width="375" height="650" src="/search/template?templateKey=@Model.Key&keyword=audi+a4&debug=true" style="border: solid 1px black; margin: auto"></iframe>-->
<div id="wrap_url_cb"> <div id="wrap_url_cb">
<div>
<h3>Wrap Url :</h3>@Html.CheckBox("WrapUrl", false,new { id = "WrapUrl" })
</div>
<div> <div>
<h3>Advertiser has Unsubscribed Url :</h3> <table>
@Html.CheckBox("WrapAdvertiserUrl", false,new {id = "WrapAdvertiserUrl"}) <tr>
<td align="left">
<b> Wrap Url :</b>
</td>
<td align="right" style="padding-left:10px">
@Html.CheckBox("WrapUrl", false, new { id = "WrapUrl" })
</td>
</tr>
<tr>
<td align="left">
<b> Advertiser has Unsubscribed Url : </b>
</td>
<td align="right" style="padding-left:10px">
@Html.CheckBox("WrapAdvertiserUrl", false, new { id = "WrapAdvertiserUrl" })
</td>
</tr>
</table>
</div> </div>
</div> </div>
</div> </div>
...@@ -155,63 +172,12 @@ ...@@ -155,63 +172,12 @@
Html Html
</div> </div>
<div class="body row scroll-y" id="froalaval"> <div class="body row scroll-y" id="froalaval">
@Html.TextAreaFor(x => x.Value,new { @class= "FroalaHtmlEditor", id="FroalaHtmlEditor" , display="none"}) @Html.TextAreaFor(x => x.Value, new { @class = "FroalaHtmlEditor", id = "FroalaHtmlEditor", display = "none" })
</div> </div>
</div> </div>
} }
@*@using (Html.BeginForm("Edit", "Template", FormMethod.Post))
{
<div class="container">
<div style="overflow-y: hidden; float: left;width: 24%;min-width:450px">
<div class="options-container" style="overflow-y: auto; overflow-x: hidden; ">
<div class="form-group">
<span><strong>Key:</strong><label class="control-label">@Model.Key</label></span>
</div>
<div class="form-group">
<label class="control-label">Template Key</label>
@Html.TextBoxFor(x => x.Key, new {@class = "form-control"})
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">Save Changes</button>
</div>
<br/>
Preview
<iframe width="375" height="650" style="border: solid 1px black;"></iframe>
</div>
</div>
<div class="code-container" style="float: left; width:70%">
@Html.TextAreaFor(x => x.Value)
</div>
</div>
}
@Scripts.Render("~/bundles/bootstrap")
<script type="text/javascript" src="~/Scripts/codemirror-2.37/lib/codemirror.js"></script>
<script type="text/javascript" src="~/Scripts/codemirror-2.37/mode/xml/xml.js"></script>
<script type="text/javascript" src="~/Scripts/codemirror-2.37/mode/javascript/javascript.js"></script>
<script type="text/javascript" src="~/Scripts/codemirror-2.37/mode/css/css.js"></script>
<script type="text/javascript" src="~/Scripts/codemirror-2.37/mode/htmlmixed/htmlmixed.js"></script>
<script>
function sizeCodeMirror() {
$('.CodeMirror').css('height', ($(window).height()) + 'px');
$('.CodeMirror').css('width', ($('.code-container').get(0).clientWidth) + 'px');
$('.options-container').css('max-height', ($(window).height()) + 'px');
}
$(function() {
CodeMirror.fromTextArea(document.getElementById('Value'), {
lineNumbers: true,
mode: "htmlmixed"
});
sizeCodeMirror();
});
$(window).resize(function() {
sizeCodeMirror();
});
</script>*@
@Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/jquery")
<script type="text/javascript" src="~/Scripts/CodeMirror/lib/codemirror.js"></script> <script type="text/javascript" src="~/Scripts/CodeMirror/lib/codemirror.js"></script>
<script type="text/javascript" src="~/Scripts/CodeMirror/mode/xml/xml.js"></script> <script type="text/javascript" src="~/Scripts/CodeMirror/mode/xml/xml.js"></script>
...@@ -257,7 +223,7 @@ ...@@ -257,7 +223,7 @@
}; };
return helpers; return helpers;
} }
$('#sent_to_email').hide(); $('#sent_to_email').hide();
$('#sent_to_email_failed').hide(); $('#sent_to_email_failed').hide();
$.get("/Template/S3Signature", {}) $.get("/Template/S3Signature", {})
...@@ -265,56 +231,55 @@ ...@@ -265,56 +231,55 @@
$('#FroalaHtmlEditor').froalaEditor({ $('#FroalaHtmlEditor').froalaEditor({
enter: $.FroalaEditor.ENTER_BR, enter: $.FroalaEditor.ENTER_BR,
fullPage: true, fullPage: true,
key: 'ukkyeD-11aB1gF-7C3uvxrpxB2G-7ol==', key: 'ukkyeD-11aB1gF-7C3uvxrpxB2G-7ol==',
htmlRemoveTags: [''], htmlRemoveTags: [''],
htmlAllowedAttrs: ['.*'], htmlAllowedAttrs: ['.*'],
heightMin:800, heightMin: 800,
htmlAllowedTags: ['.*'], htmlAllowedTags: ['.*'],
htmlAllowComments: true, htmlAllowComments: true,
toolbarInline:false, toolbarInline: false,
videoUploadToS3: data, videoUploadToS3: data,
imageUploadToS3: data imageUploadToS3: data
}) })
}); });
$('#SendEmail').click(function (e) { $('#SendEmail').click(function (e) {
e.preventDefault(); e.preventDefault();
var Content = $('#FroalaHtmlEditor').froalaEditor('html.get'); var Content = $('#FroalaHtmlEditor').froalaEditor('html.get');
if (Content.length<1) if (Content.length < 1) {
{
Content = $('#FroalaHtmlEditor').froalaEditor('codeView.get'); Content = $('#FroalaHtmlEditor').froalaEditor('codeView.get');
} }
var EmailId = document.getElementById("EmailId").value; var EmailId = document.getElementById("EmailId").value;
var key = document.getElementById("KeyValue").value; var key = document.getElementById("KeyValue").value;
var WrapUrl = document.getElementById("WrapUrl").checked; var WrapUrl = document.getElementById("WrapUrl").checked;
var WrapAdvertiserUrl = document.getElementById("WrapAdvertiserUrl").checked; var WrapAdvertiserUrl = document.getElementById("WrapAdvertiserUrl").checked;
$.ajax({ $.ajax({
url: "/Template/FroalaIndex", url: "/Template/FroalaIndex",
type: "POST", type: "POST",
data: JSON.stringify({ 'key': key, 'value': Content, 'EmailId': EmailId, 'isSendEmail': true, 'WrapUrl': WrapUrl, 'AdvertiserHasUnSub':WrapAdvertiserUrl}), data: JSON.stringify({ 'key': key, 'value': Content, 'EmailId': EmailId, 'isSendEmail': true, 'WrapUrl': WrapUrl, 'AdvertiserHasUnSub': WrapAdvertiserUrl }),
dataType: "json", dataType: "json",
traditional: true, traditional: true,
contentType: "application/json; charset=utf-8", contentType: "application/json; charset=utf-8",
success: function (data) { success: function (data) {
if (data.status == "Success") { if (data.status == "Success") {
$('#sent_to_email_failed').hide(); $('#sent_to_email_failed').hide();
$('#email_id').empty().append(EmailId); $('#email_id').empty().append(EmailId);
$('#sent_to_email').show(); $('#sent_to_email').show();
document.getElementById("EmailId").value = "" document.getElementById("EmailId").value = ""
} else { } else {
$('#sent_to_email').hide(); $('#sent_to_email').hide();
$('#email_id_failed').empty().append(EmailId); $('#email_id_failed').empty().append(EmailId);
$('#sent_to_email_failed').show(); $('#sent_to_email_failed').show();
document.getElementById("EmailId").value = "" document.getElementById("EmailId").value = ""
} }
} }
});
});
});
});
}); });
</script> </script>
</body> </body>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment