Skip to content

Commit

Permalink
Updated UI files
Browse files Browse the repository at this point in the history
  • Loading branch information
AaronSadlerUK committed Jul 26, 2021
1 parent e2b51d3 commit ba519ce
Show file tree
Hide file tree
Showing 11 changed files with 259 additions and 177 deletions.
11 changes: 9 additions & 2 deletions TestSite.V9/App_Plugins/UmbNav/js/umbnav.controller.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
var vm = this;
var dialogOptions = $scope.model;
vm.wideMode = Object.toBoolean(dialogOptions.config.hideLabel);
vm.allowChildNodes = Object.toBoolean(!dialogOptions.config.hideIncludeChildren);
vm.items = [];

if (dialogOptions.config.expandOnHoverTimeout > 0) {
Expand Down Expand Up @@ -83,6 +84,10 @@

function openSettings(item, callback) {

if (item != null && item.itemType == null) {
item.itemType = 'link';
}

var settingsEditor = {
title: "Settings",
view: "/App_Plugins/UmbNav/Views/settings.html",
Expand All @@ -92,6 +97,7 @@
allowDisplay: dialogOptions.config.allowDisplay,
allowCustomClasses: dialogOptions.config.allowCustomClasses,
allowImageIcon: dialogOptions.config.allowImageIcon,
hideIncludeChildren: dialogOptions.config.hideIncludeChildren,
currentTarget: item,
submit: function (model) {
model.target.description = model.target.url + model.target.anchor;
Expand Down Expand Up @@ -145,13 +151,14 @@
customClasses: data.customClasses,
imageUrl: data.imageUrl,
anchor: data.anchor,
url: url || "#",
url: url,
children: data.children || [],
icon: data.icon || "icon-link",
published: data.published,
naviHide: data.naviHide,
culture: data.culture,
includeChildNodes: data.includeChildren
includeChildNodes: data.includeChildren,
itemType: data.itemType
}
}
}
Expand Down
20 changes: 13 additions & 7 deletions TestSite.V9/App_Plugins/UmbNav/js/umbnav.settings.controller.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,10 +11,7 @@
vm.toggleChildren = toggleChildren;
vm.showAdvanced = false;
vm.labels = {};
vm.labels.itemTypes = [
{ 'value': 'link', 'label': 'Link' },
{ 'value': 'label', 'label': 'Label' }
];
vm.labels.itemTypes = {};
localizationService.localizeMany(['defaultdialogs_openInNewWindow']).then(function (data) {
vm.labels.openInNewWindow = data[0];
});
Expand All @@ -40,11 +37,20 @@
vm.labels.imageIconUrl = data[0];
});
localizationService.localizeMany(['umbnav_link']).then(function (data) {
vm.labels.link = data[0];
vm.labels.itemTypes.link = { 'value': 'link', 'label': data[0] };
});
localizationService.localizeMany(['umbnav_label']).then(function (data) {
vm.labels.itemTypes.label = { 'value': 'nolink', 'label': data[0] };
});
localizationService.localizeMany(['umbnav_menuItem']).then(function (data) {
vm.labels.menuItem = data[0];
});
localizationService.localizeMany(['umbnav_configuration']).then(function (data) {
vm.labels.configuration = data[0];
});
localizationService.localizeMany(['umbnav_linkTypeDescription']).then(function (data) {
vm.labels.linkTypeDescription = data[0];
});
if (!$scope.model.title) {
localizationService.localize('defaultdialogs_selectLink').then(function (value) {
$scope.model.title = value;
Expand All @@ -64,7 +70,7 @@
$scope.showTarget = $scope.model.hideTarget !== true;
$scope.showDisplay = $scope.model.allowDisplay === true;
$scope.showNoopener = $scope.model.hideNoopener !== true;
$scope.showNoreferrer = $scope.model.hideNoreferrer!== true;
$scope.showNoreferrer = $scope.model.hideNoreferrer !== true;
$scope.showAnchor = $scope.model.hideAnchor !== true;
$scope.showIncludeChildren = $scope.model.hideIncludeChildren !== true;
$scope.showCustomClasses = $scope.model.allowCustomClasses === true;
Expand Down Expand Up @@ -135,7 +141,7 @@
vm.openInNewWindow = $scope.model.target.target === '_blank';
vm.hideLoggedIn = $scope.model.target.hideLoggedIn;
vm.hideLoggedOut = $scope.model.target.hideLoggedOut;
vm.includeChildren = $scope.model.target.includeChildren;
vm.includeChildren = $scope.model.target.includeChildNodes;
vm.showNoopener = $scope.model.target.noopener === 'noopener' && $scope.model.target.id === null || $scope.model.target.udi === null;
vm.showNoreferrer = $scope.model.target.noreferrer === 'noreferrer' && $scope.model.target.id === null || $scope.model.target.udi === null;
} else if (dialogOptions.anchors) {
Expand Down
6 changes: 6 additions & 0 deletions TestSite.V9/App_Plugins/UmbNav/lang/en-us.xml
Original file line number Diff line number Diff line change
Expand Up @@ -22,5 +22,11 @@
<key alias="ImageIconUrl">Image/Icon Url, id, udi or GUID</key>
<key alias="configuration">Advanced Configuration</key>
<key alias="link">Link</key>
<key alias="label">Label</key>
<key alias="menuItem">Menu Item</key>
<key alias="title">Title</key>
<key alias="itemType">Menu Item Type</key>
<key alias="linkTypeDescription">Select menu item type</key>
<key alias="linkTypeDescription">Select menu item type</key>
</area>
</language>
2 changes: 1 addition & 1 deletion TestSite.V9/App_Plugins/UmbNav/views/editor.html
Original file line number Diff line number Diff line change
Expand Up @@ -42,7 +42,7 @@
<i ng-if="item.icon" class="umb-node-preview__icon {{ item.icon }}" aria-hidden="true"></i>
<div class="umb-node-preview__content">

<div class="umb-node-preview__name" ng-attr-title="{{item.title || item.name}}">{{ item.title || item.name }} <span ng-if="item.includeChildNodes" class="umbnav-label umbnav-label-primary"><localize key="umbnav_includesChildNodes"></localize></span></div>
<div class="umb-node-preview__name" ng-attr-title="{{item.title || item.name}}">{{ item.title || item.name }} <span ng-if="item.includeChildNodes && vm.allowChildNodes" class="umbnav-label umbnav-label-primary"><localize key="umbnav_includesChildNodes"></localize></span></div>
<div class="umb-node-preview__description" ng-if="item.description">{{ item.description }}</div>
</div>
</div>
Expand Down
180 changes: 100 additions & 80 deletions TestSite.V9/App_Plugins/UmbNav/views/settings.html
Original file line number Diff line number Diff line change
Expand Up @@ -11,99 +11,120 @@

<umb-editor-container class="block-form">
<umb-box>
<umb-box-header ng-if="!vm.loading" title="{{vm.labels.link}}"></umb-box-header>
<umb-box-header ng-if="!vm.loading" title="{{vm.labels.menuItem}}"></umb-box-header>
<umb-box-content>
<select ng-change="itemTypeChanged()" ng-model="model.target.itemType">
<option ng-repeat="itemType in vm.labels.itemTypes" ng-value="itemType.value">{{itemType.key}}</option>
</select>
<div ng-class="{'flex': showAnchor}">

<umb-control-group label="@defaultdialogs_urlLinkPicker" class="umb-linkpicker__url">
<input type="text"
style="margin-right: 10px;"
localize="placeholder"
placeholder="@general_url"
class="umb-property-editor umb-textstring"
ng-model="model.target.url"
umb-auto-focus
ng-disabled="model.target.id || model.target.udi"/>
<umb-control-group label="@umbnav_itemType">
<div class="umb-property-editor">
<div class=" flex items-center">
<select ng-model="model.target.itemType">
<option value="{{vm.labels.itemTypes.link.value}}">{{vm.labels.itemTypes.link.label}}</option>
<option value="{{vm.labels.itemTypes.label.value}}">{{vm.labels.itemTypes.label.label}}</option>
</select>
<div class="ml2">
{{vm.labels.linkTypeDescription}}
</div>
</div>
</div>
</umb-control-group>
<div ng-if="model.target.itemType == 'link'">
<div ng-class="{'flex': showAnchor}">

<umb-control-group label="@defaultdialogs_urlLinkPicker" class="umb-linkpicker__url">
<input type="text"
style="margin-right: 10px;"
localize="placeholder"
placeholder="@general_url"
class="umb-property-editor umb-textstring"
ng-model="model.target.url"
umb-auto-focus
ng-disabled="model.target.id || model.target.udi" />
</umb-control-group>

<umb-control-group label="@defaultdialogs_anchorLinkPicker" class="umb-linkpicker__anchor" ng-if="showAnchor">
<input type="text"
list="anchors"
localize="placeholder"
placeholder="@placeholders_anchor"
class="umb-property-editor umb-textstring"
ng-model="model.target.anchor" />

<datalist id="anchors">
<option value="{{a}}" ng-repeat="a in anchorValues"></option>
</datalist>
</umb-control-group>
</div>
<umb-control-group label="@general_name"
ng-if="model.target.name">
{{model.target.name}}
</umb-control-group>

<umb-control-group label="@defaultdialogs_anchorLinkPicker" class="umb-linkpicker__anchor" ng-if="showAnchor">
<umb-control-group label="@defaultdialogs_nodeNameLinkPicker">
<input type="text"
list="anchors"
localize="placeholder"
placeholder="@placeholders_anchor"
placeholder="@placeholders_entername"
class="umb-property-editor umb-textstring"
ng-model="model.target.anchor"/>

<datalist id="anchors">
<option value="{{a}}" ng-repeat="a in anchorValues"></option>
</datalist>
ng-model="model.target.title"
ng-required="!model.target.name" />
</umb-control-group>
</div>
<umb-control-group label="@general_name"
ng-if="model.target.name">
{{model.target.name}}
</umb-control-group>

<umb-control-group label="@defaultdialogs_nodeNameLinkPicker">
<input type="text"
localize="placeholder"
placeholder="@placeholders_entername"
class="umb-property-editor umb-textstring"
ng-model="model.target.title"
ng-required="!model.target.name"/>
</umb-control-group>

<div class="umb-control-group">
<h5>
<localize key="defaultdialogs_linkToPage">Link to page</localize>
</h5>

<div ng-hide="miniListView">
<umb-tree-search-box hide-search-callback="hideSearch"
search-callback="onSearchResults"
search-from-id="{{searchInfo.searchFromId}}"
search-from-name="{{searchInfo.searchFromName}}"
datatype-key="{{searchInfo.dataTypeKey}}"
show-search="{{searchInfo.showSearch}}"
section="{{section}}">
</umb-tree-search-box>

<br/>

<umb-tree-search-results ng-if="searchInfo.showSearch"
results="searchInfo.results"
select-result-callback="selectResult">
</umb-tree-search-results>

<div ng-hide="searchInfo.showSearch">
<umb-tree section="content"
hideheader="true"
hideoptions="true"
api="dialogTreeApi"
on-init="onTreeInit()"
enablelistviewexpand="true"
isdialog="true"
enablecheckboxes="true"
customtreeparams="{{customTreeParams}}">
</umb-tree>
<div class="umb-control-group">
<h5>
<localize key="defaultdialogs_linkToPage">Link to page</localize>
</h5>

<div ng-hide="miniListView">
<umb-tree-search-box hide-search-callback="hideSearch"
search-callback="onSearchResults"
search-from-id="{{searchInfo.searchFromId}}"
search-from-name="{{searchInfo.searchFromName}}"
datatype-key="{{searchInfo.dataTypeKey}}"
show-search="{{searchInfo.showSearch}}"
section="{{section}}">
</umb-tree-search-box>

<br />

<umb-tree-search-results ng-if="searchInfo.showSearch"
results="searchInfo.results"
select-result-callback="selectResult">
</umb-tree-search-results>

<div ng-hide="searchInfo.showSearch">
<umb-tree section="content"
hideheader="true"
hideoptions="true"
api="dialogTreeApi"
on-init="onTreeInit()"
enablelistviewexpand="true"
isdialog="true"
enablecheckboxes="true"
customtreeparams="{{customTreeParams}}">
</umb-tree>
</div>
</div>
</div>

<umb-mini-list-view ng-if="miniListView"
node="miniListView"
entity-type="Document"
on-select="selectListViewNode(node)"
on-close="closeMiniListView()">
</umb-mini-list-view>
<umb-mini-list-view ng-if="miniListView"
node="miniListView"
entity-type="Document"
on-select="selectListViewNode(node)"
on-close="closeMiniListView()">
</umb-mini-list-view>

</div>
</div>
<div ng-if="model.target.itemType == 'nolink'">
<umb-control-group label="@umbnav_title">
<input type="text"
localize="placeholder"
placeholder="@placeholders_entername"
class="umb-property-editor umb-textstring"
ng-model="model.target.title"
ng-required="!model.target.name" />
</umb-control-group>
</div>

</umb-box-content>
</umb-box>
<umb-box>
<umb-box ng-if="model.target.itemType == 'link'">
<umb-box-header ng-if="!vm.loading" title="{{vm.labels.configuration}}" ng-click="vm.showAdvanced = !vm.showAdvanced" style="cursor: pointer;">
<i class="icon icon-navigation-up" ng-if="vm.showAdvanced" title="expand"></i>
<i class="icon icon-navigation-down" ng-if="!vm.showAdvanced" title="collapse"></i>
Expand Down Expand Up @@ -134,7 +155,6 @@ <h5>
text="{{vm.labels.includeChildNodes}}">
</umb-checkbox>
</umb-control-group>

<umb-control-group ng-if="showNoopener || showNoreferrer" label="@umbnav_seo">
<umb-checkbox ng-if="showNoopener" model="vm.showNoopener"
on-change="vm.toggleshowNoopener(model, value)"
Expand Down
5 changes: 1 addition & 4 deletions TestSite.V9/TestSite.V9.csproj
Original file line number Diff line number Diff line change
Expand Up @@ -52,10 +52,7 @@
<None Remove="App_Plugins\UmbNav\views\settings.html" />
</ItemGroup>
<ItemGroup>
<Content Include="App_Plugins\UmbNav\css\editor.css">
<ExcludeFromSingleFile>true</ExcludeFromSingleFile>
<CopyToPublishDirectory>Always</CopyToPublishDirectory>
</Content>
<Content Include="App_Plugins\UmbNav\css\editor.css" />
<Content Include="App_Plugins\UmbNav\js\angular-ui-tree.js" />
<Content Include="App_Plugins\UmbNav\js\umbnav.controller.js" />
<Content Include="App_Plugins\UmbNav\js\umbnav.resource.js" />
Expand Down
Loading

0 comments on commit ba519ce

Please sign in to comment.