seth
/
jam-cloud
mirror of https://bitbucket.org/jamkazam/jam-cloud.git
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

VRFS-3246 : More reliable layout and styling for online presence and performance samples.

This commit is contained in:
Steven Miers 2015-05-31 20:14:18 -05:00
parent 4dbf2e1c95
commit 1f076dcc75
3 changed files with 121 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
web/app/assets/javascripts/accounts_profile_samples.js
View File

@ -48,8 +48,7 @@
$.when(api.getUserProfile())
.done(function(userDetail) {
renderPresence(userDetail);
renderSamples(userDetail);
$document.triggerHandler('INIT_SITE_VALIDATORS');
renderSamples(userDetail);
});
}
@ -335,11 +334,6 @@
// refactor:
function initializeValidators() {
var initialized = false;
$(document).on('INIT_SITE_VALIDATORS', function(e, data) {
window.soundCloudRecordingValidator.init(window.soundCloudRecordingSources);
window.youTubeRecordingValidator.init(window.youTubeRecordingSources);
});
$(document).on('JAMKAZAM_READY', function(e, data) {
window.JK.JamServer.get$Server().on(window.JK.EVENTS.CONNECTION_UP, function() {
if(initialized) {
@ -379,8 +373,10 @@
window.twitterValidator.init();
window.soundCloudRecordingValidator = new JK.RecordingSourceValidator('rec_soundcloud', soundCloudSuccessCallback, siteFailCallback);
logger.debug("window.soundCloudRecordingValidator", window.soundCloudRecordingValidator)
window.youTubeRecordingValidator = new JK.RecordingSourceValidator('rec_youtube', youTubeSuccessCallback, siteFailCallback);
$document.triggerHandler('INIT_SITE_VALIDATORS');
}, 1);
@ -433,6 +429,14 @@
}
});
});
$(document).on('INIT_SITE_VALIDATORS', function(e, data) {
logger.debug("ZZZwindow.soundCloudRecordingValidator", window.soundCloudRecordingValidator)
window.soundCloudRecordingValidator.init(window.soundCloudRecordingSources);
window.youTubeRecordingValidator.init(window.youTubeRecordingSources);
});
} // end initializeValidators.
function initialize() {

70
web/app/assets/stylesheets/client/accountProfileSamples.css.scss
View File

@ -1,10 +1,26 @@
@import "common.css.scss";
@import "site_validator.css.scss";
.profile-online-sample-controls {
.profile-online-sample-controls {
table.profile-table {
width: 100%;
tr:nth-child(even) td {
padding: 0.25em 0.25em 1em 0.25em;
vertical-align: top;
}
tr:nth-child(odd) td {
padding: 0.25em;
vertical-align: top;
}
}
table.control-table {
width: 100%;
}
.sample-row {
position: relative;
clear: both;
}
.sample {
@ -13,54 +29,12 @@
}
.presence {
margin: 3px 30px 15px 0px;
input {
width:200px;
}
margin: 3px 30px 15px 0px;
}
.samples-container {
overflow: hidden;
.samples {
width: 30%;
margin: 0.5em;
label {
height: 1.5em;
}
.controls {
height: 2em;
}
input {
width: 200px;
}
.sample {
margin: 3px 5px 10px 0px;
a.add-recording-source {
margin-top: 2px !important;
}
}
div.sample-list {
min-height: 150px;
width: auto;
min-width: 100px;
border: 2px solid #ccc;
overflow: scroll;
}
div.entry {
margin-left: 10px;
margin-top: 5px;
}
div.close-button {
margin-right: 15px;
margin-top: 5px;
cursor: pointer;
}
.site_validator {
a, .spinner-small {
margin: -7px 1px 2px 2px;
}
}
}

155
web/app/views/clients/_profile_online_sample_controls.html.slim
View File

@ -1,69 +1,88 @@
.profile-online-sample-controls
.sample_row
.left
label Website (URL):
#url_validator.left.presence.site_validator
input#website maxlength="4000" type="text"
span.spinner-small
.left
label SoundCloud (username):
#soundcloud_validator.left.presence.site_validator
input#soundcloud-username maxlength="100" type="text"
span.spinner-small
.left
label ReverbNation (username):
#reverbnation_validator.left.presence.site_validator
input#reverbnation-username maxlength="100" type="text"
span.spinner-small
.left
label Bandcamp (username):
#bandcamp_validator.left.presence.site_validator
input#bandcamp-username maxlength="100" type="text"
span.spinner-small
.sample_row
.left
label Fandalism (URL):
#fandalism_validator.left.presence.site_validator
input#fandalism-username maxlength="100" type="text"
span.spinner-small
.left
label YouTube (username):
#youtube_validator.left.presence.site_validator
input#youtube-username maxlength="100" type="text"
span.spinner-small
.left
label Facebook (username):
#facebook_validator.left.presence.site_validator
input#facebook-username maxlength="100" type="text"
span.spinner-small
.left
label Twitter (username):
#twitter_validator.left.presence.site_validator
input#twitter-username maxlength="100" type="text"
span.spinner-small
.sample_row.samples-container
.left.samples.jamkazam
label JamKazam Recordings:
.controls
.left
a#btn-add-jk-recording.button-grey BROWSE
br.clearall
.sample-list
.left.samples.soundcloud
label SoundCloud Recordings (URL):
.controls
#rec_soundcloud_validator.left.sample.site_validator
input#soundcloud-recording maxlength="4000" type="text"
a#btn-add-soundcloud-recording.button-grey.add-recording-source ADD
span.spinner-small
br.clearall
.sample-list
.left.samples.youtube
label YouTube Videos (URL):
.controls
#rec_youtube_validator.left.sample.site_validator
input#youtube-video maxlength="4000" type="text"
a#btn-add-youtube-video.button-grey.add-recording-source ADD
span.spinner-small
br.clearall
.sample-list
table.profile-table
tr
td colspan="25%": label Website (URL):
td colspan="25%": label SoundCloud (username):
td colspan="25%": label ReverbNation (username):
td colspan="25%": label Bandcamp (username):
tr
td colspan="25%"
table.control-table: tr#url_validator.presence.site_validator
td colspan="100%"
input#website maxlength="4000" type="text"
td
span.spinner-small
td colspan="25%"
table.control-table: tr#soundcloud_validator.presence.site_validator
td colspan="100%"
input#soundcloud-username maxlength="100" type="text"
td
span.spinner-small
td colspan="25%"
table.control-table: tr#reverbnation_validator.presence.site_validator
td colspan="100%"
input#reverbnation-username maxlength="100" type="text"
td
span.spinner-small
td colspan="25%"
table.control-table: tr#bandcamp_validator.presence.site_validator
td colspan="100%"
input#bandcamp-username maxlength="100" type="text"
td
span.spinner-small
tr
td colspan="25%": label Fandalism (URL):
td colspan="25%": label YouTube (username):
td colspan="25%": label Facebook (username):
td colspan="25%": label Twitter (username):
tr
td colspan="25%"
table.control-table: tr#fandalism_validator.presence.site_validator
td colspan="100%"
input#fandalism-username maxlength="100" type="text"
td
span.spinner-small
td colspan="25%"
table.control-table: tr#youtube_validator.presence.site_validator
td colspan="100%"
input#youtube-username maxlength="100" type="text"
td
span.spinner-small
td colspan="25%"
table.control-table: tr#facebook_validator.presence.site_validator
td colspan="100%"
input#facebook-username maxlength="100" type="text"
td
span.spinner-small
td colspan="25%"
table.control-table: tr#twitter_validator.presence.site_validator
td colspan="100%"
input#twitter-username maxlength="100" type="text"
td
span.spinner-small
tr
td colspan="33.33%": label JamKazam Recordings:
td colspan="33.33%": label SoundCloud Recordings (URL):
td colspan="33.33%": label YouTube Videos (URL):
tr
td colspan="33.33%"
a#btn-add-jk-recording.button-grey BROWSE
td colspan="33.33%"
table.control-table: tr#rec_soundcloud_validator.sample.site_validator
td colspan="100%"
input#soundcloud-recording maxlength="4000" type="text"
td
a#btn-add-soundcloud-recording.button-grey.add-recording-source ADD
span.spinner-small
td colspan="33.33%"
table.control-table: tr#rec_youtube_validator.sample.site_validator
td colspan="100%"
input#youtube-video maxlength="4000" type="text"
td
a#btn-add-youtube-video.button-grey.add-recording-source ADD
span.spinner-small
tr
td colspan="33.33%": .sample-list
td colspan="33.33%": .sample-list
td colspan="33.33%": .sample-list