Skip to content

Commit

Permalink
Merge pull request #1371 from eciis/responsive
Browse files Browse the repository at this point in the history 
Merge responsive - dev
  • Loading branch information
@Luiz-FS
Luiz-FS authored Dec 21, 2018
2 parents 01bdf08 + 7fbaec8 commit 3bfd3a6
Show file tree
Hide file tree
Showing 21 changed files with 1,209 additions and 193 deletions.
40 changes: 40 additions & 0 deletions frontend/app.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -90,6 +90,20 @@
}
}
})
.state(STATES.CREATE_EVENT, {
url: "/create_event/:eventKey",
views: {
user_content: {
templateUrl: "app/event/create_event.html",
controller: "EventDialogController as createEventCtrl"
}
},
params: {
event: null,
events: null,
isEditing: null
}
})
.state(STATES.INVITE_INSTITUTION, {
url: "/inviteInstitution",
views: {
Expand Down Expand Up @@ -187,6 +201,9 @@
templateUrl: "app/post/post_page.html",
controller: "PostPageController as postCtrl",
}
},
params: {
"focus": undefined
}
})
.state(STATES.MANAGE_INST, {
Expand Down Expand Up @@ -477,6 +494,29 @@
});
});

/**
* Function to intercept the access of pages that should be displayed only on mobile screens.
* @param {service} $transitions - Service of transitions states
* @param {const} STATES - Const with the states of application
* @param {const} SCREEN_SIZES - Const with the screen sizes
*/
app.run(function mobileInterceptor($transitions, $state, STATES, SCREEN_SIZES) {
const permitted_routes = [
STATES.CREATE_EVENT
];

$transitions.onStart({
to: (state) => {
return !Utils.isMobileScreen(SCREEN_SIZES.SMARTPHONE) && _.includes(permitted_routes, state.name);
}
}, () => {
$state.go(STATES.ERROR, {
"msg": "Esta página está disponível apenas para mobile.",
"status": "403"
});
});
});

