Skip to content

Commit 1ba3931

Browse files
JeremyCaneyJeremyCaney
committed
Merge branch 'maintenance/javascript-cleanup' into develop
Maintenance update focused on refactoring, mostly, client-side code. Most notably, this includes extensions of the ExtJS `TreePanel` to move the configuration of three specific tree views (navigation, relationships, and nested topics) out of the view code and into specific JavaScript files. This makes them much easier to read, validate, and debug. In addition, performed a variety of cleanup tasks, including the removal of extraneous line breaks at the end of files across the solution.
2 parents a33a950 + 1cf02e8 commit 1ba3931

80 files changed

Lines changed: 654 additions & 466 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎OnTopic.Editor.AspNetCore.Host/Program.cs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -40,4 +40,4 @@ public static IHostBuilder CreateHostBuilder(string[] args) =>
4040
});
4141

4242
} //Class
43-
} //Namespace
43+
} //Namespace

‎OnTopic.Editor.AspNetCore.Host/Startup.cs‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -142,4 +142,4 @@ public static void Configure(IApplicationBuilder app, IWebHostEnvironment env) {
142142
}
143143

144144
} //Class
145-
} //Namespace
145+
} //Namespace

‎OnTopic.Editor.AspNetCore.Host/Web.config‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,4 +61,4 @@
6161
<compiler language="vb;vbs;visualbasic;vbscript" extension=".vb" type="Microsoft.CodeDom.Providers.DotNetCompilerPlatform.VBCodeProvider, Microsoft.CodeDom.Providers.DotNetCompilerPlatform, Version=2.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" warningLevel="4" compilerOptions="/langversion:default /nowarn:41008 /define:_MYTYPE=\&quot;Web\&quot; /optionInfer+"/>
6262
</compilers>
6363
</system.codedom>
64-
</configuration>
64+
</configuration>

‎OnTopic.Editor.AspNetCore.Host/appsettings.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,4 @@
55
}
66
},
77
"AllowedHosts": "*"
8-
}
8+
}

‎OnTopic.Editor.AspNetCore/Areas/Editor/Views/Editor/Components/DisplayOptions/Default.cshtml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,4 +18,4 @@
1818
<label class="form-check-label">
1919
<input type="radio" asp-for="Value" value="Mobile" class="form-check-input" disabled=@(!Model.AttributeDescriptor.IsEnabled) required=@Model.AttributeDescriptor.IsRequired /> Mobile
2020
</label>
21-
</div>
21+
</div>

‎OnTopic.Editor.AspNetCore/Areas/Editor/Views/Editor/Components/FilePath/Default.cshtml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,4 +11,4 @@
1111
placeholder =@Model.InheritedValue
1212
disabled =@(!Model.AttributeDescriptor.IsEnabled)
1313
required =@Model.AttributeDescriptor.IsRequired
14-
/>
14+
/>

‎OnTopic.Editor.AspNetCore/Areas/Editor/Views/Editor/Components/HTML/Default.cshtml‎

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,12 @@
66

77
<style type="text/css">
88
.Content div.x-tab-panel {
9-
margin-top: 30px;
9+
margin-top : 30px;
1010
}
1111
1212
.Content ul.x-tab-strip {
13-
list-style-image: none;
14-
padding-left: 0px;
13+
list-style-image : none;
14+
padding-left : 0px;
1515
}
1616
</style>
1717

