initial commit.
This commit is contained in:
mntmn
24
views/artifact_list.html
Normal file
24
views/artifact_list.html
Normal file
@@ -0,0 +1,24 @@
|
||||
<html>
|
||||
<body>
|
||||
<h2>[[space.name]]</h2>
|
||||
|
||||
<table class="table table-striped" border=1>
|
||||
<tr>
|
||||
<th>created</th>
|
||||
<th>updated</th>
|
||||
<th>filetype</th>
|
||||
<th>filename</th>
|
||||
<th>preview</th>
|
||||
</tr>
|
||||
{% for a in space.artifacts %}
|
||||
<tr>
|
||||
<td>[[ a.created_at | date('d.m.Y H:i') ]] by [[ a.user.email ]][[ a.editor_name ]]</td>
|
||||
<td>[[ a.updated_at | date('d.m.Y H:i') ]] by [[ a.update_user.email ]][[ a.last_update_editor_name ]]</td>
|
||||
<td>[[ a.mime ]]</td>
|
||||
<td>{% if a.payload_uri %}<a href="[[a.payload_uri]]">[[ a.filename ]]</a>{% endif %}</td>
|
||||
<td>[[ a.description ]]</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
11
views/emails/action.html
Normal file
11
views/emails/action.html
Normal file
@@ -0,0 +1,11 @@
|
||||
[[ text | safe ]]
|
||||
|
||||
{% if options.message %}
|
||||
<p>
|
||||
<i>[[options.message]]</i>
|
||||
</p>
|
||||
{% endif %}
|
||||
{% if options.action %}<br><br>
|
||||
<a href="[[options.action.link]]" target="_blank">[[options.action.name]]</a><br>
|
||||
{% endif %}
|
||||
|
||||
3
views/error.html
Normal file
3
views/error.html
Normal file
@@ -0,0 +1,3 @@
|
||||
<h1>[[ message ]]</h1>
|
||||
<h2>[[ error.status ]]</h2>
|
||||
<pre>[[ error.stack ]]</pre>
|
||||
26
views/facebook.html
Normal file
26
views/facebook.html
Normal file
@@ -0,0 +1,26 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>[[space.name]]</title>
|
||||
<meta charset="utf-8" />
|
||||
<meta property="og:title" content="[[space.name]]" />
|
||||
<meta property="og:description" content="" />
|
||||
<meta property="og:updated_time" content="[[space.updated_at.getTime()]]" />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:image" content="[[space.thumbnail_url]]" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<h1>[[space.name]]</h1>
|
||||
{% for a in space.artifacts %}
|
||||
<tr>
|
||||
<td>[[ a.mime ]]</td>
|
||||
<td>[[ a.description | striptags ]]</td>
|
||||
<td>{% if a.payload_uri %}<a href="[[ a.payload_uri ]]">download</a>{% endif %}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
62
views/index.html
Normal file
62
views/index.html
Normal file
@@ -0,0 +1,62 @@
|
||||
{% extends 'layouts/outer.html' %}
|
||||
|
||||
{% block title %}[[ __("welcome") ]]{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<div id="landing">
|
||||
<div class="landing-keyvisual-wrapper">
|
||||
<div class="landing-box">
|
||||
<h2>[[__("landing_title")]]</h2>
|
||||
|
||||
<p class="lead">
|
||||
<a href="/signup" class="btn btn-primary btn-block btn-xl">[[__("signup")]]</a>
|
||||
</p>
|
||||
|
||||
<p class="lead">
|
||||
<a href="/login" class="btn btn-primary btn-block btn-xl">[[__("login")]]</a>
|
||||
</p>
|
||||
|
||||
<p class="lead">
|
||||
[[__("landing_claim")]]
|
||||
</p>
|
||||
|
||||
<p class="lead">
|
||||
[[__("landing_example")]]
|
||||
</p>
|
||||
|
||||
<ul>
|
||||
<li class="lead">
|
||||
[[__("landing_features_1") | safe ]]
|
||||
</li>
|
||||
|
||||
<li class="lead">
|
||||
[[__("landing_features_2") | safe ]]
|
||||
</li>
|
||||
|
||||
<li class="lead">
|
||||
[[__("landing_features_3") | safe ]]
|
||||
</li>
|
||||
|
||||
<li class="lead">
|
||||
[[__("landing_features_4") | safe ]]
|
||||
</li>
|
||||
|
||||
<li class="lead">
|
||||
[[__("landing_features_5") | safe ]]
|
||||
</li>
|
||||
|
||||
<li class="lead">
|
||||
[[__("landing_features_6") | safe ]]
|
||||
</li>
|
||||
|
||||
<li class="lead">
|
||||
[[__("landing_features_7") | safe ]]
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
61
views/layouts/outer.html
Normal file
61
views/layouts/outer.html
Normal file
@@ -0,0 +1,61 @@
|
||||
<!doctype html>
|
||||
<html class="no-js">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Spacedeck Open – {% block title %}{% endblock %}</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||
<link href="[[ '/images/favicon.png' | cdn ]]" rel="icon" type="image/x-icon" />
|
||||
|
||||
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,700,600,800,300|Montserrat:400,700|EB+Garamond|Vollkorn|Lato|Roboto|Source+Code+Pro|Ubuntu|Raleway|Playfair+Display|Crimson+Text' rel='stylesheet' type='text/css'>
|
||||
|
||||
<link type="text/css" rel="stylesheet" href="https://fast.fonts.net/cssapi/ee1a3484-4d98-4f9f-9f55-020a7b37f3c5.css"/>
|
||||
|
||||
<link rel="stylesheet" href="[[ '/stylesheets/style.css' | cdn ]]">
|
||||
<script> var csrf_token = '[[ csrf_token ]]'; </script>
|
||||
|
||||
<script src="[[ '/javascripts/jquery-2.1.4.min.js' | cdn ]]"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<!--[if lt IE 10]>
|
||||
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
||||
<![endif]-->
|
||||
<header id="landing-header" class="header">
|
||||
<div class="header-left">
|
||||
<a class="btn btn-transparent btn-nude" href="[[config.endpoint]]/"><img src="[[ '/images/sd5-logo.svg' | cdn ]]" width="190"></a>
|
||||
</div>
|
||||
|
||||
<div class="header-right pull-right">
|
||||
{% if !user %}
|
||||
<span class="btn-group dark round">
|
||||
{% if (locale != "de") %}<a href="/t/de" rel="alternate" hreflang="de" class="btn btn-transparent btn-md">Deutsch</a>{% endif %}
|
||||
{% if (locale != "en") %}<a href="/t/en" rel="alternate" hreflang="en" class="btn btn-transparent btn-md">English</a>{% endif %}
|
||||
{% if (locale != "fr") %}<a href="/t/fr" rel="alternate" hreflang="fr" class="btn btn-transparent btn-md">Français</a>{% endif %}
|
||||
</span>
|
||||
|
||||
<a class="btn btn-md btn-dark btn-round" href="/login">[[__("login")]]</a>
|
||||
<a class="btn btn-md btn-blue btn-round" href="/signup">[[__("signup")]]</a>
|
||||
{% else %}
|
||||
<a class="btn btn-md btn-blue btn-round" href="/spaces">[[__("spaces")]]</a>
|
||||
<a class="btn btn-md btn-dark btn-round" href="/logout">[[__("logout")]]</a>
|
||||
|
||||
{% endif %}
|
||||
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{% block content %}{% endblock %}
|
||||
|
||||
<div class="footer">
|
||||
<p>
|
||||
<div class="col-xs-6">
|
||||
<a href="/contact">[[ __("contact") ]]</a>
|
||||
<span style="color:#888">© 2011–2017 The Spacedeck Open Developers</span>
|
||||
</div>
|
||||
</p>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
11
views/not_found.html
Normal file
11
views/not_found.html
Normal file
@@ -0,0 +1,11 @@
|
||||
{% extends 'layouts/outer.html' %}
|
||||
|
||||
{% block title %}[[ __("not_found") ]]{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<div id="landing" style="padding-top:200px;margin:auto;width:300px;">
|
||||
<h1>[[__("not_found")]]</h1>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
169
views/partials/account.html
Normal file
169
views/partials/account.html
Normal file
@@ -0,0 +1,169 @@
|
||||
<div id="team" class="dialog in" style="padding:100px;z-index:20000;position:absolute;width:100%;min-height:100%;background-color:#eee" v-if="active_view == 'account' && user" v-cloak>
|
||||
|
||||
<a href="/spaces" class="btn btn-round btn-icon btn-stroke-darken btn-md pull-right" style="position:absolute;top:30px;right:30px"><span class="icon icon-cross-0"></span></a>
|
||||
|
||||
<div class="dialog-tabs" style="margin:auto">
|
||||
<div class="dialog-tab" v-bind:class="{open:account=='profile'}" v-on:click="account='profile'"><span>[[__("profile_caption")]]</span></div>
|
||||
<div class="dialog-tab" v-bind:class="{open:account=='language'}" v-on:click="account='language'"><span>[[__("language_caption")]]</span></div>
|
||||
<div class="dialog-tab" v-bind:class="{open:account=='notifications'}" v-on:click="account='notifications'"><span>[[__("notifications_caption")]]</span></div>
|
||||
<div class="dialog-tab" v-if="user.account_type=='email'" v-bind:class="{open:account=='password'}" v-on:click="account='password'"><span>[[__("password_caption")]]</span></div>
|
||||
<div class="dialog-tab" v-bind:class="{open:account=='terminate'}" v-on:click="account='terminate'"><span>[[__("terminate_caption")]]</span></div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section text-left" style="background-color:#f5f5f5;padding-top:40px;padding-bottom:40px">
|
||||
<div class="collapse" v-bind:class="{in:account=='profile'}">
|
||||
<div class="labels-inline relative" style="margin-bottom:40px">
|
||||
<div class="form-group">
|
||||
<div id="profile-image" class="img loaded pull-left" style="margin-right: 50px;">
|
||||
|
||||
<span id="profile-thumbnail" class="btn btn-xl btn-darken btn-icon btn-round" v-bind:style="{'background-image':'url('+user.avatar_thumb_uri+')'}">
|
||||
<span class="icon icon-user" v-if="!user.avatar_thumb_uri"></span>
|
||||
</span>
|
||||
|
||||
<span class="spinner"></span>
|
||||
<button id="remove-profile-image" class="btn btn-xs btn-dark btn-round btn-icon" v-on:click="delete_user_avatar_image()" v-if="has_avatar_image(user)">
|
||||
<span class="icon icon-cross-3"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="pull-left">
|
||||
<div class="form-group">
|
||||
<label class="file btn btn-md btn-darken" style="margin-right: 5px;">
|
||||
<input type="file" v-on:change="save_user_avatar_image(this)">
|
||||
<span v-if="!uploading_avatar">[[__("upload_avatar")]]</span>
|
||||
<span v-if="uploading_avatar">[[__("uploading_avatar")]]</span>
|
||||
</label>
|
||||
|
||||
<p class="message">[[__("avatar_dimensions")]]</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="label" >[[__("profile_name")]]</label>
|
||||
<input type="text" id="user-nickname"
|
||||
pattern=".{3,}"
|
||||
required title="3 characters minimum"
|
||||
class="input input-white no-b" data-i18n="[placeholder]account.username.input"
|
||||
v-model="user.nickname" placeholder="Choose a username">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="label">[[__("profile_email")]]</label>
|
||||
|
||||
<input
|
||||
id="new-email"
|
||||
v-bind:class="{disabled: user.account_type=='google'}"
|
||||
v-bind:disabled="user.account_type=='google'"
|
||||
class="input input-white no-b"
|
||||
type="email"
|
||||
v-model="user.email"
|
||||
v-on:change="user.email_changed=true"
|
||||
placeholder="mail@example.com">
|
||||
|
||||
<button class="btn btn-md btn-darken" v-if="user.account_type=='email'" v-on:click=" save_user()" style="margin-top:20px">[[__("ok")]]</button>
|
||||
</div>
|
||||
|
||||
<div class="form-group" v-if="!user.confirmed_at">
|
||||
<p v-if="!user.confirmed_at && !account_confirmed_sent">[[__("confirmation_sent_long")]]</p>
|
||||
|
||||
<span
|
||||
class="btn btn-xs btn-stroke-darken btn-round"
|
||||
v-on:click=" confirm_again()"
|
||||
v-if="!user.confirmed_at && !account_confirmed_sent"
|
||||
>[[__("send_again")]]</span>
|
||||
|
||||
<p v-if="account_confirmed_sent">
|
||||
<span class="icon icon-check"></span> <span>[[__("confirmation_sent_another")]]</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="collapse" v-bind:class="{in:account=='language'}">
|
||||
<div class="modal-section">
|
||||
<label class="radio" v-bind:class="{checked
|
||||
: user.preferences.language=='en'}" v-on:click="save_user_language('en')">
|
||||
<input type="radio" id="user-preferences_language" name="language" value="en"><span>English</span>
|
||||
</label>
|
||||
<hr/>
|
||||
<label class="radio" v-bind:class="{checked: user.preferences.language=='de'}" v-on:click="save_user_language('de')">
|
||||
<input type="radio" id="user-preferences_language" name="language" value="de"><span>Deutsch</span>
|
||||
</label>
|
||||
<hr/>
|
||||
<label class="radio" v-bind:class="{checked: user.preferences.language=='fr'}" v-on:click="save_user_language('fr')">
|
||||
<input type="radio" id="user-preferences_language" name="language" value="fr"><span>Français</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="collapse" v-bind:class="{in:account=='notifications'}">
|
||||
<div class="modal-section labels-inline">
|
||||
<div class="form-group">
|
||||
<label class="checkbox"
|
||||
v-bind:class="{checked: user.preferences.email_notifications}"
|
||||
v-on:click="account_save_user_notifications(!user.preferences.email_notifications);">
|
||||
<span>[[__('notifications_option_chat')]]</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="collapse" v-bind:class="{in:account=='password'}">
|
||||
<h4 class="modal-title">Change Password</h4>
|
||||
<div class="modal-section labels-inline">
|
||||
<div class="form-group">
|
||||
<label class="label">[[__("current_password")]]</label>
|
||||
<input id="current-password" class="input input-white no-b" v-model="password_change_current" type="password">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="label">[[__("new_password")]]</label>
|
||||
<input id="new-password" class="input input-white no-b" v-model="password_change_new" type="password">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="label">[[__("verify_password")]]</label>
|
||||
<input id="new-password-confirmation" class="input input-white no-b" v-model="password_change_new_confirmation" type="password">
|
||||
</div>
|
||||
|
||||
<div class="center alert alert-danger" v-if="password_change_error">{{password_change_error}}</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-footer">
|
||||
<div class="btn-cluster">
|
||||
<button
|
||||
class="btn btn-transparent btn-block"
|
||||
v-on:click="save_user_password(password_change_current, password_change_new, password_change_new_confirmation);" >
|
||||
[[__("change_password")]]
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="collapse" v-bind:class="{in:account=='terminate'}">
|
||||
<div class="">
|
||||
<p>[[__("terminate_warning")]]</p>
|
||||
<p>[[__("terminate_warning2")]]</p>
|
||||
</div>
|
||||
|
||||
<div class="labels-inline" v-if="user.account_type == 'email'">
|
||||
<div class="form-group">
|
||||
<label class="label">[[__("current_password")]]</label>
|
||||
<input v-model="account_remove_password" class="input input-white no-b" type="password">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="label">[[__("terminate_reason")]]</label>
|
||||
<textarea class="input input-white no-b" v-model="account_remove_feedback"></textarea>
|
||||
<p class="message">[[__("terminate_reason_caption")]]</p>
|
||||
</div>
|
||||
<div class="center alert alert-danger" v-if="account_remove_error">{{account_remove_error}}</div>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-transparent btn-block" v-on:click="remove_account(account_remove_password, account_remove_feedback)">[[__("terminate_terminate")]]</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
201
views/partials/folders.html
Normal file
201
views/partials/folders.html
Normal file
@@ -0,0 +1,201 @@
|
||||
<header id="folder-header" class="header" v-if="(active_view == 'folders' && active_folder)" v-cloak>
|
||||
<div v-cloak class="header-left pull-left">
|
||||
<a class="btn btn-stroke-darken btn-md btn-round btn-icon" href="/spaces">
|
||||
<span class="icon icon-home"></span>
|
||||
</a>
|
||||
<button v-if="logged_in && (active_space_role == 'editor' || active_space_role == 'admin')" class="btn btn-primary btn-md btn-round" v-on:click="create_space('space')">[[ __('create_space') ]]</button>
|
||||
<button v-if="logged_in && (active_space_role == 'editor' || active_space_role == 'admin')" class="btn btn-stroke-darken btn-md btn-round" v-on:click="create_space('folder')">
|
||||
<span v-bind:class="{'disabled-pro':!is_pro(user)}">[[ __('create_folder') ]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="header-right pull-right">
|
||||
<div class="dropdown top light m-r-20 compact-hidden" v-bind:class="{open : active_dropdown=='folder_sorting'}">
|
||||
<button class="btn btn-sm btn-nude" v-on:click="activate_dropdown('folder_sorting')">
|
||||
<span>[[ __('sort_by') ]]</span>:
|
||||
<b v-if="folder_sorting=='updated_at'">[[ __('last_modified') ]]</b>
|
||||
<b v-if="folder_sorting=='name'">[[ __('title') ]]</b>
|
||||
<b v-if="folder_sorting=='space_type'">[[ __('type') ]]</b>
|
||||
</button>
|
||||
<div class="dropdown-menu" role="menu">
|
||||
<ul class="select-list">
|
||||
<li v-bind:class="{checked:folder_sorting=='updated_at'}"
|
||||
v-on:click="set_folder_sorting('updated_at',true)">
|
||||
<span>[[ __('last_modified') ]]</span>
|
||||
</li>
|
||||
|
||||
<li v-bind:class="{checked:folder_sorting=='name'}"
|
||||
v-on:click="set_folder_sorting('name',false)">
|
||||
<span>[[ __('title') ]]</span>
|
||||
</li>
|
||||
|
||||
<li v-bind:class="{checked:folder_sorting=='space_type'}"
|
||||
v-on:click="set_folder_sorting('space_type',false)">
|
||||
<span>[[ __('type') ]]</span>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<label class="relative compact-hidden">
|
||||
<span class="icon icon-sm icon-zoom no-events absolute-top-left" style="margin: 5px;"></span>
|
||||
<input id="folder-search"
|
||||
type="search" name="search"
|
||||
style="padding-left: 40px !important; margin-right: 10px;"
|
||||
placeholder="[[ __('search') ]]"
|
||||
class="input input-md input-white input-round no-b w-2"
|
||||
v-model="folder_spaces_search" v-on:change="search_spaces">
|
||||
</label>
|
||||
|
||||
<button class="btn btn-stroke-darken btn-md btn-round" v-if="!user.confirmed_at" v-on:click="confirm_again()">
|
||||
<span v-if="!account_confirmed_sent">[[ __('email_unconfirmed') ]]</span>
|
||||
<span v-if="account_confirmed_sent">[[ __('confirmation_sent') ]]</span>
|
||||
</button>
|
||||
|
||||
<div class="dropdown top right light" v-bind:class="{open: active_dropdown=='account'}">
|
||||
<button
|
||||
class="profile-avatar btn btn-md btn-icon btn-darken btn-round"
|
||||
v-bind:style="background_image_style([user.avatar_thumb_uri])"
|
||||
v-bind:class="{'has-avatar-image':!!user.avatar_thumb_uri}" v-on:click="show_account();">
|
||||
<span class="icon icon-user" v-if="logged_in && !user.avatar_thumb_uri"></span></button>
|
||||
|
||||
<div class="dropdown-menu" role="menu">
|
||||
<ul class="select-list">
|
||||
<li v-if="user.team && is_admin(user)">
|
||||
<a href="/team">
|
||||
<span class="icon icon-sm icon-user-group"></span>
|
||||
<span>[[ __('edit_team') ]]</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<a href="/account">
|
||||
<span class="icon icon-sm icon-user"></span>
|
||||
<span>[[ __('edit_account') ]]</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li v-on:click="activate_modal('support')">
|
||||
<span>
|
||||
<span class="icon icon-sm icon-info"></span>
|
||||
<span>[[ __('support') ]]</span>
|
||||
</span>
|
||||
</li>
|
||||
|
||||
<li v-on:click="logout()">
|
||||
<span>
|
||||
<span class="icon icon-sm icon-logout"></span>
|
||||
<span>[[ __('log_out') ]]</span>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="btn-group dark round" id="meta-toggle" style="margin-right:10px">
|
||||
<button class="btn btn-md btn-transparent btn-icon btn-icon" v-on:click="toggle_meta()">
|
||||
<span class="jewel" style="color: white; background-color: red" v-if="meta_unseen>0">{{meta_unseen}}</span>
|
||||
<span class="icon icon-menu"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</header>
|
||||
|
||||
|
||||
<div id="profile" v-cloak v-if="active_view == 'folders' && user">
|
||||
|
||||
<div id="folder-wrapper">
|
||||
|
||||
<div id="folder-breadcrumb">
|
||||
|
||||
<a v-for="item in active_space_path" type="button" class="btn btn-sm btn-transparent" href="/{{item.space_type}}s/{{item._id}}" v-sd-droppable="handle_folder_drop;item">
|
||||
<span>{{item.name}}</span>
|
||||
<span class="seperator">/</span>
|
||||
</a>
|
||||
|
||||
<a v-if="(active_space_role != 'admin')" type="button" class="btn btn-sm btn-transparent">
|
||||
<span>{{active_folder.name}}</span>
|
||||
</a>
|
||||
|
||||
<div class="dropdown top light" v-bind:class="{open:active_dropdown=='breadcrumb'}" v-if="(active_folder._id != user.home_folder_id) && ((active_space_role == 'admin') || (active_space_role == 'editor'))">
|
||||
<button type="button" class="btn btn-sm btn-transparent btn-dropdown" data-toggle="dropdown" v-on:click=" activate_dropdown('breadcrumb')">
|
||||
<span>{{active_folder.name}}</span>
|
||||
</button>
|
||||
<div class="dropdown-menu" v-if="active_folder && active_folder._id != user.home_folder_id">
|
||||
<ul class="select-list">
|
||||
<li><span class="tile-rename" v-on:click="rename_folder(active_folder)">[[__("rename")]]</span></li>
|
||||
<li v-if="active_space_role == 'admin'"><span class="tile-share" v-on:click="activate_access()">[[__("share")]]</span></li>
|
||||
<li><a v-on:click=" open_url('[[config.endpoint]]/api/spaces/'+active_folder._id+'/list')" target="_blank">[[__("list")]]</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div v-if="active_folder._id == user.home_folder_id">
|
||||
<span>[[ __('home') ]]</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div id="folder-empty" v-if="(active_profile_spaces.length == 0)">
|
||||
<div>
|
||||
<p>[[ __('no_spaces_yet') ]]</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div id="folder-empty" v-if="folder_spaces_filter">
|
||||
<div v-if="active_profile_spaces | empty?">
|
||||
<p><b>"{{folder_spaces_filter}}"</b> <br/>[[ __('search_no_results') ]]</p>
|
||||
<button type="button" class="btn btn-md btn-round btn-stroke-darken events" v-on:click=" folder_spaces_filter = ''">[[ __('search_clear') ]]</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="folder-grid">
|
||||
<div
|
||||
v-for="item in active_profile_spaces | orderBy folder_sorting folder_reverse"
|
||||
v-sd-draggable="item"
|
||||
v-sd-droppable="handle_folder_drop;item"
|
||||
draggable="true"
|
||||
class="item" v-bind:class="item.space_type"
|
||||
v-bind:style="{'z-index': (active_profile_spaces.length - $index)}">
|
||||
<a href="/{{item.space_type}}s/{{item._id}}">
|
||||
<span class="item-thumbnail thumbnail-loading" v-if="item.space_type=='space'"></span>
|
||||
<span class="item-thumbnail" v-bind:style="space_thumbnail_style(item)"></span>
|
||||
</a>
|
||||
|
||||
<div class="item-meta" >
|
||||
<span class="item-title">{{item.name}}</span>
|
||||
<div class="pull-right dropdown center light" v-if="active_space_role=='admin'" v-bind:class="{open:(active_dropdown=='space_'+item._id || active_dropdown=='space_share_'+item._id)}">
|
||||
<button type="button" class="btn btn-transparent btn-dropdown no-min-w no-p" data-toggle="dropdown" v-on:click="activate_dropdown('space_'+item._id)">
|
||||
</button>
|
||||
|
||||
<div class="dropdown-menu" role="menu">
|
||||
<ul class="select-list">
|
||||
<li v-on:click="duplicate_space(item)"><span><span class="icon icon-sm icon-duplicate"></span>[[ __('duplicate') ]]</span></li>
|
||||
<li v-on:click="rename_space(item)"><span><span class="icon icon-sm icon-tag"></span>[[ __('rename') ]]</span></li>
|
||||
<li v-on:click="delete_space(item)"><span><span class="icon icon-sm icon-trash"></span>[[ __('delete') ]]</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="item-appendix">
|
||||
<span class="pull-right item-date">{{item.updated_at | date 'YYYY-MM-DD'}}</span>
|
||||
|
||||
<span class="item-author">
|
||||
<span class="profile-avatar btn btn-xs btn-icon btn-white btn-round m-r-10"
|
||||
v-bind:style="background_image_style([item.creator.avatar_thumb_uri])"
|
||||
v-bind:class="{'has-avatar-image':!!item.creator.avatar_thumb_uri}">
|
||||
<span class="icon icon-user" v-if="!item.creator.avatar_thumb_uri"></span>
|
||||
</span>
|
||||
{{item.creator.nickname}}
|
||||
</span>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
140
views/partials/login.html
Normal file
140
views/partials/login.html
Normal file
@@ -0,0 +1,140 @@
|
||||
<header id="landing-header" class="header" v-cloak v-if="(active_view == 'login' || active_view == 'signup' || active_view == 'password-reset' || active_view == 'password-confirm')">
|
||||
<div class="header-left">
|
||||
<a class="btn btn-transparent btn-nude" href="/"><img src="/images/sd5-logo.svg" width="190"></a>
|
||||
</div>
|
||||
|
||||
<div class="header-right pull-right">
|
||||
<span class="btn-group dark round">
|
||||
{% if (locale != "de") %}<a href="/t/de?r={{active_view}}" class="btn btn-transparent btn-md">Deutsch</a>{% endif %}
|
||||
{% if (locale != "en") %}<a href="/t/en?r={{active_view}}" class="btn btn-transparent btn-md">English</a>{% endif %}
|
||||
{% if (locale != "fr") %}<a href="/t/fr?r={{active_view}}" class="btn btn-transparent btn-md">Français</a>{% endif %}
|
||||
</span>
|
||||
|
||||
<a class="btn btn-md btn-dark btn-round" href="/login">[[__("login")]]</a>
|
||||
<a class="btn btn-md btn-blue btn-round" href="/signup">[[__("signup")]]</a>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div id="account-forms"
|
||||
v-bind:class="{'got-user':logged_in}"
|
||||
v-cloak
|
||||
v-if="(active_view == 'login' || active_view == 'signup' || active_view == 'password-reset' || active_view == 'password-confirm')">
|
||||
|
||||
<div id="login" v-bind:class="{active : active_view == 'login'}">
|
||||
<div class="content">
|
||||
<form v-on:submit="login_submit(user_forms_email, login_password, $event)">
|
||||
|
||||
<span class="btn btn-xs btn-darken pull-right" v-on:click="login_google();">[[__("login_google")]]</span>
|
||||
|
||||
<h4>[[__("login")]]</h4>
|
||||
|
||||
<div class="tight">
|
||||
<div class="form-group">
|
||||
<input class="input" name="email" type="email" required v-model="user_forms_email" placeholder="[[__("email")]]">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input class="input" name="password" type="password" required v-model="login_password" placeholder="[[__("password")]]">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn btn-primary btn-block">
|
||||
<span v-show="!loading_user">[[__("login")]]</span>
|
||||
<span v-show="loading_user">[[__("logging_in")]]</span>
|
||||
</button>
|
||||
|
||||
<div class="center alert alert-danger" v-if="login_error">{{login_error}}</div>
|
||||
|
||||
<div class="pull-right">
|
||||
<a class="btn btn-xs btn-darken" href="/signup">[[__("signup")]]</a>
|
||||
<a class="btn btn-xs btn-darken" href="/password-reset">[[__("reset_password")]]</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="signup" v-bind:class="{active : active_view == 'signup'}">
|
||||
<div class="content">
|
||||
<form v-on:submit="signup_submit($event, user_forms_name, user_forms_email, signup_password, signup_password_confirmation)">
|
||||
<span class="btn btn-xs btn-darken pull-right" v-on:click="login_google();">[[__("login_google")]]</span>
|
||||
|
||||
<h4>[[__("signup")]]</h4>
|
||||
|
||||
<div class="tight">
|
||||
|
||||
<div class="form-group">
|
||||
<input class="input" type="text" id="user-name" v-model="user_forms_name" placeholder="[[__("name")]]" v-focus autofocus>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="tight">
|
||||
|
||||
<div class="form-group">
|
||||
<input class="input" type="email" required id="user-email" v-model="user_forms_email" placeholder="[[__("email")]]">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<input class="input" id="user-password" required type="password" v-model="signup_password" placeholder="[[__("password")]]">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<input class="input" id="user-password-confirmation" required type="password" v-model="signup_password_confirmation" placeholder="[[__("password_confirmation")]]">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="margin-top: -7px; margin-bottom: 7px;"><small>By signing up you agree to our <a href="/terms" target="_blank">TOS</a> and <a href="/privacy" target="_blank">Privacy Policy.</a></small><br/>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-primary btn-block">
|
||||
<span v-if="!creating_user">[[__("signup")]]</span>
|
||||
<span v-if="creating_user">[[__("signing_up")]]</span>
|
||||
</button>
|
||||
|
||||
<div class="center alert alert-danger" style="width:100%;" v-if="signup_error">{{signup_error}}</div>
|
||||
|
||||
<a class="btn btn-link btn-block" href="/login" style="margin-top: 20px">[[__("login")]]</a>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="password-reset" v-bind:class="{active : active_view == 'password-reset'}">
|
||||
<div class="content" v-if="!password_reset_send">
|
||||
<form>
|
||||
<h4>Password Recovery</h4>
|
||||
<div class="tight">
|
||||
<div class="form-group">
|
||||
<input class="input" type="email" id="user-email" v-model="reset_email" placeholder="[[__("email")]]">
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center alert alert-danger" v-if="password_reset_error">{{password_reset_error}}</div>
|
||||
<button class="btn btn-primary btn-block" v-on:click="password_reset_submit($event, reset_email)">[[__("reset_password")]]</button>
|
||||
</form>
|
||||
</div>
|
||||
<div class="content" v-if="password_reset_send==true">
|
||||
<h4>[[__("password_confirmation")]]</h4>
|
||||
[[__("password_check_inbox")]]
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="password-confirm" v-bind:class="{active : active_view == 'password-confirm'}">
|
||||
<div class="content">
|
||||
<form>
|
||||
<h4>Password Recovery</h4>
|
||||
|
||||
<div class="tight">
|
||||
<div class="form-group">
|
||||
<input class="input" id="user-password" type="password" v-model="signup_password" placeholder="[[__("password")]]">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<input class="input" id="user-password" type="password" v-model="signup_password_confirmation" placeholder="[[__("password_confirmation")]]">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-center alert alert-danger" v-if="password_reset_confirm_error">{{password_reset_confirm_error}}</div>
|
||||
<button class="btn btn-primary btn-block" v-on:click="password_reset_confirm($event, signup_password, signup_password_confirmation)">[[__("save")]]</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
55
views/partials/meta-folder.html
Normal file
55
views/partials/meta-folder.html
Normal file
@@ -0,0 +1,55 @@
|
||||
<div id="sidebar" v-bind:class="{in : meta_visible}" v-if="active_view=='folders' && active_folder" class="folder-sidebar">
|
||||
|
||||
<button class="btn btn-md btn-transparent btn-icon round pull-right" v-on:click="toggle_meta()" style="margin-top:15px;margin-right:20px">
|
||||
<span class="icon icon-menu"></span>
|
||||
</button>
|
||||
|
||||
<div class="sidebar-section" v-if="active_folder.creator">
|
||||
<h4>{{active_folder.name}}</h4>
|
||||
|
||||
<div style="margin-bottom: 15px; margin-top: 8px" >
|
||||
<small>
|
||||
[[__("created_by")]] <b>{{active_folder.creator.nickname||active_folder.creator.slug}}.</b>
|
||||
<br/>[[__("last_updated")]] <b>{{active_folder.updated_at | date 'MMMM Do YYYY, HH:mm'}}.</b>
|
||||
</small>
|
||||
</div>
|
||||
|
||||
<div v-if="logged_in && user.home_folder_id!=active_folder._id">
|
||||
<button class="btn btn-sm btn-round btn-primary m-r-5" v-on:click="activate_access()">
|
||||
<span class="icon-label">[[__("share")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-section" v-if="is_pro(user)">
|
||||
<h5>[[__("history_recently_updated")]]</h5>
|
||||
|
||||
<div v-if="active_folder_history_items.length == 0">
|
||||
[[__("history_recently_empty")]]
|
||||
</div>
|
||||
|
||||
<ul id="updates">
|
||||
<li v-for="item in active_folder_history_items">
|
||||
<a v-bind:href="'/spaces/' + item.space._id">{{item.space.name}}</a>
|
||||
|
||||
<small>
|
||||
[[__("by")]]
|
||||
<span v-for="u in item.users">{{u}}<span v-if="$index < (item.users.length-1)">, </span></span>
|
||||
</small>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-section" v-if="!is_pro(user)">
|
||||
<h5>[[__("history_recently_updated")]]</h5>
|
||||
|
||||
<p>
|
||||
[[__("pro_ad_history_headline")]]
|
||||
</p>
|
||||
|
||||
<p>
|
||||
<button class="btn btn-round btn-primary btn-md" v-on:click="show_upgrade_modal()">Upgrade</button>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
71
views/partials/meta.html
Normal file
71
views/partials/meta.html
Normal file
@@ -0,0 +1,71 @@
|
||||
<div id="sidebar" v-bind:class="{in : meta_visible}" v-if="active_space_loaded && active_space">
|
||||
|
||||
<button class="btn btn-md btn-transparent btn-icon round pull-right" v-on:click="toggle_meta()" style="margin-top:15px;margin-right:20px">
|
||||
<span class="icon icon-cross-0"></span>
|
||||
</button>
|
||||
|
||||
<div class="sidebar-section" v-if="!logged_in && guest_nickname">
|
||||
<!--h4>{{active_space.name}}</h4>
|
||||
|
||||
<div style="margin-bottom: 15px; margin-top: 8px" >
|
||||
<small>
|
||||
[[__("created_by")]] <b>{{active_space.creator.nickname}}.</b><br/>
|
||||
[[__("last_updated")]] <b>{{active_space.updated_at | date 'MMMM Do YYYY, HH:mm'}}.</b>
|
||||
</small>
|
||||
</div-->
|
||||
|
||||
<div v-if="!logged_in && guest_nickname">
|
||||
<button class="btn btn-sm btn-round btn-primary m-r-5"
|
||||
v-on:click=" ask_guestname(guest_nickname);">
|
||||
{{guest_nickname}}
|
||||
</button>
|
||||
<button class="btn btn-sm btn-round btn-primary m-r-5"
|
||||
v-on:click="guest_logout()">
|
||||
[[__("logout")]]
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-section">
|
||||
<h5>[[__("chat")]] <a v-if="active_space_role!='viewer'" v-on:click="activate_access()" class="btn btn-xs btn-darken">Add People</a></h5>
|
||||
|
||||
<textarea id="new-comment" style="min-height:80px;padding: 5px 9px;margin-bottom:10px" class="input input-darken no-b" v-if="can_add_comment" v-model="space_comment" placeholder="[[__("chat_message_placeholder")]]" spellcheck="false"></textarea>
|
||||
|
||||
<div v-if="can_add_comment">
|
||||
<button class="btn btn-sm btn-primary" v-on:click="create_space_comment(space_comment)">[[__("post")]]</button>
|
||||
</div>
|
||||
|
||||
<ul class="comments">
|
||||
<li class="comment" v-for="item in active_space_messages | exceptFilter artifact_id | orderBy 'created_at' -1">
|
||||
<ul class="comment-meta">
|
||||
<li>
|
||||
<a title="{{item.created_at | date 'MMMM Do YYYY, HH:mm'}}">
|
||||
{{item.user.nickname}}
|
||||
{{item.editor_name}}
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li
|
||||
v-show="(active_space_role != 'viewer' || item.user_id==user._id)"
|
||||
class="delete pull-right"
|
||||
v-if="active_space_role!='viewer'"
|
||||
v-on:click="remove_space_comment(item)">
|
||||
<a title="[[__("delete")]]" style="cursor:pointer">✕</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<span class="comment-author">
|
||||
<a class="url" rel="contact" title="{{item.user.nickname}}">
|
||||
<img class="btn btn-round btn-dark btn-sm btn-icon" v-bind:src="user_avatar_image(item.user)" v-if="has_avatar_image(item.user)">
|
||||
|
||||
<span class="btn btn-round btn-dark btn-sm btn-icon" v-if="!has_avatar_image(item.user)">
|
||||
<span class="icon icon-user"></span>
|
||||
</span>
|
||||
</a>
|
||||
</span>
|
||||
<div class="comment-body" v-html="item.message"></div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
124
views/partials/modal/access.html
Normal file
124
views/partials/modal/access.html
Normal file
@@ -0,0 +1,124 @@
|
||||
<div class="modal" v-if="active_modal == 'access' && access_settings_space" v-cloak>
|
||||
<div class="modal-wrapper">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content" style="width:760px">
|
||||
<div class="modal-header" style="padding-bottom:0">
|
||||
<h3 class="text-left"><span class="icon icon-share icon-sm"></span> [[__("share")]]: {{access_settings_space.name}}</h3>
|
||||
<button type="button" class="btn btn-icon btn-light btn-round close" v-on:click=" close_modal()">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div class="modal-section" style="padding-top:0;padding-bottom:20px">
|
||||
<label class="radio" v-bind:class="{checked:access_settings_space.access_mode=='private'}">
|
||||
<input type="radio" name="access_mode" value="private" v-model="access_settings_space.access_mode" v-on:click="save_space_access_mode($event)"> [[__("mode_private")]]
|
||||
</label>
|
||||
<label class="radio" v-bind:class="{checked:access_settings_space.access_mode=='public'}">
|
||||
<input type="radio" name="access_mode" value="public" v-model="access_settings_space.access_mode" v-on:click="save_space_access_mode($event)">[[__("mode_public")]]
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="modal-section" v-if="active_space" style="padding-bottom:10px">
|
||||
<h4 class="text-left"><span class="icon icon-link icon-sm"></span> [[__("access_editor_link")]] </h4>
|
||||
<p class="text-left">
|
||||
[[__("access_editor_link_desc")]]
|
||||
</p>
|
||||
|
||||
<div class="input-group org-add-form">
|
||||
<input id="editorurl2" type="text" class="form-control input input-lg" v-bind:value="share_base + '/s/' + access_settings_space.edit_hash + (access_settings_space.edit_slug ? '-' : '') + access_settings_space.edit_slug"/>
|
||||
|
||||
<span class="input-group-btn">
|
||||
<span id="org-add-member" class="btn btn-lg btn-primary clipboard-btn" data-clipboard-target="#editorurl2" v-clipboard>
|
||||
[[__("copy")]]
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
|
||||
<label class="checkbox" v-bind:class="{checked:access_settings_space.editors_locking}">
|
||||
<input
|
||||
type="checkbox"
|
||||
v-bind:checked="access_settings_space.editors_locking"
|
||||
v-model="access_settings_space.editors_locking" v-on:change="save_space_editors_locking($event)" />
|
||||
[[__("access_anonymous_edit_blocking")]]
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<!-- subsection "invite" -->
|
||||
<div id="new-editor" class="modal-section" style="padding-bottom:20px">
|
||||
<h4 class="text-left"><span class="icon icon-user-add icon-sm"></span> [[__('access_new_members')]]</h4>
|
||||
|
||||
<div class="form-group">
|
||||
<span class="error-note" v-if="invite_email_error">{{invite_email_error}}</span>
|
||||
<input class="input input-block input-white"
|
||||
v-bind:class="{error: !!invite_email_error}"
|
||||
id="invitee_email"
|
||||
v-model="invite_email"
|
||||
type="email" placeholder="[[__('invite_emails')]]">
|
||||
|
||||
<textarea id="invite-message" class="input input-block input-white overflow-y-scroll"
|
||||
v-model="invite_message" placeholder="[[__('optional_message')]]" name="Message"></textarea>
|
||||
|
||||
<select class="input input-white" v-model="invite_member_role">
|
||||
<option value="viewer">[[__("role_viewer")]]</option>
|
||||
<option value="editor">[[__("role_editor")]]</option>
|
||||
<option value="admin">[[__("role_admin")]]</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<button class="btn btn-primary btn-md btn-round" v-on:click="invite_member(access_settings_space, invite_email, invite_message, invite_member_role)"> [[__("invite")]] </button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- subsection "editors list" -->
|
||||
<div class="modal-section" style="padding-bottom:60px">
|
||||
<h4 class="text-left"><span class="icon icon-user-group icon-sm"></span> [[__("access_current_members")]]</h4>
|
||||
<table class="table">
|
||||
<tr>
|
||||
<th></th>
|
||||
<th>Email / Name</th>
|
||||
<th>Role</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
<tr v-for="member in access_settings_memberships" v-bind:class="member.state">
|
||||
<td>
|
||||
<span class="editor-avatar btn btn-xs btn-round btn-icon" v-if="member.user">{{member.user.initials}}</span>
|
||||
<span class="editor-avatar btn btn-xs btn-round btn-icon icon-hourglass" v-if="!member.user"></span>
|
||||
</td>
|
||||
<td>
|
||||
<span class="editor-email" v-if="member.state == 'active'">{{member.user.email}}</span>
|
||||
<span class="editor-email" v-if="member.state == 'pending'">{{member.email_invited}}</span>
|
||||
<span class="editor-name" v-if="member.state == 'active'">{{member.user.nickname}}</span>
|
||||
<span class="editor-email" v-if="member.state == 'pending'">(pending)</span>
|
||||
</td>
|
||||
<td>
|
||||
<div class="form-group">
|
||||
<select class="input input-sm" v-model="member.role" v-on:change="update_member(access_settings_space, member, $event.currentTarget.value)" style="width:auto">
|
||||
<option value="viewer">[[__("role_viewer")]]</option>
|
||||
<option value="editor">[[__("role_editor")]]</option>
|
||||
<option value="admin">[[__("role_admin")]]</option>
|
||||
</select>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<button class="btn btn-sm btn-stroke-darken" v-on:click="remove_member(access_settings_space, member)">[[__("delete")]]</button>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<p class="text-left" v-if="!access_settings_memberships.length">
|
||||
[[__("access_no_members")]]
|
||||
</p>
|
||||
|
||||
<div class="form-group" style="padding-top: 40px">
|
||||
<button class="btn btn-primary btn-md btn-round" v-on:click="close_modal();"> [[__("ok")]] </button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
35
views/partials/modal/create-space.html
Normal file
35
views/partials/modal/create-space.html
Normal file
@@ -0,0 +1,35 @@
|
||||
<div class="modal" v-if="active_modal == 'create-space'" v-cloak>
|
||||
<div class="modal-wrapper">
|
||||
<div class="modal-dialog">
|
||||
|
||||
<button type="button" class="btn btn-icon btn-light btn-round close" v-on="click : close_modal()">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
</button>
|
||||
|
||||
<div class="modal-content">
|
||||
<div class="modal-body labels-inline">
|
||||
<div class="modal-section p-5">
|
||||
What would you like to create?
|
||||
|
||||
<div>
|
||||
<input type="text" v-model="create_space_title" placeholder="Title">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="btn" v-on="click: create_space('space','whiteboard')">Whiteboard</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="btn" v-on="click: create_space('space','collection')">Note Collection</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="btn" v-on="click: create_space('space','article')">Article</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
43
views/partials/modal/folder-settings.html
Normal file
43
views/partials/modal/folder-settings.html
Normal file
@@ -0,0 +1,43 @@
|
||||
<div class="modal" v-if="active_modal == 'folder-settings'" v-cloak>
|
||||
<div class="modal-wrapper">
|
||||
<div class="modal-dialog top">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header no-p">
|
||||
<button type="button" class="btn btn-icon btn-light btn-round close" v-on:click="close_modal()">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
</button>
|
||||
<h4 class="modal-title">[[__("folder_settings")]]</h4>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div class="modal-section">
|
||||
<div class="form-group">
|
||||
<label class="label">[[__("title")]]</label>
|
||||
<input type="text" class="input" v-model="active_folder.name">
|
||||
</div>
|
||||
|
||||
<div style="margin:auto;background-size:cover;background-position:50% 50%;border-radius:10px;margin-bottom:10px;width:200px;height:100px;background-image:url({{active_folder.avatar_thumb_uri}})" v-if="active_folder.avatar_thumb_uri">
|
||||
</div>
|
||||
|
||||
<div class="progress state-processing" v-if="uploading_folder_avatar">
|
||||
<div class="spinner"></div>
|
||||
</div>
|
||||
|
||||
<div class="form-group text-center">
|
||||
<label class="file btn btn-sm btn-round btn-stroke-darken">
|
||||
<input type="file" id="file" v-on:change="save_folder_avatar_image(this);">
|
||||
<span>[[__("upload_cover_image")]]</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="modal-section">
|
||||
<h4 class="modal-title" style="padding-top:0px">[[__("access_caption")]]</h4>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
84
views/partials/modal/login.html
Normal file
84
views/partials/modal/login.html
Normal file
@@ -0,0 +1,84 @@
|
||||
<div class="modal" v-if="active_modal == 'login'" v-cloak>
|
||||
<div class="modal-wrapper">
|
||||
<div class="modal-dialog">
|
||||
|
||||
<button type="button" class="btn btn-icon btn-light btn-round close" v-on:click="close_modal()">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
</button>
|
||||
|
||||
<div class="modal-content">
|
||||
<div class="modal-body">
|
||||
<div class="modal-section no-b">
|
||||
|
||||
<div id="account-forms-modal">
|
||||
<div v-show="active_modal_view != 'signup'">
|
||||
<div class="content">
|
||||
<form>
|
||||
<h4>Login</h4>
|
||||
|
||||
<div class="tight">
|
||||
<div class="form-group">
|
||||
<input class="input" type="text" focus-me="true" v-model="login_email" placeholder="Email">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input class="input" type="password" v-model="login_password" placeholder="Password">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span type="submit" class="btn btn-primary btn-xl btn-block btn-round" v-on:click="login_submit_modal(login_email, login_password, $event)">
|
||||
<span v-show="!loading_user">Log In</span>
|
||||
<span v-show="loading_user">Logging in…</span>
|
||||
</span>
|
||||
|
||||
<div class="center alert alert-danger" v-if="login_error" v-model="login_error"></div>
|
||||
|
||||
<span class="btn btn-link btn-block" v-on:click="active_modal_view='signup'">Create a new account</span>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-show="active_modal_view == 'signup'">
|
||||
<div class="content">
|
||||
<form>
|
||||
<h4>Sign Up</h4>
|
||||
|
||||
<div class="tight">
|
||||
<div class="form-group">
|
||||
<input class="input" type="text" id="user-name" v-model="name" placeholder="Name">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<input class="input" type="email" id="user-email" v-model="email" placeholder="Email">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<input class="input" id="user-password" type="password" v-model="password" placeholder="Password">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<input class="input" id="user-password-confirmation" type="password" v-model="password_confirmation" placeholder="Repeat Password">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-center" style="margin-top: -7px; margin-bottom: 30px;"><small>By signing up you agree to our <a href="/terms.html" target="_blank">TOS</a> and <a href="/privacy.html" target="_blank">Privacy Policy.</a></small><br/>
|
||||
</div>
|
||||
|
||||
<span class="btn btn-primary btn-xl btn-round btn-block" v-on:click="signup_submit_modal($event, name, email, password, password_confirmation)">
|
||||
<span v-if="!creating_user">Sign Up</span>
|
||||
<span v-if="creating_user">Signing Up…</span>
|
||||
</span>
|
||||
|
||||
<div class="center alert alert-danger" v-if="signup_error">{{signup_error}}</div>
|
||||
|
||||
<span class="btn btn-link btn-block" v-on:click="active_modal_view='login'">I already have an account</span>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
36
views/partials/modal/pdfoptions.html
Normal file
36
views/partials/modal/pdfoptions.html
Normal file
@@ -0,0 +1,36 @@
|
||||
<div class="modal" v-if="active_modal == 'pdfoptions'" v-cloak>
|
||||
<div class="modal-wrapper">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="btn btn-icon btn-light btn-round close" v-on:click=" close_modal()">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<p class="lead text-center">PDF Import</p>
|
||||
<div class="plans-box">
|
||||
<table class="plans-table">
|
||||
<tr>
|
||||
<td>
|
||||
<p>Thumbnail and Download Link</p>
|
||||
|
||||
<button class="btn btn-primary btn-round btn-sm" v-on:click=" approve_pdf_upload($event, null, 'classic')">Classic Import</button>
|
||||
|
||||
</td>
|
||||
<td>
|
||||
<p>Each Page as Image, displayed as Grid</p>
|
||||
<button class="btn btn-primary btn-round btn-sm" v-on:click=" approve_pdf_upload($event, pdf_export_with_zones, 'grid')">Grid Import</button><br>
|
||||
<input type="checkbox" v-model="pdf_export_with_zones" /> With Zones?
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
24
views/partials/modal/space-share.html
Normal file
24
views/partials/modal/space-share.html
Normal file
@@ -0,0 +1,24 @@
|
||||
<div class="modal" v-if="active_modal == 'space-share'" v-cloak>
|
||||
<div class="modal-wrapper">
|
||||
<div class="modal-dialog">
|
||||
|
||||
<button type="button" class="btn btn-icon btn-light btn-round close" v-on="click : close_modal()">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
</button>
|
||||
|
||||
<div class="modal-content">
|
||||
<div class="modal-body">
|
||||
<div class="modal-section no-b">
|
||||
<p class="lead">Share "{{active_space.name}}"</p>
|
||||
</div>
|
||||
<div class="modal-section no-b">
|
||||
<p class="lead">Or Copy & Paste this Link</p>
|
||||
<p>
|
||||
<span class="input">{{share_base_url}}{{active_space._id}}</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
31
views/partials/modal/support.html
Normal file
31
views/partials/modal/support.html
Normal file
@@ -0,0 +1,31 @@
|
||||
<div class="modal" v-if="active_modal == 'support'" v-cloak>
|
||||
<div class="modal-wrapper">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<button type="button" class="btn btn-icon btn-light btn-round close" v-on:click="close_modal()">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
</button>
|
||||
<h4 class="modal-title">Send Feedback</h4>
|
||||
</div>
|
||||
|
||||
<div class="modal-body">
|
||||
<div class="modal-section">
|
||||
|
||||
<p>
|
||||
Have a question, feedback or an idea for improvement? Send us a quick message using the box below and we'll get back to you as soon as possible.
|
||||
</p>
|
||||
|
||||
<div class="form-group">
|
||||
<textarea v-model="feedback_text" class="input" autofocus></textarea>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<button class="btn btn-primary btn-round btn-sm" v-on:click="send_feedback(feedback_text)">Send Feedback</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
3
views/partials/share-dialog.html
Normal file
3
views/partials/share-dialog.html
Normal file
@@ -0,0 +1,3 @@
|
||||
<div class="dialog-section no-b" style="width: 420px;">
|
||||
<p class="lead"> Share this with others</p>
|
||||
</div>
|
||||
135
views/partials/space-isolated.html
Normal file
135
views/partials/space-isolated.html
Normal file
@@ -0,0 +1,135 @@
|
||||
<div id="space" class="section board active mouse-{{mouse_state}} tool-{{active_tool}}">
|
||||
|
||||
<div class="space-bounds" style="width:{{active_space.advanced.width*bounds_zoom}}px;height:{{active_space.advanced.height*bounds_zoom}}px;"></div>
|
||||
|
||||
<div class="wrapper"
|
||||
style="transform:scale({{viewport_zoom}});transform-origin:0 0;width:{{active_space.advanced.width}}px;height:{{active_space.advanced.height}}px;background-image:url('{{active_space.advanced.background_uri}}');background-color:{{active_space.advanced.background_color}};margin-left:{{bounds_margin_horiz}}px;margin-top:{{bounds_margin_vert}}px" >
|
||||
|
||||
<div v-repeat="a : active_space_artifacts"
|
||||
v-class="text-editing:(editing_artifact_id==a._id && (a.view.major_type=='text' || a.view.major_type=='shape'))"
|
||||
style="{{a.view.style}}"
|
||||
class="{{a.view.classes}}"
|
||||
id="artifact-{{a._id}}">
|
||||
|
||||
<div v-if="a.view && a.view.major_type" style="height:100%; width:100%">
|
||||
<!-- text -->
|
||||
<div v-if="a.view.major_type == 'text'" class="text" style="{{a.view.inner_style}}">
|
||||
<div class="text-table">
|
||||
<div class="text-cell" style="{{a.view.text_cell_style}}">
|
||||
<div class="text-column" class="text-editing" v-sd-richtext="obj:a" v-if="editing_artifact_id==a._id">{{{a.description}}}</div>
|
||||
<div class="text-column" v-if="editing_artifact_id!=a._id">{{{a.description|urls_to_links}}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- drawing (annotation) -->
|
||||
<div v-if="a.view.major_type == 'vector'" class="clip" style="{{a.view.inner_style}}">
|
||||
<div>{{{a.view.vector_svg}}}</div>
|
||||
</div>
|
||||
|
||||
<!-- svg shape -->
|
||||
<div v-if="a.view.major_type == 'shape'" class="clip" style="{{a.view.inner_style}}">
|
||||
<div class="shape">{{{a.view.vector_svg}}}</div>
|
||||
<div class="text-table">
|
||||
<div class="text-cell" style="{{a.view.text_cell_style}}">
|
||||
<div class="text-column" v-sd-richtext="obj:a" v-class="text-editing:editing_artifact_id==a._id">{{{a.description}}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- svg image -->
|
||||
<div v-if="a.view.major_type == 'svg'" class="svg" style="{{a.view.inner_style}}">
|
||||
<img v-attr="src : a.view.payload_uri"></img>
|
||||
</div>
|
||||
|
||||
<!-- image -->
|
||||
<div v-if="a.view.major_type == 'image'" class="image" style="{{a.view.inner_style}};background-image: url('{{a.view.thumbnail_uri}}');">
|
||||
<span class="title">{{a.title}}</span>
|
||||
<div class="spinner"></div>
|
||||
<div class="progress" style="width:{{a.view.progress}}%">{{a.description}}</div>
|
||||
|
||||
<video v-if="a.mime == 'image/gif' && a.payload_alternatives && a.payload_alternatives.length > 0" preload autoplay loop>
|
||||
<source v-repeat="rep : a.payload_alternatives" v-attr="src : rep.payload_uri, type : rep.mime" />
|
||||
</video>
|
||||
|
||||
<!--span v-if="a.meta" class="link-wrapper"><a class="link btn btn-round btn-primary btn-sm" v-if="a.meta.link_uri" v-attr="href:a.meta.link_uri">{{a.view.link_caption}}</a></span-->
|
||||
</div>
|
||||
|
||||
<!-- video -->
|
||||
<div v-if="a.view.major_type == 'video'" v-videoplayer="a" class="video" style="{{a.view.inner_style}};background-image: url('{{a.view.thumbnail_uri}}');">
|
||||
<video controls preload="metadata" v-attr="poster: a.view.thumbnail_uri">
|
||||
<source v-repeat="rep : a.payload_alternatives" v-attr="src : rep.payload_uri, type : rep.mime" />
|
||||
<source v-if="a.payload_uri && a.mime" v-attr="src : a.payload_uri, type : a.mime" />
|
||||
</video>
|
||||
|
||||
<div class="spinner"></div>
|
||||
<div class="progress" style="width:{{a.view.progress}}%">{{a.description}}</div>
|
||||
</div>
|
||||
|
||||
<!-- audio -->
|
||||
<div v-if="a.view.major_type == 'audio'" v-audioplayer="a" class="audio" style="{{a.view.inner_style}};">
|
||||
|
||||
<audio>
|
||||
<source v-repeat="alt: a.payload_alternatives | orderBy 'mime' -1" v-attr="src: alt.payload_uri, type: alt.mime"/>
|
||||
<source v-attr="src: a.payload_uri, type:a.mime" v-if="a.payload_uri"/>
|
||||
</audio>
|
||||
|
||||
<div class="timeline" style="background-image: url('{{a.payload_thumbnail_web_uri}}')">
|
||||
<div class="tl-current-time" style="width: {{a.player_view.current_time_float*100}}%"></div>
|
||||
<div class="tl-inpoint" style="left: {{a.player_view.inpoint_float*100}}%" v-if="a.player_view.inpoint_float>0.0"></div>
|
||||
<div class="tl-outpoint" style="left: {{a.player_view.outpoint_float*100}}%"></div>
|
||||
</div>
|
||||
|
||||
<div class="tl-controls">
|
||||
<div class="btn btn-md btn-toggle btn-round" v-class="alt:a.player_view.state=='playing'" v-show="a.board.w>=200 || a.player_view.state!='playing'">
|
||||
<span class="btn-option play">
|
||||
<span class="icon icon-controls-play"></span>
|
||||
</span>
|
||||
|
||||
<span class="btn-option pause">
|
||||
<span class="icon icon-controls-pause"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<span class="btn btn-md btn-round btn-icon stop" v-show="a.player_view.state=='playing' || a.player_view.state=='paused'">
|
||||
<span class="icon icon-controls-stop"></span>
|
||||
</span>
|
||||
|
||||
<span class="tl-title" v-show="a.board.w>=250 && a.board.h>=150">{{a.view.filename}}</span>
|
||||
<span class="tl-times" class="btn-group" v-show="a.board.w>=400 && a.board.h>=150">
|
||||
<span class="btn btn-md btn-transparent no-p set-inpoint">{{a.player_view.current_time_string}} /</span>
|
||||
<span class="btn btn-md btn-transparent no-p set-outpoint">{{a.player_view.total_time_string}}</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="spinner"></div>
|
||||
<div class="progress" style="width:{{a.view.progress}}%">{{a.description}}</div>
|
||||
</div>
|
||||
|
||||
<!-- zone -->
|
||||
<div v-if="a.view.major_type == 'zone'" class="zone" style="{{a.view.inner_style}}">
|
||||
<div class="text-cell">
|
||||
<div class="text-column" v-sd-richtext="obj:a" v-class="text-editing:editing_artifact_id==a._id">{{{a.description}}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- embed -->
|
||||
<div v-if="a.view.major_type == 'oembed'" class="oembed" style="{{a.view.inner_style}};background-color: #3d9ee9;padding:10px;word-wrap: break-word; text-align: center; color:white">
|
||||
<span class="icon icon-video-camera"></span>
|
||||
<a href="{{a.meta.link_uri}}" style="color: white;">{{a.meta.link_uri}}</a></p><!--v-html-->
|
||||
</div>
|
||||
|
||||
<!-- file -->
|
||||
<div v-if="a.view.major_type == 'file'" class="text" style="{{a.view.inner_style}}">
|
||||
<span class="icon icon-page-vertical-double"></span>
|
||||
{{a.view.filename}}
|
||||
<div class="spinner"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- board artifacts end -->
|
||||
|
||||
</div>
|
||||
<!-- wrapper end -->
|
||||
</div>
|
||||
493
views/partials/space.html
Normal file
493
views/partials/space.html
Normal file
@@ -0,0 +1,493 @@
|
||||
<!-- FIXME modal -->
|
||||
<div class="modal" v-if="(duplicate_folders.length > 0)" v-cloak>
|
||||
<div class="modal-wrapper">
|
||||
<div class="modal-dialog">
|
||||
|
||||
<button type="button" class="btn btn-icon btn-light btn-round close" v-on:click="duplicate_folders = []">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
</button>
|
||||
|
||||
<div class="modal-content">
|
||||
<div class="modal-body labels-inline">
|
||||
<div class="modal-section">
|
||||
|
||||
<div class="form-group">
|
||||
<label>
|
||||
[[__("duplicate_destination")]]
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<select v-on:change="duplicate_folder_id=$event.target.value">
|
||||
<option v-for="f in duplicate_folders" value="{{f._id}}">{{f.name}}</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<button class="btn btn-md btn-round btn-primary" v-on:click="duplicate_folder_confirm(); ">
|
||||
<span class="icon-label">[[__("ok")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-md btn-round btn-darken pull-right" v-on:click="duplicate_folders = [];">
|
||||
<span class="icon-label">[[__("cancel")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-cloak class="header-left" v-show="active_space_loaded">
|
||||
<div class="btn-group dark">
|
||||
|
||||
<div class="pull-left">
|
||||
<a
|
||||
class="btn btn-stroke-darken btn-md btn-round btn-icon"
|
||||
title="[[__("home")]]" href="/spaces"
|
||||
v-if="(logged_in && !embedded && !active_space.parent_space_id && !guest_nickname)">
|
||||
<span class="icon icon-home"></span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
class="btn btn-stroke-darken btn-md btn-round btn-icon"
|
||||
title="[[__("parent_folder")]]"
|
||||
href="/folders/{{active_space.parent_space_id}}"
|
||||
v-if="(active_space.parent_space_id && !guest_nickname)">
|
||||
|
||||
<span class="icon icon-arrow-left-light"></span>
|
||||
</a>
|
||||
|
||||
<input class="input input-md input-transparent w-auto"
|
||||
id="space-title"
|
||||
v-model="active_space.name" name="title" v-on:keydown="save_space_keydown($event)"
|
||||
v-if="space_editing_title && logged_in" style="padding-right:0" v-focus>
|
||||
|
||||
<span class="input input-md input-transparent w-auto"
|
||||
v-if="!space_editing_title && logged_in"
|
||||
v-on:click="edit_space_title()">{{active_space.name}}</span>
|
||||
|
||||
<span v-if="!logged_in" class="btn btn-dark btn-round btn-md">{{active_space.name}}</span>
|
||||
|
||||
<button class="btn btn-md btn-transparent btn-icon" v-if="space_editing_title" v-on:click="save_space_keydown()">
|
||||
<span class="icon icon-check"></span>
|
||||
</button>
|
||||
|
||||
<div class="dropdown top left light" v-bind:class="{open: active_dropdown=='space'}">
|
||||
<button class="btn btn-md btn-icon btn-dark" v-on:click="activate_dropdown('space')">
|
||||
<span class="icon icon-triangle-down"></span></button>
|
||||
|
||||
<div class="dropdown-menu" role="menu">
|
||||
<ul class="select-list">
|
||||
|
||||
<li v-on:click="activate_access()" v-if="logged_in">
|
||||
<span>
|
||||
<span class="icon icon-sm icon-share"></span>
|
||||
<span>[[ __('share') ]]</span>
|
||||
</span>
|
||||
</li>
|
||||
|
||||
<li v-on:click="edit_space_title()" v-if="logged_in">
|
||||
<span>
|
||||
<span class="icon icon-sm icon-tag"></span>
|
||||
<span>[[ __('rename') ]]</span>
|
||||
</span>
|
||||
</li>
|
||||
|
||||
<li v-on:click="duplicate_space_into_folder()" v-if="logged_in">
|
||||
<span>
|
||||
<span class="icon icon-sm icon-duplicate"></span>
|
||||
<span>[[ __('duplicate') ]]</span>
|
||||
</span>
|
||||
</li>
|
||||
|
||||
<li v-on:click="download_space()">
|
||||
<span>
|
||||
<span class="icon icon-sm icon-download"></span>
|
||||
<span>[[ __('download_space') ]]</span>
|
||||
</span>
|
||||
</li>
|
||||
|
||||
<li v-on:click="activate_modal('support')" v-if="logged_in">
|
||||
<span>
|
||||
<span class="icon icon-sm icon-info"></span>
|
||||
<span>[[ __('support') ]]</span>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span class="btn btn-red btn-md" id="offline-indicator" v-bind:class="{offline: was_offline}" v-on:click="show_offline_help()">[[__("offline")]]</span>
|
||||
</div>
|
||||
|
||||
<div v-cloak class="header-right" v-if="active_space_loaded">
|
||||
|
||||
<span v-for="active_user in active_space_users" >
|
||||
<button
|
||||
class="member btn btn-md btn-round"
|
||||
v-cloak
|
||||
v-bind:class="{'btn-dark': !active_user.avatar_thumb_uri}"
|
||||
v-bind:style="{'background-image': 'url('+active_user.avatar_thumb_uri+')'}"
|
||||
v-bind:title="active_user.nickname + ' is online'">
|
||||
|
||||
{{active_user.nickname}}
|
||||
|
||||
</button>
|
||||
</span>
|
||||
|
||||
<div class="btn-group dark" v-if="active_space_role!='viewer'">
|
||||
<button class="btn btn-md btn-transparent btn-icon" title="Start Presentation (others follow what you see)" v-on:click="toggle_present_mode()" v-bind:class="{open:present_mode}">
|
||||
<span class="icon icon-presentation"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-group dark round" v-if="zones.length">
|
||||
<button class="btn btn-md btn-transparent btn-icon" v-on:click="go_to_previous_zone()" title="[[__("Previous Zone")]]">
|
||||
<span class="icon icon-triangle-4-left"></span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-md btn-divider"></button>
|
||||
|
||||
<button class="btn btn-md btn-transparent btn-icon" v-on:click="go_to_next_zone()" title="[[__("Next Zone")]]">
|
||||
<span class="icon icon-triangle-4-right"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!--button class="btn btn-md btn-dark btn-round btn-icon" v-on:click="download_space()" title="[[__("download_space")]]">
|
||||
<span class="icon icon-download"></span>
|
||||
</button-->
|
||||
|
||||
<div class="btn-group dark" id="meta-toggle" style="margin-right:10px">
|
||||
<button class="btn btn-md btn-transparent btn-icon" v-on:click="toggle_meta()" title="[[__("chat")]]">
|
||||
<span class="jewel" style="color: white; background-color: red" v-if="meta_unseen>0">{{meta_unseen}}</span>
|
||||
<span class="icon icon-messages"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% include "./tool/toolbar-elements.html" %}
|
||||
{% include "./tool/toolbar-object.html" %}
|
||||
|
||||
<div v-if="active_space && active_space_loaded">
|
||||
<div id="lasso"></div>
|
||||
<div class="snap-ruler-h" v-bind:style="{top:snap_ruler_y+'px'}"></div>
|
||||
<div class="snap-ruler-v" v-bind:style="{left:snap_ruler_x+'px'}"></div>
|
||||
<div class="space-empty" v-cloak v-if="active_view == 'space' && !present_mode && active_space_artifacts.length == 0">
|
||||
<div class="table-fake">
|
||||
<div class="cell">
|
||||
<p>Click anywhere to add content.<br>
|
||||
You can also drop images, sounds and video<br>
|
||||
or use copy and paste.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="space-loading" v-cloak v-bind:class="{active:loading_space_id, active:global_spinner}">
|
||||
<div>
|
||||
<div class="spinner"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="space" v-cloak
|
||||
v-if="active_view == 'space' && active_space_loaded"
|
||||
class="section board active mouse-{{mouse_state}} tool-{{active_tool}}"
|
||||
v-bind:style="{'background-color': active_space.advanced.background_color}"
|
||||
v-sd-droppable="handle_data_drop;active_space"
|
||||
v-sd-whiteboard
|
||||
v-on:scroll="handle_scroll"
|
||||
v-on:dblclick="handle_space_doubleclick">
|
||||
|
||||
<div id="space-clipboard" style="position:fixed;top:0;left:0;z-index:0;opacity:0;background-color:white"><textarea v-model="selected_artifacts_json" cols="2" rows="2" id="clipboard-ta" class="mousetrap"></textarea></div>
|
||||
|
||||
<div class="space-bounds" v-bind:style="{width: active_space.advanced.width*bounds_zoom + 'px', height: active_space.advanced.height*bounds_zoom + 'px', 'background-color': active_space.advanced.background_color}"></div>
|
||||
|
||||
<div class="wrapper"
|
||||
v-bind:style="{
|
||||
transform: 'scale('+viewport_zoom+')',
|
||||
'transform-origin': '0 0',
|
||||
width: active_space.advanced.width + 'px',
|
||||
height: active_space.advanced.height + 'px',
|
||||
'background-image': (active_space.advanced.background_uri)?'url(' + active_space.advanced.background_uri + ')':'',
|
||||
'background-color': ''+active_space.advanced.background_color,
|
||||
'margin-left': bounds_margin_horiz + 'px',
|
||||
'margin-top': bounds_margin_vert + 'px'}" >
|
||||
|
||||
<div v-for="a in active_space_artifacts"
|
||||
v-bind:style="a.view.style" v-bind:class="a.view.classes"
|
||||
v-bind:class="{text-editing:(editing_artifact_id==a._id && (a.view.major_type=='text' || a.view.major_type=='shape'))}"
|
||||
id="artifact-{{a._id}}">
|
||||
|
||||
|
||||
<div v-if="a.view && a.view.major_type" style="height:100%; width:100%" v-bind:title="(a.editor_name || (a.user && a.user.nickname) || '')">
|
||||
<span v-if="a.locked && is_selected(a)" class="link-wrapper">
|
||||
<span class="btn btn-sm btn-icon btn-round btn-primary">
|
||||
<span class="icon icon-lock-closed"></span>
|
||||
</span>
|
||||
</span>
|
||||
<!-- text -->
|
||||
<div v-if="a.view.major_type == 'text'" class="text" v-bind:style="a.view.inner_style">
|
||||
<div class="text-table">
|
||||
<div class="text-cell" v-bind:style="a.view.text_cell_style">
|
||||
<div class="text-column" class="text-editing" v-sd-richtext:obj="a" v-show="editing_artifact_id==a._id">{{{a.description}}}</div>
|
||||
<div class="text-column" v-show="editing_artifact_id!=a._id">{{{a.description|urls_to_links}}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span v-if="a.view.link.length>0" class="link-wrapper">
|
||||
<a class="link btn btn-round btn-primary btn-sm" v-if="a.view.link" v-bind:href="a.view.link" target="_blank">{{a.view.link_caption}}</a>
|
||||
</span>
|
||||
|
||||
<div class="btn btn-xs btn-icon btn-round btn-primary edit" v-show="editing_artifact_id!=a._id && is_selected(a)" v-on:touchstart="delayed_edit_artifact($event)"><span class="icon icon-pencil" v-on:click="toggle_selected_artifact_editing(true)" v-on:"touchstart:delayed_edit_artifact($event)"></span></div>
|
||||
<input v-show="is_selected(a)" type="text" id="ios-focuser-{{a._id}}" class="ios-focuser">
|
||||
</div>
|
||||
|
||||
<!-- drawing (annotation) -->
|
||||
<div v-if="a.view.major_type == 'vector'" class="clip" v-bind:style="a.view.inner_style">
|
||||
<div>{{{a.view.vector_svg}}}</div>
|
||||
</div>
|
||||
|
||||
<!-- svg shape -->
|
||||
<div v-if="a.view.major_type == 'shape'" class="clip" v-bind:style="a.view.inner_style">
|
||||
<div class="shape">{{{a.view.vector_svg}}}</div>
|
||||
<div class="text-table">
|
||||
<div class="text-cell" v-bind:style="a.view.text_cell_style">
|
||||
<div class="text-column" class="text-editing" v-sd-richtext:obj="a" v-show="editing_artifact_id==a._id"></div>
|
||||
<div class="text-column" v-show="editing_artifact_id!=a._id">{{{a.description|urls_to_links}}}</div>
|
||||
</div>
|
||||
</div>
|
||||
<span v-if="a.view.link.length>0" class="link-wrapper">
|
||||
<a class="link btn btn-round btn-primary btn-sm" v-if="a.view.link" v-bind:href="a.view.link" target="_blank">{{a.view.link_caption}}</a>
|
||||
</span>
|
||||
|
||||
<div class="btn btn-xs btn-icon btn-round btn-primary edit" v-show="editing_artifact_id!=a._id && is_selected(a)" v-on:touchstart="delayed_edit_artifact($event)"><span class="icon icon-pencil" v-on:click="toggle_selected_artifact_editing(true)" v-on:"touchstart:delayed_edit_artifact($event)"></span></div>
|
||||
<input v-show="is_selected(a)" type="text" id="ios-focuser-{{a._id}}" class="ios-focuser">
|
||||
</div>
|
||||
|
||||
<!-- svg image -->
|
||||
<div v-if="a.view.major_type == 'svg'" class="svg" v-bind:style="a.view.inner_style">
|
||||
<img v-bind:src="a.view.payload_uri"></img>
|
||||
</div>
|
||||
|
||||
<!-- image -->
|
||||
<div v-if="a.view.major_type == 'image'" class="image" v-bind:style="a.view.inner_style + '; background-image: url('+a.view.thumbnail_uri+');'">
|
||||
<span class="title">{{a.title}}</span>
|
||||
<div class="spinner"></div>
|
||||
<div class="progress" v-bind:style="{width: a.view.progress+'%'}"></div>
|
||||
<div class="progress-text">{{a.description}}</div>
|
||||
|
||||
<video v-if="a.mime == 'image/gif' && a.payload_alternatives && a.payload_alternatives.length > 0" preload autoplay loop>
|
||||
<source v-for="rep in a.payload_alternatives" v-bind:src="rep.payload_uri" v-bind:type="rep.mime" />
|
||||
</video>
|
||||
|
||||
<a class="btn btn-md btn-icon btn-round btn-primary edit"
|
||||
v-show="a.mime == 'application/pdf'"
|
||||
v-bind:href="a.payload_uri" target="_blank"
|
||||
><span class="icon icon-link"></span></a>
|
||||
|
||||
<span v-if="a.view.link.length>0" class="link-wrapper">
|
||||
<a class="link btn btn-round btn-primary btn-sm" v-if="a.view.link" v-bind:href="a.view.link" target="_blank">{{a.view.link_caption}}</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- video -->
|
||||
<div v-if="a.view.major_type == 'video'" v-videoplayer="a" class="video" v-bind:style="a.view.inner_style + ';background-image: url('+a.view.thumbnail_uri+');'">
|
||||
<video preload="metadata" v-bind:poster="a.view.thumbnail_uri">
|
||||
<source v-for="rep in a.payload_alternatives" v-bind:src="rep.payload_uri" v-bind:type="rep.mime" />
|
||||
<source v-if="a.payload_uri && a.mime" v-bind:src="a.payload_uri" v-bind:type="a.mime" />
|
||||
</video>
|
||||
|
||||
<div class="tl-controls">
|
||||
<div class="btn btn-md btn-toggle btn-round" v-bind:class="{alt:a.player_view.state=='playing'}">
|
||||
<span class="btn-option play">
|
||||
<span class="icon icon-controls-play"></span>
|
||||
</span>
|
||||
|
||||
<span class="btn-option pause">
|
||||
<span class="icon icon-controls-pause"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<span class="btn btn-md btn-round btn-icon stop" v-show="a.player_view.state=='playing' || a.player_view.state=='paused'">
|
||||
<span class="icon icon-controls-stop"></span>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
<div class="spinner"></div>
|
||||
<div class="progress" v-bind:style="{width: a.view.progress+'%'}">{{a.description}}</div>
|
||||
</div>
|
||||
|
||||
<!-- audio -->
|
||||
<div v-if="a.view.major_type == 'audio'" v-audioplayer="a" class="audio" v-bind:style="a.view.inner_style">
|
||||
|
||||
<audio>
|
||||
<source v-for="alt in a.payload_alternatives | orderBy 'mime' -1" v-bind:src="alt.payload_uri" v-bind:type="alt.mime"/>
|
||||
<source v-bind:src="a.payload_uri" v-bind:type="a.mime" v-if="a.payload_uri"/>
|
||||
</audio>
|
||||
|
||||
<div class="timeline" v-show="a.board.h>=64 && a.board.w>=170" v-bind:style="{'background-image': 'url(' + a.payload_thumbnail_web_uri +')'}">
|
||||
<div class="tl-current-time" v-bind:style="{width: a.player_view.current_time_float*100 + '%'}"></div>
|
||||
<div class="tl-inpoint" v-bind:style="{left: a.player_view.inpoint_float*100 + '%'}" v-if="a.player_view.inpoint_float>0.0"></div>
|
||||
<div class="tl-outpoint" v-bind:style="{left: a.player_view.outpoint_float*100 + '%'}"></div>
|
||||
</div>
|
||||
|
||||
<div class="tl-controls">
|
||||
<div class="btn btn-md btn-toggle btn-round" v-bind:class="{alt:a.player_view.state=='playing'}">
|
||||
<span class="btn-option play">
|
||||
<span class="icon icon-controls-play"></span>
|
||||
</span>
|
||||
|
||||
<span class="btn-option pause">
|
||||
<span class="icon icon-controls-pause"></span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<span class="btn btn-md btn-round btn-icon stop" v-show="a.player_view.state=='playing' || a.player_view.state=='paused'">
|
||||
<span class="icon icon-controls-stop"></span>
|
||||
</span>
|
||||
|
||||
<span class="tl-title" v-show="a.board.w>=400">{{a.view.filename}}</span>
|
||||
<span class="tl-times" class="btn-group">
|
||||
<span class="btn btn-md btn-transparent no-p">{{a.player_view.current_time_string}}</span>
|
||||
<span class="btn btn-md btn-transparent no-p" v-show="a.board.w>=170"> / {{a.player_view.total_time_string}}</span>
|
||||
</span>
|
||||
|
||||
<span v-show="logged_in && a.board.w>=310">
|
||||
<a class="btn btn-xs btn-round btn-icon set-inpoint" title="Set Inpoint at Playhead">
|
||||
<span class="icon icon-edge-left"></span>
|
||||
</a>
|
||||
<a class="btn btn-xs btn-round btn-icon set-outpoint" title="Set Outpoint at Playhead">
|
||||
<span class="icon icon-edge-right"></span>
|
||||
</a>
|
||||
<a class="btn btn-xs btn-round btn-icon reset-points" title="Reset In-/Outpoints">
|
||||
<span class="icon icon-size-horizontal"></span>
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="spinner"></div>
|
||||
<div class="progress" v-bind:style="{width: a.view.progress + '%'}">{{a.description}}</div>
|
||||
</div>
|
||||
|
||||
<!-- zone -->
|
||||
<div v-if="a.view.major_type == 'zone'" class="zone" v-bind:style="a.view.inner_style">
|
||||
<div class="text-cell">
|
||||
<div class="text-column" class="text-editing" v-sd-richtext:obj="a" v-show="editing_artifact_id==a._id"></div>
|
||||
<div class="text-column" v-show="editing_artifact_id!=a._id">{{{a.description|urls_to_links}}}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- embed -->
|
||||
<div v-if="a.view.major_type == 'oembed'" class="oembed"
|
||||
v-bind:style="{'background-image': 'url('+a.view.thumbnail_uri+')'}"
|
||||
v-bind:class="{interactive:(a.view.interactive || present_mode)}">
|
||||
{{{a.view.oembed_html}}}
|
||||
<button class="btn btn-icon btn-primary btn-round interact" v-on:click="a.view.interactive=1" v-if="!a.view.interactive && !present_mode"><span class="icon icon-tool-pointer"></span></button>
|
||||
</div>
|
||||
|
||||
<!-- file -->
|
||||
<div v-if="a.view.major_type == 'file'" class="text" v-bind:style="a.view.inner_style">
|
||||
<span class="icon icon-page-vertical-double"></span>
|
||||
{{a.view.filename}}
|
||||
<div class="spinner"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- board artifacts end -->
|
||||
|
||||
<div
|
||||
class="handles handles-object"
|
||||
v-bind:class="{'handles-vector':selection_metrics.vector_selection}"
|
||||
v-bind:style="selection_metrics.style">
|
||||
|
||||
<div class="handle resize-nw"><div><div><div>
|
||||
<span class="value-h">{{selection_metrics.h}}</span>
|
||||
<span class="value-w">{{selection_metrics.w}}</span>
|
||||
</div></div></div></div>
|
||||
|
||||
<div class="handle resize-n"><div><div><div>
|
||||
<span class="value-h">{{selection_metrics.h}}</span>
|
||||
</div></div></div></div>
|
||||
|
||||
<div class="handle resize-ne"><div><div><div>
|
||||
<span class="value-h">{{selection_metrics.h}}</span>
|
||||
<span class="value-w">{{selection_metrics.w}}</span>
|
||||
</div></div></div></div>
|
||||
|
||||
<div class="handle resize-e"><div><div><div>
|
||||
<span class="value-w">{{selection_metrics.w}}</span>
|
||||
</div></div></div></div>
|
||||
|
||||
<div class="handle resize-se"><div><div><div>
|
||||
<span class="value-h">{{selection_metrics.h}}</span>
|
||||
<span class="value-w">{{selection_metrics.w}}</span>
|
||||
</div></div></div></div>
|
||||
|
||||
<div class="handle resize-s"><div><div><div>
|
||||
<span class="value-h">{{selection_metrics.h}}</span>
|
||||
</div></div></div></div>
|
||||
|
||||
<div class="handle resize-sw"><div><div><div>
|
||||
<span class="value-h">{{selection_metrics.h}}</span>
|
||||
<span class="value-w">{{selection_metrics.w}}</span>
|
||||
</div></div></div></div>
|
||||
|
||||
<div class="handle resize-w"><div><div><div>
|
||||
<span class="value-w">{{selection_metrics.w}}</span>
|
||||
</div></div></div></div>
|
||||
|
||||
<div class="edge-handle resize-n"> <span class="value-h">{{selection_metrics.h}}</span> </div>
|
||||
<div class="edge-handle resize-s"> <span class="value-h">{{selection_metrics.h}}</span> </div>
|
||||
<div class="edge-handle resize-e"> <span class="value-w">{{selection_metrics.w}}</span> </div>
|
||||
<div class="edge-handle resize-w"> <span class="value-w">{{selection_metrics.w}}</span> </div>
|
||||
|
||||
<div
|
||||
v-bind:style="selection_metrics.vector_style" v-show="selection_metrics.vector_points">
|
||||
<span v-for="p in selection_metrics.vector_points" v-bind:style="{left: p.dx+'px', top: p.dy+'px'}" class="vector-handle" data-idx="{{$index}}"></span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- handles end -->
|
||||
|
||||
<div class="cursor" v-for="c in user_cursors" v-bind:style="{left: c.x + 'px', top: c.y+'px'}"><span class="btn btn-round btn-sm btn-dark"><span class="icon icon-tool-pointer"></span> {{c.name}}</div>
|
||||
|
||||
</div>
|
||||
<!-- wrapper end -->
|
||||
|
||||
</div>
|
||||
|
||||
<div v-if="active_space_loaded" v-cloak>
|
||||
<div id="minimap"
|
||||
v-bind:style="{width: ''+(active_space.advanced.width/minimap_scale)+'px', height: ''+(active_space.advanced.height/minimap_scale)+'px', bottom: '66px', right: '20px'}"
|
||||
v-if="active_space"
|
||||
v-on:mousedown="handle_minimap_mousedown($event)"
|
||||
v-on:touchstart="handle_minimap_mousedown($event)"
|
||||
v-on:mousemove="handle_minimap_mousemove($event)"
|
||||
v-on:touchmove="handle_minimap_mousemove($event)"
|
||||
v-on:mouseleave="handle_minimap_mouseup($event)"
|
||||
v-on:touchend="handle_minimap_mouseup($event)"
|
||||
v-on:mouseup="handle_minimap_mouseup($event)">
|
||||
<div v-for="a in active_space_artifacts" v-bind:style="{left: ''+(a.board.x/minimap_scale)+ 'px', top: ''+(a.board.y/minimap_scale) + 'px', width: ''+(a.board.w/minimap_scale)+ 'px', height: ''+(a.board.h/minimap_scale) + 'px'}"></div>
|
||||
<div class="window" v-bind:style="{left: ''+(scroll_left/minimap_scale) + 'px', top: ''+(scroll_top/minimap_scale)+ 'px', width: ''+(window_width/minimap_scale)+ 'px', height: ''+(window_height/minimap_scale) + 'px'}"></div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="btn-group dark" style="position:absolute;bottom:20px;right:20px;">
|
||||
<button class="btn btn-icon btn-md btn-transparent" v-on:click="zoom_in()">
|
||||
<span class="icon icon-plus"></span>
|
||||
</button>
|
||||
<button class="btn btn-md btn-transparent no-p" v-on:click="zoom_to_original()">
|
||||
{{viewport_zoom_percent}}%
|
||||
</button>
|
||||
<button class="btn btn-icon btn-md btn-transparent" v-on:click="zoom_out()">
|
||||
<span class="icon icon-minus"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
91
views/partials/team.html
Normal file
91
views/partials/team.html
Normal file
@@ -0,0 +1,91 @@
|
||||
<div id="team" class="dialog in" style="padding:100px;z-index:20000;position:absolute;width:100%;min-height:100%;background-color:#fafafa" v-if="active_view == 'team' && user" v-cloak>
|
||||
|
||||
<a href="/spaces" class="btn btn-round btn-icon btn-stroke-darken btn-md pull-right" style="position:absolute;top:30px;right:30px"><span class="icon icon-cross-0"></span></a>
|
||||
|
||||
<h4>Spacedeck Team Management</h4>
|
||||
|
||||
<div v-if="!user.team" class="dialog-section text-left">
|
||||
You are not in a team yet. Please upgrade first.</h2>
|
||||
</div>
|
||||
|
||||
<div v-if="user.team">
|
||||
<div class="dialog-section">
|
||||
<h4 class="text-left">[[__("team_name")]]</h4>
|
||||
<div class="input-group org-add-form">
|
||||
<input id="org-member-emails" v-model="user.team.name" class="form-control input input-lg" type="text">
|
||||
<span class="input-group-btn">
|
||||
<span id="org-add-member" class="btn btn-lg btn-primary" v-on:click=" team_save()">
|
||||
[[__("save")]]
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section">
|
||||
<h4 class="text-left">[[__("subdomain")]]</h4>
|
||||
<div class="input-group org-add-form">
|
||||
<input v-model="user.team.subdomain" class="form-control input input-lg" type="text">
|
||||
<span class="input-group-btn">
|
||||
<span id="org-add-member" class="btn btn-lg btn-primary" v-on:click=" team_save()">
|
||||
[[__("save")]]
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section text-left">
|
||||
<h4>Members</h4>
|
||||
|
||||
<p>
|
||||
New members will get an invitation email. After the invitation was used, the member is active. The number of active members in your team will affect your monthly charge.
|
||||
</p>
|
||||
|
||||
<div class="input-group org-add-form">
|
||||
<input id="org-member-emails" v-model="team_emails" class="form-control input input-lg" type="email" placeholder="[[__("team_adresses")]]">
|
||||
<span class="input-group-btn">
|
||||
<span id="org-add-member" class="btn btn-lg btn-primary org-save" v-on:click=" team_invite_members(team_emails)">
|
||||
<span v-if="!team_email_invited">[[__("add")]]</span>
|
||||
<span v-if="team_email_invited">✓ [[__("invited")]]</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<table class="table table-striped table-condensed" v-if="team_members.length">
|
||||
<thead>
|
||||
<tr>
|
||||
<th> [[__("email")]] </th>
|
||||
<th> [[__("name")]] </th>
|
||||
<th> [[__("role")]] </th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody class="members-list">
|
||||
|
||||
<tr v-for="u in team_members">
|
||||
|
||||
<td class="email">
|
||||
<span>{{u.email}}</span>
|
||||
</td>
|
||||
|
||||
<td class="display_name">
|
||||
<span>{{u.nickname}}</span>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<span v-if="is_admin(u)">[[__("role_admin")]]</span>
|
||||
<span v-if="!is_admin(u)">[[__("role_member")]]</span>
|
||||
</td>
|
||||
|
||||
<td>
|
||||
<span v-if="u._id != user._id" class="btn btn-sm btn-danger" v-on:click="team_remove_member(u)">[[__("remove")]]</span>
|
||||
<span v-if="(u._id != user._id) && !is_admin(u)" class="btn btn-sm" v-on:click="team_promote_member(u)">[[__("promote")]]</span>
|
||||
<span v-if="(u._id != user._id) && is_admin(u)" class="btn btn-sm" v-on:click="team_demote_member(u)">[[__("demote")]]</span>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
16
views/partials/tool/audio.html
Normal file
16
views/partials/tool/audio.html
Normal file
@@ -0,0 +1,16 @@
|
||||
<h4 class="dialog-title">audio</h4>
|
||||
|
||||
<div id="audio">
|
||||
|
||||
<div class="dialog-section">
|
||||
<label class="btn btn-xxl btn-transparent btn-icon">
|
||||
<span class="icon icon-music-note"></span>
|
||||
<input type="file" accept="audio/*" multiple v-on="change:handle_audio_file_upload($event)" id="audio_file_upload">
|
||||
</label>
|
||||
<p>Click to Upload<br/> or drag file(s) here</p>
|
||||
</div>
|
||||
<div class="dialog-section no-p-b">
|
||||
<input type="text" v-model="audio_search_query" class="input input-md input-white input-round text-center no-p no-b no-r input-block" placeholder="Search / Paste URL" v-on="keyup:search_audio(audio_search_query) | key enter">
|
||||
</div>
|
||||
<button class="btn btn-transparent btn-block text-center" v-on="click:handle_insert_audio_url(audio_search_query)">Insert Audio</button>
|
||||
</div>
|
||||
112
views/partials/tool/background.html
Normal file
112
views/partials/tool/background.html
Normal file
@@ -0,0 +1,112 @@
|
||||
|
||||
<div class="dialog-tabs-wrapper">
|
||||
<div class="dialog-tabs">
|
||||
<div class="dialog-tab" v-bind:class="{open:background_mode=='image'}" v-on:click="background_mode='image'"><span>[[__("background_image_caption")]]</span></div>
|
||||
<div class="dialog-tab" v-bind:class="{open:background_mode=='color'}" v-on:click="background_mode='color'"><span>[[__("background_color_caption")]]</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="background" class="relative">
|
||||
<div id="colors" class="relative" v-show="background_mode!='image'">
|
||||
<div class="color-picker" v-show="color_mode=='picker'">
|
||||
<div class="color" id="background-color-picker" v-bind:style="{'background-color': 'hsl(' +color_picker_hue/255*360 + ', 100%, 50%)'}"
|
||||
v-sd-fader="true"
|
||||
sd-fader-var-x="color_picker_saturation"
|
||||
sd-fader-var-y="color_picker_value"
|
||||
sd-fader-max-x="255"
|
||||
sd-fader-max-y="255">
|
||||
<div class="fader-constraint mask" style="pointer-events:none" ></div>
|
||||
<button class="fader-selector" style="pointer-events:none"></button>
|
||||
</div>
|
||||
|
||||
<div class="color-hue"
|
||||
v-sd-fader="true"
|
||||
sd-fader-var-x="color_picker_hue">
|
||||
<button class="fader-selector" style="pointer-events:none"></button>
|
||||
</div>
|
||||
|
||||
<div class="color-opacity"
|
||||
v-sd-fader="true"
|
||||
sd-fader-var-x="color_picker_opacity">
|
||||
<div class="fit"></div>
|
||||
<button class="fader-selector" style="pointer-events:none"></button>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p" id="color-rgba">
|
||||
<div class="input-row">
|
||||
<div>
|
||||
<label class="color-hsva-hue">H</label>
|
||||
<input class="input input-md input-nude text-center" v-model="color_picker_hue" spellcheck="false" maxlength="3" type="number">
|
||||
</div>
|
||||
<div>
|
||||
<label class="color-hsva-saturation">S</label>
|
||||
<input class="input input-md input-nude text-center" v-model="color_picker_saturation" spellcheck="false" maxlength="3" type="number">
|
||||
</div>
|
||||
<div>
|
||||
<label class="color-hsva-brightness">V</label>
|
||||
<input class="input input-md input-nude text-center" v-model="color_picker_value" spellcheck="false" maxlength="3" type="number">
|
||||
</div>
|
||||
<div>
|
||||
<label class="color-hsva-alpha">A</label>
|
||||
<input class="input input-md input-nude text-center" v-model="color_picker_opacity" spellcheck="false" maxlength="3" type="number">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="color-palette" v-show="color_mode=='palette'">
|
||||
<div class="adapt overflow-y-scroll">
|
||||
<button class="btn btn-round btn-darken"
|
||||
v-on:click="apply_swatch_color(s)"
|
||||
v-for="s in swatches"
|
||||
v-bind:style="{'background-color': s.hex}">
|
||||
<span class="icon"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--div class="dialog-section" v-show="background_mode=='color'">
|
||||
<div class="tab-switch round options-2" v-bind:class="{'option-2':color_mode=='picker'}">
|
||||
<div class="options">
|
||||
<span class="option" v-on:click="activate_color_mode('palette')">[[__("palette")]]</span>
|
||||
<span class="option" v-on:click="activate_color_mode('picker')">
|
||||
<span>[[__("picker")]]</span>
|
||||
</span>
|
||||
</div>
|
||||
<span class="option-highlight"></span>
|
||||
</div>
|
||||
</div-->
|
||||
|
||||
<div class="" v-show="background_mode=='image'" v-if="active_space">
|
||||
<div class="background-image" v-bind:style="{height: '233px', 'background-image':'url('+active_space.advanced.background_uri+')', 'margin': '6px', 'border-radius': '3px'}" v-if="active_space.advanced.background_uri && !space_background_uploading">
|
||||
</div>
|
||||
|
||||
<div class="progress state-processing" v-if="space_background_uploading">
|
||||
<div class="spinner"></div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-b adapt" v-if="!active_space.advanced.background_uri && !space_background_uploading" v-on:touchstart="handle_touch_select_background_image()">
|
||||
<label class="btn btn-xxl btn-transparent btn-icon">
|
||||
<span class="icon icon-picture-upload"></span>
|
||||
<input id="background-uploader" type="file" accept="image/*" v-on:change="handle_section_background_upload($event)">
|
||||
</label>
|
||||
<p>[[__("upload_background_caption")]]</p>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p no-flex" v-if="active_space.advanced.background_uri">
|
||||
<div class="btn-cluster">
|
||||
<label class="btn btn-transparent btn-block text-center" v-if="active_space.advanced.background_uri" v-on:touchstart="handle_touch_select_background_image()">
|
||||
<input id="background-uploader" type="file" accept="image/*" v-on:chang="handle_section_background_upload($event)">
|
||||
<span class="icon icon-picture-upload"></span>
|
||||
<!-- Upload -->
|
||||
</label>
|
||||
<button class="btn btn-transparent text-center" v-on:click="remove_section_background()" >
|
||||
<span class="icon icon-trash"></span>
|
||||
<!-- Remove -->
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
28
views/partials/tool/canvas.html
Normal file
28
views/partials/tool/canvas.html
Normal file
@@ -0,0 +1,28 @@
|
||||
<h4 class="dialog-title">Padding</h4>
|
||||
|
||||
<div id="canvas">
|
||||
<div class="dialog-section no-p-b no-p-h">
|
||||
<div class="input-couple">
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-right">Horizontal</label>
|
||||
<input class="input no-b no-p text-right" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" v-model="active_version.advanced.padding_horiz">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" v-sd-fader="true" sd-fader-var-y="active_version.advanced.padding_horiz" sd-fader-min-y="0" sd-fader-max-y="1000" sd-fader-step="1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-left">Vertical</label>
|
||||
<input class="input no-b no-p text-left" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" ng-model="active_version.advanced.height">
|
||||
<button class="input-drag btn btn-transparent btn-icon absolute-bottom-right" sd-fader="y-encoder" sd-fader-var-y="active_version.advanced.height" sd-fader-min-y="100" sd-fader-max-y="20000" sd-fader-step="10">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
152
views/partials/tool/color.html
Normal file
152
views/partials/tool/color.html
Normal file
@@ -0,0 +1,152 @@
|
||||
<div id="colors" class="relative">
|
||||
<div class="color-picker" v-bind:class="{invis : color_mode=='palette'}">
|
||||
<div class="color" id="fg-color-picker" v-bind:style="{'background-color': 'hsl(' + color_picker_hue/255*360 + ', 100%, 50%)'}"
|
||||
v-sd-fader="true"
|
||||
sd-fader-var-x="color_picker_saturation"
|
||||
sd-fader-var-y="color_picker_value"
|
||||
sd-fader-max-x="255"
|
||||
sd-fader-max-y="255">
|
||||
<div class="fader-constraint mask" style="pointer-events:none" ></div>
|
||||
<button class="fader-selector" style="pointer-events:none"></button>
|
||||
</div>
|
||||
|
||||
<div class="color-hue"
|
||||
v-sd-fader="true"
|
||||
sd-fader-var-x="color_picker_hue">
|
||||
<button class="fader-selector" style="pointer-events:none"></button>
|
||||
</div>
|
||||
|
||||
<div class="color-opacity"
|
||||
v-sd-fader="true"
|
||||
sd-fader-var-x="color_picker_opacity">
|
||||
<div class="fit"></div>
|
||||
<button class="fader-selector" style="pointer-events:none"></button>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p" id="color-rgba">
|
||||
<div class="input-row">
|
||||
<div>
|
||||
<label class="color-hsva-hue">H</label>
|
||||
<input class="input input-md input-nude text-center" v-model="color_picker_hue" spellcheck="false" maxlength="3" type="number">
|
||||
</div>
|
||||
<div>
|
||||
<label class="color-hsva-saturation">S</label>
|
||||
<input class="input input-md input-nude text-center" v-model="color_picker_saturation" spellcheck="false" maxlength="3" type="number">
|
||||
</div>
|
||||
<div>
|
||||
<label class="color-hsva-brightness">V</label>
|
||||
<input class="input input-md input-nude text-center" v-model="color_picker_value" spellcheck="false" maxlength="3" type="number">
|
||||
</div>
|
||||
<div>
|
||||
<label class="color-hsva-alpha">A</label>
|
||||
<input class="input input-md input-nude text-center" v-model="color_picker_opacity" spellcheck="false" maxlength="3" type="number">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="dialog-section no-p" id="color-hex">
|
||||
<button id="add-remove-color" class="btn btn-toggle btn-transparent btn-icon" >
|
||||
<span class="btn-option">
|
||||
<span class="icon icon-circle-check"></span>
|
||||
</span>
|
||||
|
||||
<span class="btn-option" >
|
||||
<span class="icon icon-trash"></span>
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<div id="color-hash">
|
||||
<label class="hash">#</label>
|
||||
<input class="input" v-model="color_picker_rgb" spellcheck="false" maxlength="6" type="text">
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<div class="color-palette r-10" v-bind:class="{invis:color_mode!='palette'}">
|
||||
<div class="adapt overflow-y-scroll">
|
||||
<button class="btn btn-round btn-darken"
|
||||
v-on:click="apply_swatch_color(s)"
|
||||
v-for="s in swatches"
|
||||
v-bind:style="{'background-color': s.hex}">
|
||||
<span class="icon" v-bind:class="{'icon-cross-0':s.hex=='rgba(0,0,0,0)'}"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--div class="dialog-section no-b" style="margin-top:-10px">
|
||||
<div class="tab-switch round options-2" v-bind:class="{'option-2':color_mode=='picker'}">
|
||||
<div class="options">
|
||||
<span class="option" v-on:click="activate_color_mode('palette')">[[__("palette")]]</span>
|
||||
<span class="option" v-on:click="activate_color_mode('picker')">
|
||||
<span>[[__("picker")]]</span>
|
||||
</span>
|
||||
</div>
|
||||
<span class="option-highlight"></span>
|
||||
</div>
|
||||
</div-->
|
||||
|
||||
<!--div class="dialog-section no-p-h no-p-b" v-show="opened_dialog=='color-fill'">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm">Padding</label>
|
||||
<input class="input no-b no-p text-center text-large" spellcheck="false" type="number" pattern="[0-9]" maxlength="64" value="250" v-model="active_style.padding">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" style="cursor: ns-resize;" v-sd-fader="true" sd-fader-var-y="active_style.padding" sd-fader-min-y="0" sd-fader-max-y="500" sd-fader-step="1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
</div-->
|
||||
|
||||
<div class="dialog-section no-p-h no-p-b" v-show="opened_dialog=='color-stroke'">
|
||||
<div class="input-row">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm">Stroke</label>
|
||||
<input class="input no-b no-p text-center text-large" spellcheck="false" type="number" v-model="active_style.stroke">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" v-sd-fader="true" sd-fader-var-y="active_style.stroke" sd-fader-min-y="0" sd-fader-max-y="100" sd-fader-step="1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm">Border Radius</label>
|
||||
<input class="input no-b no-p text-center text-large" spellcheck="false" type="number" v-model="active_style.border_radius">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" v-sd-fader="true" sd-fader-var-y="active_style.border_radius" sd-fader-min-y="0" sd-fader-max-y="500" sd-fader-step="1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="dialog-section no-p-b no-p-h" v-show="opened_dialog=='color-text'">
|
||||
<div class="input-row">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-center">[[__("font_size")]]</label>
|
||||
<input class="input no-b no-p text-center text-large" spellcheck="false" type="text" pattern="[0-9]" maxlength="64" v-model="active_style.font_size">
|
||||
|
||||
<!--button tabindex="-1" class="input-drag btn btn-transparent btn-icon" style="cursor: ns-resize;" v-sd-fader="true" sd-fader-var-y="active_style.font_size" sd-fader-min-y="8" sd-fader-max-y="400" sd-fader-sens="0.2">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button-->
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
|
||||
<div class="form-group no-m">
|
||||
<span class="font-size-swatches" v-show="opened_dialog=='color-text'">
|
||||
<button class="btn btn-sm" v-on:click="apply_font_size(64)" style="font-size:32px">Big</button>
|
||||
<button class="btn btn-sm" v-on:click="apply_font_size(32)" style="font-size:24px">Medium</button>
|
||||
<button class="btn btn-sm" v-on:click="apply_font_size(18)" style="font-size:14px">Small</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!--div class="form-group no-m">
|
||||
<label class="label label-sm text-center">[[__("line_height")]]</label>
|
||||
<input disabled class="input no-b no-p text-center text-large" spellcheck="false" type="text" pattern="[0-9\.]" maxlength="64" v-model="active_style.line_height">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" style="cursor: ns-resize;" v-sd-fader="true" sd-fader-var-y="active_style.line_height" sd-fader-min-y="0.5" sd-fader-max-y="4" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">em</span>
|
||||
</div-->
|
||||
</div>
|
||||
</div>
|
||||
30
views/partials/tool/crop.html
Normal file
30
views/partials/tool/crop.html
Normal file
@@ -0,0 +1,30 @@
|
||||
<h4 class="dialog-title">Crop<br/><br/>(Not yet implemented)</h4>
|
||||
|
||||
<div id="crop">
|
||||
<div class="dialog-section">
|
||||
<div class="form-group">
|
||||
<label class="label label-range">Size</label>
|
||||
<div class="range-wrapper">
|
||||
<output for="crop" value="50">50</output>
|
||||
<input type="range" name="crop" min="0" max="100" value="50">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="fit" class="dialog-section">
|
||||
<div class="form-group">
|
||||
<label class="label label-sm">Proportions</label>
|
||||
<div class="btn-group center">
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon number">Fit</span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon number">Fill</span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon number">1:1</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
15
views/partials/tool/embed.html
Normal file
15
views/partials/tool/embed.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<h4 class="dialog-title">Embed Space</h4>
|
||||
|
||||
<div id="embed">
|
||||
<div class="dialog-section">
|
||||
<p>
|
||||
Copy and paste this HTML code into your blog or website:
|
||||
</p>
|
||||
</div>
|
||||
<hr>
|
||||
<div class="dialog-section">
|
||||
<div class="form-group">
|
||||
<textarea class="input input-md no-b input-block no-p" style="line-height: 140% !important; height: 200px; font-size: 13px !important; color: #666; font-family: courier" v-model="space_embed_html"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
73
views/partials/tool/filter.html
Normal file
73
views/partials/tool/filter.html
Normal file
@@ -0,0 +1,73 @@
|
||||
<h4 class="dialog-title">Filters</h4>
|
||||
|
||||
<div id="filter">
|
||||
<div class="dialog-section">
|
||||
<span class="icon icon-lightbulb"></span>
|
||||
<div class="form-group">
|
||||
<label class="label label-range">Brightness</label>
|
||||
<div class="range-wrapper">
|
||||
<output for="brightness">{{active_style.brightness}}</output>
|
||||
<input type="range" name="brightness" min="0" max="200" value="100" v-model="active_style.brightness">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section">
|
||||
<span class="icon icon-contrast"></span>
|
||||
<div class="form-group">
|
||||
<label class="label label-range">Contrast</label>
|
||||
<div class="range-wrapper">
|
||||
<output for="contrast">{{active_style.contrast}}</output>
|
||||
<input type="range" name="contrast" min="0" max="200" value="100" v-model="active_style.contrast">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section">
|
||||
<span class="icon icon-certificate"></span>
|
||||
<div class="form-group">
|
||||
<label class="label label-range">Saturation</label>
|
||||
<div class="range-wrapper">
|
||||
<output for="saturation">{{active_style.saturation}}</output>
|
||||
<input type="range" name="saturation" min="0" max="200" value="100" v-model="active_style.saturation">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section">
|
||||
<span class="icon icon-circle-subtract"></span>
|
||||
<div class="form-group">
|
||||
<label class="label label-range">Opacity</label>
|
||||
<div class="range-wrapper">
|
||||
<output for="opacity">{{active_style.opacity}}</output>
|
||||
<input type="range" name="opacity" min="0" max="100" value="100" v-model="active_style.opacity">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section">
|
||||
<span class="icon icon-leave"></span>
|
||||
<div class="form-group">
|
||||
<label class="label label-range">Hue</label>
|
||||
<div class="range-wrapper">
|
||||
<output for="hue">{{active_style.hue}}</output>
|
||||
<input type="range" name="hue" min="0" max="360" value="0" v-model="active_style.hue">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section">
|
||||
<span class="icon icon-tint"></span>
|
||||
<div class="form-group">
|
||||
<label class="label label-range">Blur</label>
|
||||
<div class="range-wrapper">
|
||||
<output for="blur">{{active_style.blur}}</output>
|
||||
<input type="range" name="blur" min="0" max="100" value="0" v-model="active_style.blur">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p">
|
||||
<button class="btn btn-transparent btn-block text-center" v-on:click="reset_artifact_filters()">Reset</button>
|
||||
</div>
|
||||
29
views/partials/tool/grid.html
Normal file
29
views/partials/tool/grid.html
Normal file
@@ -0,0 +1,29 @@
|
||||
<div id="grid">
|
||||
<div class="dialog-section no-p-b no-p-h">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm">Grid</label>
|
||||
<input class="input no-b no-p text-center" spellcheck="false" type="text" pattern="[0-9]" maxlength="64" ng-model="grid.spacing" value="50">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" sd-fader="y-encoder" sd-fader-var-y="grid.spacing" sd-fader-min-y="4" sd-fader-max-y="500" sd-fader-step="1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p-b no-p-h">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm">Subdivision</label>
|
||||
<input class="input no-b no-p text-center" spellcheck="false" type="text" pattern="[0-9]" maxlength="64" ng-model="grid.subdivisions" value="4">
|
||||
|
||||
<button class="btn-more btn btn-icon btn-transparent" ng-click="increase_grid_subdivisions()"> </button>
|
||||
<button class="btn-less btn btn-icon btn-transparent" ng-click="decrease_grid_subdivisions()"> </button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section">
|
||||
<button class="btn btn-md btn-block btn-darker" ng-click="open_dialog('canvas')">
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
15
views/partials/tool/image.html
Normal file
15
views/partials/tool/image.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<h4 class="dialog-title">Image</h4>
|
||||
|
||||
<div id="image">
|
||||
<div class="dialog-section">
|
||||
<label class="btn btn-xxl btn-transparent btn-icon">
|
||||
<span class="icon icon-picture-upload"></span>
|
||||
<input type="file" accept="*/*" multiple v-on:change="handle_image_file_upload($event)" id="image_file_upload">
|
||||
</label>
|
||||
<p>Click to Upload<br/> or drag file(s) anywhere.</p>
|
||||
</div>
|
||||
<div class="dialog-section no-p-b">
|
||||
<input type="text" v-model="image_search_query" class="input input-md input-white input-round text-center no-p no-b no-r input-block" placeholder="Search / Paste URL" v-on:keyup.enter="search_images(image_search_query)">
|
||||
</div>
|
||||
<button class="btn btn-transparent btn-block text-center" v-on:click="handle_insert_image_url(image_search_query)">Insert Image</button>
|
||||
</div>
|
||||
65
views/partials/tool/layout.html
Normal file
65
views/partials/tool/layout.html
Normal file
@@ -0,0 +1,65 @@
|
||||
<div id="layout" class="relative">
|
||||
<div class="dialog-section no-p-b">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_stack_top()">
|
||||
<span class="icon icon-stack-3d-top"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_stack_bottom()">
|
||||
<span class="icon icon-stack-3d-bottom"></span>
|
||||
</button>
|
||||
<button class="left btn btn-transparent btn-icon" v-on:click="layout_align_left()">
|
||||
<span class="icon icon-align-left"></span>
|
||||
</button>
|
||||
<button class="right btn btn-transparent btn-icon" v-on:click="layout_align_right()">
|
||||
<span class="icon icon-align-right"></span>
|
||||
</button>
|
||||
<button class="top btn btn-transparent btn-icon" v-on:click="layout_align_top()">
|
||||
<span class="icon icon-align-top"></span>
|
||||
</button>
|
||||
<button class="bottom btn btn-transparent btn-icon" v-on:click="layout_align_bottom()">
|
||||
<span class="icon icon-align-bottom"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_align_center()">
|
||||
<span class="icon icon-align-center-horizontal"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_align_middle()">
|
||||
<span class="icon icon-align-center-vertical"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_distribute_horizontal()">
|
||||
<span class="icon icon-distribute-horizontal"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_distribute_vertical()">
|
||||
<span class="icon icon-distribute-vertical"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_distribute_horizontal_spacing()">
|
||||
<span class="icon icon-spacing-horizontal"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_distribute_vertical_spacing()">
|
||||
<span class="icon icon-spacing-vertical"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_auto()">
|
||||
<span class="icon icon-cluster"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!--div class="dialog-section no-p-b no-p-h" v-if="selection_metrics.count>1">
|
||||
<label class="label label-sm">Match Size</label>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_match_size_vert()">
|
||||
<span class="icon icon-size-vertical"></span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_match_size_both()">
|
||||
<span class="icon icon-size-both"></span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="layout_match_size_horiz()">
|
||||
<span class="icon icon-size-horizontal"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div-->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
13
views/partials/tool/link.html
Normal file
13
views/partials/tool/link.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<div class="dialog-section no-p">
|
||||
<div class="form-group">
|
||||
<div class="input-group">
|
||||
<input class="input no-b w-3 b-r m-r-60" type="url" placeholder="Url"
|
||||
v-on="keydown:create_link_on_selected_artifacts | key enter"
|
||||
v-model="insert_link_url">
|
||||
</div>
|
||||
|
||||
<button class="btn btn-transparent btn-icon absolute-bottom-right" v-show="selection_metrics.has_link" v-on="click:remove_link_from_selected_artifacts()">
|
||||
<span class="icon icon-link-open"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
88
views/partials/tool/metrics.html
Normal file
88
views/partials/tool/metrics.html
Normal file
@@ -0,0 +1,88 @@
|
||||
<h4 class="dialog-title">Metrics</h4>
|
||||
|
||||
<div id="metrics">
|
||||
<!-- <button class="btn btn-toggle btn-transparent btn-icon" ng-class="{alt:artifact_aspect_ratio=='locked'}">
|
||||
<span class="btn-option" ng-click="set_artifact_aspect_ratio($event,'locked')" >
|
||||
<span class="icon icon-lock-open"></span>
|
||||
</span>
|
||||
|
||||
<span class="btn-option" ng-click="set_artifact_aspect_ratio($event,'open')" >
|
||||
<span class="icon icon-lock-closed"></span>
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon number">1:1</span>
|
||||
</button> -->
|
||||
|
||||
<div class="dialog-section no-p-b no-p-h">
|
||||
<div class="input-couple">
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-right">Width</label>
|
||||
<input class="input no-b no-p text-right" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" ng-model="selection_metrics.w">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" sd-fader="y-encoder" sd-fader-var-y="selection_metrics.w" sd-fader-min-y="0" sd-fader-max-y="100000" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
<span class="times"> × </span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-left">Height</label>
|
||||
<input class="input no-b no-p text-left" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" ng-model="selection_metrics.h">
|
||||
<button class="input-drag btn btn-transparent btn-icon absolute-bottom-right" sd-fader="y-encoder" sd-fader-var-y="selection_metrics.h" sd-fader-min-y="0" sd-fader-max-y="100000" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="dialog-section no-p-b no-p-h">
|
||||
<div class="input-couple">
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-right">X Axis</label>
|
||||
<input class="input no-b no-p text-right" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" ng-model="selection_metrics.x1">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" sd-fader="y-encoder" sd-fader-var-y="selection_metrics.x1" sd-fader-min-y="0" sd-fader-max-y="100000" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-left">Y Axis</label>
|
||||
<input class="input no-b no-p text-left" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" ng-model="selection_metrics.y1">
|
||||
<button class="input-drag btn btn-transparent btn-icon absolute-bottom-right" sd-fader="y-encoder" sd-fader-var-y="selection_metrics.y1" sd-fader-min-y="0" sd-fader-max-y="100000" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--div id="transform-origin" class="dialog-section">
|
||||
<label class="label">Transform Origin</label>
|
||||
|
||||
<div class="transform-origin-icon">
|
||||
<label ng-class="{checked:transform_origin=='absolute-top-left'}" ng-click="set_transform_origin($event,'absolute-top-left')" class="radio only absolute-top-left"> <input type="radio" value="absolute-top-left"> </label>
|
||||
<label ng-class="{checked:transform_origin=='top-center'}" ng-click="set_transform_origin($event,'top-center')" class="radio only top-center"> <input type="radio" value="top-center"> </label>
|
||||
<label ng-class="{checked:transform_origin=='absolute-top-right'}" ng-click="set_transform_origin($event,'absolute-top-right')" class="radio only absolute-top-right"> <input type="radio" value="absolute-top-right"> </label>
|
||||
<label ng-class="{checked:transform_origin=='center-left'}" ng-click="set_transform_origin($event,'center-left')" class="radio only center-left"> <input type="radio" value="center-left"> </label>
|
||||
<label ng-class="{checked:transform_origin=='center-center'}" ng-click="set_transform_origin($event,'center-center')" class="radio only center-center"> <input type="radio" value="center-center"> </label>
|
||||
<label ng-class="{checked:transform_origin=='center-right'}" ng-click="set_transform_origin($event,'center-right')" class="radio only center-right"> <input type="radio" value="center-right"> </label>
|
||||
<label ng-class="{checked:transform_origin=='absolute-bottom-left'}" ng-click="set_transform_origin($event,'absolute-bottom-left')" class="radio only absolute-bottom-left"> <input type="radio" value="absolute-bottom-left"> </label>
|
||||
<label ng-class="{checked:transform_origin=='bottom-center'}" ng-click="set_transform_origin($event,'bottom-center')" class="radio only bottom-center"> <input type="radio" value="bottom-center"> </label>
|
||||
<label ng-class="{checked:transform_origin=='absolute-bottom-right'}" ng-click="set_transform_origin($event,'absolute-bottom-right')" class="radio only absolute-bottom-right"> <input type="radio" value="absolute-bottom-right"> </label>
|
||||
</div>
|
||||
</div-->
|
||||
</div>
|
||||
37
views/partials/tool/object-options.html
Normal file
37
views/partials/tool/object-options.html
Normal file
@@ -0,0 +1,37 @@
|
||||
<div class="dialog-section no-b no-p" v-if="active_space_loaded">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="delete_selected_artifacts()">
|
||||
<span class="icon icon-trash"></span>
|
||||
<span class="icon-label">[[__("delete")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-divider"></button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="toggle_lock_of_selected_artifacts()" v-if="active_space_role=='admin'">
|
||||
<span class="icon icon-lock-closed"></span>
|
||||
<span class="icon-label">[[__("lock")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="toggle_lock_of_selected_artifacts()" v-if="active_space_role=='admin'">
|
||||
<span class="icon icon-lock-open"></span>
|
||||
<span class="icon-label">[[__("unlock")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="duplicate_selected_artifacts()">
|
||||
<span class="icon icon-duplicate"></span>
|
||||
<span class="icon-label">[[__("copy")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="create_link_on_selected_artifacts()">
|
||||
<span class="icon icon-link"></span>
|
||||
<span class="icon-label">[[__("link")]]</span>
|
||||
</button>
|
||||
|
||||
<span v-if="first_selected_artifact">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="download_selected_artifacts()" v-if="selection_metrics.count==1 && first_selected_artifact.payload_uri">
|
||||
<span class="icon icon-download"></span>
|
||||
<span class="icon-label">[[__("download")]]</span>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
24
views/partials/tool/object.html
Normal file
24
views/partials/tool/object.html
Normal file
@@ -0,0 +1,24 @@
|
||||
<div id="sections">
|
||||
<h4 class="dialog-title">Selection</h4>
|
||||
|
||||
<div class="dialog-section no-p no-b">
|
||||
<button class="btn btn-transparent btn-block " v-on="click: add_section('grid',-1)">
|
||||
<span style="margin: 7px" class="icon absolute-left icon-md icon-grid-free"></span>
|
||||
<span class="icon-label">Grid</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p">
|
||||
<button class="btn btn-transparent btn-block " v-on="click: add_section('board',-1)">
|
||||
<span style="margin: 7px" class="icon absolute-left icon-md icon-cluster"></span>
|
||||
<span class="icon-label">Canvas</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p">
|
||||
<button class="btn btn-transparent btn-block " v-on="click: add_section('article',-1)">
|
||||
<span style="margin: 7px" class="icon absolute-left icon-md icon-text-align-left"></span>
|
||||
<span class="icon-label">Article</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
48
views/partials/tool/pattern.html
Normal file
48
views/partials/tool/pattern.html
Normal file
@@ -0,0 +1,48 @@
|
||||
<h4 class="dialog-title">Pattern</h4>
|
||||
|
||||
<div id="pattern">
|
||||
<div class="dialog-section">
|
||||
<label class="file btn btn-md btn-block btn-transparent" style="margin-bottom:2px">
|
||||
<input type="file" >
|
||||
Upload Image
|
||||
</label>
|
||||
<div class="dropdown dropdown-block" drop-down>
|
||||
<button type="button" class="btn btn-transparent btn-md btn-block btn-dropdown" data-toggle="dropdown">Repeat X-Axis</button>
|
||||
<div class="dropdown-menu center" role="menu">
|
||||
<ul class="select-list medium">
|
||||
<li><span>Repeat X-Axis</span></li>
|
||||
<li><span>Repeat Y-Axis</span></li>
|
||||
<li><span>Repeat Both-Axis</span></li>
|
||||
<li><span>Don't Repeat</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="background-position" class="dialog-section">
|
||||
<label class="label">Pattern Position</label>
|
||||
|
||||
<div class="position-icon">
|
||||
<label ng-class="{checked:pattern_position=='absolute-top-left'}" ng-click="set_pattern_position($event,'absolute-top-left')" class="radio only absolute-top-left"> <input type="radio" value="absolute-top-left"> </label>
|
||||
<label ng-class="{checked:pattern_position=='top-center'}" ng-click="set_pattern_position($event,'top-center')" class="radio only top-center"> <input type="radio" value="top-center"> </label>
|
||||
<label ng-class="{checked:pattern_position=='absolute-top-right'}" ng-click="set_pattern_position($event,'absolute-top-right')" class="radio only absolute-top-right"> <input type="radio" value="absolute-top-right"> </label>
|
||||
<label ng-class="{checked:pattern_position=='center-left'}" ng-click="set_pattern_position($event,'center-left')" class="radio only center-left"> <input type="radio" value="center-left"> </label>
|
||||
<label ng-class="{checked:pattern_position=='center-center'}" ng-click="set_pattern_position($event,'center-center')" class="radio only center-center"> <input type="radio" value="center-center"> </label>
|
||||
<label ng-class="{checked:pattern_position=='center-right'}" ng-click="set_pattern_position($event,'center-right')" class="radio only center-right"> <input type="radio" value="center-right"> </label>
|
||||
<label ng-class="{checked:pattern_position=='absolute-bottom-left'}" ng-click="set_pattern_position($event,'absolute-bottom-left')" class="radio only absolute-bottom-left"> <input type="radio" value="absolute-bottom-left"> </label>
|
||||
<label ng-class="{checked:pattern_position=='bottom-center'}" ng-click="set_pattern_position($event,'bottom-center')" class="radio only bottom-center"> <input type="radio" value="bottom-center"> </label>
|
||||
<label ng-class="{checked:pattern_position=='absolute-bottom-right'}" ng-click="set_pattern_position($event,'absolute-bottom-right')" class="radio only absolute-bottom-right"> <input type="radio" value="absolute-bottom-right"> </label>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section p-20">
|
||||
<div class="form-group">
|
||||
<label class="label label-range">Size</label>
|
||||
<div class="range-wrapper">
|
||||
<output for="crop" value="50">50</output>
|
||||
<input type="range" name="crop" min="0" max="100" value="50">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
12
views/partials/tool/pick-mobile.html
Normal file
12
views/partials/tool/pick-mobile.html
Normal file
@@ -0,0 +1,12 @@
|
||||
<div id="pick-mobile" v-if="active_space" class="dialog-section" v-show="opened_dialog=='mobile'">
|
||||
<h4 class="dialog-title">Mobile Upload</h4>
|
||||
|
||||
<img v-if="active_space.edit_hash" v-bind:src="'/api/helper/qrcode/'+ active_space._id" />
|
||||
|
||||
<p class="text-center">
|
||||
Install the Spacedeck App on your phone and scan this QR code to upload photos, sound, video or text.
|
||||
<p>
|
||||
<p class="text-center">
|
||||
Access Code: {{active_space.edit_hash}}
|
||||
</p>
|
||||
</div>
|
||||
70
views/partials/tool/search.html
Normal file
70
views/partials/tool/search.html
Normal file
@@ -0,0 +1,70 @@
|
||||
<div id="search" class="relative w-8" style="height:350px">
|
||||
<ul class="dialog-side-tabs">
|
||||
<li>
|
||||
<button class="btn btn-xl btn-transparent btn-icon-labeled hover" v-class="active:media_search_target=='google'" v-on="click:search_google(generic_search_query)">
|
||||
<span class="icon icon-social-google"></span>
|
||||
<span class="icon-label">Google</span>
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button class="btn btn-xl btn-transparent btn-icon-labeled hover" v-class="active:media_search_target=='youtube'" v-on="click:search_youtube(generic_search_query)">
|
||||
<span class="icon icon-social-youtube"></span>
|
||||
<span class="icon-label">Youtube</span>
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button class="btn btn-xl btn-transparent btn-icon-labeled hover" v-class="active:media_search_target=='tumblr'" v-on="click:search_tumblr(generic_search_query)">
|
||||
<span class="icon icon-social-tumblr"></span>
|
||||
<span class="icon-label">Tumblr</span>
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button class="btn btn-xl btn-transparent btn-icon-labeled hover" v-class="active:media_search_target=='soundcloud'" v-on="click:search_soundcloud(generic_search_query)">
|
||||
<span class="icon icon-social-soundcloud"></span>
|
||||
<span class="icon-label">Soundcloud</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="dialog-search-input">
|
||||
<!-- generic search box placeholder -->
|
||||
<div class="relative">
|
||||
<span class="icon icon-zoom absolute-top-left no-events" style="margin-top: -2px;"></span>
|
||||
<input type="text" v-model="generic_search_query" v-focus class="input input-white input-round input-block no-b p-l-60" placeholder="[[__("search_media_placeholder")]]" v-on="keyup: search_generic(generic_search_query) | key enter">
|
||||
</div>
|
||||
|
||||
<!-- <button type="button" class="btn btn-sm btn-icon btn-round btn-darken absolute-top-right clear-search" style="margin-right: 42px; margin-top: 40px;">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
</button> -->
|
||||
</div>
|
||||
|
||||
<div class="overflow-y-scroll fit dialog-search-results dialog-section" v-if="search_loading">
|
||||
<span class="middle">Searching...</span>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- search results audio -->
|
||||
<div class="overflow-y-scroll fit dialog-search-results dialog-section" v-if="audio_search_results.length">
|
||||
<div class="search-result search-result-audio relative" v-repeat="r : audio_search_results" v-on="click:create_artifact_via_embed_url(r.permalink_url)">
|
||||
<iframe frameborder="0" seamless width="100%" v-attr="src:r.embed_url"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- search results images -->
|
||||
<div class="overflow-y-scroll fit dialog-search-results dialog-section" v-if="image_search_results.length">
|
||||
<div class="search-result search-result-image" v-repeat="r : image_search_results" v-on="click:handle_insert_image_url(r.link)">
|
||||
<img v-attr="src:r.thumb"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- search results video -->
|
||||
<div class="overflow-y-scroll fit dialog-search-results dialog-section" v-if="video_search_results.length">
|
||||
<div class="search-result search-result-video relative" v-repeat="r : video_search_results" v-on="click:create_artifact_via_embed_url('https://youtube.com/?v='+r.id.videoId)">
|
||||
|
||||
<div class="thumbnail" v-style="background-image: 'url(https://img.youtube.com/vi/'+r.id.videoId+'/hqdefault.jpg)'"> </div>
|
||||
<span>{{r.snippet.title}}</span>
|
||||
<!-- <span>{{r.snippet.description}}</span> -->
|
||||
<!-- <span>{{r.snippet.thumbnails.medium.url}}</span> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
31
views/partials/tool/selection.html
Normal file
31
views/partials/tool/selection.html
Normal file
@@ -0,0 +1,31 @@
|
||||
<div id="sections">
|
||||
<h4 class="dialog-title">Selection</h4>
|
||||
|
||||
<div class="dialog-section no-p no-b">
|
||||
<button class="btn btn-transparent btn-block" v-on:click="toggle_selected_artifact_editing()" v-bind:class="active:editing_artifact_id">
|
||||
<span style="margin: 7px" class="icon absolute-left icon-md icon-pencil"></span>
|
||||
<span class="icon-label">Edit</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p">
|
||||
<button class="btn btn-transparent btn-block">
|
||||
<span style="margin: 7px" class="icon absolute-left icon-md icon-group"></span>
|
||||
<span class="icon-label">Group</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p">
|
||||
<button class="btn btn-transparent btn-block" >
|
||||
<span style="margin: 7px" class="icon absolute-left icon-md icon-duplicate"></span>
|
||||
<span class="icon-label">Copy</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p">
|
||||
<button class="btn btn-transparent btn-block" v-on:click="delete_selected_artifacts()">
|
||||
<span style="margin: 7px" class="icon absolute-left icon-md icon-trash"></span>
|
||||
<span class="icon-label">Delete</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
69
views/partials/tool/shapes.html
Normal file
69
views/partials/tool/shapes.html
Normal file
@@ -0,0 +1,69 @@
|
||||
<h4 class="dialog-title">[[__("tool_shape")]]</h4>
|
||||
|
||||
<div id="shapes">
|
||||
<div class="dialog-section no-p-h" style="white-space: normal;">
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('ellipse',$event)">
|
||||
<span class="icon icon-shape-circle"></span>
|
||||
<span class="icon-label">[[__("tool_circle")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('hexagon',$event)">
|
||||
<span class="icon icon-shape-hexagon"></span>
|
||||
<span class="icon-label">[[__("tool_hexagon")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('square',$event)">
|
||||
<span class="icon icon-shape-square"></span>
|
||||
<span class="icon-label">[[__("tool_square")]]</span>
|
||||
</button>
|
||||
|
||||
<!--button class="btn btn-icon-labeled btn-transparent rot45" v-on:click="add_shape('diamond',$event)">
|
||||
<span class="icon icon-shape-square"></span>
|
||||
<span class="icon-label">[[__("tool_diamond")]]</span>
|
||||
</button-->
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('speechbubble',$event)">
|
||||
<span class="icon icon-shape-bubble"></span>
|
||||
<span class="icon-label">[[__("tool_bubble")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('cloud',$event)">
|
||||
<span class="icon icon-shape-cloud"></span>
|
||||
<span class="icon-label">[[__("tool_cloud")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('burst',$event)">
|
||||
<span class="icon icon-shape-burst"></span>
|
||||
<span class="icon-label">[[__("tool_burst")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('star',$event)">
|
||||
<span class="icon icon-shape-star"></span>
|
||||
<span class="icon-label">[[__("tool_star")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="add_shape('heart',$event)">
|
||||
<span class="icon icon-shape-heart"></span>
|
||||
<span class="icon-label">[[__("tool_heart")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_arrow()">
|
||||
<span class="icon icon-tool-arrow"></span>
|
||||
<span class="icon-label">[[__("tool_arrow")]]</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_line()">
|
||||
<span class="icon icon-tool-line"></span>
|
||||
<span class="icon-label">[[__("tool_line")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--
|
||||
<div class="dialog-section no-p">
|
||||
<div class="btn-cluster">
|
||||
<button class="btn btn-transparent text-center"> Upload </button>
|
||||
<button class="btn btn-transparent text-center" v-on:click="start_drawing_scribble()"> Draw </button>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
19
views/partials/tool/share.html
Normal file
19
views/partials/tool/share.html
Normal file
@@ -0,0 +1,19 @@
|
||||
<!-- <h4 class="dialog-title">Share</h4> -->
|
||||
|
||||
<div class="dialog-section no-p">
|
||||
<a class="btn btn-transparent btn-icon-labeled hover" href="http://www.facebook.com/sharer.php?u={{share_base_url_enc}}{{active_space._id}}">
|
||||
<span class="icon icon-social-square-facebook"> </span>
|
||||
<span class="icon-label"> facebook </span>
|
||||
</a>
|
||||
<a class="btn btn-transparent btn-icon-labeled hover" target="_blank" href="https://twitter.com/intent/tweet?url={{share_base_url_enc}}{{active_space._id}}">
|
||||
<span class="icon icon-social-twitter"> </span>
|
||||
<span class="icon-label"> twitter </span>
|
||||
</a>
|
||||
<a class="btn btn-transparent btn-icon-labeled hover email" target="_blank" href="mailto:?subject=Check out my new Space&body={{share_base_url_enc}}{{active_space._id}}">
|
||||
<span class="icon icon-mail"> </span>
|
||||
<span class="icon-label"> email </span>
|
||||
</a>
|
||||
<hr>
|
||||
<h4 class="dialog-title">Share via Link</h4>
|
||||
<span class="input no-b" style="height:auto;padding:15px">{{share_base_url+active_space._id}}</span>
|
||||
</div>
|
||||
110
views/partials/tool/size.html
Normal file
110
views/partials/tool/size.html
Normal file
@@ -0,0 +1,110 @@
|
||||
<h4 class="dialog-title">Size</h4>
|
||||
|
||||
<div>
|
||||
|
||||
<div class="dialog-section no-p-b no-p-h">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon icon-size-vertical"></span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon icon-size-both"></span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon icon-size-horizontal"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p">
|
||||
<!-- <button class="btn btn-toggle btn-transparent btn-icon" ng-class="{alt:artifact_aspect_ratio=='locked'}">
|
||||
<span class="btn-option" ng-click="set_artifact_aspect_ratio($event,'locked')" >
|
||||
<span class="icon icon-lock-open"></span>
|
||||
</span>
|
||||
<span class="btn-option" ng-click="set_artifact_aspect_ratio($event,'open')" >
|
||||
<span class="icon icon-lock-closed"></span>
|
||||
</span>
|
||||
</button> -->
|
||||
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon number">1:1</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon number">Auto</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p-b no-p-h">
|
||||
<div class="input-couple">
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-right">Width</label>
|
||||
<input class="input no-b no-p text-right" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" ng-model="selection_metrics.w">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" sd-fader="y-encoder" sd-fader-var-y="selection_metrics.w" sd-fader-min-y="0" sd-fader-max-y="100000" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
<span class="times"> × </span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-left">Height</label>
|
||||
<input class="input no-b no-p text-left" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" ng-model="selection_metrics.h">
|
||||
<button class="input-drag btn btn-transparent btn-icon absolute-bottom-right" sd-fader="y-encoder" sd-fader-var-y="selection_metrics.h" sd-fader-min-y="0" sd-fader-max-y="100000" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="dialog-section no-p-b no-p-h hidden">
|
||||
<div class="input-couple">
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-right">X Axis</label>
|
||||
<input class="input no-b no-p text-right" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" ng-model="selection_metrics.x1">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" sd-fader="y-encoder" sd-fader-var-y="selection_metrics.x1" sd-fader-min-y="0" sd-fader-max-y="100000" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-left">Y Axis</label>
|
||||
<input class="input no-b no-p text-left" spellcheck="false" type="text" value="0" pattern="[0-9]" maxlength="6" ng-model="selection_metrics.y1">
|
||||
<button class="input-drag btn btn-transparent btn-icon absolute-bottom-right" sd-fader="y-encoder" sd-fader-var-y="selection_metrics.y1" sd-fader-min-y="0" sd-fader-max-y="100000" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<!-- <span class="input-unit">px</span> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--div id="transform-origin" class="dialog-section">
|
||||
<label class="label">Transform Origin</label>
|
||||
|
||||
<div class="transform-origin-icon">
|
||||
<label ng-class="{checked:transform_origin=='absolute-top-left'}" ng-click="set_transform_origin($event,'absolute-top-left')" class="radio only absolute-top-left"> <input type="radio" value="absolute-top-left"> </label>
|
||||
<label ng-class="{checked:transform_origin=='top-center'}" ng-click="set_transform_origin($event,'top-center')" class="radio only top-center"> <input type="radio" value="top-center"> </label>
|
||||
<label ng-class="{checked:transform_origin=='absolute-top-right'}" ng-click="set_transform_origin($event,'absolute-top-right')" class="radio only absolute-top-right"> <input type="radio" value="absolute-top-right"> </label>
|
||||
<label ng-class="{checked:transform_origin=='center-left'}" ng-click="set_transform_origin($event,'center-left')" class="radio only center-left"> <input type="radio" value="center-left"> </label>
|
||||
<label ng-class="{checked:transform_origin=='center-center'}" ng-click="set_transform_origin($event,'center-center')" class="radio only center-center"> <input type="radio" value="center-center"> </label>
|
||||
<label ng-class="{checked:transform_origin=='center-right'}" ng-click="set_transform_origin($event,'center-right')" class="radio only center-right"> <input type="radio" value="center-right"> </label>
|
||||
<label ng-class="{checked:transform_origin=='absolute-bottom-left'}" ng-click="set_transform_origin($event,'absolute-bottom-left')" class="radio only absolute-bottom-left"> <input type="radio" value="absolute-bottom-left"> </label>
|
||||
<label ng-class="{checked:transform_origin=='bottom-center'}" ng-click="set_transform_origin($event,'bottom-center')" class="radio only bottom-center"> <input type="radio" value="bottom-center"> </label>
|
||||
<label ng-class="{checked:transform_origin=='absolute-bottom-right'}" ng-click="set_transform_origin($event,'absolute-bottom-right')" class="radio only absolute-bottom-right"> <input type="radio" value="absolute-bottom-right"> </label>
|
||||
</div>
|
||||
</div-->
|
||||
</div>
|
||||
68
views/partials/tool/stroke.html
Normal file
68
views/partials/tool/stroke.html
Normal file
@@ -0,0 +1,68 @@
|
||||
<h4 class="dialog-title">Stroke</h4>
|
||||
|
||||
<div id="stroke">
|
||||
<div class="dialog-section no-p">
|
||||
<div class="form-group no-m">
|
||||
<input class="input no-b no-p text-center text-large" spellcheck="false" type="number" v-model="active_style.stroke">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" v-sd-fader="true" sd-fader-var-y="active_style.stroke" sd-fader-min-y="0" sd-fader-max-y="100" sd-fader-step="1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p-h no-p-b" v-show="selection_metrics.borders_stylable">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm">Border Radius</label>
|
||||
<input class="input no-b no-p text-center" spellcheck="false" type="number" v-model="active_style.border_radius">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" v-sd-fader="true" sd-fader-var-y="active_style.border_radius" sd-fader-min-y="0" sd-fader-max-y="500" sd-fader-step="1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="style" class="dialog-section no-p-h no-p-b" v-show="selection_metrics.borders_stylable">
|
||||
<div class="form-group">
|
||||
<label class="label label-sm">Border Style</label>
|
||||
<div class="btn-group center">
|
||||
<button class="btn btn-transparent btn-icon" v-on="click:set_artifact_style_prop('stroke_style','solid')">
|
||||
<span class="icon icon-border-solid"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on="click:set_artifact_style_prop('stroke_style','dashed')">
|
||||
<span class="icon icon-border-dashed"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on="click:set_artifact_style_prop('stroke_style','dotted')">
|
||||
<span class="icon icon-border-dotted"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="dialog-section">
|
||||
<label class="btn btn-sm btn-round color-indicator" style="background-color:{{active_style.stroke_color}}"><input type="color" v-model="active_style.stroke_color" style="display:block;visibility:hidden;position:absolute;"></label>
|
||||
</div>
|
||||
-->
|
||||
<div class="dialog-section no-p">
|
||||
<button class="btn btn-transparent btn-block text-center" v-on="click:reset_stroke()">Remove Stroke</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!--div id="style" class="dialog-section">
|
||||
<div class="form-group">
|
||||
<label class="label label-sm">Arrow Head</label>
|
||||
<div class="btn-group center">
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon icon-chevron-up-4"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon icon-shape-triangle"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon">
|
||||
<span class="icon icon-moon-new"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div-->
|
||||
|
||||
28
views/partials/tool/text-align.html
Normal file
28
views/partials/tool/text-align.html
Normal file
@@ -0,0 +1,28 @@
|
||||
<div class="dialog-section no-b no-p">
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="set_artifact_style_prop('align','left')">
|
||||
<span class="icon icon-text-align-left-alt"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="set_artifact_style_prop('align','center')">
|
||||
<span class="icon icon-text-align-center-alt"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="set_artifact_style_prop('align','right')">
|
||||
<span class="icon icon-text-align-right-alt"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="set_artifact_style_prop('align','justify')">
|
||||
<span class="icon icon-text-align-justify-alt"></span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-divider"></button>
|
||||
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="set_artifact_style_prop('valign','top')">
|
||||
<span class="icon icon-align-vertical-top"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="set_artifact_style_prop('valign','middle')">
|
||||
<span class="icon icon-align-vertical-middle"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on:click="set_artifact_style_prop('valign','bottom')">
|
||||
<span class="icon icon-align-vertical-bottom"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
25
views/partials/tool/text-columns.html
Normal file
25
views/partials/tool/text-columns.html
Normal file
@@ -0,0 +1,25 @@
|
||||
<h4 class="dialog-title">Columns</h4>
|
||||
|
||||
<div id="type-columns" class="relative">
|
||||
<div class="dialog-section no-p">
|
||||
<div class="form-group no-m">
|
||||
<!-- <label class="label label-sm">Columns</label> -->
|
||||
<input class="input no-b no-p text-center text-large" spellcheck="false" type="text" pattern="[0-9]" maxlength="10" v-model="active_style.columns">
|
||||
|
||||
<button class="btn-more btn btn-icon btn-transparent" v-on="click:increase_columns()"> </button>
|
||||
<button class="btn-less btn btn-icon btn-transparent" v-on="click:decrease_columns()"> </button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p-b no-p-h">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm text-center">Gutter</label>
|
||||
<input class="input no-b no-p text-center" spellcheck="false" type="text" pattern="[0-9\.]" maxlength="3" v-model="active_style.gutter">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" style="cursor: ns-resize;" v-sd-fader="true" sd-fader-var-y="active_style.gutter" sd-fader-min-y="0" sd-fader-max-y="200" sd-fader-step="1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
13
views/partials/tool/text-digits.html
Normal file
13
views/partials/tool/text-digits.html
Normal file
@@ -0,0 +1,13 @@
|
||||
<div id="typography" class="relative">
|
||||
|
||||
<div id="font">
|
||||
<ul class="select-list overflow-y-scroll" style="max-height:315px;width:240px">
|
||||
<li v-bind:class="{checked:active_font==font}"
|
||||
v-for="font in fonts"
|
||||
v-on:mousedown="apply_font($event,font)"
|
||||
v-on:touchstart="apply_font($event,font)">
|
||||
<span v-bind:style="{'font-family': font}">{{font}}</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
20
views/partials/tool/text-formats.html
Normal file
20
views/partials/tool/text-formats.html
Normal file
@@ -0,0 +1,20 @@
|
||||
<h4 class="dialog-title">[[__("text_formats")]]</h4>
|
||||
|
||||
<ul class="select-list overflow-y-scroll" style="min-width: 200px;">
|
||||
<li id="note-format-div" v-on="mousedown:apply_formatting($event, 'p')"> <span>[[__("format_p")]]</span> </li>
|
||||
<li id="note-format-ul" v-on="mousedown:apply_formatting($event, 'insertunorderedlist')"> <span>[[__("format_bullets")]]</span> </li>
|
||||
<li id="note-format-ol" v-on="mousedown:apply_formatting($event, 'insertorderedlist')"> <span>[[__("format_numbers")]]</span> </li>
|
||||
<li id="note-format-h1" v-on="mousedown:apply_formatting($event, 'h1')"> <span>[[__("format_h1")]]</span> </li>
|
||||
<li id="note-format-h2" v-on="mousedown:apply_formatting($event, 'h2')"> <span>[[__("format_h2")]]</span> </li>
|
||||
<li id="note-format-h3" v-on="mousedown:apply_formatting($event, 'h3')"> <span>[[__("format_h3")]]</span> </li>
|
||||
</ul>
|
||||
|
||||
<!--
|
||||
<div class="dialog-section no-p noflex">
|
||||
<button class="btn btn-transparent btn-block text-center"> Create New </button>
|
||||
<div class="btn-cluster">
|
||||
<button class="btn btn-transparent text-center"> Save </button>
|
||||
<button class="btn btn-transparent btn-block text-center"> Delete </button>
|
||||
</div>
|
||||
</div>
|
||||
-->
|
||||
29
views/partials/tool/text-styles.html
Normal file
29
views/partials/tool/text-styles.html
Normal file
@@ -0,0 +1,29 @@
|
||||
|
||||
<div class="dialog-section no-b no-p">
|
||||
<div class="btn-group">
|
||||
<!-- <button class="btn btn-transparent btn-icon" ng-click="apply_formatting('caps')">
|
||||
<span class="icon icon-text-allcaps"></span>
|
||||
</button> -->
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="apply_formatting($event,'bold')">
|
||||
<span class="icon icon-text-bold"></span>
|
||||
<span class="icon-label">Bold</span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="apply_formatting($event,'italic')">
|
||||
<span class="icon icon-text-italic"></span>
|
||||
<span class="icon-label">Italic</span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="apply_formatting($event,'underline')">
|
||||
<span class="icon icon-text-underline"></span>
|
||||
<span class="icon-label">Underl.</span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="apply_formatting($event,'strikeThrough')">
|
||||
<span class="icon icon-text-strike"></span>
|
||||
<span class="icon-label">Strike</span>
|
||||
</button>
|
||||
|
||||
<!--button class="btn btn-transparent btn-icon-labeled" v-on:click="apply_formatting($event,'insertUnorderedList')">
|
||||
<span class="icon icon-text-list-bullet"></span>
|
||||
<span class="icon-label">Bullets</span>
|
||||
</button-->
|
||||
</div>
|
||||
</div>
|
||||
101
views/partials/tool/textbox.html
Normal file
101
views/partials/tool/textbox.html
Normal file
@@ -0,0 +1,101 @@
|
||||
<h4 class="dialog-title">Textframe</h4>
|
||||
|
||||
<div id="text-frame">
|
||||
<div class="dialog-section no-p-b">
|
||||
<label class="label label-sm">Vertical Alignment</label>
|
||||
<div class="btn-group">
|
||||
<button class="btn btn-transparent btn-icon" v-on="click:set_artifact_style_prop('valign','top')" ng-class="{active:selected_artifact.align=='top'}">
|
||||
<span class="icon icon-align-vertical-top"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on="click:set_artifact_style_prop('valign','middle')" ng-class="{active:selected_artifact.align=='middle'}">
|
||||
<span class="icon icon-align-vertical-middle"></span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon" v-on="click:set_artifact_style_prop('valign','bottom')" ng-class="{active:selected_artifact.align=='bottom'}">
|
||||
<span class="icon icon-align-vertical-bottom"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p-b no-p-h">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm">Padding</label>
|
||||
<input class="input no-b no-p text-center" spellcheck="false" type="text" pattern="[0-9]" maxlength="64" value="250" v-model="active_style.padding">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" style="cursor: ns-resize;" v-sd-fader="true" sd-fader-var-y="active_style.padding" sd-fader-min-y="0" sd-fader-max-y="500" sd-fader-step="1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="dialog-section">
|
||||
<label class="btn btn-sm btn-round color-indicator" style="background-color:{{active_style.fill_color}};pointer-events:all"><input type="color" v-model="active_style.fill_color" style="display:block;visibility:hidden;position:absolute;"></label>
|
||||
</div>
|
||||
|
||||
<!--div class="dialog-section no-p-b no-p-h">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm">Columns</label>
|
||||
<input class="input no-b no-p text-center" spellcheck="false" type="text" pattern="[0-9]" maxlength="64" value="5">
|
||||
|
||||
<button class="btn-more btn btn-icon btn-transparent"> </button>
|
||||
<button class="btn-less btn btn-icon btn-transparent"> </button>
|
||||
</div>
|
||||
</div-->
|
||||
|
||||
<!--div class="dialog-section no-p-b no-p-h">
|
||||
<div class="form-group no-m">
|
||||
<label class="label label-sm">Gutter</label>
|
||||
<input class="input no-b no-p text-center" spellcheck="false" type="text" pattern="[0-9]" maxlength="64" value="50">
|
||||
<button tabindex="-1" class="input-drag btn btn-transparent btn-icon" style="cursor: ns-resize;">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
<span class="input-unit">px</span>
|
||||
</div>
|
||||
</div-->
|
||||
|
||||
<!-- <div id="padding" class="dialog-section">
|
||||
<label class="label label-sm">Padding</label>
|
||||
|
||||
<div class="padding-icon">
|
||||
|
||||
<button id="padding-link" class="btn btn-md btn-toggle btn-dark btn-icon" ng-class="{alt:!padding_locked}" ng-click="toggle_padding_locked()">
|
||||
<span class="btn-option">
|
||||
<span class="icon icon-link-closed"></span>
|
||||
</span>
|
||||
|
||||
<span class="btn-option">
|
||||
<span class="icon icon-link-open"></span>
|
||||
</span>
|
||||
</button>
|
||||
|
||||
<div class="left">
|
||||
<input class="input" spellcheck="false" type="text" v-model="active_style.padding_left" value="0" style="cursor: ew-resize;">
|
||||
<button class="input-drag btn btn-md btn-transparent btn-icon" sd-fader="y-encoder" sd-fader-var-y="active_style.padding_left" sd-fader-min-y="0" sd-fader-max-y="500" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="right">
|
||||
<input class="input" spellcheck="false" type="text" v-model="active_style.padding_right" value="0" style="cursor: ew-resize;">
|
||||
<button class="input-drag btn btn-md btn-transparent btn-icon" sd-fader="y-encoder" sd-fader-var-y="active_style.padding_left" sd-fader-min-y="0" sd-fader-max-y="500" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="top">
|
||||
<input class="input" spellcheck="false" type="text" v-model="active_style.padding_top" value="0" style="cursor: ns-resize;">
|
||||
<button class="input-drag btn btn-md btn-transparent btn-icon" sd-fader="y-encoder" sd-fader-var-y="active_style.padding_top" sd-fader-min-y="0" sd-fader-max-y="500" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="bottom">
|
||||
<input class="input" spellcheck="false" type="text" v-model="active_style.padding_bottom" value="0" style="cursor: ns-resize;">
|
||||
<button class="input-drag btn btn-md btn-transparent btn-icon" sd-fader="y-encoder" sd-fader-var-y="active_style.padding_bottom" sd-fader-min-y="0" sd-fader-max-y="500" sd-fader-step="0.1">
|
||||
<span class="icon icon-triangles-vertical"></span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
</div>
|
||||
110
views/partials/tool/toolbar-elements.html
Normal file
110
views/partials/tool/toolbar-elements.html
Normal file
@@ -0,0 +1,110 @@
|
||||
<div class="toolbar toolbar-elements" v-bind:class="{in:toolbar_artifacts_in,out:!toolbar_artifacts_in}" v-show="!is_active_space_role('viewer') && active_space_loaded" v-bind:style="{left:toolbar_artifacts_x,top:toolbar_artifacts_y}">
|
||||
|
||||
<div class="btn-group dark">
|
||||
|
||||
<!--div id="search-dialog" class="dropdown bottom light center static" v-bind:class="{open:opened_dialog=='search'}">
|
||||
<div class="btn-collapse in">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='search'}" v-on:click="open_dialog('search')" >
|
||||
<span class="icon icon-search"></span>
|
||||
<span class="icon-label">[[__("tool_search")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog dialog-search">
|
||||
xinclude "./search.html"
|
||||
</div>
|
||||
</div-->
|
||||
|
||||
<div class="dropdown bottom light center" v-bind:class="{open:opened_dialog=='shapes'}">
|
||||
<div class="btn-collapse in">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='shapes'}" v-on:click="open_dialog('shapes')">
|
||||
<span class="icon icon-shapes"></span>
|
||||
<span class="icon-label">[[__("tool_shape")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./shapes.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-icon-labeled btn-transparent" v-on:click="start_drawing_scribble()">
|
||||
<span class="icon icon-tool-scribble"></span>
|
||||
<span class="icon-label">[[__("tool_scribble")]]</span>
|
||||
</button>
|
||||
|
||||
<div class="dropdown bottom light center">
|
||||
<div class="btn-collapse in">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="handle_insert_image_url()" v-on:touchstart="handle_insert_image_url()">
|
||||
<span class="icon icon-upload"></span>
|
||||
<span class="icon-label" >[[__("tool_upload")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dropdown bottom light center">
|
||||
<div class="btn-collapse in">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click=" add_artifact(active_space, 'text', null, $event)">
|
||||
<span class="icon icon-tool-text"></span>
|
||||
<span class="icon-label">[[__("tool_text")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dropdown bottom light center">
|
||||
<div class="btn-collapse">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='image'}" v-on:click="open_dialog('image')">
|
||||
<span class="icon icon-picture"></span>
|
||||
<span class="icon-label">[[__("image")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./image.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dropdown bottom light center" v-bind:class="{open:opened_dialog=='zones'}">
|
||||
<div class="btn-collapse in">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='zones'}" v-on:click="open_dialog('zones')">
|
||||
<span class="icon icon-zone"></span>
|
||||
<span class="icon-label">[[__("tool_zones")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./zones.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="mobile-dialog" class="dropdown bottom light center static" v-bind:class="{open:opened_dialog=='mobile'}">
|
||||
<div class="btn-collapse in">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='mobile'}" v-on:click="open_dialog('mobile')" >
|
||||
<span class="icon icon-device-mobile"></span>
|
||||
<span class="icon-label">[[__("mobile")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog mobile-search">
|
||||
{% include "./pick-mobile.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-divider" v-show="logged_in"></button>
|
||||
|
||||
<div class="dropdown bottom light center" v-show="logged_in" v-bind:class="{open:opened_dialog=='background'}">
|
||||
<div class="btn-collapse in">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='background'}" v-on:click="open_dialog('background')">
|
||||
<span class="letter">bg</span>
|
||||
<span class="icon-label">[[__("tool_canvas")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./background.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
46
views/partials/tool/toolbar-object-options.html
Normal file
46
views/partials/tool/toolbar-object-options.html
Normal file
@@ -0,0 +1,46 @@
|
||||
<div class="toolbar toolbar-object-options" v-show="(active_space && (active_view == 'space' && !is_active_space_role('viewer')))" v-bind:class="in:(selection_metrics.count>0)">
|
||||
|
||||
<div class="btn-group dark">
|
||||
<div class="btn-group">
|
||||
<div class="btn-collapse" v-bind:class="in : opened_dialog == 'delete_artifact'">
|
||||
<button class="btn btn-green btn-icon-labeled hover" v-on="click : delete_selected_artifacts()">
|
||||
<span class="icon icon-check"></span>
|
||||
<span class="icon-label">Okay</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-collapse" v-bind:class="in : opened_dialog == 'delete_artifact' , last : opened_dialog == 'delete_artifact'">
|
||||
<button class="btn btn-red btn-icon-labeled hover" v-on="click : open_dialog('delete_artifact')">
|
||||
<span class="icon icon-cross-3"></span>
|
||||
<span class="icon-label">Cancel</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-collapse" v-bind:class="in : opened_dialog != 'delete_artifact' , first : opened_dialog != 'delete_artifact'">
|
||||
<button class="btn btn-dark btn-icon-labeled hover" v-on="click : open_dialog('delete_artifact')">
|
||||
<span class="icon icon-trash"></span>
|
||||
<span class="icon-label">Delete</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btn-collapse" v-bind:class="in:selection_metrics.count<2">
|
||||
<button class="btn btn-transparent btn-icon-labeled hover" v-if="" v-on:click=" show_artifact_comments($event)" >
|
||||
<span class="icon icon-messages"></span>
|
||||
<span class="icon-label">Comment</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-transparent btn-icon-labeled hover" v-on:click="duplicate_selected_artifacts()">
|
||||
<span class="icon icon-duplicate"></span>
|
||||
<span class="icon-label">Copy</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-group dark">
|
||||
<button class="btn btn-transparent btn-icon-labeled hover" v-on:click="deselect(true)">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
<span class="icon-label">Cancel</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
130
views/partials/tool/toolbar-object.html
Normal file
130
views/partials/tool/toolbar-object.html
Normal file
@@ -0,0 +1,130 @@
|
||||
<div class="toolbar toolbar-properties" v-cloak v-show="active_space_loaded && !is_active_space_role('viewer')" v-bind:class="{in:toolbar_props_in,out:!toolbar_props_in}" v-bind:style="{left:toolbar_props_x,top:toolbar_props_y}" v-if="active_space_loaded">
|
||||
|
||||
<div class="btn-group dark">
|
||||
<div class="dropdown topleft light"
|
||||
v-bind:class="{open : opened_dialog.match('color') ,
|
||||
'option-1':opened_dialog=='color-fill' ,
|
||||
'option-2':opened_dialog=='color-stroke' ,
|
||||
'option-3':opened_dialog=='color-text',
|
||||
'options-3':selection_metrics.contains_text}">
|
||||
|
||||
<label
|
||||
class="dropdown-toggle btn btn-icon btn-transparent no-r-r"
|
||||
v-on:click="open_dialog('color-fill')"
|
||||
v-bind:class="{open:opened_dialog=='color-fill'}">
|
||||
<span class="icon icon-tool-fill icon-sm"></span>
|
||||
<span class="jewel" v-bind:style="{'background-color':active_style.fill_color}"></span>
|
||||
</label>
|
||||
<label
|
||||
class="dropdown-toggle btn btn-icon btn-transparent no-r"
|
||||
v-bind:class="{open:opened_dialog=='color-stroke'}"
|
||||
v-on:click="open_dialog('color-stroke')">
|
||||
<span class="icon icon-tool-stroke icon-sm"></span>
|
||||
<span class="jewel jewel-stroke" v-bind:style="{'border-color':active_style.stroke_color}"></span>
|
||||
</label>
|
||||
<label
|
||||
class="dropdown-toggle btn btn-icon btn-transparent no-r-l"
|
||||
v-on:click="open_dialog('color-text')"
|
||||
v-bind:class="{open:opened_dialog=='color-text'}">
|
||||
<span class="icon icon-tool-text icon-sm"></span>
|
||||
<span class="jewel" v-bind:style="{'border-color':active_style.text_color}">{{active_style.font_size}}</span>
|
||||
</label>
|
||||
<div class="dialog">
|
||||
{% include "./color.html" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btn-group dark">
|
||||
|
||||
<!-- <button class="btn btn-transparent btn-icon-labeled">
|
||||
<span class="icon icon-tool-eyedrop"></span>
|
||||
<span class="icon-label">Eyedrop</span>
|
||||
</button>
|
||||
|
||||
<button class="btn btn-divider"></button>
|
||||
-->
|
||||
|
||||
<div class="dropdown top light center" v-bind:class="{open:opened_dialog=='text-styles'}">
|
||||
<div class="btn-collapse in">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('text-styles')" v-bind:class="{open : opened_dialog=='text-styles'}">
|
||||
<span class="icon icon-text-styles"></span>
|
||||
<span class="icon-label">styles</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./text-styles.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dropdown top light center" v-bind:class="{open:opened_dialog=='filter'}">
|
||||
<div class="btn-collapse" v-bind:class="{in:selection_metrics.contains_images}">
|
||||
<!-- <div class="btn-collapse" v-bind:class="in:selection_metrics.count>0"> -->
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('filter')" v-bind:class="{open : opened_dialog=='filter'}">
|
||||
<span class="icon icon-contrast"></span>
|
||||
<span class="icon-label">[[__("tool_filter")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./filter.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dropdown top light center" v-bind:class="{open:opened_dialog=='type-align'}">
|
||||
<div class="btn-collapse" v-bind:class="{in:selection_metrics.contains_text}">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('type-align')" v-bind:class="{open : opened_dialog=='type-align'}">
|
||||
<span class="icon icon-text-align-left-alt"></span>
|
||||
<span class="icon-label">[[__("tool_align")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./text-align.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dropdown top light center" v-bind:class="{open:opened_dialog=='layout'}">
|
||||
|
||||
<div class="btn-collapse" v-bind:class="{in:selection_metrics.count>0}">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('layout')" v-bind:class="{open : opened_dialog=='layout'}">
|
||||
<span class="icon icon-cluster"></span>
|
||||
<span class="icon-label">[[__("tool_layout")]]</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./layout.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dropdown top light center" v-bind:class="{open:opened_dialog=='text-settings'}">
|
||||
|
||||
<div class="btn-collapse in">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('text-settings')" v-bind:class="{open : opened_dialog=='text-settings'}">
|
||||
<span class="icon icon-text-typeface"></span>
|
||||
<span class="icon-label">Font</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./text-digits.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-divider"></button>
|
||||
|
||||
<div class="dropdown top light center" v-bind:class="{open:opened_dialog=='object-options'}">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('object-options')" v-bind:class="{open : opened_dialog=='object-options'}">
|
||||
<span class="icon icon-cogwheel"></span>
|
||||
<span class="icon-label">[[__("more")]]</span>
|
||||
</button>
|
||||
|
||||
<div class="dialog no-min-w">
|
||||
{% include "./object-options.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
29
views/partials/tool/toolbar-social.html
Normal file
29
views/partials/tool/toolbar-social.html
Normal file
@@ -0,0 +1,29 @@
|
||||
<div class="toolbar toolbar-social"
|
||||
v-bind:class="{in : active_space_role=='viewer' || (present_mode && active_space.access_mode=='public')}"
|
||||
v-if="social_bar && active_space_loaded">
|
||||
<div class="btn-group dark">
|
||||
|
||||
<div id="share-dialog" class="dropdown bottomleft light center static" v-bind:class="{open:opened_dialog=='share'}">
|
||||
<button class="btn btn-primary btn-icon-labeled" v-on:click="open_dialog('share')">
|
||||
<span class="icon icon-share" style="color:white"></span>
|
||||
<span class="icon-label" style="color:white"> Share </span>
|
||||
</button>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./share.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="share-dialog" class="dropdown bottom light center static" v-bind:class="{open:opened_dialog=='embed'}">
|
||||
<button class="btn btn-transparent btn-icon-labeled" v-on:click="open_dialog('embed')">
|
||||
<span class="icon icon-embed"></span>
|
||||
<span class="icon-label"> Embed </span>
|
||||
</button>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./embed.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
72
views/partials/tool/toolbar-text.html
Normal file
72
views/partials/tool/toolbar-text.html
Normal file
@@ -0,0 +1,72 @@
|
||||
<div class="toolbar toolbar-text in" v-cloak v-show="(active_space && (active_view == 'space' && !is_active_space_role('viewer') && editing_artifact_id!=null))">
|
||||
<div class="btn-group dark">
|
||||
|
||||
<div class="dropdown bottomleft light center" v-bind:class="{open:opened_dialog=='text-formats'}">
|
||||
<div v-bind:class="{in:selection_metrics.contains_text}">
|
||||
<button class="btn btn-transparent" v-on:click="open_dialog('text-formats')" v-bind:class="open : opened_dialog=='text-formats'">
|
||||
{{active_text_format_name}}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./text-formats.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-divider"></button>
|
||||
|
||||
<div class="dropdown bottom light center" v-bind:class="{open:opened_dialog=='text-settings'}">
|
||||
<button class="btn btn-transparent btn-icon-labeled hover" v-on:click="open_dialog('text-settings')" v-bind:class="{open : opened_dialog=='text-settings'}">
|
||||
<span class="text-medium">{{active_style.font_family}}</span>
|
||||
<span class="slash">/</span>
|
||||
<span class="text-medium">{{active_style.font_size}}px</span>
|
||||
</button>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./text-digits.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<button class="btn btn-divider"></button>
|
||||
|
||||
<div class="dropdown bottom light center" v-bind:class="{open:opened_dialog=='text-align'}">
|
||||
<button class="btn btn-transparent btn-icon-labeled hover" v-on:click="open_dialog('text-align')" v-bind:class="{open : opened_dialog=='text-align'}">
|
||||
<span class="icon icon-text-align-left-alt"></span>
|
||||
<span class="icon-label">Align</span>
|
||||
</button>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./text-align.html" %}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="dropdown bottom light center" v-bind:class="{open:opened_dialog=='text-styles'}">
|
||||
<button class="btn btn-transparent btn-icon-labeled hover" v-on:click="open_dialog('text-styles')" v-bind:class="{open : opened_dialog=='text-styles'}">
|
||||
<span class="icon icon-text-styles"></span>
|
||||
<span class="icon-label">styles</span>
|
||||
</button>
|
||||
|
||||
<div class="dialog">
|
||||
{% include "./text-styles.html" %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btn-group dark">
|
||||
<button class="btn btn-transparent btn-icon-labeled hover" v-on="click : apply_formatting($event,'insertUnorderedList')">
|
||||
<span class="icon icon-text-list-bullet"></span>
|
||||
<span class="icon-label">Bullets</span>
|
||||
</button>
|
||||
<button class="btn btn-transparent btn-icon-labeled hover" v-on="click : apply_formatting($event,'insertOrderedList')">
|
||||
<span class="icon icon-text-list-numbered"></span>
|
||||
<span class="icon-label">Number</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="btn-group dark">
|
||||
<button class="btn btn-transparent btn-icon-labeled hover" v-on:click=" toggle_selected_artifact_editing()">
|
||||
<span class="icon icon-cross-1"></span>
|
||||
<span class="icon-label">Cancel</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
15
views/partials/tool/video.html
Normal file
15
views/partials/tool/video.html
Normal file
@@ -0,0 +1,15 @@
|
||||
<h4 class="dialog-title">Video</h4>
|
||||
|
||||
<div id="video">
|
||||
<div class="dialog-section">
|
||||
<label class="btn btn-xxl btn-transparent btn-icon">
|
||||
<span class="icon icon-video-camera"></span>
|
||||
<input type="file" accept="video/*" multiple v-on="change:handle_video_file_upload($event)" id="video_file_upload">
|
||||
</label>
|
||||
<p>Click to Upload<br/> or drag file(s) anywhere.</p>
|
||||
</div>
|
||||
<div class="dialog-section no-p-b">
|
||||
<input type="text" v-model="video_search_query" class="input input-md input-white input-round text-center no-p no-b no-r input-block" placeholder="Search / Paste URL" v-on="keyup:search_videos(video_search_query) | key enter">
|
||||
</div>
|
||||
<button class="btn btn-transparent btn-block text-center" v-on="click:handle_insert_video_url(video_search_query)">Insert Video</button>
|
||||
</div>
|
||||
17
views/partials/tool/zones.html
Normal file
17
views/partials/tool/zones.html
Normal file
@@ -0,0 +1,17 @@
|
||||
<h4 class="dialog-title">[[__("tool_zones")]]</h4>
|
||||
|
||||
<div id="zones" style="max-height:500px;overflow-y:scroll">
|
||||
<div class="dialog-section">
|
||||
<p v-if="zones.length<2">
|
||||
Turn your Space into a zooming presentation by placing some Zones and switch through them when presenting.
|
||||
</p>
|
||||
|
||||
<button v-on:click="add_zone()" class="btn btn-sm btn-primary">[[__("add_zone")]]</button>
|
||||
</div>
|
||||
|
||||
<div class="dialog-section no-p" v-for="z in zones | orderBy 'style.order'" style="white-space: nowrap;text-align:left;cursor:pointer" v-on:click="zoom_to_zone(z)">
|
||||
<button class="btn btn-sm btn-transparent">{{{z.description}}}</button>
|
||||
<button v-if="$index==current_zone_idx" v-on:click="sort_zone_up(z)" class="btn btn-sm btn-round btn-transparent btn-icon"><span class="icon icon-triangle-up"></span></button>
|
||||
<button v-if="$index==current_zone_idx" v-on:click="sort_zone_down(z)" class="btn btn-sm btn-round btn-transparent btn-icon"><span class="icon icon-triangle-down"></span></button>
|
||||
</div>
|
||||
</div>
|
||||
10
views/public/contact.html
Normal file
10
views/public/contact.html
Normal file
@@ -0,0 +1,10 @@
|
||||
{% extends '../layouts/outer.html' %}
|
||||
|
||||
{% block title %}[[ __("contact") ]]{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="landing-box">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
9
views/public/privacy.html
Normal file
9
views/public/privacy.html
Normal file
@@ -0,0 +1,9 @@
|
||||
{% extends '../layouts/outer.html' %}
|
||||
{% block title %}[[ __("privacy") ]]{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
|
||||
<div class="landing-box">
|
||||
|
||||
</div>
|
||||
{% endblock %}
|
||||
8
views/public/terms.html
Normal file
8
views/public/terms.html
Normal file
@@ -0,0 +1,8 @@
|
||||
{% extends '../layouts/outer.html' %}
|
||||
|
||||
{% block title %}[[ __("terms") ]]{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="landing-box">
|
||||
</div>
|
||||
{% endblock %}
|
||||
20
views/space_list.html
Normal file
20
views/space_list.html
Normal file
@@ -0,0 +1,20 @@
|
||||
<html>
|
||||
<body>
|
||||
|
||||
<h2>[[ __("folder") ]]: [[space.name]]</h2>
|
||||
<table class="table table-striped" >
|
||||
<tr>
|
||||
<th>[[__("created")]]</th>
|
||||
<th>[[__("name")]]</th>
|
||||
<th>[[__("link")]]</th>
|
||||
</tr>
|
||||
{% for s in subspaces %}
|
||||
<tr>
|
||||
<td>[[ s.created_at | date('d.m.Y H:i') ]]</td>
|
||||
<td>[[ s.name ]]</td>
|
||||
<td>[[ s.ae_link ]]</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
</body>
|
||||
</html>
|
||||
110
views/spacedeck.html
Normal file
110
views/spacedeck.html
Normal file
@@ -0,0 +1,110 @@
|
||||
<!doctype html>
|
||||
<html class="no-js">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Spacedeck Open</title>
|
||||
<meta name="description" content="">
|
||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
||||
|
||||
<link href="[[ '/images/favicon.png' | cdn ]]" rel="icon" type="image/x-icon" />
|
||||
<link href='https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,700,600,800,300|Montserrat:400,700|EB+Garamond|Vollkorn|Lato|Roboto|Source+Code+Pro|Ubuntu|Raleway|Playfair+Display|Crimson+Text' rel='stylesheet' type='text/css'>
|
||||
<link type="text/css" rel="stylesheet" href="https://fast.fonts.net/cssapi/ee1a3484-4d98-4f9f-9f55-020a7b37f3c5.css"/>
|
||||
<link rel="stylesheet" href="[[ '/stylesheets/style.css' | cdn ]]">
|
||||
|
||||
<script src="//cdnjs.cloudflare.com/ajax/libs/twemoji/1.3.2/twemoji.min.js"></script>
|
||||
|
||||
<script>
|
||||
window.socket_auth = '[[socket_auth]]';
|
||||
window.browser_lang = '[[locale]]';
|
||||
window.csrf_token = '[[csrf_token]]';
|
||||
|
||||
{% if process.env.NODE_ENV != "production" %}
|
||||
var ENV = {
|
||||
name: 'development',
|
||||
webHost: "localhost:9000",
|
||||
webEndpoint:"http://localhost:9000",
|
||||
apiEndpoint: "http://localhost:9000",
|
||||
websocketsEndpoint: "ws://localhost:9000"
|
||||
};
|
||||
{% endif %}
|
||||
|
||||
{% if subdomain_team %}
|
||||
var subdomainTeam = [[ subdomain_team | json | safe ]];
|
||||
{% else %}
|
||||
var subdomainTeam = null;
|
||||
{% endif %}
|
||||
</script>
|
||||
|
||||
{% if process.env.NODE_ENV == "production" %}
|
||||
<script src="[[ '/javascripts/spacedeck.js' | cdn ]]"></script>
|
||||
{% else %}
|
||||
<script minify src="/javascripts/jquery-2.1.4.min.js"></script>
|
||||
<script minify src="/javascripts/i18next-1.11.2.js"></script>
|
||||
<script minify src="/javascripts/clipboard.js"></script>
|
||||
|
||||
<script minify src="/javascripts/lodash.compat.js"></script>
|
||||
<script minify src="/javascripts/fastclick.js"></script>
|
||||
<script minify src="/javascripts/vue.js"></script>
|
||||
<script minify src="/javascripts/moment.js"></script>
|
||||
<script minify src="/javascripts/medium.patched.js"></script>
|
||||
<script minify src="/javascripts/route-recognizer.js"></script>
|
||||
|
||||
<script minify src="/javascripts/backend.js"></script>
|
||||
<script minify src="/javascripts/link_parser.js"></script>
|
||||
<script minify src="/javascripts/vector-render.js"></script>
|
||||
<script minify src="/javascripts/mousetrap.js"></script>
|
||||
<script minify src="/javascripts/smoke.js"></script>
|
||||
<script minify src="/javascripts/helper.js"></script>
|
||||
<script minify src="/javascripts/packer.growing.js"></script>
|
||||
|
||||
<script minify src="/javascripts/spacedeck_routes.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_formatting.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_sections.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_spaces.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_teams.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_board_artifacts.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_users.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_account.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_modals.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_avatars.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_websockets.js"></script>
|
||||
|
||||
<script minify src="/javascripts/spacedeck_whiteboard.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_directives.js"></script>
|
||||
<script minify src="/javascripts/spacedeck_vue.js"></script>
|
||||
{% endif %}
|
||||
</head>
|
||||
|
||||
<body id="main" v-bind:class="{'present-mode':present_mode,'modal-open':active_modal}" v-on:click="handle_body_click($event)">
|
||||
<!--[if lt IE 10]>
|
||||
<p class="browsehappy">You are using an <strong>outdated</strong> version of Internet Explorer. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
||||
<![endif]-->
|
||||
|
||||
{% include "./partials/login.html" %}
|
||||
{% include "./partials/space.html" %}
|
||||
{% include "./partials/folders.html" %}
|
||||
{% include "./partials/team.html" %}
|
||||
{% include "./partials/account.html" %}
|
||||
{% include "./partials/meta.html" %}
|
||||
{% include "./partials/meta-folder.html" %}
|
||||
|
||||
{% include "./partials/modal/access.html" %}
|
||||
{% include "./partials/modal/folder-settings.html" %}
|
||||
{% include "./partials/modal/support.html" %}
|
||||
{% include "./partials/modal/login.html" %}
|
||||
{% include "./partials/modal/pdfoptions.html" %}
|
||||
|
||||
</body>
|
||||
|
||||
<script type="text/javascript">
|
||||
window.locales = {};
|
||||
window.locales.en = {};
|
||||
window.locales.de = {};
|
||||
window.locales.fr = {};
|
||||
window.locales.en.translation = {% include "./../locales/en.js" %};
|
||||
window.locales.de.translation = {% include "./../locales/de.js" %};
|
||||
window.locales.fr.translation = {% include "./../locales/fr.js" %};
|
||||
</script>
|
||||
</html>
|
||||
Reference in New Issue
Block a user