-
Notifications
You must be signed in to change notification settings - Fork 1.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Improve imageSegmentation view extension
- Loading branch information
1 parent
f8b74e8
commit a9284ab
Showing
11 changed files
with
336 additions
and
66 deletions.
There are no files selected for viewing
37 changes: 37 additions & 0 deletions
37
digits/extensions/view/imageSegmentation/app_begin_template.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,37 @@ | ||
<!-- Copyright (c) 2016, NVIDIA CORPORATION. All rights reserved. --> | ||
|
||
<div ng-app="visualization_app" class="ng-cloak"> | ||
<div ng-controller="display_controller as dispaly"> | ||
<!-- Display Options --> | ||
<div class="pull-right"> | ||
<div class="row"> | ||
<div class="col-md-12"> | ||
<div class="button-group pull-right"> | ||
<button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown"> | ||
<span class="glyphicon glyphicon-cog"></span> | ||
<span class="caret"></span> | ||
</button> | ||
<ul class="dropdown-menu" | ||
style="padding:10px" | ||
ng-click="$event.stopPropagation()"> | ||
<li> | ||
<small>Opacity {[storage.opacity * 100 | number : 0]}%</small> | ||
<input type="range" min="0" max="1" step="0.01" ng-model="storage.opacity"> | ||
</li> | ||
<li> | ||
<small>Mask {[storage.mask * 100 | number : 0]}%</small> | ||
<input type="range" min="0" max="1" step="0.01" ng-model="storage.mask"> | ||
</li> | ||
<!-- reset --> | ||
<li> | ||
<button type="button" class="btn btn-default btn-sm dropdown-toggle" | ||
ng-click="storage.opacity = 0.3; storage.mask = 0;" | ||
title="Reset to defaults"> | ||
<span class="glyphicon glyphicon-refresh"></span> | ||
</button> | ||
</li> | ||
</ul> | ||
</div> | ||
</div> | ||
</div> | ||
</div> |
4 changes: 4 additions & 0 deletions
4
digits/extensions/view/imageSegmentation/app_end_template.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
<!-- Copyright (c) 2016, NVIDIA CORPORATION. All rights reserved. --> | ||
|
||
</div> | ||
</div> |
14 changes: 2 additions & 12 deletions
14
digits/extensions/view/imageSegmentation/header_template.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,14 +1,4 @@ | ||
{# Copyright (c) 2016, NVIDIA CORPORATION. All rights reserved. #} | ||
|
||
<h3>Legend</h3> | ||
|
||
<table> | ||
{% for category in legend %} | ||
{% set image = category['image'] %} | ||
{% set text = category['text'] %} | ||
<tr> | ||
<td><img src="{{image}}" style="max-width:100%;" /></td> | ||
<td>{{ text }}</td> | ||
</tr> | ||
{% endfor %} | ||
</table> | ||
<script type="text/javascript" src="/extension-static/view/image-segmentation/js/app.js"></script> | ||
<link rel="stylesheet" href="/extension-static/view/image-segmentation/css/app.css"> |
20 changes: 20 additions & 0 deletions
20
digits/extensions/view/imageSegmentation/static/css/app.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
/* Copyright (c) 2016, NVIDIA CORPORATION. All rights reserved. */ | ||
|
||
div.vis-div { | ||
position: relative; | ||
} | ||
img.overlay { | ||
float: left; | ||
position: absolute; | ||
left: 0px; | ||
top: 0px; | ||
} | ||
img.fill { | ||
z-index: 1; | ||
} | ||
img.mask { | ||
z-index: 2; | ||
} | ||
caption { | ||
caption-side: bottom; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,34 @@ | ||
// Copyright (c) 2016, NVIDIA CORPORATION. All rights reserved. | ||
|
||
// Angularjs app, visualization_app | ||
var app = angular.module('visualization_app', ['ngStorage']); | ||
|
||
// Controller to handle global display attributes | ||
app.controller('display_controller', | ||
['$scope', '$rootScope', '$localStorage', | ||
function($scope, $rootScope, $localStorage) { | ||
$rootScope.storage = $localStorage.$default({ | ||
opacity: .3, | ||
mask: 0.0, | ||
}); | ||
$scope.fill_style = {'opacity': $localStorage.opacity}; | ||
$scope.mask_style = {'opacity': $localStorage.mask}; | ||
// Broadcast to child scopes that the opacity has changed. | ||
$scope.$watch(function() { | ||
return $localStorage.opacity; | ||
}, function() { | ||
$scope.fill_style = {'opacity': $localStorage.opacity}; | ||
}); | ||
// Broadcast to child scopes that the mask has changed. | ||
$scope.$watch(function() { | ||
return $localStorage.mask; | ||
}, function() { | ||
$scope.mask_style = {'opacity': $localStorage.mask}; | ||
}); | ||
}]); | ||
|
||
// Because jinja uses {{ and }}, tell angular to use {[ and ]} | ||
app.config(['$interpolateProvider', function($interpolateProvider) { | ||
$interpolateProvider.startSymbol('{['); | ||
$interpolateProvider.endSymbol(']}'); | ||
}]); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.