@@ -28,7 +28,7 @@
2828
<script type="text/javascript">
2929
(function ($) {
3030
31-
var textareaId = '@Html.IdFor(m => m.Value)';
31+
var textareaId = '@Html.IdFor(m => m.Value)';
3232
3333
$('[id*="EditorModal"]').on('shown.bs.modal', function(e) {
3434
$('.Modal [id*="@Html.IdFor(m => m.Value)"]').attr('id', '@Html.IdFor(m => m.Value)_Modal');
@@ -44,11 +44,10 @@
4444
})(jQuery);
4545
4646
function setEditorInstance(textareaId) {
47-
//console.log(textareaId + ' on setEditorInstance');
4847
CKEDITOR.replace(textareaId, {
49-
height : '@Model.AttributeDescriptor.Height',
50-
resize_maxHeight : '@(Model.AttributeDescriptor.Height+300)',
51-
customConfig : '/_content/OnTopic.Editor.AspNetCore/Shared/Scripts/CkEditor/customConfig.js'
48+
height : '@Model.AttributeDescriptor.Height',
49+
resize_maxHeight : '@(Model.AttributeDescriptor.Height+300)',
50+
customConfig : '/_content/OnTopic.Editor.AspNetCore/Shared/Scripts/CkEditor/customConfig.js'
5251
});
5352
}
5453
</script>

‎OnTopic.Editor.AspNetCore/Areas/Editor/Views/Editor/Components/NestedTopicList/Default.cshtml‎

Lines changed: 58 additions & 101 deletions
Original file line numberDiff line numberDiff line change
@@ -1,122 +1,79 @@
11
@model NestedTopicListAttributeViewModel
22

33
@{
4-
Layout = "~/Areas/Editor/Views/Editor/Components/_Layout.cshtml";
5-
}
6-
7-
<script type="text/javascript">
8-
var @($"{Model.AttributeDescriptor.Key}Tree");
9-
10-
Ext.onReady(function(){
11-
var Tree = Ext.tree;
4+
Layout = "~/Areas/Editor/Views/Editor/Components/_Layout.cshtml";
125

13-
//track what nodes are moved
14-
var oldPosition = null;
15-
var oldNextSibling = null;
16-
var debugMessage = "";
6+
var attributeKey = Model.AttributeDescriptor.Key;
7+
var containerName = ViewData.TemplateInfo.GetFullHtmlFieldName("Container");
8+
var treeName = attributeKey + "Tree";
179

18-
@($"{Model.AttributeDescriptor.Key}Tree") = new Tree.TreePanel({
19-
useArrows : true,
20-
autoScroll : true,
21-
animate : false,
22-
enableDD : true,
23-
containerScroll : true,
24-
border : false,
25-
baseCls : 'treeview',
26-
dataUrl : '/OnTopic/Json/@Model.WebPath/@Model.AttributeDescriptor.Key?ShowAll=true',
27-
root : new Ext.tree.AsyncTreeNode({}),
28-
rootVisible : false,
29-
listeners : {
30-
click: function (n) {
31-
var targetUrl = "@($"{Url.Action("Edit")}/{Model.AttributeDescriptor.Key}/")" + n.attributes.key;
32-
@if (Model.AttributeDescriptor.EnableModal?? true) {
33-
<text>
34-
initEditorModal('@Model.AttributeDescriptor.Key', n.attributes.text, targetUrl + '?IsModal=true', @($"{Model.AttributeDescriptor.Key}Tree_refresh"));return false;
35-
</text>
36-
}
37-
else {
38-
<text>
39-
location.href = targetUrl;
40-
</text>
41-
}
42-
},
43-
startdrag : function(tree, node, event) {
44-
oldPosition = node.parentNode.indexOf(node);
45-
oldNextSibling = node.nextSibling;
46-
},
47-
nodedragover : function(dragOverEvent) {
48-
return dragOverEvent.point !== "append";
49-
},
50-
movenode : function(tree, node, oldParent, newParent, position) {
10+
}
5111

52-
var params = {'node':node.id, 'delta':(position-oldPosition)};
12+
@if (!Model.IsNew) {
5313

54-
//Determine sibling ID to place node after, based off position
55-
var siblingId = -1;
56-
if (position > 0) {
57-
siblingId = newParent.childNodes[position-1].id;
14+
<div id="@containerName"></div>
15+
16+
<script type="text/javascript">
17+
var @($"{treeName}");
18+
19+
Ext.onReady(function () {
20+
21+
@($"{treeName}") = new OnTopic.NestedTopics('@Model.UniqueKey', {
22+
dataUrl : '/OnTopic/Json/@Model.WebPath/@attributeKey?ShowAll=true',
23+
listeners : {
24+
click : function (n) {
25+
var targetUrl = "@($"{Url.Action("Edit")}/{attributeKey}/")" + n.attributes.key;
26+
@if (Model.AttributeDescriptor.EnableModal?? true) {
27+
<text>
28+
initEditorModal('@attributeKey', n.attributes.text, targetUrl + '?IsModal=true', @($"{treeName}.refresh"));return false;
29+
</text>
30+
}
31+
else {
32+
<text>
33+
location.href = targetUrl;
34+
</text>
35+
}
5836
}
37+
}
38+
});
5939

60-
//Ext.Msg.alert("Debugging", "Node: " + node.attributes.id + ", OldParent: " + oldParent.attributes.id + ", Parent: " + newParent.attributes.id + ", Sibling: " + siblingId);
61-
62-
$.ajax({
63-
method: "POST",
64-
url: "/OnTopic/Move",
65-
data: { topicId: node.attributes.id, targetTopicId: -1, siblingId }
66-
})
40+
@($"{treeName}").render('@containerName');
6741

68-
}
69-
}
7042
});
7143

72-
@if (!Model.IsNew) {
73-
<text>
74-
@($"{Model.AttributeDescriptor.Key}Tree").render('@ViewData.TemplateInfo.GetFullHtmlFieldName("Container")');
75-
</text>
76-
}
77-
});
44+
</script>
7845

79-
function @($"{Model.AttributeDescriptor.Key}Tree")_refresh() {
80-
@($"{Model.AttributeDescriptor.Key}Tree").getLoader().load(@($"{Model.AttributeDescriptor.Key}Tree").root);
81-
};
46+
<vc:content-type-list
47+
current-topic =@Model.CurrentTopic
48+
attribute-descriptor =@Model.AttributeDescriptor
49+
on-modal-close =@($"{treeName}.refresh")
50+
values =@Model.AttributeDescriptor.PermittedContentTypes>
51+
</vc:content-type-list>
52+
53+
<div id="@($"EditorModal_{attributeKey}")" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
54+
<div class="modal-dialog modal-lg">
55+
<div class="modal-header page title">
56+
<h2 id="@($"ModalTitle_{attributeKey}")"><!-- determined by modal open script caller --></h2>
57+
</div>
58+
<div class="modal-content">
59+
<iframe id="@($"EditorFrame_{attributeKey}")" src="" width="100%" marginheight="0" frameborder="0">
60+
<!-- iframe source determined by modal open script caller -->
61+
</iframe>
62+
</div>
63+
</div>
64+
</div>
8265

66+
<script>
67+
$(function() {
68+
$('[id^="EditorModal"]').on('hide.bs.modal', function (e) {
69+
@($"{treeName}.refresh")();
70+
});
71+
});
8372
</script>
8473

85-
<div id="@ViewData.TemplateInfo.GetFullHtmlFieldName("Container")"></div>
86-
87-
@if (!Model.IsNew) {
88-
<text>
89-
<vc:content-type-list
90-
current-topic =@Model.CurrentTopic
91-
attribute-descriptor =@Model.AttributeDescriptor
92-
on-modal-close =@($"{Model.AttributeDescriptor.Key}Tree_refresh")
93-
values =@Model.AttributeDescriptor.PermittedContentTypes>
94-
</vc:content-type-list>
95-
</text>
9674
}
9775
else {
9876
<div class="alert alert-warning">
9977
Subtopics cannot be created until this topic has been saved. Save the topic, then add nested topics.
10078
</div>
101-
}
102-
103-
<div id="@($"EditorModal_{Model.AttributeDescriptor.Key}")" class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
104-
<div class="modal-dialog modal-lg">
105-
<div class="modal-header page title">
106-
<h2 id="@($"ModalTitle_{Model.AttributeDescriptor.Key}")"><!-- determined by modal open script caller --></h2>
107-
</div>
108-
<div class="modal-content">
109-
<iframe id="@($"EditorFrame_{Model.AttributeDescriptor.Key}")" src="" width="100%" marginheight="0" frameborder="0">
110-
<!-- iframe source determined by modal open script caller -->
111-
</iframe>
112-
</div>
113-
</div>
114-
</div>
115-
116-
<script>
117-
$(function() {
118-
$('[id^="EditorModal"]').on('hide.bs.modal', function (e) {
119-
@($"{Model.AttributeDescriptor.Key}Tree_refresh")();
120-
});
121-
});
122-
</script>
79+
}

‎OnTopic.Editor.AspNetCore/Areas/Editor/Views/Editor/Components/Relationship/Default.cshtml‎

Lines changed: 12 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -2,56 +2,24 @@
22

33
@{
44
Layout = "~/Areas/Editor/Views/Editor/Components/_Layout.cshtml";
5-
var rootTopicKey = Model.AttributeDescriptor.RootTopic?.UniqueKey.Replace(":", "/") ?? Model.AttributeDescriptor.RootTopicKey?.Replace(":", "/") ?? "Root";
5+
6+
var descriptor = Model.AttributeDescriptor;
7+
var rootTopicKey = descriptor.RootTopic?.UniqueKey.Replace(":", "/")?? descriptor.RootTopicKey?.Replace(":", "/")?? "Root";
8+
var containerName = ViewData.TemplateInfo.GetFullHtmlFieldName("TreeView");
9+
610
}
711

812
<input asp-for="Value" type="hidden" />
9-
<div id="@ViewData.TemplateInfo.GetFullHtmlFieldName("TreeView")"></div>
13+
14+
<div id="@containerName"></div>
1015

1116
<script type="text/javascript">
1217
Ext.onReady(function(){
13-
var Tree = Ext.tree;
14-
var Storage = Ext.get("@Html.IdFor(m => m.Value)");
15-
var relationships = Storage.dom.value.split(",");
16-
17-
tree = new Tree.TreePanel({
18-
id : 'relatedTree',
19-
useArrows : true,
20-
autoScroll : true,
21-
animate : true,
22-
enableDD : false,
23-
containerScroll : true,
24-
border : false,
25-
baseCls : 'RelationshipsTreeView',
26-
dataUrl : '/OnTopic/Json/@rootTopicKey?ShowRoot=@Model.AttributeDescriptor.ShowRoot&ShowAll=true&RelatedNamespace=@Model.AttributeDescriptor.Key&RelatedTopicID=@Model.CurrentTopic.Id&AttributeName=@Model.AttributeDescriptor.AttributeKey&AttributeValue=@Model.AttributeDescriptor.AttributeValue',
27-
root : new Ext.tree.AsyncTreeNode({
28-
checked : true,
29-
text : 'Web',
30-
draggable : false,
31-
id : 'related',
32-
leaf : false
33-
}),
34-
rootVisible : false,
35-
listeners : {
36-
click : function(node) {
37-
node.checked = true;
38-
node.select();
39-
return true;
40-
},
41-
checkchange : function(node, checked) {
42-
if (checked) {
43-
relationships.push(node.attributes.id.toString());
44-
}
45-
else {
46-
relationships.remove(node.attributes.id.toString());
47-
}
48-
Storage.dom.value = relationships.concat(",");
49-
@(Model.AttributeDescriptor.CheckAscendants is true? "" : "return true")
50-
if (checked && node.parentNode) node.parentNode.getUI().toggleCheck(true);
51-
}
52-
}
18+
var tree = new OnTopic.SelectableTreeView({
19+
dataUrl : '/OnTopic/Json/@rootTopicKey?ShowRoot=@descriptor.ShowRoot&ShowAll=true&RelatedNamespace=@descriptor.Key&RelatedTopicID=@Model.CurrentTopic.Id&AttributeName=@descriptor.AttributeKey&AttributeValue=@descriptor.AttributeValue',
20+
checkAscendants : @((descriptor.CheckAscendants is true).ToString().ToLower()),
21+
backingField : '@Html.IdFor(m => m.Value)'
5322
});
54-
tree.render('@ViewData.TemplateInfo.GetFullHtmlFieldName("TreeView")');
55-
23+
tree.render('@containerName');
5624
});
5725
</script>

‎OnTopic.Editor.AspNetCore/Areas/Editor/Views/Editor/Components/TokenizedTopicList/Default.cshtml‎

Lines changed: 18 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,34 +2,37 @@
22

33
@{
44
Layout = "~/Areas/Editor/Views/Editor/Components/_Layout.cshtml";
5-
var rootTopicKey = Model.AttributeDescriptor.RootTopic?.UniqueKey.Replace(":", "/") ?? Model.AttributeDescriptor.RootTopicKey?.Replace(":", "/") ?? "Root";
5+
6+
var descriptor = Model.AttributeDescriptor;
7+
var rootTopicKey = descriptor.RootTopic?.UniqueKey.Replace(":", "/")?? descriptor.RootTopicKey?.Replace(":", "/") ?? "Root";
8+
69
}
710

811
<div>
912
<input
10-
asp-for ="Value"
11-
class ="@Model.AttributeDescriptor.CssClass"
12-
disabled =@(!Model.AttributeDescriptor.IsEnabled)
13-
required =@Model.AttributeDescriptor.IsRequired
13+
asp-for ="Value"
14+
class ="@descriptor.CssClass"
15+
disabled =@(!descriptor.IsEnabled)
16+
required =@descriptor.IsRequired
1417
/>
1518
</div>
1619

1720
<script>
1821
$(function() {
1922
2023
//Create new instance of TokenizedTopics and set relevant properties
21-
var tokenizedTopics = new TokenizedTopics();
22-
tokenizedTopics.selector = '#@Html.IdFor(m => m.Value)';
23-
tokenizedTopics.scope = '@rootTopicKey';
24-
tokenizedTopics.attributeName = '@Model.AttributeDescriptor.AttributeKey';
25-
tokenizedTopics.attributeValue = '@Model.AttributeDescriptor.AttributeValue';
26-
tokenizedTopics.resultLimit = '@Model.AttributeDescriptor.ResultLimit';
27-
tokenizedTopics.tokenLimit = @Model.AttributeDescriptor.TokenLimit;
28-
tokenizedTopics.isAutoPostBack = @((Model.AttributeDescriptor.AutoPostBack?? false).ToString().ToLower());
29-
tokenizedTopics.selectedTopics = @Html.Raw(Model.SelectedTopics);
24+
var topics = new TokenizedTopics();
25+
topics.selector = '#@Html.IdFor(m => m.Value)';
26+
topics.scope = '@rootTopicKey';
27+
topics.attributeName = '@descriptor.AttributeKey';
28+
topics.attributeValue = '@descriptor.AttributeValue';
29+
topics.resultLimit = '@descriptor.ResultLimit';
30+
topics.tokenLimit = @descriptor.TokenLimit;
31+
topics.isAutoPostBack = @((descriptor.AutoPostBack?? false).ToString().ToLower());
32+
topics.selectedTopics = @Html.Raw(Model.SelectedTopics);
3033
3134
//Fire TokenizedTopics.prototype.getTokenizedTopics() (and $([selector]).tokenInput())
32-
tokenizedTopics.getTokenizedTopics();
35+
topics.getTokenizedTopics();
3336
3437
});
3538

0 commit comments

Comments
 (0)