bring over some css
This commit is contained in:
Jon Lambson
parent
b27ba889ba
commit
8f18104029
|
|
@ -0,0 +1,14 @@
|
|||
<div ng-show="vm.notification" class="panel panel-default">
|
||||
<div class="panel-heading frsa">
|
||||
<span class="align-left">Congratulations: Award Unlocked (just for fun)</span>
|
||||
<span ng-click="vm.notification = false" class="achievement-close cp"><i class="fa fa-times-circle"></i></span>
|
||||
</div>
|
||||
|
||||
<div class="panel-body achievement-body">
|
||||
<i class="fa fa-trophy fa-4x"></i>
|
||||
<div class="achievement-text">
|
||||
<!-- <p><strong ng-bind="vm.achievement.name">Achievement Name</strong>: <span ng-bind="vm.achievement.desc">Achievement Text</span></p> -->
|
||||
<p><strong>Welcome</strong>: {{ vm.userName() }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,44 @@
|
|||
<div class="steps-wizard">
|
||||
<div class="notification white-well" ng-hide="vm.hide_todos">
|
||||
<i class="fa fa-times pull-right js-close-wizard" aria-hidden="true"></i>
|
||||
<h1 class="text-center">Steps to take back your digital life</h1>
|
||||
<h3 class="text-center">{{ vm.todo_count }} of 5 complete</h3>
|
||||
<div class="frsa">
|
||||
<div class="button-container">
|
||||
<a ng-click="vm.hide_import_contact()" class="todo-item" ng-hide="vm.hide_contact_button">
|
||||
<p class="button-title">Import Contacts</p>
|
||||
<button type="button" name="button" class="btn btn-default side-menu-button"><i class="fa fa-users fa-2x" aria-hidden="true"></i></button>
|
||||
<i class="fa fa-check-square-o" aria-hidden="true" ng-show="vm.show_contact_checked"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="button-container">
|
||||
<a ng-click="vm.hide_sync_device()" class="todo-item" ng-hide="vm.hide_sync_button">
|
||||
<p class="button-title">Connect Another Device</p>
|
||||
<button type="button" name="button" class="btn btn-default side-menu-button"><i class="fa fa-tablet fa-2x" aria-hidden="true"></i></button>
|
||||
<i class="fa fa-check-square-o" aria-hidden="true" ng-show="vm.show_sync_checked"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="button-container">
|
||||
<a ng-click="vm.hide_import_files()" class="todo-item" ng-hide="vm.hide_files_button">
|
||||
<p class="button-title">Upload A File</p>
|
||||
<button type="button" name="button" class="btn btn-default side-menu-button"><i class="fa fa-file-text-o fa-2x" aria-hidden="true"></i></button>
|
||||
<i class="fa fa-check-square-o" aria-hidden="true" ng-show="vm.show_files_checked"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="button-container">
|
||||
<a ng-click="vm.hide_share_folder()" class="todo-item" ng-hide="vm.hide_share_folder_button">
|
||||
<p class="button-title">Share a folder</p>
|
||||
<button type="button" name="button" class="btn btn-default side-menu-button"><i class="fa fa-share fa-2x" aria-hidden="true"></i></button>
|
||||
<i class="fa fa-check-square-o" aria-hidden="true" ng-show="vm.show_share_folder_checked"></i>
|
||||
</a>
|
||||
</div>
|
||||
<div class="button-container">
|
||||
<a ng-click="vm.hide_post()" class="todo-item" ng-hide="vm.hide_post_button">
|
||||
<p class="button-title">Create Public Post</p>
|
||||
<button type="button" name="button" class="btn btn-default side-menu-button"><i class="fa fa-quote-right fa-2x" aria-hidden="true"></i></button>
|
||||
<i class="fa fa-check-square-o" aria-hidden="true" ng-show="vm.show_post_checked"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,93 @@
|
|||
<div class="panel panel-default">
|
||||
<div class="panel-heading pb-0">
|
||||
<ul class="nav nav-tabs" role="tablist">
|
||||
<li role="presentation" class="active"><a href="!#upload" class="quick-create-tab" aria-controls="upload" role="tab" data-toggle="tab"><i class="fa fa-upload" aria-hidden="true"></i> Upload something</a></li>
|
||||
<li role="presentation"><a href="!#send" class="quick-create-tab" aria-controls="send" role="tab" data-toggle="tab"><i class="fa fa-comment" aria-hidden="true"></i> Share with person</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div class="tab-content">
|
||||
<div role="tabpanel" class="tab-pane active" id="upload">
|
||||
<div class="text-center select-file">
|
||||
<input type="text" class="form-control" placeholder="Start typing to create a post, note, or document"></input>
|
||||
or Drag and drop or <button type="button" name="button" class="btn btn-default">Choose a File</button>
|
||||
</div>
|
||||
</div>
|
||||
<div role="tabpanel" class="tab-pane" id="send">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<div class="image-thing"><i class="fa fa-user fa-3x" aria-hidden="true"></i></div>
|
||||
</div>
|
||||
<div class="media-body">
|
||||
<div class="form-group">
|
||||
<input type="text" class="form-control" placeholder="Contact name(s) or email(s)">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="">add subject:</label>
|
||||
<textarea name="name" class="form-control" rows="8" cols="80" placeholder="Type your message"></textarea>
|
||||
<br>
|
||||
<div class="pull-right">
|
||||
<a class=""><i class="fa fa-paperclip fa-2x" aria-hidden="true"></i></a>
|
||||
<button type="button" name="button" class="btn btn-default">Share</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div role="tabpanel" class="tab-pane" id="sync">
|
||||
<div class="select-device-container text-center">
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn btn-default">Choose a device</button>
|
||||
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||
<span class="caret"></span>
|
||||
<span class="sr-only">Toggle Dropdown</span>
|
||||
</button>
|
||||
<ul class="dropdown-menu">
|
||||
<li><a>My Macbook</a></li>
|
||||
<li><a>My Samsung Galaxy</a></li>
|
||||
<li><a>John's Macbook</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-footer">
|
||||
<div class="uploaded-info">
|
||||
<p><strong>type:</strong> <span class="badge select-badge"> Document</span><span class="select-badge"> N/A</span></p>
|
||||
<p><strong>Location:</strong> Documents > 2017-07-01.txt</p>
|
||||
<button type="button" name="button" class="btn btn-default save-btn">Save</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="shared-music">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-body">
|
||||
<div class="media">
|
||||
<h5 class="media-heading">Uploaded a file moments ago</h5>
|
||||
<hr>
|
||||
<div class="media-left">
|
||||
<div class="image-thing"><i class="fa fa-music fa-3x" aria-hidden="true"></i></div>
|
||||
</div>
|
||||
<div class="media-body">
|
||||
<h3 class="media-heading">Taylor Swift</h3>
|
||||
<h5 class="media-heading">1989</h5>
|
||||
<h4 class="media-heading">Teardrops on my guitar</h4>
|
||||
</div>
|
||||
<div class="media-footer">
|
||||
<div class="media-player">
|
||||
<i class="fa fa-play-circle-o fa-3x" aria-hidden="true"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-footer">
|
||||
<div class="button-group flex-row space-around">
|
||||
<button type="button" name="button" class="btn btn-default"><i class="fa fa-user" aria-hidden="true"></i> Share</button>
|
||||
<button type="button" name="button" class="btn btn-default" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><i class="fa fa-laptop" aria-hidden="true"></i> Sync to ...</button>
|
||||
<button type="button" name="button" class="btn btn-default"><i class="fa fa-globe" aria-hidden="true"></i> Publish</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -1,18 +1,56 @@
|
|||
.container.main-content {
|
||||
display: flex;
|
||||
margin-top: 70px;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
display: flex;
|
||||
margin-top: 70px;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
.menu-container {
|
||||
width: 5%;
|
||||
width: 5%;
|
||||
}
|
||||
.main-content-container {
|
||||
width: 70%;
|
||||
}
|
||||
.notifications-container {
|
||||
width: 25%;
|
||||
width: 95%;
|
||||
padding: 0 20px;
|
||||
}
|
||||
.login-container {
|
||||
top: 25vh;
|
||||
top: 25vh;
|
||||
}
|
||||
/**/
|
||||
.cp {
|
||||
cursor: pointer;
|
||||
}
|
||||
.frsa {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.side-menu {
|
||||
padding-top: 10px;
|
||||
max-width: 100px;
|
||||
border-right: 1px solid #ccc;
|
||||
}
|
||||
.button-container {
|
||||
text-align: center;
|
||||
}
|
||||
.button-container a {
|
||||
color: black;
|
||||
}
|
||||
.side-menu-button {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
.achievement-body {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.white-well {
|
||||
min-height: 20px;
|
||||
padding: 19px;
|
||||
margin-bottom: 20px;
|
||||
background-color: #FFFFFF;
|
||||
border: 1px solid #e3e3e3;
|
||||
border-radius: 4px;
|
||||
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
|
||||
box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -15,7 +15,6 @@
|
|||
<div class="container main-content">
|
||||
<div class="menu-container" ui-view="menu"></div>
|
||||
<div class="main-content-container" ui-view="content"></div>
|
||||
<div class="notifications-container" ui-view="notifications"></div>
|
||||
</div>
|
||||
|
||||
<!-- JQuery -->
|
||||
|
|
@ -45,5 +44,9 @@
|
|||
<script src="/js/controllers/websiteController.js" charset="utf-8"></script>
|
||||
<script src="/js/controllers/dnsController.js" charset="utf-8"></script>
|
||||
<script src="/js/controllers/emailController.js" charset="utf-8"></script>
|
||||
<!-- Divrectives -->
|
||||
<script src="/js/directives/notificationDirective.js" charset="utf-8"></script>
|
||||
<script src="/js/directives/todoDirective.js" charset="utf-8"></script>
|
||||
<script src="/js/directives/uploadDirective.js" charset="utf-8"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
24
js/app.js
24
js/app.js
|
|
@ -31,13 +31,8 @@ app.config(['$stateProvider', '$urlRouterProvider', 'localStorageServiceProvider
|
|||
},
|
||||
'content': {
|
||||
templateUrl: '/templates/home.html'
|
||||
},
|
||||
'notifications': {
|
||||
templateUrl: '/templates/partials/notifications.html',
|
||||
controller: 'HomeController',
|
||||
controllerAs: 'vm'
|
||||
}
|
||||
},
|
||||
}
|
||||
})
|
||||
.state('app.home', {
|
||||
url: 'home',
|
||||
|
|
@ -54,7 +49,8 @@ app.config(['$stateProvider', '$urlRouterProvider', 'localStorageServiceProvider
|
|||
views: {
|
||||
'content@': {
|
||||
templateUrl: 'templates/bolt.html',
|
||||
controller: 'BoltController'
|
||||
controller: 'BoltController',
|
||||
controllerAs: 'vm'
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
@ -130,21 +126,21 @@ app.config(['$stateProvider', '$urlRouterProvider', 'localStorageServiceProvider
|
|||
app.run(['$rootScope', '$state', 'Auth', function($rootScope, $state, Auth) {
|
||||
|
||||
$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {
|
||||
console.log('toState', toState);
|
||||
console.log('toParams', toParams);
|
||||
console.log('fromState', fromState);
|
||||
console.log('fromParams', fromParams);
|
||||
// console.log('toState', toState);
|
||||
// console.log('toParams', toParams);
|
||||
// console.log('fromState', fromState);
|
||||
// console.log('fromParams', fromParams);
|
||||
|
||||
var requiresLogin = toState.data.requiresLogin;
|
||||
|
||||
redirectedURL = toState.url;
|
||||
|
||||
console.log("%c" + redirectedURL, "color: yellow; font-size: 72px;");
|
||||
// console.log("%c" + redirectedURL, "color: yellow; font-size: 72px;");
|
||||
|
||||
if (Auth.isLoggedIn()) {
|
||||
console.log('yes');
|
||||
console.log('logged in');
|
||||
} else {
|
||||
console.log('not logged in');
|
||||
console.log('logged out');
|
||||
}
|
||||
|
||||
if (requiresLogin && !Auth.isLoggedIn()) {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,8 @@
|
|||
app.controller('HomeController', ['$scope', 'Auth', 'localStorageService', '$location', '$rootScope', function ($scope, Auth, localStorageService, $location, $rootScope) {
|
||||
var vm = this;
|
||||
|
||||
vm.notification = true;
|
||||
|
||||
vm.signOut = function () {
|
||||
localStorageService.remove('userAuth');
|
||||
$location.path('/splash-page');
|
||||
|
|
@ -12,7 +14,5 @@ app.controller('HomeController', ['$scope', 'Auth', 'localStorageService', '$loc
|
|||
return profile.email;
|
||||
};
|
||||
|
||||
console.log('worked:', vm.userName());
|
||||
|
||||
|
||||
}]);
|
||||
|
|
|
|||
|
|
@ -1,2 +1,7 @@
|
|||
app.controller('BoltController', [function($scope) {
|
||||
app.controller('BoltController', ['$scope', 'Auth', function($scope, Auth) {
|
||||
var vm = this;
|
||||
vm.userName = function(profile){
|
||||
profile = Auth.getProfile();
|
||||
return profile.email;
|
||||
};
|
||||
}]);
|
||||
|
|
|
|||
|
|
@ -3,7 +3,8 @@ app.controller('SignInController', ['$scope', 'Auth', '$location', 'localStorage
|
|||
|
||||
vm.signIn = function () {
|
||||
var userInfo = {
|
||||
email: vm.userAuthEmail
|
||||
email: vm.userAuthEmail,
|
||||
name: 'Johnny Cash'
|
||||
};
|
||||
Auth.setUser(userInfo);
|
||||
var userAuthenticated = function() {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,5 @@
|
|||
app.directive('notificationDirective', function() {
|
||||
return {
|
||||
templateUrl: "_notification-widget.html"
|
||||
};
|
||||
});
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
app.directive('todoDirective', function() {
|
||||
return {
|
||||
templateUrl: "_todo-widget.html"
|
||||
};
|
||||
});
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
app.directive('uploadDirective', function() {
|
||||
return {
|
||||
templateUrl: "_upload-widget.html"
|
||||
};
|
||||
});
|
||||
|
|
@ -1 +1,110 @@
|
|||
<h1>Bolt</h1>
|
||||
<div class="home-container">
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading pb-0">
|
||||
<ul class="nav nav-tabs" role="tablist">
|
||||
<li role="presentation" class="active"><a href="!#bolt-upload" class="quick-create-tab" aria-controls="upload" role="tab" data-toggle="tab"><i class="fa fa-upload" aria-hidden="true"></i> Lightning Share</a></li>
|
||||
<li role="presentation"><a href="!#bolt-download" class="quick-create-tab" aria-controls="send" role="tab" data-toggle="tab"><i class="fa fa-download" aria-hidden="true"></i> Lightning Accept</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div class="tab-content">
|
||||
<div role="tabpanel" class="tab-pane active" id="bolt-upload">
|
||||
<!-- <h2 class="text-center">Share a file as fast as lightning:</h2> -->
|
||||
<div class="text-center select-file" ng-hide="vm.lightning_uploaded">
|
||||
<div ng-click="vm.lightning_uploaded = true">
|
||||
<div class="panel-body text-center">
|
||||
Drag and drop a file here
|
||||
<br>
|
||||
or
|
||||
<br>
|
||||
<button type="button" name="button" class="btn btn-default js-choose-file-btn">Upload New File</button>
|
||||
<br>
|
||||
or
|
||||
<br>
|
||||
<button type="button" name="button" class="btn btn-default js-choose-file-btn">Choose from Daplie files</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="select-file" ng-show="vm.lightning_uploaded">
|
||||
<p class="text-center"> Uploading 70% complete</p>
|
||||
<div class="progress">
|
||||
<div class="progress-bar" role="progressbar" aria-valuenow="70" aria-valuemin="0" aria-valuemax="100" style="width:70%">
|
||||
<span class="sr-only">70% Complete</span>
|
||||
</div>
|
||||
</div>
|
||||
<h3 class="share-text">Share with</h3>
|
||||
<form action="">
|
||||
<label class="radio-inline">
|
||||
<input type="radio" name="optradio" checked="checked">Anyone with this link has access
|
||||
</label>
|
||||
<label class="radio-inline">
|
||||
<input type="radio" name="optradio">Only signed-in contacts have access
|
||||
</label>
|
||||
</form>
|
||||
<h3>Option A: Yell it across the room</h3>
|
||||
<br>
|
||||
<ol class="text-left">
|
||||
<li>
|
||||
<span>Tell your friend to open </span> <span class="framed">bolt.smithfam.net</span>
|
||||
<br>
|
||||
<br>
|
||||
</li>
|
||||
<li>
|
||||
<span>Tell them to use the code </span><span class="framed">happy</span> <span class="framed">dog</span> <span class="framed">22</span>
|
||||
</li>
|
||||
</ol>
|
||||
<br>
|
||||
<h3>Option B: Share this link <small><a href="#">https://bolt.smithfam.net/#/happy-dog-22</a></small></h3>
|
||||
<div class="input-group">
|
||||
<input type="text" class="form-control" placeholder="Type contact name or email address" aria-describedby="basic-addon2">
|
||||
<span class="input-group-addon" id="basic-addon2">Send Link</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div role="tabpanel" class="tab-pane" id="bolt-download">
|
||||
<center>
|
||||
<h3>Enter lightning code</h3>
|
||||
<form class="form-inline">
|
||||
<input type="text" class="form-control">
|
||||
<label>-</label>
|
||||
<input type="text" class="form-control">
|
||||
<label>-</label>
|
||||
<input type="text" class="form-control">
|
||||
</form>
|
||||
</center>
|
||||
<br>
|
||||
<button class="btn btn-default pull-right">Download</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-footer" ng-show="vm.noted_on_wall">
|
||||
<div class="uploaded-info">
|
||||
<p><strong>type:</strong> <span class="badge select-badge"> Document</span><span class="select-badge"> N/A</span></p>
|
||||
<p><strong>Location:</strong> Documents > 2017-07-01.txt</p>
|
||||
<button type="button" name="button" class="btn btn-default save-btn" ng-click="vm.post_selected_file()">Save</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-footer" ng-show="vm.filed_on_wall">
|
||||
<div class="uploaded-info">
|
||||
<p><strong>type:</strong> <span class="badge select-badge"> Music</span><span class="select-badge"> Audio Book</span> <span class="select-badge"> N/A</span></p>
|
||||
<p><strong>Location:</strong> Music > Taylor Swift > Teardrops.mp3</p>
|
||||
<button type="button" name="button" class="btn btn-default save-btn" ng-click="vm.post_selected_file()">Save</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="">
|
||||
<h2 class="share-text">Recent Lightning Shares</h2>
|
||||
<section class="white-well">
|
||||
<li>
|
||||
<span>teardrops.mp3
|
||||
-
|
||||
<span class="framed">happy</span> <span class="framed">dog</span> <span class="framed">22</span>
|
||||
-
|
||||
Shared with <span class="framed">anyone with link</span>
|
||||
-
|
||||
<button class="btn">Stop Sharing</button>
|
||||
</li>
|
||||
</ol>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1 +1,11 @@
|
|||
<h1>DNS</h1>
|
||||
<div class="">
|
||||
<div class="white-well">
|
||||
<h2 class="text-center">Watch Your Step</h2>
|
||||
<h4 class="text-center">Advanced Features Ahead</h4><br>
|
||||
<p class="text-center">This space is intended for<br> people that need more functionality<br> than the average bear</p><br>
|
||||
<div class="text-center">
|
||||
<a href="#!/home" class="btn btn-default"><link href="#">I'd like to go home, please</a><br><br>
|
||||
<a ng-click="vm.unlock('honeybadger')">I don't care, let me through</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1 +1,72 @@
|
|||
<h1>Email</h1>
|
||||
<div class="home-container">
|
||||
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-heading">
|
||||
<ul class="nav nav-tabs" role="tablist">
|
||||
<li role="presentation" class="active"><a href="!#conversation" class="quick-create-tab" aria-controls="conversate" role="tab" data-toggle="tab"><i class="fa fa-comments-o" aria-hidden="true"></i> Start a conversation</a></li>
|
||||
<li role="presentation"><a href="!#conversation" class="quick-create-tab" aria-controls="conversate" role="tab" data-toggle="tab"><i class="fa fa-comments-o" aria-hidden="true"></i> Start a group</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="panel-body">
|
||||
<div ng-hide="vm.message_active" ng-click="vm.message_active = true">
|
||||
<input type="text" class="form-control" placeholder="Start typing your message">
|
||||
</div>
|
||||
<div ng-show="vm.message_active" class="tab-content">
|
||||
<div role="tabpanel" class="tab-pane active" id="conversation">
|
||||
<div class="media">
|
||||
<div class="media-left">
|
||||
<div class="image-thing"><i class="fa fa-user fa-3x" aria-hidden="true"></i></div>
|
||||
</div>
|
||||
<div class="media-body">
|
||||
<div class="form-group">
|
||||
<input type="text" class="form-control" placeholder="Contact name(s) or email(s)">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input type="text" class="form-control" placeholder="Subject (optional)">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<textarea name="name" class="form-control" rows="8" cols="80" placeholder="Type your message"></textarea>
|
||||
<br>
|
||||
<div class="pull-right">
|
||||
<a href="" class=""><i class="fa fa-paperclip fa-2x" aria-hidden="true"></i></a>
|
||||
<button type="button" name="button" class="btn btn-default" ng-click="vm.message_active = false">Send</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table class="table">
|
||||
<tbody>
|
||||
<td>Drew Warren</td>
|
||||
<td><button class="btn btn-default">Save Contact</button></td>
|
||||
<td><strong>Tomorrow's Agenda</strong> -It's going to be a long day</td>
|
||||
<td>7:00 pm</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Jacob Jones</td>
|
||||
<td></td>
|
||||
<td><strong>Family get-together</strong> -I'm super excited!</td>
|
||||
<td>6:00 pm</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Sharen O'Neal</td>
|
||||
<td></td>
|
||||
<td><strong>Friday Lunch</strong> -Yum!</td>
|
||||
<td>Jun 29</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Jessica Maizer</td>
|
||||
<td><button class="btn btn-default">Save Contact</button></td>
|
||||
<td><strong>Vacation</strong> -Cruise to Hawaii?</td>
|
||||
<td>Jun 10</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<!-- <div class="white-well">
|
||||
</div> -->
|
||||
|
|
|
|||
|
|
@ -1 +1,153 @@
|
|||
<h1>Files</h1>
|
||||
<div class="row">
|
||||
<ol class="breadcrumb">
|
||||
<li><a href="">Home</a></li>
|
||||
</ol>
|
||||
<div class="text-center">
|
||||
<div class="btn-group" role="group" aria-label="...">
|
||||
<button type="button" class="btn btn-default"><i class="fa fa-bars" aria-hidden="true"></i></button>
|
||||
<button type="button" class="btn btn-default"><i class="fa fa-th" aria-hidden="true"></i></button>
|
||||
<button type="button" class="btn btn-default"><i class="fa fa-film" aria-hidden="true"></i></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div ng-hide="vm.share_active || vm.device_active" class="flex-row list-of-devices">
|
||||
<div class="shares" ng-click="vm.select_shares()">
|
||||
<i class="fa fa-folder-o fa-5x" aria-hidden="true"></i>
|
||||
<p>Shares</p>
|
||||
</div>
|
||||
<div class="from-computer" ng-click="vm.select_computer_device()">
|
||||
<i class="fa fa-laptop fa-5x" aria-hidden="true"></i>
|
||||
<p>Jane's Macbook</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="jumbotron jumbo">
|
||||
<i class="fa fa-times pull-right js-close-hero" aria-hidden="true"></i>
|
||||
<h1 class="text-center">All of your files in one place!</h1>
|
||||
<p>With daplie you can access any file on any device from any where. Even when a device is off or offline you can schedule file to be pulled or pushed</p>
|
||||
<p class="text-center"><button type="button" name="button" class="btn btn-default js-close-hero">Okay</button></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" ng-show="vm.device_selected">
|
||||
<div class="users-selected-device">
|
||||
<i class="fa fa-times pull-right js-close-hero" aria-hidden="true"></i>
|
||||
<table class="table" ng-show="vm.shared_selected">
|
||||
<!--
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Artist</th>
|
||||
<th>Date</th>
|
||||
<th>Sync</th>
|
||||
</tr>
|
||||
</thead>
|
||||
-->
|
||||
<tbody>
|
||||
<tr ng-repeat="shared_artist in vm.shared_artists">
|
||||
<td class="select-an-artist" ng-click="vm.get_artist(shared_artist)">{{ shared_artist }}</td>
|
||||
<td>December 23, 2016</td>
|
||||
<td><i class="fa fa-exchange js-sync-icon" aria-hidden="true"></i></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<table class="table" ng-show="vm.computer_selected">
|
||||
<!-- <thead>
|
||||
<tr>
|
||||
<th>Artist</th>
|
||||
<th>Date</th>
|
||||
<th>Sync</th>
|
||||
</tr>
|
||||
</thead>
|
||||
-->
|
||||
<tbody>
|
||||
<tr ng-repeat="artist in vm.artists">
|
||||
<td class="select-an-artist" ng-click="vm.get_artist(artist)">{{ artist }}</td>
|
||||
<td>June 13, 2017</td>
|
||||
<td><i class="fa fa-exchange js-sync-icon" aria-hidden="true"></i></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="display-selected-artist" ng-show="vm.artist_information">
|
||||
<div class="col-md-4">
|
||||
<div class="text-center">
|
||||
<h3>{{ vm.artist_selected }}</h3>
|
||||
<div class="image-placeholder">
|
||||
<i class="fa fa-users fa-2x" aria-hidden="true"></i>
|
||||
</div>
|
||||
<p>15MB</p>
|
||||
<p>July 15, 2017</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div class="text-center">
|
||||
<h4>Syncing</h4>
|
||||
<p><i class="fa fa-laptop"></i> Jane's Macbook at ~/Music/{{ vm.artist_selected }}</p>
|
||||
<p><i class="fa fa-mobile"></i> Jane's iPhone at ~/iTunes/{{ vm.artist_selected }}</p>
|
||||
<br>
|
||||
<p><a href="">Push to another device</a></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<i class="fa fa-times pull-right js-close-artist-info" aria-hidden="true"></i>
|
||||
<div class="text-center">
|
||||
<h4>Sharing with</h4>
|
||||
<p>
|
||||
<i class="fa fa-user" aria-hidden="true"></i> AJ as
|
||||
<select class="" name="">
|
||||
<option value="">owner</option>
|
||||
<option value="">viewer</option>
|
||||
</select>
|
||||
</p>
|
||||
<p>
|
||||
<i class="fa fa-user" aria-hidden="true"></i> Hannah as
|
||||
<select class="" name="">
|
||||
<option value="">viewer</option>
|
||||
<option value="">owner</option>
|
||||
</select>
|
||||
</p>
|
||||
<p>
|
||||
<i class="fa fa-users" aria-hidden="true"></i> Family as
|
||||
<select class="" name="">
|
||||
<option value="">viewer</option>
|
||||
<option value="">owner</option>
|
||||
</select>
|
||||
</p>
|
||||
<p>
|
||||
<input type="text" class="form-control" placeholder="share with contact by name or email">
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="file-footer">
|
||||
<i class="fa fa-times pull-right js-close-file-uploader" aria-hidden="true"></i>
|
||||
<p>Take back your files 1 of 3 complete</p>
|
||||
<div class="files-to-sync">
|
||||
<div class="button-container-row">
|
||||
<i class="fa fa-check-square-o is-syncd" aria-hidden="true"></i>
|
||||
<a href="">
|
||||
<button type="button" name="button" class="btn btn-default side-menu-button"><i class="fa fa-folder-o fa-2x" aria-hidden="true"></i></button>
|
||||
<p class="button-title">Create a share</p>
|
||||
</a>
|
||||
</div>
|
||||
<div class="button-container-row">
|
||||
<a href="">
|
||||
<button type="button" name="button" class="btn btn-default side-menu-button"><i class="fa fa-laptop fa-2x" aria-hidden="true"></i></button>
|
||||
<p class="button-title">Sync a computer</p>
|
||||
</a>
|
||||
</div>
|
||||
<div class="button-container-row">
|
||||
<a href="">
|
||||
<button type="button" name="button" class="btn btn-default side-menu-button"><i class="fa fa-tablet fa-2x" aria-hidden="true"></i></button>
|
||||
<p class="button-title">Sync a mobile device</p>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1 +1,41 @@
|
|||
<h1>HOME</h1>
|
||||
<div notification-directive></div>
|
||||
|
||||
<div upload-directive></div>
|
||||
|
||||
<div class="panel panel-default">
|
||||
<div class="panel-body">
|
||||
<div class="media">
|
||||
<h5 class="media-heading">System Message > Jane Smith {{ vm.userName() }}</h5>
|
||||
<hr>
|
||||
<div class="media-left">
|
||||
<div class="image-thing"><i class="fa fa-bullhorn fa-3x" aria-hidden="true"></i></div>
|
||||
</div>
|
||||
<div class="media-body">
|
||||
<h3 class="media-heading">What to do?</h3>
|
||||
<p>This is a prototype. It's essentially like a bunch of pictures that you can click through. You can type
|
||||
in certain areas, but not all of the buttons "work". It's mostly just clickable "screenshots".</p>
|
||||
|
||||
<p>For this demo you are "Jane Smith".
|
||||
As part of the setup for this device you chose
|
||||
<a href="feed.html">https://jane.smith.net</a> as your personal page
|
||||
and jane@smith.net as your messaging address.</p>
|
||||
|
||||
<p>Choose a few of these goals to "test out" in a few different ways:</p>
|
||||
<ul>
|
||||
<li>Share a photo with a family member</li>
|
||||
<li>Send an email</li>
|
||||
<li>Share a family vacation album with someone</li>
|
||||
<li>Whatever reason you might have bought the Daplie personal server</li>
|
||||
</ul>
|
||||
<p>Your public feed is available at </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="panel-footer">
|
||||
<div class="button-group flex-row space-around">
|
||||
<button ng-click="vm.hide_welcome_msg = true" type="button" name="button" class="btn btn-default"><i class="fa fa-thumbs-up" aria-hidden="true"></i> Okay</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div todo-directive></div>
|
||||
|
|
|
|||
|
|
@ -1 +1,8 @@
|
|||
<h1>Music</h1>
|
||||
<h1>Music (todo)</h1>
|
||||
|
||||
<ul>
|
||||
<li>Create playlist</li>
|
||||
<li>Add collaborator</li>
|
||||
<li>Add more songs</li>
|
||||
<li>Multiple tabs for switching between playlists</li>
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -1,10 +0,0 @@
|
|||
<div class="alert alert-success" role="alert">
|
||||
<span class="">
|
||||
<i class="fa fa-check"></i>
|
||||
Welcome: {{ vm.userName() }}
|
||||
</span>
|
||||
<span class="pull-right">
|
||||
<i class="fa fa-times"></i>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
Loading…
Reference in New Issue