Skip to content

Commit

Permalink
First cut of a draggy/droppy dozer mapping layout, no draggy droppy yet
Browse files Browse the repository at this point in the history
  • Loading branch information
gashcrumb committed Oct 9, 2013
1 parent 8b78fab commit f956296
Show file tree
Hide file tree
Showing 7 changed files with 266 additions and 82 deletions.
12 changes: 10 additions & 2 deletions hawtio-web/src/main/webapp/app/dozer/js/helpers.ts
Expand Up @@ -2,6 +2,14 @@ module Dozer {

export var jmxDomain = 'net.sourceforge.dozer';

/**
* Don't try and load properties for these types
* @type {Array}
*/
export var excludedPackages = [
'java.lang'
];

/**
* Lets map the class names to element names
*/
Expand Down Expand Up @@ -88,7 +96,7 @@ module Dozer {
* Finds class names matching the given search text and either invokes the function with the results
* or does a sync request and returns them.
*/
export function findClassNames(workspace: Workspace, searchText: string, limit = 10, fn = null) {
export function findClassNames(workspace: Workspace, searchText: string, limit = 20, fn = null) {
var mbean = getIntrospectorMBean(workspace);
if (mbean) {
return workspace.jolokia.execute(mbean, "findClassNames", searchText, limit, onSuccess(fn));
Expand Down Expand Up @@ -322,4 +330,4 @@ module Dozer {
}
return text;
}
}
}
9 changes: 8 additions & 1 deletion hawtio-web/src/main/webapp/app/dozer/js/model.ts
Expand Up @@ -5,10 +5,17 @@ module Dozer {
}

export class Mapping {
map_id:string;
class_a:MappingClass;
class_b:MappingClass;
fields:Field[] = [];

constructor() {
this.map_id = Core.getUUID();
this.class_a = new MappingClass('');
this.class_b = new MappingClass('');
}

name() {
return nameOf(this.class_a) + " -> " + nameOf(this.class_b);
}
Expand Down Expand Up @@ -68,4 +75,4 @@ module Dozer {
constructor(public fromField:string, public property:any, public toField:string = null) {
}
}
}
}
12 changes: 2 additions & 10 deletions hawtio-web/src/main/webapp/app/fabric/js/container.ts
Expand Up @@ -174,16 +174,8 @@ module Fabric {
}

$scope.formatStackTrace = (exception) => {
if (!exception) {
return '';
}
var answer = '<ul class="unstyled">\n';
exception.each((line) => {
answer += "<li>" + Log.formatStackLine(line) + "</li>\n"
});
answer += "</ul>\n";
return answer;
}
return Log.formatStackTrace(exception);
};

function render(response) {
if (!angular.isDefined($scope.responseJson)) {
Expand Down
18 changes: 18 additions & 0 deletions hawtio-web/src/main/webapp/app/log/js/helpers.ts
Expand Up @@ -49,6 +49,24 @@ module Log {

var _stackRegex = /\s*at\s+([\w\.$_]+(\.([\w$_]+))*)\((.*)?:(\d+)\).*\[(.*)\]/

export function formatStackTrace(exception:any) {
if (!exception) {
return '';
}
if (!angular.isArray(exception) && angular.isString(exception)) {
exception = exception.split('\n');
} else {
return '';
}

var answer = '<ul class="unstyled">\n';
exception.each((line) => {
answer += "<li>" + Log.formatStackLine(line) + "</li>\n"
});
answer += "</ul>\n";
return answer;
}

export function formatStackLine(line: string): string {
var match = _stackRegex.exec(line);
if (match && match.length > 6) {
Expand Down
233 changes: 167 additions & 66 deletions hawtio-web/src/main/webapp/app/wiki/html/dozerMappings.html
Expand Up @@ -34,79 +34,180 @@
</div>
</div>

<div class="row-fluid">
<div class="span12">
<ul class="nav nav-tabs">
<li>
<a href='' title="Add a new mapping between two classes" ng-click="addMapping()" data-placement="bottom">
<i class="icon-plus"></i> Class</a></li>
<li>
<a href='' title="Add new mappings between fields in these classes" ng-disable="!selectedMapping" ng-click="addField()" data-placement="bottom">
<i class="icon-plus"></i> Field</a></li>
<li>
<a href='' title="Deletes the selected item" ng-disabled="!canDelete()" ng-click="deleteDialog = true" data-placement="bottom">
<i class="icon-remove"></i> Delete</a></li>
</ul>
</div>
</div>
<div class="tabbable hawtio-form-tabs">

<div class="tab-pane" title="Draggy Droppy">

<div class="row-fluid">
<div class="span12 centered spacer">
<select class="no-bottom-margin" ng-model="selectedMapping" ng-options="m.map_id for m in mappings"></select>
<button class="btn"
ng-click="addMapping()"
title="Add Mapping">
<i class="icon-plus"></i>
</button>
<button class="btn"
ng-click="deleteDialog = true"
title="Delete Mapping">
<i class="icon-minus"></i>
</button>
&nbsp;
&nbsp;
<label class="inline-block" for="map_id">Map ID: </label>
<input id="map_id" type="text" class="input-xxlarge no-bottom-margin" ng-model="selectedMapping.map_id">
</div>
</div>

<script type="text/ng-template" id="property.html">
{{field.displayName}} : {{field.typeName}}
<ul>
<li ng-repeat="field in field.properties" ng-include="'property.html'"></li>
</ul>
</script>

<div class="row-fluid" hawtio-js-plumb>
<div class="span6">
<div class="row-fluid">
<input type="text" class="span12"
ng-model="selectedMapping.class_a.value"
typeahead="title for title in classNames($viewValue) | filter:$viewValue"
typeahead-editable="true" title="Java classname for class 'A'"
placeholder="Java classname for class 'A'">
</div>
<div class="row-fluid" ng-show="selectedMapping.class_a.error">
<div class="alert alert-error">
<div class="expandable closed">
<div class="title">
<i class="expandable-indicator"></i> Failed to load properties for {{selectedMapping.class_a.value}} due to {{selectedMapping.class_a.error.type}}
</div>
<div class="expandable-body well">
<div ng-bind-html-unsafe="formatStackTrace(selectedMapping.class_a.error.stackTrace)"></div>
</div>
</div>
</div>
</div>

<div class="row-fluid" ng-hide="selectedMapping.class_a.error">
<ul>
<li ng-repeat="field in selectedMapping.class_a.properties" ng-include="'property.html'"></li>
</ul>
</div>


</div>
<div class="span6">
<div class="row-fluid">
<input type="text" class="span12"
ng-model="selectedMapping.class_b.value"
typeahead="title for title in classNames($viewValue) | filter:$viewValue"
typeahead-editable="true" title="Java classname for class 'B'"
placeholder="Java classname for class 'B'">
</div>
<div class="row-fluid" ng-show="selectedMapping.class_b.error">
<div class="alert alert-error">
<div class="expandable closed">
<div class="title">
<i class="expandable-indicator"></i> Failed to load properties for {{selectedMapping.class_b.value}} due to {{selectedMapping.class_b.error.type}}
</div>
<div class="expandable-body well">
<div ng-bind-html-unsafe="formatStackTrace(selectedMapping.class_b.error.stackTrace)"></div>
</div>
</div>
</div>
</div>

<div class="row-fluid" ng-hide="selectedMapping.class_b.error">
<ul>
<li ng-repeat="field in selectedMapping.class_b.properties" ng-include="'property.html'"></li>
</ul>
</div>

</div>
</div>

<div class="row-fluid">
<div id="tree-container" class="span4">
<div hawtio-tree="mappingTree" onselect="onNodeSelect" onDragEnter="onNodeDragEnter" onDrop="onNodeDrop"
onRoot="onRootTreeNode"
hideRoot="true"></div>
</div>

<div class="span8">
<div ng-include="propertiesTemplate"></div>
</div>
</div>

<div hawtio-confirm-dialog="deleteDialog"
ok-button-text="Delete"
on-ok="removeNode()">
<div class="dialog-body">
<p>You are about to delete the selected {{selectedDescription}}
</p>
<p>This operation cannot be undone so please be careful.</p>
</div>
</div>

<div class="modal-large">
<div modal="addDialog.show" close="addDialog.close()" ng-options="addDialog.options">
<form class="form-horizontal no-bottom-margin" ng-submit="addAndCloseDialog()">
<div class="modal-header"><h4>Add Fields</h4></div>
<div class="modal-body">
<table class="">
<tr>
<th>From</th>
<th></th>
<th>To</th>
<th>Exclude</th>
</tr>
<tr ng-repeat="unmapped in unmappedFields">
<td>
{{unmapped.fromField}}
</td>
<td>-></td>
<td>
<input type="text" ng-model="unmapped.toField" ng-change="onUnmappedFieldChange(unmapped)"
typeahead="title for title in toFieldNames($viewValue) | filter:$viewValue" typeahead-editable='true'
title="The field to map to"/>
</td>
<td>
<input type="checkbox" ng-model="unmapped.exclude" ng-click="onUnmappedFieldChange(unmapped)"
title="Whether or not the field should be excluded"/>
</td>
</tr>
</table>
<div class="tab-pane" title="Tree">

<div class="row-fluid">
<div class="span12">
<ul class="nav nav-pills">
<li>
<a href='' title="Add a new mapping between two classes" ng-click="addMapping()" data-placement="bottom">
<i class="icon-plus"></i> Class</a></li>
<li>
<a href='' title="Add new mappings between fields in these classes" ng-disable="!selectedMapping" ng-click="addField()" data-placement="bottom">
<i class="icon-plus"></i> Field</a></li>
<li>
<a href='' title="Deletes the selected item" ng-disabled="!canDelete()" ng-click="deleteDialog = true" data-placement="bottom">
<i class="icon-remove"></i> Delete</a></li>
</ul>
</div>
</div>

<div class="row-fluid">
<div id="tree-container" class="span4">
<div hawtio-tree="mappingTree" onselect="onNodeSelect" onDragEnter="onNodeDragEnter" onDrop="onNodeDrop"
onRoot="onRootTreeNode"
hideRoot="true"></div>
</div>
<div class="modal-footer">
<input id="submit" class="btn btn-primary add" type="submit" ng-disabled="!unmappedFieldsHasValid"
value="Add">
<button class="btn btn-warning cancel" type="button" ng-click="addDialog.close()">Cancel</button>

<div class="span8">
<div ng-include="propertiesTemplate"></div>
</div>
</div>

<div hawtio-confirm-dialog="deleteDialog"
ok-button-text="Delete"
on-ok="removeNode()">
<div class="dialog-body">
<p>You are about to delete the selected {{selectedDescription}}
</p>
<p>This operation cannot be undone so please be careful.</p>
</div>
</form>
</div>

<div class="modal-large">
<div modal="addDialog.show" close="addDialog.close()" ng-options="addDialog.options">
<form class="form-horizontal no-bottom-margin" ng-submit="addAndCloseDialog()">
<div class="modal-header"><h4>Add Fields</h4></div>
<div class="modal-body">
<table class="">
<tr>
<th>From</th>
<th></th>
<th>To</th>
<th>Exclude</th>
</tr>
<tr ng-repeat="unmapped in unmappedFields">
<td>
{{unmapped.fromField}}
</td>
<td>-></td>
<td>
<input type="text" ng-model="unmapped.toField" ng-change="onUnmappedFieldChange(unmapped)"
typeahead="title for title in toFieldNames($viewValue) | filter:$viewValue" typeahead-editable='true'
title="The field to map to"/>
</td>
<td>
<input type="checkbox" ng-model="unmapped.exclude" ng-click="onUnmappedFieldChange(unmapped)"
title="Whether or not the field should be excluded"/>
</td>
</tr>
</table>
</div>
<div class="modal-footer">
<input id="submit" class="btn btn-primary add" type="submit" ng-disabled="!unmappedFieldsHasValid"
value="Add">
<button class="btn btn-warning cancel" type="button" ng-click="addDialog.close()">Cancel</button>
</div>
</form>
</div>
</div>
</div>

</div>

</div>

0 comments on commit f956296

Please sign in to comment.