upload to community now code complete. Added a custom "copy link to clipboard" directive. This is looking much better now.
This commit is contained in:
Ron Gilchrist
Родитель
17f60e9fc8
Коммит
62047b6381
|
|
@ -177,6 +177,7 @@
|
|||
<script src="<%= ResourcesLocation %>/directives/EditSlideValues.js?v=<%= ResourcesVersion%>"></script>
|
||||
<script src="<%= ResourcesLocation %>/directives/ContextMenu.js?v=<%= ResourcesVersion%>"></script>
|
||||
<script src="<%= ResourcesLocation %>/directives/Movable.js?v=<%= ResourcesVersion%>"></script>
|
||||
<script src="<%= ResourcesLocation %>/directives/CopyToClipboard.js?v=<%= ResourcesVersion%>"></script>
|
||||
<script src="<%= ResourcesLocation %>/factories/appstate.js?v=<%= ResourcesVersion%>"></script>
|
||||
<script src="<%= ResourcesLocation %>/factories/autohidepanels.js?v=<%= ResourcesVersion%>"></script>
|
||||
<script src="<%= ResourcesLocation %>/factories/localization.js?v=<%= ResourcesVersion%>"></script>
|
||||
|
|
|
|||
|
|
@ -46,6 +46,7 @@ module.exports = function(grunt) {
|
|||
'directives/ContextMenu.js',
|
||||
'directives/EditSlideValues.js',
|
||||
'directives/Movable.js',
|
||||
'directives/CopyToClipboard.js',
|
||||
'factories/appstate.js',
|
||||
'factories/autohidepanels.js',
|
||||
'factories/localization.js',
|
||||
|
|
|
|||
|
|
@ -176,16 +176,14 @@
|
|||
var blob = tour.saveToBlob();
|
||||
var filename = tour._title + '.wtt';
|
||||
if ($rootScope.loggedIn) {
|
||||
$scope.confirm = function (upload) {
|
||||
$scope.modalData = {
|
||||
step: 'save',
|
||||
tourTitle:tour._title
|
||||
};
|
||||
$scope.modalData.saveChoice = function (upload) {
|
||||
$scope.$applyAsync(function () {
|
||||
if (upload) {
|
||||
|
||||
var uploadingModal = $modal({
|
||||
scope: $scope,
|
||||
template: 'views/modals/message.html',
|
||||
show: true,
|
||||
content: 'Uploading ' + tour._title + ' to your default community. Please wait...',
|
||||
placement: 'center'
|
||||
});
|
||||
$scope.modalData.step='progress'
|
||||
var fd = new FormData();
|
||||
fd.append('fname', filename);
|
||||
fd.append('data', blob);
|
||||
|
|
@ -199,37 +197,44 @@
|
|||
},
|
||||
contentType: 'text/plain'
|
||||
}).done(function (data) {
|
||||
//uploadingModal.$hide();
|
||||
hideModal(uploadingModal);
|
||||
var message;
|
||||
if (data && parseInt(data) > 1) {
|
||||
message = "Tour successfully uploaded. <a href='/Community/Profile' target='wwt'>Click to manage your WWT Community Profile</a>";
|
||||
|
||||
} else {
|
||||
message = "There was an error uploading your tour. " + data;
|
||||
}
|
||||
$scope.showModalButtons = true;
|
||||
var successModal = $modal({
|
||||
scope: $scope,
|
||||
template: 'views/modals/message.html',
|
||||
show: true,
|
||||
content: message,
|
||||
placement: 'center'
|
||||
|
||||
$scope.$applyAsync(function () {
|
||||
if (data && data.length > 1) {
|
||||
$scope.modalData.step = 'success';
|
||||
var url = 'http://' + location.host + 'file/Download/' + data + '/' + tour._title + '/wtt'
|
||||
$scope.modalData.download = {
|
||||
url: url,
|
||||
showStatus: false,
|
||||
label: 'Share Download Link'
|
||||
};
|
||||
$scope.modalData.share = {
|
||||
url: 'http://' + location.host + '/webclient?tourUrl=' + encodeURIComponent(url),
|
||||
showStatus: false,
|
||||
label: 'Share Playable Link'
|
||||
}
|
||||
|
||||
|
||||
} else {
|
||||
$scope.modalData.step = 'error';
|
||||
$scope.modalData.error = +data;
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
}
|
||||
else {
|
||||
saveRawFile();
|
||||
|
||||
}
|
||||
hideModal(saveTourAsModal);
|
||||
});
|
||||
}
|
||||
var saveTourAsModal = $modal({
|
||||
scope: $scope,
|
||||
template: 'views/modals/userconfirm.html',
|
||||
templateUrl: 'views/modals/tour-uploader.html',
|
||||
show: true,
|
||||
content: 'Upload this tour to your WWT community profile now? Click cancel to download the tour locally.',
|
||||
content: '',
|
||||
placement:'center'
|
||||
});
|
||||
|
||||
|
|
|
|||
|
|
@ -1140,7 +1140,7 @@ body.wwt-webclient-wrapper.mobile{
|
|||
#lstImagery{
|
||||
width:180px;
|
||||
}
|
||||
.btn, .introjs-button {
|
||||
.btn, .introjs-button, .input-group-addon {
|
||||
font-size: 12px;
|
||||
color: lighten( @text-color, 10%);
|
||||
.boxGradient();
|
||||
|
|
@ -1157,7 +1157,32 @@ body.wwt-webclient-wrapper.mobile{
|
|||
background-color: rgba(88,88,88,.7);
|
||||
border: solid 1px rgba(88, 88, 88, .9);
|
||||
}
|
||||
|
||||
.input-group-addon {
|
||||
border-radius: 3px;
|
||||
border-top-left-radius:0;
|
||||
border-bottom-left-radius:0;
|
||||
display: table-cell;
|
||||
cursor:pointer;
|
||||
}
|
||||
.clipboard-status{
|
||||
position: absolute;
|
||||
top: 2px;
|
||||
left: 2px;
|
||||
background: rgba(0,0,0,.8);
|
||||
z-index: 2;
|
||||
padding: 5px 24px;
|
||||
display: inline-block;
|
||||
box-shadow: 0 0 14px #000;
|
||||
border-radius: 3px;
|
||||
width: 95%;
|
||||
text-align: center;
|
||||
transition:all linear 100ms;
|
||||
opacity:1;
|
||||
}
|
||||
.clipboard-status.fadeout{
|
||||
opacity:0;
|
||||
transition:all linear 1200ms;
|
||||
}
|
||||
input[type=search], input[type=number], input[type=text],textarea, textarea[readonly] {
|
||||
background: rgba(123,123,123,.5);
|
||||
border: solid 1px #394558;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,23 @@
|
|||
wwt.app.directive('copyable', ['$timeout',function ($timeout) {
|
||||
return {
|
||||
restrict: 'E',
|
||||
templateUrl:'views/copy-to-clipboard.html',
|
||||
scope: { copy: '=' },
|
||||
link:function(scope,el,attrs){
|
||||
var input = el.find('input')[0];
|
||||
var copyButton = el.find('.input-group-addon');
|
||||
copyButton.bind('click', function (event) {
|
||||
input.select();
|
||||
document.execCommand('copy');
|
||||
$timeout(function () {
|
||||
scope.copy.showStatus = true;
|
||||
scope.copy.fadeout = false;
|
||||
input.blur();
|
||||
}, 0);
|
||||
$timeout(function () {
|
||||
scope.copy.fadeout = true;
|
||||
}, 3333);
|
||||
})
|
||||
}
|
||||
};
|
||||
}]);
|
||||
|
|
@ -33,6 +33,16 @@
|
|||
return $(window).height() - (168 + $('body.desktop .context-panel').height());
|
||||
};
|
||||
|
||||
$rootScope.copyLink = function (event) {
|
||||
var src = $(event.currentTarget);
|
||||
var input = src.prev();
|
||||
input[0].select();
|
||||
document.execCommand('copy');
|
||||
var flyout = $('<div class=clipboard-status>Copied successfully</div>');
|
||||
input.parent().css('position', 'relative').append(flyout);
|
||||
//flyout.fadeIn(200).show();
|
||||
setTimeout(function () { flyout.fadeOut(1111); }, 3333);
|
||||
}
|
||||
|
||||
return true;
|
||||
}]);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,10 @@
|
|||
<div class="form-group">
|
||||
<label>{{copy.label}}</label>
|
||||
<div class="input-group">
|
||||
<input type="url" class="form-control" ng-model="copy.url">
|
||||
<span class="input-group-addon" bs-tooltip localize-only="title" localize="Copy to clipboard">
|
||||
<i class="fa fa-copy"></i>
|
||||
</span>
|
||||
<div ng-class="{'clipboard-status':true, fadeout: copy.fadeout}" ng-show="copy.showStatus" localize="Copied successfully"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
<div class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-body">
|
||||
<p ng-bind-html="content"></p>
|
||||
</div>
|
||||
<div class="modal-footer" style="border: none" ng-if="showModalButtons">
|
||||
<a class="btn" data-dismiss="modal" ng-click="$hide()" style="width:80px" localize="OK"></a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<div class="modal fade" tabindex="-1" role="dialog">
|
||||
<div class="modal-dialog" style="margin:100px auto 30px auto">
|
||||
<div class="modal-content">
|
||||
<div class="modal-body">
|
||||
<div ng-if="modalData.step=='save'" localize="Do you want to upload this tour to your WWT community profile or save it your computer.">
|
||||
|
||||
</div>
|
||||
<div ng-if="modalData.step=='progress'">
|
||||
<p>Uploading {{modalData.tourTitle}} to your default community. Please wait...</p>
|
||||
<div class="progress progress-striped active">
|
||||
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">
|
||||
</div>
|
||||
</div>
|
||||
</div><div ng-if="modalData.step == 'error'">
|
||||
<p>
|
||||
<span localize="There was an error uploading your tour."></span>
|
||||
{{modalData.error}}
|
||||
</p>
|
||||
</div>
|
||||
<div ng-if="modalData.step == 'success'">
|
||||
<p>
|
||||
<span localize="Tour successfully uploaded."></span>
|
||||
<a href='/Community/Profile' target='wwt' localize="Click to manage your WWT Community Profile"></a>
|
||||
</p>
|
||||
<copyable copy="modalData.share"></copyable>
|
||||
<copyable copy="modalData.download"></copyable>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="modal-footer" style="border: none" ng-if="modalData.step=='save' || modalData.step=='success' || modalData.step=='error'">
|
||||
<a class="btn" data-dismiss="modal" ng-click="$hide()" style="width:80px" localize="Close" ng-if="modalData.step=='success' || modalData.step=='error'"></a>
|
||||
<a class="btn" data-dismiss="modal" ng-click="modalData.saveChoice(true);" localize="Upload to Profile" ng-if="modalData.step=='save'"></a>
|
||||
<a class="btn" data-dismiss="modal" ng-click="modalData.saveChoice(false);$hide()" localize="Save to Computer" ng-if="modalData.step=='save'"></a>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
<div class="modal fade" tabindex="-1" role="dialog" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-body">
|
||||
<p ng-bind-html="content"></p>
|
||||
</div>
|
||||
<div class="modal-footer" style="border: none">
|
||||
<a class="btn" data-dismiss="modal" ng-click="confirm(true);$hide()" style="width:80px" localize="OK"></a>
|
||||
<a class="btn" data-dismiss="modal" ng-click="confirm(false);$hide()" style="width:80px" localize="Cancel"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -87,6 +87,7 @@
|
|||
<Content Include="css\skin.min.css" />
|
||||
<Content Include="dataproxy\Community.js" />
|
||||
<Content Include="dataproxy\Places.js" />
|
||||
<Content Include="directives\CopyToClipboard.js" />
|
||||
<Content Include="directives\EditSlideValues.js" />
|
||||
<Content Include="directives\Movable.js" />
|
||||
<Content Include="factories\AutohidePanels.js" />
|
||||
|
|
@ -314,11 +315,11 @@
|
|||
<Content Include="searchdata.min.js" />
|
||||
<Content Include="searchdataraw.js" />
|
||||
<Content Include="sunCorona.png" />
|
||||
<Content Include="views\copy-to-clipboard.html" />
|
||||
<Content Include="views\layer-manager.html" />
|
||||
<Content Include="views\modals\finder-scope.html" />
|
||||
<Content Include="views\modals\intro.html" />
|
||||
<Content Include="views\modals\message.html" />
|
||||
<Content Include="views\modals\userconfirm.html" />
|
||||
<Content Include="views\modals\tour-uploader.html" />
|
||||
<Content Include="views\modals\loading.html" />
|
||||
<Content Include="views\modals\mobile-explore.html" />
|
||||
<Content Include="views\modals\mobile-layer-manager.html" />
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче