diff options
Diffstat (limited to 'public/assets/javascripts/ui')
| -rw-r--r-- | public/assets/javascripts/ui/_router.js | 2 | ||||
| -rw-r--r-- | public/assets/javascripts/ui/editor/MediaEditor.js | 22 | ||||
| -rw-r--r-- | public/assets/javascripts/ui/reader/MediaPlayer.js | 30 |
3 files changed, 37 insertions, 17 deletions
diff --git a/public/assets/javascripts/ui/_router.js b/public/assets/javascripts/ui/_router.js index c0f35b6..2b2c7c0 100644 --- a/public/assets/javascripts/ui/_router.js +++ b/public/assets/javascripts/ui/_router.js @@ -189,7 +189,7 @@ var SiteRouter = Router.extend({ var name = e ? $(e.currentTarget).data("name") : name - confirmModal.confirm("Are you sure you want to delete " + name + "?", function(){ + ConfirmModal.confirm("Are you sure you want to delete " + name + "?", function(){ this.documentModal.destroy(name, function(){ AlertModal.alert("Document deleted!", function(){ window.location.href = "/about" diff --git a/public/assets/javascripts/ui/editor/MediaEditor.js b/public/assets/javascripts/ui/editor/MediaEditor.js index 4e1132c..1ffe7b8 100644 --- a/public/assets/javascripts/ui/editor/MediaEditor.js +++ b/public/assets/javascripts/ui/editor/MediaEditor.js @@ -3,13 +3,14 @@ var MediaEditor = FormView.extend({ el: "#mediaEditor", events: { - "click .playButton": "togglePlaying", + "click [data-role=play-media]": "togglePaused", "mousedown [name=keyframe]": "stopPropagation", "mousedown": "stopPropagation", "change [name=keyframe]": "seek", "change [name=autoplay]": "setAutoplay", "change [name=loop]": "setLoop", "change [name=mute]": "setMute", + "click [data-role=destroy-media]": "destroy", }, initialize: function(opt){ @@ -25,7 +26,7 @@ var MediaEditor = FormView.extend({ this.$units = this.$("[name=units]") // video fields - this.$playButton = this.$(".playButton") + this.$playButton = this.$("[data-role=play-media]") this.$autoplay = this.$("[name=autoplay]") this.$loop = this.$("[name=loop]") this.$mute = this.$("[name=mute]") @@ -36,8 +37,8 @@ var MediaEditor = FormView.extend({ this.$el.toggleClass("active", state); }, - togglePlaying: function(){ - var state = this.scenery.toggle() + togglePaused: function(state){ + var state = this.scenery.toggle(state) this.$playButton.toggleClass("playing", ! state) }, @@ -71,7 +72,7 @@ var MediaEditor = FormView.extend({ this.$(".video").show() this.$(".image").hide() - this.$playButton.toggleClass("playing", ! this.scenery.paused()) + this.$playButton.toggleClass("paused", this.scenery.paused()) this.$autoplay.prop('checked', !! media.autoplay) this.$loop.prop('checked', !! media.loop) this.$mute.prop('checked', !! media.mute) @@ -97,6 +98,9 @@ var MediaEditor = FormView.extend({ setAutoplay: function(){ var checked = this.$autoplay.prop('checked') this.scenery.media.autoplay = checked + if (checked && this.scenery.paused()) { + this.togglePaused() + } }, setLoop: function(){ var checked = this.$loop.prop('checked') @@ -117,5 +121,13 @@ var MediaEditor = FormView.extend({ this.scenery.mx.bound = false this.scenery = null }, + + destroy: function(){ + ConfirmModal.confirm("Are you sure you want to this media?", function(){ + var scenery = this.scenery + this.hide() + Scenery.remove(scenery.id) + }.bind(this)) + }, }) diff --git a/public/assets/javascripts/ui/reader/MediaPlayer.js b/public/assets/javascripts/ui/reader/MediaPlayer.js index 74054b4..df2d075 100644 --- a/public/assets/javascripts/ui/reader/MediaPlayer.js +++ b/public/assets/javascripts/ui/reader/MediaPlayer.js @@ -3,7 +3,8 @@ var MediaPlayer = FormView.extend({ el: "#mediaPlayer", events: { - "click .playButton": "togglePlaying", + "click [data-role=play-media]": "togglePaused", + "click [data-role=mute-media]": "toggleMuted", "mousedown": "stopPropagation", }, @@ -18,16 +19,22 @@ var MediaPlayer = FormView.extend({ this.$dimensions = this.$(".dimensions") // video fields - this.$playButton = this.$(".playButton") + this.$playButton = this.$("[data-role=play-media]") + this.$muteButton = this.$("[data-role=mute-media]") }, toggle: function(state) { this.$el.toggleClass("active", state); }, - togglePlaying: function(){ - var state = this.scenery.toggle() - this.$playButton.toggleClass("playing", ! state) + togglePaused: function(state){ + var state = this.scenery.toggle(state) + this.$playButton.toggleClass("paused", ! state) + }, + + toggleMuted: function(state){ + var state = this.scenery.toggleMuted(state) + this.$muteButton.toggleClass("muted", state) }, pick: function(scenery) { @@ -45,7 +52,7 @@ var MediaPlayer = FormView.extend({ this.bind(scenery) this.$el.addClass("active") - + this.$name.html(media.title) this.$description.html(media.description) @@ -54,9 +61,9 @@ var MediaPlayer = FormView.extend({ this.$(".image").show() this.$(".video").hide() - this.$widthDimension.html( Number(media.widthDimension) || "" ) - this.$heightDimension.html( Number(media.heightDimension) || "" ) - this.$units.html( media.units || "cm" ) +// this.$widthDimension.html( Number(media.widthDimension) || "" ) +// this.$heightDimension.html( Number(media.heightDimension) || "" ) +// this.$units.html( media.units || "cm" ) break @@ -65,8 +72,9 @@ var MediaPlayer = FormView.extend({ case "video": this.$(".video").show() this.$(".image").hide() - - this.$playButton.toggleClass("playing", ! this.scenery.paused()) + + this.$playButton.toggleClass("paused", ! this.scenery.paused()) + this.$muteButton.toggleClass("muted", this.scenery.muted()) break } |