app.run(function inviteInterceptor(AuthService, $transitions, $state, STATES) {
var ignored_routes = [
STATES.CREATE_INST_FORM
Expand Down
224 changes: 224 additions & 0 deletions frontend/event/create_event.html
View file

Large diffs are not rendered by default.

225 changes: 223 additions & 2 deletions frontend/event/event.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -105,9 +105,12 @@
margin-bottom: 0.3125em;
}

.event-buttons-color, .back-to-button, .create-event-cancel-button, .event-img-icon, .useful-links-icon {
color: white;
}

.useful-links-icon {
background-color: #8cc04e;
color: white;
height: 1.667em;
width: 1.667em;
text-align: center;
Expand Down Expand Up @@ -146,6 +149,10 @@
width: 0.8em;
}

#video-youtube{
height:31.5em;
}

@media screen and (max-width: 450px) {
.font-resp {
font-size: 12px;
Expand Down Expand Up @@ -278,7 +285,7 @@
z-index: 1;
}

.event-title, .event-subtitle, .event-inst-name {
.event-title, .event-subtitle, .event-inst-name, .event-limit-string {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
Expand Down Expand Up @@ -306,4 +313,218 @@
.select-years {
width: 6em;
}

.create-event-mobile-top-bar {
height: 3em;
width: 100%;
background-color: #009688;
align-items: center;
position: fixed;
z-index: 3;
grid-row-start: 1; grid-row-end: 2;
}

.back-to-button {
font-size: 2.5em;
}

.fields-event-padding {
padding: 0;
margin: 0;
}

.fields-event-container, .event-select-inst, .fields-event-split, .fields-event-split-reverse,
.create-event-grid, .create-event-form-grid, .create-event-grid-inst {
display: grid;
}

.fields-event-container, .event-select-inst {
justify-content: center;
}

.fields-event-container {
grid-template-columns: 98%;
padding: 0 0.5em 0 0.5em;
height: 75%;
}

.event-select-inst {
grid-template-columns: 14% 70% auto;
grid-row-start: 2;
width: 100%;
box-shadow: 0px 3px 6px grey;
}

.event-select-ball {
grid-column-start: 1;
}

.event-inst-select-name {
grid-column-start: 2;
}

.event-select-button {
grid-column-start: 3;
}

.event-select-ball-margin {
margin-top: 0.55em;
margin-left: 0.5em;
}

.fields-event-split, .fields-event-split-reverse {
justify-content: initial;
grid-template-columns: 65% auto;
}

.fields-event-split-reverse {
grid-template-columns: 35% auto;
}

.event-input-margin {
margin-right: 0.7em;
}

.action-event-container {
display: grid;
justify-content: end;
grid-template-columns: auto auto;
margin-right: 1em;
align-self: center;
overflow: scroll;
}

.create-event-loading {
align-self: center;
}

.create-event-cancel-button {
background-color: rgb(173, 169, 169);
}

.event-select-inst-shadow {
box-shadow: 0px 0px 5px grey;
height: 0.001em;
}

.event-textarea-size {
resize: none;
width: 98%;
}

.event-textarea {
position: relative;
padding: 0.2em;
vertical-align: middle;
}

.event-links-fields {
max-height: 10em;
overflow-y:auto;
margin: 8px 0 8px 0;
}

.event-img-button {
border-radius: 3em;
margin-top: 1.6em;
}

.event-img-icon {
margin-top: 0.25em;
height: 4.375em;
width: 4.375em;
font-size: 4.375em;
}

.event-img-height, .event-img-thumbnail {
height: 9.375em;
}

.event-img-thumbnail {
overflow: hidden;
padding-left: 0;
padding-right: 0;
}

.event-overflow-navbar {
overflow: auto;
}

.event-form-margin {
margin-top: 3.2em;
}

.event-date-alert {
opacity: 0.9;
margin-top: 0.125em;
font-size: 0.8em;
}

.event-link-height {
height: 2.2em;
}

.md-open-menu-container.md-active {
width: 95%;
}

.event-checkbox {
margin-left: 0.2em !important;
margin-bottom: 0.4em !important;
}

.create-event-grid, .create-event-grid-inst {
grid-template-rows: 3em auto;
grid-template-columns: 100%;
height: 100%;
overflow: scroll;
}

.create-event-grid-inst {
grid-template-rows: 3em 3em auto;
}

.create-event-form-second-line {
grid-row-start: 2;
}

.create-event-form-third-line {
grid-row-start: 3;
}

.create-event-form-grid {
grid-template-rows: 88% auto;
height: 100%;
grid-template-columns: 100%;
}

.create-event-img-field {
height: 20%;
}

.create-event-city-margin {
margin-top: -0.2em;
}

.event-links-color {
color:#009688;
}

@media screen and (min-height: 600px) {
.event-links-fields {
max-height: 13em;
}
}

@media screen and (min-height: 700px) {
.event-links-fields {
max-height: 15em;
}
}

@media screen and (min-height: 800px) {
.event-links-fields {
max-height: 18em;
}
}
}
38 changes: 23 additions & 15 deletions frontend/event/eventController.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
(function() {
var app = angular.module('app');

app.controller("EventController", function EventController(EventService, $state, $mdDialog, AuthService, $q, STATES) {
app.controller("EventController", function EventController(EventService, $state, $mdDialog, AuthService, $q, STATES, SCREEN_SIZES) {
const eventCtrl = this;
let content = document.getElementById("content");

Expand Down Expand Up @@ -62,19 +62,27 @@
}

eventCtrl.newEvent = function newEvent(event) {
$mdDialog.show({
controller: 'EventDialogController',
controllerAs: "controller",
templateUrl: 'app/event/event_dialog.html',
targetEvent: event,
clickOutsideToClose: true,
locals: {
if(Utils.isMobileScreen(SCREEN_SIZES.SMARTPHONE)) {
$state.go(STATES.CREATE_EVENT, {
eventKey: null,
event: event,
events: eventCtrl.events
},
bindToController: true
}).then(() => {
eventCtrl._getEventsByDay();
});
});
} else {
$mdDialog.show({
controller: 'EventDialogController',
controllerAs: "controller",
templateUrl: 'app/event/event_dialog.html',
targetEvent: event,
clickOutsideToClose: true,
locals: {
events: eventCtrl.events
},
bindToController: true
}).then(() => {
eventCtrl._getEventsByDay();
});
}
};

eventCtrl.share = function share(ev, event) {
Expand All @@ -98,7 +106,7 @@
* @param {object} event - The current event
*/
eventCtrl.goToEvent = (event) => {
$state.go('app.user.event', { eventKey: event.key });
$state.go(STATES.EVENT_DETAILS, { eventKey: event.key });
};

/**
Expand Down Expand Up @@ -208,7 +216,7 @@

eventCtrl.$onInit = () => {
eventCtrl.institutionKey = $state.params.institutionKey;
if(Utils.isMobileScreen(475)) {
if(Utils.isMobileScreen(SCREEN_SIZES.SMARTPHONE)) {
eventCtrl._getMonths();
} else {
eventCtrl.loadMoreEvents();
Expand Down
Loading

0 comments on commit 3bfd3a6

Please sign in to comment.