pimhwang
/
spreed-webrtc
mirror of https://github.com/strukturag/spreed-webrtc.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Return array from getAll in contactData. Create custom modal dom build ability in alertify with default header, body, footer dom. Update contactsmanager css class names. Add listener to add contact to contactsmanager on contactadded.

pull/67/head
Evan Theurer 12 years ago
parent
687a2bd965
commit
61466f74c9
9 changed files with 106 additions and 69 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 60
      src/styles/components/_contactsmanager.scss
  2. 29
      static/js/directives/contactsmanager.js
  3. 39
      static/js/services/alertify.js
  4. 4
      static/js/services/contactdata.js
  5. 14
      static/partials/contactsmanager.html
  6. 6
      static/partials/contactsmanageradd.html
  7. 8
      static/partials/contactsmanagerbutton.html
  8. 2
      static/partials/contactsmanageredit.html
  9. 13
      static/partials/settings.html

60
src/styles/components/_contactsmanager.scss
Unescape View File

@ -19,16 +19,16 @@
* *
*/ */
.contactsManager { .contactsmanager {
.contactsContentHead { .head {
margin-bottom: 10px; margin-bottom: 10px;
} }
.contactsDesc { .desc {
font-size: 20px; font-size: 20px;
font-weight: normal; font-weight: normal;
text-align: baseline; text-align: baseline;
} }
.contactsAddBtn { .addbtn {
font-size: 14px; font-size: 14px;
.fa-users { .fa-users {
font-size: 22px; font-size: 22px;
@ -37,12 +37,12 @@
font-size: 15px; font-size: 15px;
} }
} }
.contactsEditPicture { .editpicture {
vertical-align: middle; vertical-align: middle;
float: left; float: left;
margin-right: 20px; margin-right: 20px;
} }
.contactsUploadPicBtn { .uploadbtn {
margin-top: 7px; margin-top: 7px;
} }
.buddyPicture { .buddyPicture {
@ -61,6 +61,29 @@
top: -6px; top: -6px;
} }
} }
.editlist {
max-height: 250px;
overflow-y: scroll;
padding-right: 0px;
}
.table {
.picture {
width: 15%;
min-height: 46px;
text-align: center;
vertical-align: middle;
}
.name {
width: 70%;
padding-left: 5%;
text-align: left;
vertical-align: middle;
}
.action {
text-align: center;
vertical-align: middle;
}
}
} }
.search { .search {
@ -77,28 +100,3 @@
padding-left: 25px; padding-left: 25px;
} }
} }
.contactsEditList {
max-height: 250px;
overflow-y: scroll;
padding-right: 0px;
}
.contactsTable {
.picture {
width: 15%;
min-height: 46px;
text-align: center;
vertical-align: middle;
}
.name {
width: 70%;
padding-left: 5%;
text-align: left;
vertical-align: middle;
}
.action {
text-align: center;
vertical-align: middle;
}
}

29
static/js/directives/contactsmanager.js
Unescape View File

