diff --git a/css/style.css b/css/style.css
index 22180d5..53465a9 100644
--- a/css/style.css
+++ b/css/style.css
@@ -497,6 +497,10 @@ textarea {
input[type="text"] {
height: 34px;
}
+span {
+ display: flex;
+ justify-content: center;
+}
.btn, .btn:hover, .btn:focus,
a.btn, a.btn:hover, a.btn:focus {
background-color: #CB4D59;
@@ -561,6 +565,50 @@ a.btn:active {
top:3px;
border-bottom: 0;
}
+.random, .random:hover, .random:focus,
+a.random, a.random:hover, a.random:focus {
+ background-color: #18AE90;
+ background-image: none;
+ border: 0;
+ border-bottom: 3px solid #017F66;
+ border-radius: 0;
+ color: #FEFDFD;
+ cursor: pointer;
+ display: inline-block;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.42857;
+ outline: none;
+ padding: 5px 20px;
+ position: relative;
+ text-decoration: none;
+ vertical-align: top;
+ white-space: nowrap;
+ -moz-user-select: none;
+ -webkit-appearance: none;
+}
+.reset, .reset:hover, .reset:focus,
+a.reset, a.reset:hover, a.reset:focus {
+ background-color: #CB4D59;
+ background-image: none;
+ border: 0;
+ border-bottom: 3px solid #8B121E;
+ border-radius: 0;
+ color: #FEFDFD;
+ cursor: pointer;
+ display: inline-block;
+ font-size: 14px;
+ font-weight: 400;
+ line-height: 1.42857;
+ outline: none;
+ padding: 5px 20px;
+ position: relative;
+ text-decoration: none;
+ vertical-align: top;
+ white-space: nowrap;
+ -moz-user-select: none;
+ -webkit-appearance: none;
+}
/**
* GENERAL
* -----------------------------------------------------------------------------
diff --git a/js/app/app.js b/js/app/app.js
index a6aab82..6c88f33 100644
--- a/js/app/app.js
+++ b/js/app/app.js
@@ -20,6 +20,7 @@ define("app", function(require) {
Radio.channel("App").reply("region:show", this.showRegion.bind(this));
Radio.channel("App").reply("modal:show", this.showModal.bind(this));
Radio.channel("Sounds").on("sound:play", this.changeUrl.bind(this));
+ Radio.channel("Sounds").on("sound:stop", this.resetUrl.bind(this));
this.router = new Marionette.AppRouter();
@@ -46,6 +47,10 @@ define("app", function(require) {
this.router.navigate("son/"+slug);
},
+ resetUrl: function() {
+ this.router.navigate("/");
+ },
+
showRegion: function showRegion(params) {
this.mainRegion.show(params.view);
},
diff --git a/js/app/collections/sounds.js b/js/app/collections/sounds.js
index 04d17da..0c126a5 100644
--- a/js/app/collections/sounds.js
+++ b/js/app/collections/sounds.js
@@ -14,6 +14,15 @@ define("collections/sounds", function(require) {
return str1.localeCompare(str2);
},
+ filterByCid: function(cid) {
+ if(cid == "") {
+ return this;
+ }
+
+ return new Sounds(this.filter(function(data) {
+ return data.cid == cid;
+ }));
+ },
filterByTitle: function(search){
var that = this,
pattern;
@@ -25,7 +34,7 @@ define("collections/sounds", function(require) {
pattern = new RegExp(this.removeDiacritics(search), "gi");
return new Sounds(this.filter(function(data) {
pattern.lastIndex = 0;
-
+
return pattern.test(that.removeDiacritics(data.get("title")))
|| pattern.test(that.removeDiacritics(data.get("character")))
|| pattern.test(that.removeDiacritics(data.get("episode")));
diff --git a/js/app/templates/random.hbs b/js/app/templates/random.hbs
new file mode 100644
index 0000000..7470cfd
--- /dev/null
+++ b/js/app/templates/random.hbs
@@ -0,0 +1,2 @@
+
+
\ No newline at end of file
diff --git a/js/app/templates/soundboard.hbs b/js/app/templates/soundboard.hbs
index a284c03..7eb31fa 100644
--- a/js/app/templates/soundboard.hbs
+++ b/js/app/templates/soundboard.hbs
@@ -1,6 +1,12 @@
-
+
+
+
+
+
diff --git a/js/app/views/random.js b/js/app/views/random.js
new file mode 100644
index 0000000..2089f5f
--- /dev/null
+++ b/js/app/views/random.js
@@ -0,0 +1,31 @@
+define("views/random", function(require) {
+ "use strict";
+
+ var Marionette = require("marionette"),
+ Radio = require("backbone.radio"),
+ RandomTemplate = require("hbs!templates/random"),
+ RandomView;
+
+ RandomView = Marionette.LayoutView.extend({
+ template: RandomTemplate,
+ ui: {
+ randomButton: "#random",
+ resetButton: "#reset"
+ },
+ events: {
+ "click @ui.randomButton": "random",
+ "click @ui.resetButton": "reset"
+ },
+ initialize: function() {
+ this.channel = Radio.channel("Sounds");
+ },
+ random: function() {
+ this.channel.trigger("sounds:random");
+ },
+ reset: function() {
+ this.channel.trigger("sounds:reset");
+ }
+ });
+
+ return RandomView;
+});
diff --git a/js/app/views/soundboard.js b/js/app/views/soundboard.js
index 97bd4bc..32999ea 100644
--- a/js/app/views/soundboard.js
+++ b/js/app/views/soundboard.js
@@ -3,6 +3,7 @@ define("views/soundboard", function(require) {
var Marionette = require("marionette"),
SoundsFilterView = require("views/filter"),
+ RandomView = require("views/random"),
SoundsView = require("views/sounds"),
SoundboardTemplate = require("hbs!templates/soundboard"),
SoundboardView;
@@ -11,6 +12,7 @@ define("views/soundboard", function(require) {
template: SoundboardTemplate,
regions: {
regFilter: "#filter",
+ regRandom: "#random",
regList: "#list"
},
initialize: function(options) {
@@ -18,6 +20,7 @@ define("views/soundboard", function(require) {
},
onShow: function() {
this.showChildView("regFilter", new SoundsFilterView());
+ this.showChildView("regRandom", new RandomView());
this.showChildView("regList", new SoundsView({
slug: this.slug
}));
diff --git a/js/app/views/sounds.js b/js/app/views/sounds.js
index 6a830f2..60beaf2 100644
--- a/js/app/views/sounds.js
+++ b/js/app/views/sounds.js
@@ -28,6 +28,8 @@ define("views/sounds", function(require) {
this.channel = Radio.channel("Sounds");
this.channel.request("getSounds").then(this.initCollection.bind(this));
this.channel.on("sounds:filter", this.filterCollection.bind(this));
+ this.channel.on("sounds:random", this.randomSound.bind(this));
+ this.channel.on("sounds:reset", this.resetCollection.bind(this));
},
onBeforeRender: function() {
var sound;
@@ -52,11 +54,32 @@ define("views/sounds", function(require) {
this.render();
},
+ filterCollectionByCid: function(cid) {
+ this.collection = this.data.collection.filterByCid(cid);
+
+ this.render();
+ },
manageSounds: function(args) {
this.stopPlayingSound();
Radio.channel("Sounds").trigger("sound:play", args.model.getSlug());
},
+ randomSound: function() {
+ this.stopPlayingSound();
+
+ this.filterCollection("");
+ var index = Math.floor(Math.random() * Math.floor(this.collection.length));
+ var sound = this.collection.models[index];
+ this.filterCollectionByCid(sound.cid);
+
+ Radio.channel("Sounds").trigger("sound:play", sound.getSlug());
+ sound.play();
+ },
+ resetCollection: function() {
+ this.filterCollection("");
+
+ Radio.channel("Sounds").trigger("sound:stop");
+ },
stopPlayingSound: function() {
var playingSound = this.collection.findWhere({playing: true});