Improve mailinglist page
This commit is contained in:
1 parent
a67187d693
commit
4f8eb0f3dc
8 files changed
+1587
-4092
No files matched your search
@@ -1,5 +1,5 @@
|
||||
'use strict';
|
||||
/*global moment, jQuery, document, _, $, window */
|
||||
/*global moment, jQuery, document, _, $, window, List */
|
||||
var program_endpoint = 'https://studentersamfundet.no/api/events/get_today/';
|
||||
var inside_url = 'https://inside.studentersamfundet.no';
|
||||
var inside_groups_url = inside_url + '/api/groups.php';
|
||||
@@ -194,12 +194,15 @@ function mailinglist_show(q) {
|
||||
_wpnonce: $('meta[name=x-inside-api-nonce]').attr('content')
|
||||
},
|
||||
function(data) {
|
||||
var list = '<h5>Medlemmer på ' + data.meta.list +'</h5><ul id="members-result"><% _.each(members, function(m) { %>' +
|
||||
var list = '<h5 class="list-members-title">Medlemmer på ' + data.meta.list +'</h5><span class="list-num-members"><%= members.length %> stk</span><ul id="members-result"><% _.each(members, function(m) { %>' +
|
||||
'<li><a href="mailto:<%= m %>"><span class="dashicons dashicons-email"></span> <%= m %></a></li>' +
|
||||
'<% }); %></ul>';
|
||||
var html = _.template(list, data);
|
||||
$('.list-members').html(html);
|
||||
$('.lists-list-wrap .meta').html('<a href="#members-result" class="button radius list-members-button">Vis medlemmer på '+ data.meta.list +'</a>');
|
||||
|
||||
/* Highlight selected list */
|
||||
$('[data-list-name=\''+q+'\']').addClass('selected');
|
||||
}
|
||||
);
|
||||
}
|
||||
@@ -302,10 +305,9 @@ jQuery(document).ready(function() {
|
||||
|
||||
/* Mailinglists page */
|
||||
if( $('.page-mailinglists').length ) {
|
||||
// TODO:
|
||||
// - selected mailinglist logic and highlight
|
||||
// - better mobile layout
|
||||
// - sorting by list size
|
||||
// TODO: better mobile layout
|
||||
// TODO: dynamic show/hide of members
|
||||
|
||||
/* Load list of lists*/
|
||||
$.getJSON(
|
||||
email_endpoint,
|
||||
@@ -314,19 +316,24 @@ jQuery(document).ready(function() {
|
||||
_wpnonce: $('meta[name=x-inside-api-nonce]').attr('content')
|
||||
},
|
||||
function(data) {
|
||||
// TODO, dynamic show/hide of members
|
||||
var list = '<h5>Viser '+ data.meta.num +' epostlister:</h5><ul><% _.each(lists, function(l) { %>' +
|
||||
'<li><a href="'+ window.location.pathname + '?q=<%= l.name %>"><%= l.name %></a><br>' +
|
||||
var list = '<% _.each(lists, function(l) { %>' +
|
||||
'<li data-list-name="<%= l.name %>"><a href="'+ window.location.pathname + '?q=<%= l.name %>" class="list-name"><%= l.name %></a><br>' +
|
||||
'<span class="list-num-members"><%= l.num %> medlemmer</span>'+
|
||||
'<a href="<%= l.admin_url %>" class="email-<%= l.type %> button-alt" title="<%= l.type %>"> '+
|
||||
'<span class="dashicons dashicons-<% if( l.admin_type == "selfservice" ) { %>edit<% } else { %>email<% } %>"> </span>Endre'+
|
||||
'</a></li>' +
|
||||
'<% }); %></ul>';
|
||||
'<% }); %>';
|
||||
var html = _.template(list, data);
|
||||
$('.lists-list').html(html);
|
||||
|
||||
/* Index list and make searchable and sortable */
|
||||
var options = {
|
||||
valueNames: [ 'list-name', 'list-num-members' ]
|
||||
};
|
||||
new List('mailinglists', options);
|
||||
mailinglists_load_initial();
|
||||
}
|
||||
);
|
||||
mailinglists_load_initial();
|
||||
}
|
||||
|
||||
/* Profile page */
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
// TODO: zheight param
|
||||
|
||||
@mixin card($padding: rem-calc(10) 0) {
|
||||
padding: $padding;
|
||||
background-color: #fff;
|
||||
border: 1px solid #eee;
|
||||
box-shadow: rgba(0,0,0,0.14902) 0px 1px 0px 0px, rgba(0,0,0,0.09804) 0px 1px 2px 0px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
@mixin card-z1($padding) {
|
||||
@include card($padding);
|
||||
box-shadow: rgba(0,0,0,0.14902) 0px 1px 0px 0px, rgba(0,0,0,0.09804) 0px 1px 2px 0px;
|
||||
}
|
||||
@mixin card-z2($padding) {
|
||||
@include card($padding);
|
||||
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
|
||||
}
|
||||
@@ -1,5 +1,6 @@
|
||||
@import 'normalize';
|
||||
@import 'chosen';
|
||||
@import 'mixins';
|
||||
|
||||
/* Colors */
|
||||
$body-bg: #fafafa;
|
||||
@@ -435,6 +436,7 @@ input[type=submit]{
|
||||
.profile-details,
|
||||
.account-details {
|
||||
@include grid-column(12);
|
||||
margin-bottom: rem-calc(16);
|
||||
|
||||
@media #{$large-up} {
|
||||
@include grid-column(6);
|
||||
@@ -485,12 +487,30 @@ input[type=submit]{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.list-manipulation {
|
||||
padding-top: rem-calc(10);
|
||||
@include clearfix();
|
||||
|
||||
.lists-list {
|
||||
.button-alt {
|
||||
margin-bottom: rem-calc(8);
|
||||
}
|
||||
.sort-buttons {
|
||||
@include grid-column(6);
|
||||
}
|
||||
.search-field {
|
||||
@include grid-column(6);
|
||||
}
|
||||
}
|
||||
.lists-list-wrap {
|
||||
#mailinglists {
|
||||
@include card($padding: 0);
|
||||
}
|
||||
margin-bottom: rem-calc(18);
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
}
|
||||
li {
|
||||
list-style: none;
|
||||
@@ -498,34 +518,51 @@ input[type=submit]{
|
||||
display: block;
|
||||
position: relative;
|
||||
line-height: 1.15;
|
||||
&:nth-child(odd) {
|
||||
background-color: #f4f4f4;
|
||||
border-bottom: 1px solid #eee;
|
||||
border-left: 4px solid transparent;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: transparent;
|
||||
}
|
||||
&.selected {
|
||||
border-left: 4px solid $secondary-color;
|
||||
}
|
||||
|
||||
.button-alt {
|
||||
color: #666;
|
||||
background-color: transparent;
|
||||
&:hover {
|
||||
background-color: #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.button-alt {
|
||||
color: #666;
|
||||
background-color: transparent;
|
||||
&:hover {
|
||||
background-color: #ccc;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list-members {
|
||||
.list-members-title{
|
||||
line-height: 1.15;
|
||||
display: inline-block;
|
||||
margin-right: rem-calc(4);
|
||||
|
||||
}
|
||||
ul {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
@extend .card;
|
||||
@include card($padding: 0);
|
||||
}
|
||||
li {
|
||||
list-style: none;
|
||||
font-size: rem-calc(14);
|
||||
a {
|
||||
padding: 8px 10px;
|
||||
display: block;
|
||||
position: relative;
|
||||
border-bottom: 1px solid #eee
|
||||
border-bottom: 1px solid #eee;
|
||||
|
||||
}
|
||||
&:last-child a {
|
||||
border-bottom: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
.list-num-members {
|
||||
|
||||
@@ -8,12 +8,13 @@
|
||||
"moment": "~2.8.3",
|
||||
"underscore": "~1.7.0",
|
||||
"chosen-bower": "~1.1.0",
|
||||
"history.js": "~1.8.0"
|
||||
"history.js": "~1.8.0",
|
||||
"list.js": "~1.1.1"
|
||||
},
|
||||
"devDependencies": {},
|
||||
"overrides": {
|
||||
"history.js": {
|
||||
"main": "./scripts/bundled/html4+html5/native.history.js"
|
||||
}
|
||||
"history.js": {
|
||||
"main": "./scripts/bundled/html4+html5/native.history.js"
|
||||
}
|
||||
}
|
||||
}
|
||||
+1
-1
@@ -1 +1 @@
|
||||
"use strict";function getParameterByName(e){e=e.replace(/[\[]/,"\\[").replace(/[\]]/,"\\]");var t=new RegExp("[\\?&]"+e+"=([^&#]*)"),a=t.exec(location.search);return null===a?"":decodeURIComponent(a[1].replace(/\+/g," "))}function format_posts(e){var t="",a=0;if(0===e.length)return"Idag er det stille på huset :-/";for(a=0;a<e.length;a++){var n=e[a];t+='<li class="fadein">',t+='<span class="entry-starttime">'+moment.unix(n.custom_fields._neuf_events_starttime).utc().format("HH.mm")+"</span>: ",t+='<a href="'+n.url+'">'+n.title+"</a>",t+=' <span class="entry-venue">'+n.custom_fields._neuf_events_venue+"</span>",t+="</li>"}return t}function format_results(e){var t="<table><thead><tr><th>Navn</th><th>Brukernavn</th><th>Epost</th><th>Telefon</th><th>Har medlemskap</th><th>Grupper</th></tr></thead>";if(e.error)return console.log(e.error),$(".search-result-list").html(""),void $(".search-results .meta").html("");if(0===e.meta.num_results)return $(".search-result-list").html("Uffda, ingen treff."),void $(".search-results .meta").html("");var a='<tbody><% _.each(results, function(u) { %><tr><td><a href="'+inside_url+'/?page=display-user&userid=<%= u.id %>"><%= u.firstname %> <%= u.lastname %></a></td><td><%= u.username %></td><td><a href="mailto:<%= u.email %>"><%= u.email %></a></td><td><a href="tlf:<%= u.number %>"><%= u.number %></a></td><td><% if(u.is_member != 0) { %>Ja<% } else { %>Nei<% } %></td><td class="groups"><% _.each(u.groups, function(g, i) { %><%= g.name %><% if(u.groups.length !== i +1){ %>, <% } %><% }); %></td></tr> <% }); %></tbody></table>',n=t+_.template(a,e);$(".search-result-list").html(n);var s="Antall treff: <%= meta.num_results %>";$(".search-results .meta").html(_.template(s,e))}function do_search(){var e=$('.filters [data-search-filter="has_valid_membership"]'),t="",a=$(".groups-select").val();null!==a&&(t=a.join());var n={q:$(".search-field").val(),filter_groups:t};e.hasClass("active")&&(n.has_valid_membership=!0);var s=$.param(n);window.History.pushState(null,null,"?"+s),n._wpnonce=$("meta[name=x-inside-api-nonce]").attr("content"),$.getJSON(user_search_endpoint,n,format_results)}function user_search_load_initial_values(){var e=!1,t=getParameterByName("q");t&&t.length>0&&($(".search-field").val(t),e=!0);var a=getParameterByName("has_valid_membership");a&&"true"===a&&($('.filters [data-search-filter="has_valid_membership"]').addClass("active"),e=!0);var n=getParameterByName("filter_groups"),s=[];if(n&&n.length>0){s=-1!==n.indexOf(",")?n.split(","):[n];var r=!1,i=0;for(i=0;i<s.length;i++){var l=s[i];$.isNumeric(l)||(r=!0)}r||(e=!0,$(".groups-select").val(s),$(".groups-select").trigger("chosen:updated"))}e&&do_search()}function save_user_meta(e,t){try{localStorage.setItem(e,t)}catch(a){}var n=$("meta[name=x-siteurl]").attr("content")+"/wp-admin/admin-ajax.php",s={action:"neuf_save_user_meta",meta_key:e,meta_value:t,unique:!0,user_id:parseInt($("meta[name=x-user-id]").attr("content"),10),_wpnonce:$("meta[name=x-user-meta-nonce]").attr("content")};$.post(n,s)}function get_user_meta(e,t){try{var a=localStorage.getItem(e);if(null!==a)return void t({result:a})}catch(n){}var s=$("meta[name=x-siteurl]").attr("content")+"/wp-admin/admin-ajax.php",r={action:"neuf_get_user_meta",meta_key:e,single:!0,user_id:parseInt($("meta[name=x-user-id]").attr("content"),10),_wpnonce:$("meta[name=x-user-meta-nonce]").attr("content")};$.getJSON(s,r,function(a){if(a.hasOwnProperty("result")&&""!==a.result)try{localStorage.setItem(e,a.result)}catch(n){}t(a)})}function mailinglist_show(e){$.getJSON(email_endpoint,{"do":"list",q:e,_wpnonce:$("meta[name=x-inside-api-nonce]").attr("content")},function(e){var t="<h5>Medlemmer på "+e.meta.list+'</h5><ul id="members-result"><% _.each(members, function(m) { %><li><a href="mailto:<%= m %>"><span class="dashicons dashicons-email"></span> <%= m %></a></li><% }); %></ul>',a=_.template(t,e);$(".list-members").html(a),$(".lists-list-wrap .meta").html('<a href="#members-result" class="button radius list-members-button">Vis medlemmer på '+e.meta.list+"</a>")})}function mailinglists_load_initial(){var e=getParameterByName("q");e&&e.length>0&&mailinglist_show(e)}var program_endpoint="https://studentersamfundet.no/api/events/get_today/",inside_url="https://inside.studentersamfundet.no",inside_groups_url=inside_url+"/api/groups.php",user_search_endpoint="/inside-api/",email_endpoint="/email-api/",query_params={};jQuery(document).ready(function(){moment.locale("nb");var e=jQuery;e("#menu .menu-toggle").on("click",function(t){t.preventDefault();var a=e("#menu .main-menu, #menu .user-menu-wrap");a.toggleClass("visible")}),e("#menu a.profile-badge").on("click",function(t){t.preventDefault();var a=e("#menu .user-menu");a.toggleClass("visible")}),e("[data-toggle-introduction]").on("click",function(){e(this).parent().fadeOut(600),save_user_meta("introduction_dismissed",!0)}),e(".front-page .introduction").length&&get_user_meta("introduction_dismissed",function(t){t.hasOwnProperty("resultLine truncated
|
||||
"use strict";function getParameterByName(e){e=e.replace(/[\[]/,"\\[").replace(/[\]]/,"\\]");var t=new RegExp("[\\?&]"+e+"=([^&#]*)"),a=t.exec(location.search);return null===a?"":decodeURIComponent(a[1].replace(/\+/g," "))}function format_posts(e){var t="",a=0;if(0===e.length)return"Idag er det stille på huset :-/";for(a=0;a<e.length;a++){var s=e[a];t+='<li class="fadein">',t+='<span class="entry-starttime">'+moment.unix(s.custom_fields._neuf_events_starttime).utc().format("HH.mm")+"</span>: ",t+='<a href="'+s.url+'">'+s.title+"</a>",t+=' <span class="entry-venue">'+s.custom_fields._neuf_events_venue+"</span>",t+="</li>"}return t}function format_results(e){var t="<table><thead><tr><th>Navn</th><th>Brukernavn</th><th>Epost</th><th>Telefon</th><th>Har medlemskap</th><th>Grupper</th></tr></thead>";if(e.error)return console.log(e.error),$(".search-result-list").html(""),void $(".search-results .meta").html("");if(0===e.meta.num_results)return $(".search-result-list").html("Uffda, ingen treff."),void $(".search-results .meta").html("");var a='<tbody><% _.each(results, function(u) { %><tr><td><a href="'+inside_url+'/?page=display-user&userid=<%= u.id %>"><%= u.firstname %> <%= u.lastname %></a></td><td><%= u.username %></td><td><a href="mailto:<%= u.email %>"><%= u.email %></a></td><td><a href="tlf:<%= u.number %>"><%= u.number %></a></td><td><% if(u.is_member != 0) { %>Ja<% } else { %>Nei<% } %></td><td class="groups"><% _.each(u.groups, function(g, i) { %><%= g.name %><% if(u.groups.length !== i +1){ %>, <% } %><% }); %></td></tr> <% }); %></tbody></table>',s=t+_.template(a,e);$(".search-result-list").html(s);var n="Antall treff: <%= meta.num_results %>";$(".search-results .meta").html(_.template(n,e))}function do_search(){var e=$('.filters [data-search-filter="has_valid_membership"]'),t="",a=$(".groups-select").val();null!==a&&(t=a.join());var s={q:$(".search-field").val(),filter_groups:t};e.hasClass("active")&&(s.has_valid_membership=!0);var n=$.param(s);window.History.pushState(null,null,"?"+n),s._wpnonce=$("meta[name=x-inside-api-nonce]").attr("content"),$.getJSON(user_search_endpoint,s,format_results)}function user_search_load_initial_values(){var e=!1,t=getParameterByName("q");t&&t.length>0&&($(".search-field").val(t),e=!0);var a=getParameterByName("has_valid_membership");a&&"true"===a&&($('.filters [data-search-filter="has_valid_membership"]').addClass("active"),e=!0);var s=getParameterByName("filter_groups"),n=[];if(s&&s.length>0){n=-1!==s.indexOf(",")?s.split(","):[s];var r=!1,i=0;for(i=0;i<n.length;i++){var l=n[i];$.isNumeric(l)||(r=!0)}r||(e=!0,$(".groups-select").val(n),$(".groups-select").trigger("chosen:updated"))}e&&do_search()}function save_user_meta(e,t){try{localStorage.setItem(e,t)}catch(a){}var s=$("meta[name=x-siteurl]").attr("content")+"/wp-admin/admin-ajax.php",n={action:"neuf_save_user_meta",meta_key:e,meta_value:t,unique:!0,user_id:parseInt($("meta[name=x-user-id]").attr("content"),10),_wpnonce:$("meta[name=x-user-meta-nonce]").attr("content")};$.post(s,n)}function get_user_meta(e,t){try{var a=localStorage.getItem(e);if(null!==a)return void t({result:a})}catch(s){}var n=$("meta[name=x-siteurl]").attr("content")+"/wp-admin/admin-ajax.php",r={action:"neuf_get_user_meta",meta_key:e,single:!0,user_id:parseInt($("meta[name=x-user-id]").attr("content"),10),_wpnonce:$("meta[name=x-user-meta-nonce]").attr("content")};$.getJSON(n,r,function(a){if(a.hasOwnProperty("result")&&""!==a.result)try{localStorage.setItem(e,a.result)}catch(s){}t(a)})}function mailinglist_show(e){$.getJSON(email_endpoint,{"do":"list",q:e,_wpnonce:$("meta[name=x-inside-api-nonce]").attr("content")},function(t){var a='<h5 class="list-members-title">Medlemmer på '+t.meta.list+'</h5><span class="list-num-members"><%= members.length %> stk</span><ul id="members-result"><% _.each(members, function(m) { %><li><a href="mailto:<%= m %>"><span class="dashicons dashicons-email"></span> <%= m %></a></li><% }); %></ul>',s=_.template(a,t);$(".list-members").html(s),$(".lists-list-wrap .meta").html('<a href="#members-result" class="button radius list-members-button">Vis medlemmer på '+t.meta.list+"</a>"),$("[data-list-name='"+e+"']").addClass("selected")})}function mailinglists_load_initial(){var e=getParameterByName("q");e&&e.length>0&&mailinglist_show(e)}var program_endpoint="https://studentersamfundet.no/api/events/get_today/",inside_url="https://inside.studentersamfundet.no",inside_groups_url=inside_url+"/api/groups.php",user_search_endpoint="/inside-api/",email_endpoint="/email-api/",query_params={};jQuery(document).ready(function(){moment.locale("nb");var e=jQuery;e("#menu .menu-toggle").on("click",function(t){t.preventDefault();var a=e("#menu .main-menu, #menu .user-menu-wrap");a.toggleClass("visible")}),e("#menu a.profile-badge").on("click",function(t){t.preventDefault();var a=e("#menu .user-menu");a.toggleClass("visible")}),e("[data-toggle-introduction]").on("click",function(){e(this).parent().fadeOut(600),save_user_meta("intLine truncated
|
||||
+1475
-1
File diff suppressed because it is too large.
Load diff
+1
-4049
File diff suppressed because it is too large.
Load diff
@@ -13,21 +13,27 @@
|
||||
<div class="search-about">
|
||||
<?php the_post(); the_content(); ?>
|
||||
</div>
|
||||
<!--<div class="sort-by">
|
||||
<label>Sortér på:</label>
|
||||
<ul class="button-group">
|
||||
<li><a href="#" class="button-alt" data-sort-by="num">Antall medlemmer</a></li>
|
||||
<li><a href="#" class="button-alt" data-sort-by="name">Navn</a></li>
|
||||
</ul>
|
||||
</div>-->
|
||||
<div class="lists-list-wrap">
|
||||
<div class="meta"></div>
|
||||
<div class="lists-list"></div>
|
||||
</div>
|
||||
<div class="list-members-wrap">
|
||||
<div class="meta"></div>
|
||||
<div class="list-members"></div>
|
||||
<div class="lists-list-wrap">
|
||||
<div class="meta"></div>
|
||||
<div id="mailinglists">
|
||||
<div class="list-manipulation">
|
||||
<div class="search-field">
|
||||
<label>Søk i listene:</label>
|
||||
<input class="search" type="text" />
|
||||
</div>
|
||||
<div class="sort-buttons">
|
||||
<label>Sortér på:</label>
|
||||
<span class="button-alt sort" data-sort="list-num-members">Antall medlemmer</span>
|
||||
<span class="button-alt sort" data-sort="list-name">Navn</span>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="lists-list list"></ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list-members-wrap">
|
||||
<div class="meta"></div>
|
||||
<div class="list-members"></div>
|
||||
</div>
|
||||
|
||||
<div class="toptoptop">
|
||||
<a href="#site-header" class="button-alt">Til toppen</a>
|
||||
|
||||
Reference in new issue
Block a user