@ -18,24 +18,29 @@
* along with this program. If not, see <http://www.gnu.org/licenses/>. * along with this program. If not, see <http://www.gnu.org/licenses/>.
* *
*/ */
define(['jquery', 'underscore', 'text!partials/contactsmanager.html'], function($, _, templateContactsManager) { define(['jquery', 'underscore', 'text!partials/contactsmanagerbutton.html', 'text!partials/contactsmanager.html'], function($, _, templateContactsManagerButton,templateContactsManager) {
return [function() { return ['contacts', 'alertify', function(contacts, alertify) {
var contactsManagerController = ['$scope', '$modalInstance', 'contactData', function($scope, $modalInstance, contactData) { var contactsManagerController = ['$scope', '$modalInstance', 'contactData', 'data', 'defaultModalController', function($scope, $modalInstance, contactData, data, defaultModalController) {
$scope.contacts = contactData.getAllContacts(); $scope.contacts = null;
$scope.close = function() {
$modalInstance.close('Close'); var getContacts = function() {
$scope.contacts = contactData.getAll();
}; };
getContacts();
contacts.e.on('contactadded', function() {
getContacts();
});
// Set state based on default controller
defaultModalController[3]($scope, $modalInstance, data);
}]; }];
var controller = ['$scope', '$modal', function($scope, $modal) { var controller = ['$scope', '$modal', function($scope, $modal) {
// Setup an api to pass the html body template to alertify
$scope.contactsManager = function() { $scope.contactsManager = function() {
$modal.open({ alertify.dialog.buildCustom({'windowClass': 'contactsmanager', 'header': _('Contacts Manager'), 'bodydom': templateContactsManager, 'footerdom': null, 'controller': contactsManagerController});
template: templateContactsManager,
controller: contactsManagerController,
windowClass: 'contactsManager'
});
}; };
}]; }];
@ -44,6 +49,8 @@ define(['jquery', 'underscore', 'text!partials/contactsmanager.html'], function(
return { return {
scope: true, scope: true,
restrict: 'E', restrict: 'E',
replace: true,
template: templateContactsManagerButton,
controller: controller, controller: controller,
link: link link: link
}; };

39
static/js/services/alertify.js
Unescape View File

@ -50,7 +50,7 @@ define(["angular"], function(angular) {
}]; }];
// Alertify uniquified api wrapper // Alertify uniquified api wrapper
return ["$window", "$modal", "$templateCache", "translation", function($window, $modal, $templateCache, translation) { return ["$window", "$modal", "$templateCache", "translation", '$compile', function($window, $modal, $templateCache, translation, $compile) {
// Overwrite templates from dialogs with fontawesome/i18n variants. // Overwrite templates from dialogs with fontawesome/i18n variants.
$templateCache.put('/dialogs/error.html', '<div class="modal-header dialog-header-error"><button type="button" class="close" ng-click="close()">&times;</button><h4 class="modal-title text-danger"><span class="fa fa-warning"></span> <span ng-bind-html="header"></span></h4></div><div class="modal-body text-danger" ng-bind-html="msg"></div><div class="modal-footer"><button type="button" class="btn btn-default" ng-click="close()">{{_("Close")}}</button></div>'); $templateCache.put('/dialogs/error.html', '<div class="modal-header dialog-header-error"><button type="button" class="close" ng-click="close()">&times;</button><h4 class="modal-title text-danger"><span class="fa fa-warning"></span> <span ng-bind-html="header"></span></h4></div><div class="modal-body text-danger" ng-bind-html="msg"></div><div class="modal-footer"><button type="button" class="btn btn-default" ng-click="close()">{{_("Close")}}</button></div>');
@ -60,6 +60,9 @@ define(["angular"], function(angular) {
// Add new template for prompt. // Add new template for prompt.
$templateCache.put('/dialogs/prompt.html', '<div class="modal-header"><h4 class="modal-title"><span class="fa fa-star"></span> <span ng-bind-html="header"></span></h4></div><div class="modal-body"><ng-form name="promptDialog" novalidate role="form"><div class="form-group input-group-lg" ng-class="{true: \'has-error\'}[promptDialog.text.$dirty && promptDialog.text.$invalid]"><label class="control-label"></label><input type="text" id="{{id}}" class="form-control" name="text" ng-model="input.text" ng-keyup="hitEnter($event)" required></div></ng-form></div><div class="modal-footer"><button type="button" class="btn btn-default" ng-click="cancel()">{{cancelButtonLabel}}</button><button type="button" class="btn btn-primary" ng-click="save()" ng-disabled="(promptDialog.$dirty && promptDialog.$invalid) || promptDialog.$pristine">{{okButtonLabel}}</button></div>'); $templateCache.put('/dialogs/prompt.html', '<div class="modal-header"><h4 class="modal-title"><span class="fa fa-star"></span> <span ng-bind-html="header"></span></h4></div><div class="modal-body"><ng-form name="promptDialog" novalidate role="form"><div class="form-group input-group-lg" ng-class="{true: \'has-error\'}[promptDialog.text.$dirty && promptDialog.text.$invalid]"><label class="control-label"></label><input type="text" id="{{id}}" class="form-control" name="text" ng-model="input.text" ng-keyup="hitEnter($event)" required></div></ng-form></div><div class="modal-footer"><button type="button" class="btn btn-default" ng-click="cancel()">{{cancelButtonLabel}}</button><button type="button" class="btn btn-primary" ng-click="save()" ng-disabled="(promptDialog.$dirty && promptDialog.$invalid) || promptDialog.$pristine">{{okButtonLabel}}</button></div>');
$templateCache.put('/base/headerdom.html', '<div class="modal-header"><button type="button" class="close" ng-click="close()">×</button><h4 class="modal-title" ng-bind-html="header"></h4></div>');
$templateCache.put('/base/bodydom.html', '<div class="modal-body" ng-bind-html="msg"></div>');
$templateCache.put('/base/footerdom.html', '<div class="modal-footer"><button type="button" class="btn btn-default" ng-click="close()">{{_("Close")}}</button></div>');
var defaultMessages = { var defaultMessages = {
error: translation._("Error"), error: translation._("Error"),
@ -143,6 +146,40 @@ define(["angular"], function(angular) {
} }
}, 100); }, 100);
}); });
},
buildCustom: function(data) {
var modaldom = '';
if (data.headerdom) {
modaldom += data.headerdom;
} else {
modaldom += $templateCache.get('/base/headerdom.html');
}
if (data.bodydom) {
modaldom += data.bodydom;
} else {
modaldom += $templateCache.get('/base/bodydom.html');
}
if (data.footerdom === undefined) {
modaldom += $templateCache.get('/base/footerdom.html');
// footer should not be included
} else if (data.footerdom === null) {
modaldom += '';
} else {
modaldom += data.footerdom;
}
$modal.open({
template: modaldom,
controller: data.controller || modalController,
resolve: {
data: function() { return data; },
defaultModalController: function() { return modalController; }
},
windowClass: data.windowClass || ''
});
} }
}; };

4
static/js/services/contactdata.js
Unescape View File

@ -95,8 +95,8 @@ define(['underscore', 'jquery'], function(underscore, $) {
} }
return null; return null;
}, },
getAllContacts: function() { getAll: function() {
return contacts; return _.values(contacts);
} }
}; };

