summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--public/assets/javascripts/ui/editor/EditorSettings.js10
-rw-r--r--public/assets/javascripts/ui/editor/EditorView.js4
-rw-r--r--public/assets/javascripts/ui/reader/EmbedView.js50
-rw-r--r--public/assets/javascripts/ui/reader/ReaderView.js1
-rw-r--r--public/assets/javascripts/ui/reader/ShareView.js40
-rw-r--r--public/assets/javascripts/util.js13
-rwxr-xr-xpublic/assets/stylesheets/app.css66
-rw-r--r--views/controls/editor/collaborators.ejs57
-rw-r--r--views/controls/editor/share.ejs16
-rw-r--r--views/controls/reader/about-room.ejs1
-rw-r--r--views/controls/reader/embed.ejs25
-rwxr-xr-xviews/editor.ejs2
-rw-r--r--views/partials/scripts.ejs3
-rw-r--r--views/reader.ejs1
14 files changed, 236 insertions, 53 deletions
diff --git a/public/assets/javascripts/ui/editor/EditorSettings.js b/public/assets/javascripts/ui/editor/EditorSettings.js
index 2b29961..026607a 100644
--- a/public/assets/javascripts/ui/editor/EditorSettings.js
+++ b/public/assets/javascripts/ui/editor/EditorSettings.js
@@ -110,7 +110,6 @@ var EditorSettings = FormView.extend({
clear: function(e){
e.preventDefault()
-
Scenery.removeAll()
},
@@ -215,6 +214,7 @@ var EditorSettings = FormView.extend({
clickSave: function(){
this.toggle(false)
this.save()
+ this.isVisible = true
},
success: function(data){
@@ -226,7 +226,13 @@ var EditorSettings = FormView.extend({
Minotaur.hide()
window.history.pushState(null, document.title, "/project/" + data.slug + "/edit")
-
+
+ this.parent.share.setLink( "http://vvalls.com/project/" + data.slug )
+ if (this.isVisible) {
+ this.isVisible = false
+ this.parent.share.show()
+ }
+
this.parent.data = data
},
diff --git a/public/assets/javascripts/ui/editor/EditorView.js b/public/assets/javascripts/ui/editor/EditorView.js
index 2872ab9..3773366 100644
--- a/public/assets/javascripts/ui/editor/EditorView.js
+++ b/public/assets/javascripts/ui/editor/EditorView.js
@@ -21,6 +21,7 @@ var EditorView = View.extend({
this.textEditor = new TextEditor ({ parent: this })
this.collaborators = new Collaborators ({ parent: this })
this.presets = new Presets ({ parent: this })
+ this.share = new ShareView ({ parent: this })
},
load: function(name){
@@ -41,6 +42,8 @@ var EditorView = View.extend({
ready: function(data){
$("#map").hide()
+ this.data = data
+
this.settings.load(data)
this.info.load(data)
},
@@ -70,6 +73,7 @@ var EditorView = View.extend({
hideExtras: function(){
this.mediaEditor.hide()
this.textEditor.hide()
+ this.share.hide()
Scenery.resize.hide()
Scenery.hovering = false
}
diff --git a/public/assets/javascripts/ui/reader/EmbedView.js b/public/assets/javascripts/ui/reader/EmbedView.js
new file mode 100644
index 0000000..a0b3c6f
--- /dev/null
+++ b/public/assets/javascripts/ui/reader/EmbedView.js
@@ -0,0 +1,50 @@
+var EmbedView = ModalView.extend({
+ el: ".embedView",
+
+ events: {
+ "keydown": "stopPropagation",
+ "input [name=width]": "build",
+ "input [name=height]": "build",
+ "click [name=mute]": "build",
+ "click textarea": "selectAll",
+ },
+
+ defaultWidth: 600,
+ defaultHeight: 450,
+
+ initialize: function(opt){
+ this.parent = opt.parent
+ this.$embedCode = this.$("#embedCode")
+ this.$width = this.$("[name=width]")
+ this.$height = this.$("[name=height]")
+ this.$mute = this.$("[name=mute]")
+
+ this.$width.val(this.defaultWidth)
+ this.$height.val(this.defaultHeight)
+ },
+
+ show: function(){
+ this.build()
+ this.__super__.show.call(this)
+ },
+
+ build: function(){
+ var mute = this.$mute.prop('checked') ? 1 : 0
+ var width = clamp( this.$width.int(), 0, 2000) || this.defaultWidth
+ var height = clamp( this.$height.int(), 0, 2000) || this.defaultHeight
+ var link = this.parent.getLink()
+ link += "?mute=" + mute
+// link += "&noui=1"
+ var kode = "<iframe src='" + encodeURI(link) + "' width='" + width + "' height='" + height + "'"
+ + " seamless scrolling='no' style='border: 0'"
+ + " webkitAllowFullScreen mozallowfullscreen allowfullscreen"
+ + "></iframe>"
+
+ this.$embedCode.val( kode )
+ },
+
+ selectAll: function(){
+ this.$embedCode[0].select()
+ },
+
+})
diff --git a/public/assets/javascripts/ui/reader/ReaderView.js b/public/assets/javascripts/ui/reader/ReaderView.js
index c132609..9e0d21e 100644
--- a/public/assets/javascripts/ui/reader/ReaderView.js
+++ b/public/assets/javascripts/ui/reader/ReaderView.js
@@ -29,6 +29,7 @@ var ReaderView = View.extend({
ready: function(data){
$("#map").hide()
+ this.data = data
data.rooms && Rooms.deserialize(data.rooms)
data.walls && Walls.deserialize(data.walls)
data.media && Scenery.deserialize(data.media)
diff --git a/public/assets/javascripts/ui/reader/ShareView.js b/public/assets/javascripts/ui/reader/ShareView.js
index 4e5f832..dbe6f64 100644
--- a/public/assets/javascripts/ui/reader/ShareView.js
+++ b/public/assets/javascripts/ui/reader/ShareView.js
@@ -2,31 +2,61 @@ var ShareView = View.extend({
el: ".share",
events: {
+ "keydown": "stopPropagation",
"click #share_facebook": "facebook",
"click #share_twitter": "twitter",
+ "click #share_embed": "embed",
},
initialize: function(opt){
this.parent = opt.parent
+ this.embedView = new EmbedView ({ parent: this })
+ this.$link = this.$("#share_link")
+ },
+
+ toggle: function(state){
+ if (typeof state == "boolean") {
+ this.$el.toggleClass("active", state)
+ }
+ else {
+ this.$el.toggleClass("active")
+ }
+ },
+ show: function(){
+ this.toggle(true)
+ },
+ hide: function(){
+ this.toggle(false)
+ },
+
+ setLink: function(url){
+ this.$link.val( url )
+ },
+ getLink: function(){
+ var link = window.location.origin + window.location.pathname
+ link = link.replace(/\/edit\/?$/, "")
+ return link
},
facebook: function (e) {
e.preventDefault()
- var msg = $(".roomName").html() + " on VValls"
- var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(window.location.origin + window.location.pathname) + "&t=" + encodeURIComponent(msg);
+ var link = this.getLink()
+ var msg = app.controller.data.name + " on VValls"
+ var url = "https://www.facebook.com/share.php?u=" + encodeURIComponent(link) + "&t=" + encodeURIComponent(msg)
window.open(url, "_blank")
},
twitter: function (e) {
e.preventDefault()
- var msg = $(".roomName").html() + " on VValls"
- var url = "https://twitter.com/home?status=" + encodeURIComponent(window.location.origin + window.location.pathname + " " + msg);
+ var link = this.getLink()
+ var msg = app.controller.data.name + " on VValls"
+ var url = "https://twitter.com/home?status=" + encodeURIComponent(link + " " + msg)
window.open(url, "_blank")
},
embed: function (e) {
e.preventDefault()
-
+ this.embedView.show()
},
})
diff --git a/public/assets/javascripts/util.js b/public/assets/javascripts/util.js
index 2fa994a..1749836 100644
--- a/public/assets/javascripts/util.js
+++ b/public/assets/javascripts/util.js
@@ -239,4 +239,17 @@ if (!Function.prototype.bind) {
}());
+function selectElementContents(el) {
+ if (window.getSelection && document.createRange) {
+ var sel = window.getSelection();
+ var range = document.createRange();
+ range.selectNodeContents(el);
+ sel.removeAllRanges();
+ sel.addRange(range);
+ } else if (document.selection && document.body.createTextRange) {
+ var textRange = document.body.createTextRange();
+ textRange.moveToElementText(el);
+ textRange.select();
+ }
+}
diff --git a/public/assets/stylesheets/app.css b/public/assets/stylesheets/app.css
index d37884e..8b5e011 100755
--- a/public/assets/stylesheets/app.css
+++ b/public/assets/stylesheets/app.css
@@ -2572,23 +2572,35 @@ a[data-role="forgot-password"] {
text-decoration: none;
font-size: 12px;
font-weight: 600;
+ cursor: pointer;
}
-.share a:nth-child(3){
+.share a:nth-child(3), .share a:nth-child(4) {
margin-left:4px;
}
.share a:hover{
text-decoration:underline;
}
+.vvbox.share {
+ width: 300px
+}
+.vvbox.share #share_link {
+ width: 100%;
+ margin-top: 4px;
+ padding: 3px;
+ font-weight: 300;
+ font-size: 11px;
+}
+
/* COLLABORATORS */
-.collaborators .rap {
+.mediaDrawer .rap {
display: table;
width: 100%;
height: 100%;
}
-.collaborators .rap .holder .inner {
+.mediaDrawer .rap .holder .inner {
width: 480px;
margin: 0 auto;
text-align: left;
@@ -2623,7 +2635,7 @@ a[data-role="forgot-password"] {
background-color: black;
border-color: black;
}
-.collaborators p {
+.mediaDrawer .rap p {
margin: 10px 0 20px;
font-weight: 300;
}
@@ -2631,7 +2643,7 @@ a[data-role="forgot-password"] {
font-size: 16px;
width: 300px;
}
-.collaborators h2 {
+.mediaDrawer .rap h2 {
margin: 20px auto 0;
}
#collaborator-list {
@@ -2667,6 +2679,50 @@ a[data-role="forgot-password"] {
font-weight: 300;
font-style: italic;
}
+#collaborator-url-rapper {
+ display: none;
+ background: #fff;
+ border: 1px solid;
+ box-shadow: -3px 3px 0;
+ padding: 10px;
+ font-weight: 300;
+ font-size: 14px;
+ margin: 10px 0;
+}
+#collaborator-url {
+ font-size: 16px;
+ width: 500px;
+ border: 1px solid;
+ font-size: 14px;
+ padding: 5px;
+ font-weight: 300;
+ margin-top: 5px;
+ display: block;
+}
+
+/* EMBED CODE GENERATOR */
+
+.embedView textarea {
+ border: 1px solid black;
+ width: 100%;
+ height: 100px;
+ font-family: 'Menlo', 'Monaco', 'Lucida Sans Console', monospace;
+ padding: 5px;
+ line-height: 15px;
+}
+.embedView input[type=text] {
+ border: 1px solid black;
+ width: 40px;
+ padding: 2px;
+ font-size: 14px;
+ margin: 5px;
+}
+.embedView label {
+ font-size: 14px;
+}
+.embedView {
+ font-weight: 300;
+}
/* MARCHING ANTS ANIMATION */
diff --git a/views/controls/editor/collaborators.ejs b/views/controls/editor/collaborators.ejs
index b658bf6..8ad8c00 100644
--- a/views/controls/editor/collaborators.ejs
+++ b/views/controls/editor/collaborators.ejs
@@ -4,29 +4,29 @@
<div class="rap">
<div class="holder">
<div class="inner vvbox">
- <h2>Collaborators</h2>
+ <h2>Collaborators</h2>
- <p>
- To invite others to contribute to this project, submit their email address below. They'll receive an email with instructions to join this blog and register if they're not a Vvalls user yet.
- </p>
+ <p>
+ To invite others to contribute to this project, submit their email address below. They'll receive an email with instructions to join this project and register if they're not a Vvalls user yet.
+ </p>
- <form>
- <input type="text" id="collaborator-email" name="email">
- <input type="submit" id="collaborator-invite" value="Invite to this project">
- </form>
+ <form>
+ <input type="text" id="collaborator-email" name="email">
+ <input type="submit" id="collaborator-invite" value="Invite to this project">
+ </form>
- <div id="collaborator-url-rapper">
- We've sent a link to join this project to <span id="collaborator-dummy-email"></span>.
- You can also send this link yourself:
- <input type="text" id="collaborator-url">
- </div>
+ <div id="collaborator-url-rapper">
+ We've sent a link to join this project to <span id="collaborator-dummy-email"></span>.
+ You can also send this link yourself:
+ <input type="text" id="collaborator-url">
+ </div>
- <ul id="collaborator-list">
- </ul>
- </div>
+ <ul id="collaborator-list">
+ </ul>
+ </div>
+ </div>
</div>
</div>
-</div>
<script type="text/html" id="collaborator-template">
<li>
@@ -38,26 +38,3 @@
<span class="role">owner</span>
</li>
</script>
-
-<style>
-#collaborator-url-rapper {
- display: none;
- background: #fff;
- border: 1px solid;
- box-shadow: -3px 3px 0;
- padding: 10px;
- font-weight: 300;
- font-size: 14px;
- margin: 10px 0;
-}
-#collaborator-url {
- font-size: 16px;
- width: 500px;
- border: 1px solid;
- font-size: 14px;
- padding: 5px;
- font-weight: 300;
- margin-top: 5px;
- display: block;
-}
-</style>
diff --git a/views/controls/editor/share.ejs b/views/controls/editor/share.ejs
new file mode 100644
index 0000000..7e7ad3c
--- /dev/null
+++ b/views/controls/editor/share.ejs
@@ -0,0 +1,16 @@
+<div class="vvbox settings share">
+ <h4>Project Saved</h4>
+
+ <div class="setting">
+ <h2>Share on–</h2>
+ <a id="share_facebook">Facebook</a>
+ <a id="share_twitter">Twitter</a>
+ <a id="share_embed">Embed</a>
+ </div>
+
+ <div class="setting">
+ Send people this link:
+ <input type="text" id="share_link">
+ </div>
+
+</div>
diff --git a/views/controls/reader/about-room.ejs b/views/controls/reader/about-room.ejs
index c9ad626..eba8c98 100644
--- a/views/controls/reader/about-room.ejs
+++ b/views/controls/reader/about-room.ejs
@@ -13,6 +13,7 @@
<h2>Share on–</h2>
<a id="share_facebook">Facebook</a>
<a id="share_twitter">Twitter</a>
+ <a id="share_embed">Embed</a>
</div>
[[ if (canEdit) { ]]
diff --git a/views/controls/reader/embed.ejs b/views/controls/reader/embed.ejs
new file mode 100644
index 0000000..a897fbe
--- /dev/null
+++ b/views/controls/reader/embed.ejs
@@ -0,0 +1,25 @@
+<div class="embedView fixed mediaDrawer animate">
+ <span class="close">X</span>
+
+ <div class="rap">
+ <div class="holder">
+ <div class="inner vvbox">
+ <h2>Embed Vvalls</h2>
+
+ <p>
+ This code generates an iframe which will embed this room in your website or blog.
+ </p>
+ <textarea id="embedCode"></textarea>
+
+ dimensions: <input type="text" name="width">x<input type="text" name="height">
+ <input type="checkbox" name="mute" id="mute" checked> <label for="mute">mute</label>
+<!--
+ <input type="checkbox" id=""> <label for=""></label>
+ <input type="checkbox" id=""> <label for=""></label>
+ <input type="checkbox" id=""> <label for=""></label>
+ -->
+
+ </div>
+ </div>
+ </div>
+</div>
diff --git a/views/editor.ejs b/views/editor.ejs
index 29db917..efc4b9d 100755
--- a/views/editor.ejs
+++ b/views/editor.ejs
@@ -20,6 +20,8 @@
[[ include controls/editor/color-control ]]
[[ include controls/editor/text-editor ]]
[[ include controls/editor/collaborators ]]
+ [[ include controls/editor/share ]]
+ [[ include controls/reader/embed ]]
[[ include controls/editor/settings ]]
[[ include controls/editor/presets ]]
</div>
diff --git a/views/partials/scripts.ejs b/views/partials/scripts.ejs
index 3e61a5a..70c3b27 100644
--- a/views/partials/scripts.ejs
+++ b/views/partials/scripts.ejs
@@ -7,7 +7,7 @@
<script type="text/javascript" src="/assets/javascripts/vendor/tube.js"></script>
<script type="text/javascript" src="/assets/javascripts/vendor/loader.js"></script>
<script type="text/javascript" src="/assets/javascripts/vendor/polyfill.js"></script>
-<!--<script type="text/javascript" src="/assets/javascripts/vendor/wow.js"></script>-->
+<!-- <script type="text/javascript" src="/assets/javascripts/vendor/wow.js"></script> -->
<script type="text/javascript" src="/assets/javascripts/vendor/chardinjs.min.js"></script>
<script type="text/javascript" src="/assets/javascripts/vendor/sha1.js"></script>
<script type="text/javascript" src="/assets/javascripts/vendor/dataUriToBlob.js"></script>
@@ -115,6 +115,7 @@
<script type="text/javascript" src="/assets/javascripts/ui/reader/ReaderView.js"></script>
<script type="text/javascript" src="/assets/javascripts/ui/reader/ShareView.js"></script>
+<script type="text/javascript" src="/assets/javascripts/ui/reader/EmbedView.js"></script>
<script type="text/javascript" src="/assets/javascripts/ui/reader/MediaPlayer.js"></script>
<script type="text/javascript" src="/assets/javascripts/ui/reader/Tracker.js"></script>
diff --git a/views/reader.ejs b/views/reader.ejs
index e86bab1..b9b53d2 100644
--- a/views/reader.ejs
+++ b/views/reader.ejs
@@ -15,6 +15,7 @@
<div id="editorView">
[[ include controls/reader/about-room ]]
[[ include controls/reader/media-player ]]
+ [[ include controls/reader/embed ]]
</div>
<!--
generated by cgit v1.2.3-70-g09d2 (git 2.51.0) at 2025-12-11 21:56:24 +0000