From 2d8cf127f993de17e18348118e5d99375cdff03d Mon Sep 17 00:00:00 2001
From: luigser <luigser@gmail.com>
Date: Wed, 17 Feb 2016 18:39:15 +0100
Subject: [PATCH] postit and google card updates
---
controllets/google-cards-controllet/google-card-controllet.html | 34 ++++++++++++++++++----------------
controllets/google-cards-controllet/google-card-creation-controllet.html | 0
controllets/google-cards-controllet/static/images/google-doc-icon.png | Bin 20291 -> 0 bytes
controllets/google-cards-controllet/static/images/google-drawing-icon.png | Bin 6601 -> 0 bytes
controllets/google-cards-controllet/static/images/google-presentation-icon.png | Bin 12697 -> 0 bytes
controllets/google-cards-controllet/static/images/google-sheet-icon.png | Bin 17440 -> 0 bytes
controllets/postit-container-controllet/postit-container-controllet.html | 339 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
7 files changed, 357 insertions(+), 16 deletions(-)
mode change 100644 => 100755 controllets/google-cards-controllet/google-card-controllet.html
mode change 100644 => 100755 controllets/google-cards-controllet/google-card-creation-controllet.html
mode change 100644 => 100755 controllets/google-cards-controllet/static/images/google-doc-icon.png
mode change 100644 => 100755 controllets/google-cards-controllet/static/images/google-drawing-icon.png
mode change 100644 => 100755 controllets/google-cards-controllet/static/images/google-presentation-icon.png
mode change 100644 => 100755 controllets/google-cards-controllet/static/images/google-sheet-icon.png
create mode 100755 controllets/postit-container-controllet/postit-container-controllet.html
diff --git a/controllets/google-cards-controllet/google-card-controllet.html b/controllets/google-cards-controllet/google-card-controllet.html
old mode 100644
new mode 100755
index e7ab3b5..9d6a1a3
--- a/controllets/google-cards-controllet/google-card-controllet.html
+++ b/controllets/google-cards-controllet/google-card-controllet.html
@@ -5,7 +5,7 @@
<link rel="import" href="../../bower_components/paper-dialog/paper-dialog.html"/>
<link rel="import" href="../../bower_components/neon-animation/neon-animation.html"/>
-<script src="../../locales/paper-card-ln.js"></script>
+<script src="../../locales/paper_card_controllet_ln.js"></script>
<dom-module id="google-card-controllet">
@@ -23,7 +23,7 @@
#content {
padding: 4px 4px 0px 4px;
position:relative;
- width: 100%;
+ width: 98%;
height: 90%;
}
@@ -45,10 +45,14 @@
paper-fab#fullscreen-button {
position: absolute;
- z-index: 100;
- top: -20px;
- right: 8px;
+ /*z-index: 10;*/
+ top: 0px;
+ right: 0px;
--paper-fab-background:#2196F3;
+ padding : 0px;
+ margin: 0px;
+ height: 24px;
+ width: 24px;
}
paper-dialog {
@@ -86,15 +90,12 @@
<paper-material id="paper_card_container" elevation="{{elevation}}">
<div id="content">
- <iframe id="resource" src="{{resourceUrl}}?embedded=true"></iframe>
+ <iframe id="resource" src="{{resourceUrl}}&embedded=true"></iframe>
+ <!--<iframe id="resource" src="{{resourceUrl}}"></iframe>-->
</div>
<paper-fab id="fullscreen-button" class="open" mini icon="fullscreen" on-click="_handleOpenClick"></paper-fab>
- <div class="footer">
- <div class="comment">{{comment}}</div>
- </div>
-
<paper-dialog id="fullscreen_container" entry-animation="scale-up-animation" exit-animation="fade-out-animation">
<!--with-backdrop-->
<div id="fullscreen_content"></div>
@@ -153,15 +154,16 @@
_changeWidth: function(){
- this.style.width = this.width + "px";
- this.$.paper_card_container.style.width = this.width + "px";
- this.$.content.style.width = this.width - 8 + "px";
+ //this.style.width = this.width + "px";
+ //this.$.paper_card_container.style.width = this.width + "px";
+ //this.$.content.style.width = this.width - 8 + "px";
},
_changeHeight: function(){
- this.style.height = this.height + 64 + "px";
- this.$.paper_card_container.style.height = this.height + "px";
- this.$.content.style.height = this.height - 4 + "px";
+ this.style.height = this.height + "vh";
+ //this.$.content.width = this.width - 4 + "vh";
+ this.$.paper_card_container.style.height = this.height + "vh";
+ this.$.content.style.height = this.height - 1 + "vh";
$(this.$.content).perfectScrollbar();
},
diff --git a/controllets/google-cards-controllet/google-card-creation-controllet.html b/controllets/google-cards-controllet/google-card-creation-controllet.html
old mode 100644
new mode 100755
index a69b199..a69b199
--- a/controllets/google-cards-controllet/google-card-creation-controllet.html
+++ b/controllets/google-cards-controllet/google-card-creation-controllet.html
diff --git a/controllets/google-cards-controllet/static/images/google-doc-icon.png b/controllets/google-cards-controllet/static/images/google-doc-icon.png
old mode 100644
new mode 100755
index 9cada25..9cada25
Binary files a/controllets/google-cards-controllet/static/images/google-doc-icon.png and b/controllets/google-cards-controllet/static/images/google-doc-icon.png differ
diff --git a/controllets/google-cards-controllet/static/images/google-drawing-icon.png b/controllets/google-cards-controllet/static/images/google-drawing-icon.png
old mode 100644
new mode 100755
index 510a291..510a291
Binary files a/controllets/google-cards-controllet/static/images/google-drawing-icon.png and b/controllets/google-cards-controllet/static/images/google-drawing-icon.png differ
diff --git a/controllets/google-cards-controllet/static/images/google-presentation-icon.png b/controllets/google-cards-controllet/static/images/google-presentation-icon.png
old mode 100644
new mode 100755
index 304f49c..304f49c
Binary files a/controllets/google-cards-controllet/static/images/google-presentation-icon.png and b/controllets/google-cards-controllet/static/images/google-presentation-icon.png differ
diff --git a/controllets/google-cards-controllet/static/images/google-sheet-icon.png b/controllets/google-cards-controllet/static/images/google-sheet-icon.png
old mode 100644
new mode 100755
index 6ea5ff3..6ea5ff3
Binary files a/controllets/google-cards-controllet/static/images/google-sheet-icon.png and b/controllets/google-cards-controllet/static/images/google-sheet-icon.png differ
diff --git a/controllets/postit-container-controllet/postit-container-controllet.html b/controllets/postit-container-controllet/postit-container-controllet.html
new file mode 100755
index 0000000..7c67b92
--- /dev/null
+++ b/controllets/postit-container-controllet/postit-container-controllet.html
@@ -0,0 +1,339 @@
+<link rel="import" href="../../bower_components/polymer/polymer.html">
+
+<link rel="import" href="../../bower_components/iron-icon/iron-icon.html">
+<link rel="import" href="../../bower_components/iron-icons/iron-icons.html">
+<link rel="import" href="../../bower_components/paper-material/paper-material.html">
+<link rel="import" href="../../bower_components/paper-toolbar/paper-toolbar.html">
+<link rel="import" href="../../bower_components/paper-fab/paper-fab.html">
+
+<link rel="import" href="../../controllets/search-panel-controllet/search-panel-controllet.html">
+
+<dom-module id="postit-container-controllet">
+
+ <style>
+
+ iron-icon.postit {
+ padding: 2px;
+ margin: 0px;
+ color: #FFFFFF;
+ height: 32px;
+ width: 32px;
+ background-color: #00BCD4;
+ }
+
+ .button-container {
+ cursor: pointer;
+ text-decoration:none;
+ color:#000;
+ background:#ffc;
+ display:block;
+ height:40px;
+ width:40px;
+ padding:10px;
+ /* Firefox */
+ -moz-box-shadow:5px 5px 7px rgba(33,33,33,1);
+ /* Safari+Chrome */
+ -webkit-box-shadow: 5px 5px 7px rgba(33,33,33,.7);
+ /* Opera */
+ box-shadow: 5px 5px 7px rgba(33,33,33,.7);
+ -o-transform:rotate(4deg);
+ -webkit-transform:rotate(4deg);
+ -moz-transform:rotate(4deg);
+ }
+
+ .button-container p{
+ -o-transform:rotate(4deg);
+ -webkit-transform:rotate(4deg);
+ -moz-transform:rotate(4deg);
+ font-size: 5px;
+ line-height: 3px;
+ }
+
+ .button-container:hover {
+ box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
+ -webkit-transition: 0.2s ease-out;
+ -moz-transition: 0.2s ease-out;
+ -o-transition: 0.2s ease-out;
+ -ms-transition: 0.2s ease-out;
+ transition: 0.2s ease-out;
+ }
+
+ .window {
+ /*height: 80vh;
+ width: 120vh;*/
+ display: none;
+ height: 80%;
+ position: fixed;
+ top: 15%;
+ left: 50%;
+ margin-right: auto;
+ margin-left: auto;
+ z-index: 1000;
+ }
+
+ .transparent {
+ position:absolute;
+ top:0;
+ left:0;
+ width: 100%;
+ height: 12%;
+ background-color: rgba(0, 0, 0, 0.4);
+ }
+
+ paper-fab.close {
+ position: absolute;
+ height: 32px;
+ width: 32px;
+ margin: 8px;
+ top: 0px;
+ right: 0px;
+ --paper-fab-background:#B6B6B6;
+ z-index: 9999;
+ }
+
+ paper-fab#addPostit {
+ position: absolute;
+ height: 32px;
+ width: 32px;
+ margin: 8px;
+ top: 0px;
+ right: 48px;
+ --paper-fab-background:#2196F3;
+ z-index: 9999;
+ }
+
+ #container_content {
+ position: relative;
+ overflow: auto;
+ height: 100%;
+ background-color: transparent;
+ z-index: 1000;
+ margin-top : 7%;
+ }
+
+ h2,p{
+ font-size:100%;
+ font-weight:normal;
+ }
+ ul,li{
+ list-style:none;
+ }
+ ul{
+ overflow:hidden;
+ padding:3em;
+ }
+ ul li a{
+ text-decoration:none;
+ color:#000;
+ background:#ffc;
+ display:block;
+ height:10em;
+ width:10em;
+ padding:1em;
+ -moz-box-shadow:5px 5px 7px rgba(33,33,33,1);
+ -webkit-box-shadow: 5px 5px 7px rgba(33,33,33,.7);
+ box-shadow: 5px 5px 7px rgba(33,33,33,.7);
+ -moz-transition:-moz-transform .15s linear;
+ -o-transition:-o-transform .15s linear;
+ -webkit-transition:-webkit-transform .15s linear;
+ }
+ ul li{
+ margin:10px;
+ float:left;
+ }
+ ul li h3{
+ font-size:100%;
+ font-weight:bold;
+ }
+ ul li p{
+ /*font-family:"Reenie Beanie",arial,sans-serif;*/
+ font-size:60%;
+ }
+ ul li a{
+ -webkit-transform: rotate(-6deg);
+ -o-transform: rotate(-6deg);
+ -moz-transform:rotate(-6deg);
+ }
+ ul li:nth-child(even) a{
+ -o-transform:rotate(4deg);
+ -webkit-transform:rotate(4deg);
+ -moz-transform:rotate(4deg);
+ position:relative;
+ top:5px;
+ background:#cfc;
+ }
+ ul li:nth-child(3n) a{
+ -o-transform:rotate(-3deg);
+ -webkit-transform:rotate(-3deg);
+ -moz-transform:rotate(-3deg);
+ position:relative;
+ top:-5px;
+ background:#ccf;
+ }
+ ul li:nth-child(5n) a{
+ -o-transform:rotate(5deg);
+ -webkit-transform:rotate(5deg);
+ -moz-transform:rotate(5deg);
+ position:relative;
+ top:-10px;
+ }
+ ul li a:hover,ul li a:focus{
+ box-shadow:10px 10px 7px rgba(0,0,0,.7);
+ -moz-box-shadow:10px 10px 7px rgba(0,0,0,.7);
+ -webkit-box-shadow: 10px 10px 7px rgba(0,0,0,.7);
+ -webkit-transform: scale(1.25);
+ -moz-transform: scale(1.25);
+ -o-transform: scale(1.25);
+ position:relative;
+ z-index:5;
+ }
+
+ </style>
+
+ <template>
+
+ <div class="button-container" title$="{{tooltip}}" on-click="_onOpenClick">
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
+ </p>
+ </div>
+
+ <paper-material id="window" class="window" elevation="0">
+
+ <div class="transparent"></div>
+
+ <paper-fab class="close" mini icon="close" on-click="_onCloseClick"></paper-fab>
+ <paper-fab id="addPostit" icon="add" title='{text key="spodcollaborative+add_content"}' class="dropdown-trigger"></paper-fab>
+ <div id="container_content">
+ <content>
+ <ul>
+ <!--<template is="dom-repeat" items="{{data}}">
+ <li>
+ <a href="#">
+ <h3>{{items.title}}</h3>
+ <p>{{items.content}}</p>
+ </a>
+ </li>
+ </template>-->
+
+ <li>
+ <a href="#">
+ <h3>My note #1</h3>
+ <p>
+ At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis
+ praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias
+ excepturi sint occaecati cupiditate non provident
+ </p>
+ </a>
+ </li>
+ <li>
+ <a href="#">
+ <h2>My note #2</h2>
+ <p>
+ Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod
+ maxime placeat facere possimus
+ </p>
+ </a>
+ </li>
+ <li>
+ <a href="#">
+ <h2>My note #3</h2>
+ <p>
+ Similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.
+ Et harum quidem rerum facilis est et expedita distinctio
+ </p>
+ </a>
+ </li>
+ <li>
+ <a href="#">
+ <h2>My note #4</h2>
+ <p>
+ Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet
+ ut et voluptates repudiandae sint et molestiae non recusandae.
+ </p>
+ </a>
+ </li>
+ <li>
+ <a href="#">
+ <h2>My note #5</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod
+ tempor incididunt ut labore et dolore magna aliqua
+ </p>
+ </a>
+ </li>
+ <!-- <li>
+ <a href="#">
+ <h2>My note #6</h2>
+ <p>
+ Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
+ </p>
+ </a>
+ </li>
+ <li>
+ <a href="#">
+ <h2>My note #7</h2>
+ <p>
+ Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias
+ consequatur aut perferendis doloribus asperiores repellat
+ </p>
+ </a>
+ </li>
+ <li>
+ <a href="#">
+ <h2>My note #8</h2>
+ <p>
+ Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
+ Excepteur sint occaecat cupidatat non proident
+ </p>
+ </a>
+ </li>
+ <li>
+ <a href="#">
+ <h2>My note #9</h2>
+ <p>Sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
+ </a>
+ </li>-->
+ </ul>
+ </content>
+ </div>
+
+ </paper-material>
+
+ </template>
+
+ <script type="text/javascript" src="../shared_js/perfect-scrollbar/js/perfect-scrollbar.jquery.js"></script>
+
+ <script>
+
+ Polymer({
+
+ is: 'postit-container-controllet',
+
+ properties: {
+ tooltip: {
+ type: String,
+ value: ""
+ },
+ data : {
+ type: Array,
+ value: undefined
+ }
+ },
+
+ ready: function(){
+ $(this.$.container_content).perfectScrollbar();
+ },
+
+ _onOpenClick: function() {
+ $(this.$.window).show();
+ },
+
+ _onCloseClick: function(){
+ $(this.$.window).hide();
+ }
+
+ });
+
+ </script>
+</dom-module>
--
libgit2 0.21.4