14
static/partials/contactsmanager.html
Unescape View File

@ -1,14 +1,8 @@
<div class="modal-header">
<button type="button" class="close" ng-click="close()"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">
{{_('Contacts Manager')}}
</h4>
</div>
<div class="modal-body"> <div class="modal-body">
<div class="row contactsContentHead"> <div class="row head">
<div class="col-xs-offset-7 col-xs-5"> <div class="col-xs-offset-7 col-xs-5">
<div class="pull-right"> <div class="pull-right">
<button class="btn btn-success contactsAddBtn"> <button class="btn btn-success addbtn">
{{_('Find new contacts')}}&nbsp; {{_('Find new contacts')}}&nbsp;
<i class="fa fa-users"></i> <i class="fa fa-users"></i>
<i class="fa fa-plus"></i> <i class="fa fa-plus"></i>
@ -17,8 +11,8 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-xs-12 contactsEditList"> <div class="col-xs-12 editlist">
<table class="table table-bordered table-hover table-condensed contactsTable"> <table class="table table-bordered table-hover table-condensed ">
<tbody> <tbody>
<tr ng-repeat="contact in contacts"> <tr ng-repeat="contact in contacts">
<td class="picture"> <td class="picture">

6
static/partials/contactsmanageradd.html
Unescape View File

@ -5,7 +5,7 @@
</h4> </h4>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<div class="row contactsContentHead"> <div class="row head">
<div class="col-xs-12"> <div class="col-xs-12">
<form class="form"> <form class="form">
<div class="row"> <div class="row">
@ -18,8 +18,8 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-xs-12 contactsEditList"> <div class="col-xs-12 editlist">
<table class="table table-bordered table-hover table-condensed contactsTable"> <table class="table table-bordered table-hover table-condensed ">
<tbody> <tbody>
<tr> <tr>
<td class="picture"> <td class="picture">

8
static/partials/contactsmanagerbutton.html
Unescape View File

@ -0,0 +1,8 @@
<div>
<legend>{{_('Contacts')}}</legend>
<div class="form-group">
<div class="col-xs-8 col-xs-offset-4">
<button class="btn btn-success" ng-click="contactsManager()">{{_('Contacts Manager')}}</button>
</div>
</div>
</div>

2
static/partials/contactsmanageredit.html
Unescape View File

@ -20,7 +20,7 @@
<div class="contactsEditPicture"> <div class="contactsEditPicture">
<div class="userAvatar"></div> <div class="userAvatar"></div>
</div> </div>
<buttton class="btn btn-info contactsUploadPicBtn">{{_('Upload')}}</buttton> <buttton class="btn btn-info uploadbtn">{{_('Upload')}}</buttton>
</div> </div>
</div> </div>
</form> </form>

13
static/partials/settings.html
Unescape View File

@ -69,16 +69,9 @@
</div> </div>
</div> </div>
</div> </div>
<contacts-manager> <div ng-if="userid">
<div ng-if="userid"> <contacts-manager/>
<legend>{{_('Contacts')}}</legend> </div>
<div class="form-group">
<div class="col-xs-8 col-xs-offset-4">
<button class="btn btn-success" ng-click="contactsManager()">{{_('Contacts Manager')}}</button>
</div>
</div>
</div>
<contacts-manager/>
<div ng-show="mediaSources.supported || isChrome"> <div ng-show="mediaSources.supported || isChrome">
<legend>{{_('Media')}}</legend> <legend>{{_('Media')}}</legend>
<div ng-show="mediaSources.supported"> <div ng-show="mediaSources.supported">

Write Preview
Loading…
Cancel
Save