YunoHost-Apps/chtickynotes_ynh
1
0
Fork 0
mirror of https://github.com/YunoHost-Apps/chtickynotes_ynh.git synced 2024-09-03 18:15:57 +02:00
Code Issues Activity Actions

Created

Browse source 
Copied from ynh-chtickynotes and begining of boards management
This commit is contained in:
Chtixof 2015-02-26 23:40:40 +01:00
parent a02b12114b
commit c63ca08270
29 changed files with 14311 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
LICENSE.txt Normal file
View file

@ -0,0 +1,21 @@
The MIT License (MIT)
Copyright (c) 2014 Chtixof
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

17
README.md Normal file
View file

@ -0,0 +1,17 @@
# chtickynotes_ynh : sticky notes for Yunohost #
chtickynotes_ynh is packaged to be installed on a [Yunohost](https://yunohost.org) server.
chtickynotes_ynh is a "simple post-it" application. Its main features are:
- notes movable and resizable
- edit note by just typing on it (or CTRL-V to paste chunks of HTML)
- menu on each note to change its color, and so on
- global menu to change board, and so on
- autosave every 10 seconds
- storage on the server (not on the browser local storage)
**Screen shot:**<br>
![Screen shot](https://lh4.googleusercontent.com/-ATC-XA5iVsc/VM06cI3ClLI/AAAAAAAACHo/uBhDViaSBRg/s800/chtickynotes.gif)
chtickynotes_ynh core is based on [Post It All!](https://github.com/txusko/PostItAll).

18
conf/nginx.conf Normal file
View file

@ -0,0 +1,18 @@
location PATHTOCHANGE {
alias WWWPATH ;
index index.html index.php ;
try_files $uri $uri/ index.php;
location ~ [^/]\.php(/|$) {
fastcgi_split_path_info ^(.+?\.php)(/.*)$;
fastcgi_pass unix:/var/run/php5-fpm.sock;
fastcgi_index index.php;
include fastcgi_params;
fastcgi_param REMOTE_USER $remote_user;
fastcgi_param PATH_INFO $fastcgi_path_info;
}
# Include SSOWAT user panel.
include conf.d/yunohost_panel.conf.inc;
}

31
manifest.json Normal file
View file

@ -0,0 +1,31 @@
{
"name": "ChtickyNotes",
"id": "chtickynotes",
"description": {
"en": "Generic sticky notes for all purpose",
"fr": "Des post-its génériques à tout faire"
},
"license": "MIT",
"developer": {
"name": "chtixof"
},
"multi_instance": "false",
"arguments": {
"install" : [ {
"name": "domain",
"ask": {
"en": "Choose a domain for ChtickyNotes",
"en": "Choisissez un domaine pour ChtickyNotes"
},
"example": "domain.org"
},{
"name": "path",
"ask": {
"en": "Choose a path for ChtickyNotes",
"en": "Choisissez un chemin pour ChtickyNotes"
},
"example": "/chtickynotes",
"default": "/chtickynotes"
} ]
}
}

15
scripts/backup Normal file
View file

@ -0,0 +1,15 @@
#!/bin/bash
app=chtickynotes
# The parameter $1 is the backup directory location
# which will be compressed afterward
backup_dir=$1/apps/$app
mkdir -p $backup_dir
# Backup sources & data
sudo cp -a /var/www/$app/. $backup_dir/sources
# Copy Nginx and YunoHost parameters to make the script "standalone"
sudo cp -a /etc/yunohost/apps/$app/. $backup_dir/yunohost
domain=$(sudo yunohost app setting $app domain)
sudo cp -a /etc/nginx/conf.d/$domain.d/$app.conf $backup_dir/nginx.conf

28
scripts/install Normal file
View file

@ -0,0 +1,28 @@
#!/bin/bash
# Installation de ChtickyNotes dans Yunohost
app=chtickynotes
# Retrieve arguments
domain=$1
path=$2
# Check domain/path availability
sudo yunohost app checkurl $domain$path -a $app
if [[ ! $? -eq 0 ]]; then
exit 1
fi
# Copy files to the right place with the right permissions
final_path=/var/www/$app
sudo mkdir -p $final_path
sudo cp -a ../sources/* $final_path
sudo chown -R www-data: $final_path
# Modify Nginx configuration file and copy it to Nginx conf directory
sed -i "s@PATHTOCHANGE@$path@g" ../conf/nginx.conf
sed -i "s@WWWPATH@$final_path@g" ../conf/nginx.conf
sudo cp ../conf/nginx.conf /etc/nginx/conf.d/$domain.d/$app.conf
# Reload nginx and regenerate SSOwat conf
sudo service nginx reload
sudo yunohost app ssowatconf

15
scripts/remove Normal file
View file

@ -0,0 +1,15 @@
#!/bin/bash
app=chtickynotes
# Retrieve arguments
domain=$(sudo yunohost app setting $app domain)
# Remove sources
sudo rm -rf /var/www/$app
# Remove configuration files
sudo rm -f /etc/nginx/conf.d/$domain.d/$app.conf
# Restart services
sudo service nginx reload
sudo yunohost app ssowatconf

16
scripts/restore Normal file
View file

@ -0,0 +1,16 @@
#!/bin/bash
app=chtickynotes
# The parameter $1 is the uncompressed restore directory location
backup_dir=$1/apps/$app
# Restore sources & data
sudo cp -a $backup_dir/sources/. /var/www/$app
# Restore Nginx and YunoHost parameters
sudo cp -a $backup_dir/yunohost/. /etc/yunohost/apps/$app
domain=$(sudo yunohost app setting $app domain)
sudo cp -a $backup_dir/nginx.conf /etc/nginx/conf.d/$domain.d/$app.conf
# Restart webserver
sudo service nginx reload

24
scripts/upgrade Normal file
View file

@ -0,0 +1,24 @@
#!/bin/bash
app=chtickynotes
# Retrieve arguments
domain=$(sudo yunohost app setting $app domain)
path=$(sudo yunohost app setting $app path)
# Remove trailing "/" for next commands
path=${path%/}
# Copy source files
final_path=/var/www/$app
sudo mkdir -p $final_path
sudo cp -a ../sources/* $final_path
# Modify Nginx configuration file and copy it to Nginx conf directory
sed -i "s@PATHTOCHANGE@$path@g" ../conf/nginx.conf
sed -i "s@WWWPATH@$final_path@g" ../conf/nginx.conf
sudo cp ../conf/nginx.conf /etc/nginx/conf.d/$domain.d/$app.conf
# Restart services
sudo service nginx reload
sudo yunohost app ssowatconf

10
sources/fav.php Normal file
View file

@ -0,0 +1,10 @@
<?php
$text=file_get_contents('php://input');
if ($text!="") {
file_put_contents('allnotes.json', $text);
header("Cache-Control: no-cache, must-revalidate");
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Content-Type: application/json; charset=utf-8");
echo($text);
}
?>

250
sources/index.html Normal file
View file

@ -0,0 +1,250 @@
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>ChtickyNotes
</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="libs/jquery-ui-1.10.0.custom.css">
<link rel="stylesheet" href="libs/bootstrap.min.css">
<link rel="stylesheet" href="libs/bootstrap-responsive.min.css">
<link rel="stylesheet" href="libs/jquery.minicolors.css">
<link rel="stylesheet" href="plugin/jquery.postitall.css">
<link rel="stylesheet" href="libs/main.css">
<style>
body {
background: #41444f;
color: #bbb;
}
#chtimenu {
margin-left: 10px;
}
#chtimenu a, .chme a {
color: #fff;
}
#chtimenu a:hover {
color: #fff;
}
#saved {
position:absolute;
}
#saveallnotes {
position:absolute;
background: #41444f;
}
#chtoption {
background-image: url(data:image/gif;base64,R0lGODlhDQANALsAAMXFxbe3t76+vtvb2729vbi4uLy8vMHBwbm5ueHh4dra2tPT07e4t9TU1ODg4JmZmSH5BAEAAA8ALAAAAAANAA0AAAQvsIVJaxmIiM25OQMgjiSQPGiqruy6VHBwZV39hWV5tnz/vDEKQ1HQ1DwHRa7kiAAAOw==);
position:absolute;
top:15px;
right:15px;
cursor: pointer;
width: 20px;
height: 20px;
background-position: center;
background-repeat: no-repeat;
}
.chme {
position: absolute;
display: none;
z-index: 100000;
right: 15px;
}
#chtoptmenu {
width: 275px;
height: 40px;
top: 15px;
}
#chlist {
width: 400px;
height: 40px;
top: 45px;
}
.chme label{
display: inline;
}
#chtoptmenu ul {
top: 30px;
width: 275px;
}
#chlist ul {
width: 400px;
}
.chme ul {
margin: 0;
list-style: none;
padding: 0;
position: absolute;
}
.chme ul li {
font: 14px;
margin-right: -4px;
position: relative;
padding: 5px 20px;
cursor: pointer;
background: #555;
display: block;
color: #fff;
}
.chme ul li:hover { background: #666; }
.center { text-align: center; }
.float-left { float: left; }
.float-right { float: right; }
.vertical-bottom { vertical-align: bottom; }
.vertical-middle { vertical-align: middle; }
.vertical-top { vertical-align: top; }
.clear { clear: both; }
.red { color: red; }
.red a { color: red; font-weight: bold; text-decoration: none; }
.red a:hover { text-decoration: underline; }
</style>
</head>
<body>
<!--[if lt IE 7]>
<p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
<![endif]-->
<div id="chtimenu">
<a id="addanote" href="javascript:void(0)">Add a note</a> &nbsp; &nbsp;
<span id="saved">(saved)</span>
<a id="saveallnotes" href="javascript:void(0)">Save all notes</a>
</div>
<div id="addanote_result">
</div>
<div id="chtoption">
</div>
<div id="chtoptmenu" class="chme">
<ul>
<li id="chboard">Change board</li>
<li><a href="javascript:alert('tbd')">Background color</a></li>
<li><a href="javascript:alert('tbd')">Title</a></li>
<li><a href="javascript:alert('tbd')">This board is shared. Make it private?</a></li>
<li><a href="javascript:alert('tbd')">Delete this board</a></li>
</ul>
</div>
<div id="chlist" class="chme">
<ul>
<li>First Board (shared)</li>
<li>Second Board (shared)</li>
<li>&lt;New board&gt;</a></li>
</ul>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="libs/jquery-1.9.1.min.js"><\/script>')</script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>
<script>window.jQuery || document.write('<script src="libs/jquery-ui-1.10.1.min.js"><\/script>')</script>
<script src="libs/bootstrap.min.js"></script>
<script src="//google-code-prettify.googlecode.com/svn/loader/run_prettify.js?autoload=true&amp;skin=sunburst&amp;lang=css" defer="defer"></script>
<script src="libs/jquery.minicolors.js"></script>
<script src="plugin/jquery.postitall.js"></script>
<script src="libs/main.js"></script>
<script>
function saveallnotes(){}
//global reqini for ajax
var reqini = new XMLHttpRequest();
//here we go
$(document).ready(function() {
//Minicolors for the form
$('.minicolors').minicolors();
//Add a note
$('#addanote').click(function() {
$('#addanote_result').postitall();
});
// set function to save all notes in the z-index order
saveallnotes=function() {
var allnotes=[];
var req = new XMLHttpRequest();
$('.PIApostit').each(function() {
var thisone=$(this).postitall('options');
allnotes.push({
"date": thisone.date,
"showdate": thisone.showdate,
"title": thisone.title,
"backgroundcolor": thisone.backgroundcolor,
"textcolor": thisone.textcolor,
"posX": thisone.posX,
"posY": thisone.posY,
"height": thisone.height,
"width": thisone.width,
"description": thisone.description,
"zindex": parseInt($(this).css('z-index'))
});
});
allnotes.sort(function (a,b) {
if (a.zindex < b.zindex)
return -1;
if (a.zindex > b.zindex)
return 1;
return 0;
});
allnotes.forEach(function(thisone){
delete thisone.zindex;
});
text=JSON.stringify(allnotes);
//ajax out
req.open("POST", "fav.php", true);
req.setRequestHeader("Content-type", "application/json");
req.onreadystatechange = function()
{
if (req.readyState == 4) {
$('#saveallnotes').hide(); //=(saved)
}
}
req.send(text);
}
$('#saveallnotes').click(saveallnotes); // set function to link
$('#chtoption').click(function () { // set function to menu for options
$('#chtoptmenu').show();
});
$('.chme').mouseleave(function(){
$(this).hide();
});
$('#chboard').click(function () {
$('#chlist').show();
});
// ajax in
reqini.open("GET", "allnotes.json", true);
reqini.onreadystatechange = function()
{
if (reqini.readyState == 4) {
text=reqini.responseText;
try {
JSON.parse(text);
} catch (e) {
text = '[]';
}
JSON.parse(text).forEach(function(note){
$('#addanote_result').postitall(note);
});
$('.PIApostit').postitall('isittosave','#saveallnotes'); // prevents to save on load! and sets id to hide/show
$('#saveallnotes').hide(); //=(saved)
}
}
reqini.send(null);
});
// timer to save every 10 s. if required
window.setInterval(function () {
if($('.PIApostit').postitall('isittosave')){saveallnotes()}
}, 10000);
</script>
</body>
</html>

1109
sources/libs/bootstrap-responsive.css vendored Normal file
View file

File diff suppressed because it is too large Load diff

9
sources/libs/bootstrap-responsive.min.css vendored Normal file
View file

File diff suppressed because one or more lines are too long

6158
sources/libs/bootstrap.css vendored Normal file
View file

File diff suppressed because it is too large Load diff

2268
sources/libs/bootstrap.js vendored Normal file
View file

File diff suppressed because it is too large Load diff

9
sources/libs/bootstrap.min.css vendored Normal file
View file

File diff suppressed because one or more lines are too long

6
sources/libs/bootstrap.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

5
sources/libs/jquery-1.9.1.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

1174
sources/libs/jquery-ui-1.10.0.custom.css vendored Normal file
View file

File diff suppressed because it is too large Load diff

5
sources/libs/jquery-ui-1.10.1.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

1174
sources/libs/jquery-ui.css vendored Normal file
View file

File diff suppressed because it is too large Load diff

278
sources/libs/jquery.minicolors.css Normal file
View file

@ -0,0 +1,278 @@
.minicolors {
position: relative;
display: inline-block;
z-index: 1;
}
.minicolors-focus {
z-index: 2;
}
.minicolors.minicolors-theme-default .minicolors-input {
margin: 0px;
margin-right: 3px;
border: solid 1px #CCC;
font: 14px sans-serif;
width: 65px;
height: 16px;
border-radius: 0;
box-shadow: inset 0 2px 4px rgba(0, 0, 0, .04);
padding: 2px;
margin-right: -1px;
}
.minicolors-theme-default.minicolors .minicolors-input {
vertical-align: middle;
outline: none;
}
.minicolors-theme-default.minicolors-swatch-left .minicolors-input {
margin-left: -1px;
margin-right: auto;
}
.minicolors-theme-default.minicolors-focus .minicolors-input,
.minicolors-theme-default.minicolors-focus .minicolors-swatch {
border-color: #999;
}
.minicolors-hidden {
position: absolute;
left: -9999em;
}
.minicolors-swatch {
position: relative;
width: 20px;
height: 20px;
text-align: left;
background: url(jquery.minicolors.png) -80px 0;
border: solid 1px #CCC;
vertical-align: middle;
display: inline-block;
}
.minicolors-swatch SPAN {
position: absolute;
width: 100%;
height: 100%;
background: none;
box-shadow: inset 0 9px 0 rgba(255, 255, 255, .1);
display: inline-block;
}
/* Panel */
.minicolors-panel {
position: absolute;
top: 26px;
left: 0;
width: 173px;
height: 152px;
background: white;
border: solid 1px #CCC;
box-shadow: 0 0 20px rgba(0, 0, 0, .2);
display: none;
}
.minicolors-position-top .minicolors-panel {
top: -156px;
}
.minicolors-position-left .minicolors-panel {
left: -83px;
}
.minicolors-position-left.minicolors-with-opacity .minicolors-panel {
left: -104px;
}
.minicolors-with-opacity .minicolors-panel {
width: 194px;
}
.minicolors .minicolors-grid {
position: absolute;
top: 1px;
left: 1px;
width: 150px;
height: 150px;
background: url(jquery.minicolors.png) -120px 0;
cursor: crosshair;
}
.minicolors .minicolors-grid-inner {
position: absolute;
top: 0;
left: 0;
width: 150px;
height: 150px;
background: none;
}
.minicolors-slider-saturation .minicolors-grid {
background-position: -420px 0;
}
.minicolors-slider-saturation .minicolors-grid-inner {
background: url(jquery.minicolors.png) -270px 0;
}
.minicolors-slider-brightness .minicolors-grid {
background-position: -570px 0;
}
.minicolors-slider-brightness .minicolors-grid-inner {
background: black;
}
.minicolors-slider-wheel .minicolors-grid {
background-position: -720px 0;
}
.minicolors-slider,
.minicolors-opacity-slider {
position: absolute;
top: 1px;
left: 152px;
width: 20px;
height: 150px;
background: white url(jquery.minicolors.png) 0 0;
cursor: crosshair;
}
.minicolors-slider-saturation .minicolors-slider {
background-position: -60px 0;
}
.minicolors-slider-brightness .minicolors-slider {
background-position: -20px 0;
}
.minicolors-slider-wheel .minicolors-slider {
background-position: -20px 0;
}
.minicolors-opacity-slider {
left: 173px;
background-position: -40px 0;
display: none;
}
.minicolors-with-opacity .minicolors-opacity-slider {
display: block;
}
/* Pickers */
.minicolors-grid .minicolors-picker {
position: absolute;
top: 70px;
left: 70px;
width: 10px;
height: 10px;
border: solid 1px black;
border-radius: 10px;
margin-top: -6px;
margin-left: -6px;
background: none;
}
.minicolors-grid .minicolors-picker SPAN {
position: absolute;
top: 0;
left: 0;
width: 6px;
height: 6px;
border-radius: 6px;
border: solid 2px white;
}
.minicolors-picker {
position: absolute;
top: 0;
left: 0;
width: 18px;
height: 2px;
background: white;
border: solid 1px black;
margin-top: -2px;
}
/* Inline controls */
.minicolors-inline .minicolors-input,
.minicolors-inline .minicolors-swatch {
display: none;
}
.minicolors-inline .minicolors-panel {
position: relative;
top: auto;
left: auto;
display: inline-block;
}
/*
* Bootstrap Theme (theme: 'bootstrap')
*
*/
/* Input styles */
.minicolors-theme-bootstrap .minicolors-input {
padding: 4px 6px;
padding-left: 30px;
background-color: white;
border: 1px solid #CCC;
border-radius: 3px;
color: #555;
font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
font-size: 14px;
height: 19px;
margin: 0px;
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
/* When the input has focus */
.minicolors-theme-bootstrap.minicolors-focus .minicolors-input {
border-color: #6fb8f1;
box-shadow: 0 0 10px #6fb8f1;
outline: none;
}
/* Swatch styles */
.minicolors-theme-bootstrap .minicolors-swatch {
position: absolute;
left: 4px;
top: 4px;
z-index: 2;
}
/* Handle swatch position (left = default / right) */
.minicolors-theme-bootstrap.minicolors-swatch-position-right .minicolors-input {
padding-left: 6px;
padding-right: 30px;
}
.minicolors-theme-bootstrap.minicolors-swatch-position-right .minicolors-swatch {
left: auto;
right: 4px;
}
/* Panel styles */
.minicolors-theme-bootstrap .minicolors-panel {
top: 28px;
z-index: 3;
}
/* Handle panel positions (top / left) */
.minicolors-theme-bootstrap.minicolors-position-top .minicolors-panel {
top: -154px;
}
.minicolors-theme-bootstrap.minicolors-position-left .minicolors-panel {
left: -63px;
}
/* Don't forget to adjust the left position in case the opacity slider is visible! */
.minicolors-theme-bootstrap.minicolors-position-left.minicolors-with-opacity .minicolors-panel {
left: -84px;
}

857
sources/libs/jquery.minicolors.js Normal file
View file

@ -0,0 +1,857 @@
/*
* jQuery MiniColors: A tiny color picker built on jQuery
*
* Copyright Cory LaViska for A Beautiful Site, LLC. (http://www.abeautifulsite.net/)
*
* Dual-licensed under the MIT and GPL Version 2 licenses
*
*/
if(jQuery) (function($) {
// Yay, MiniColors!
$.minicolors = {
// Default settings
defaultSettings: {
animationSpeed: 100,
animationEasing: 'swing',
change: null,
changeDelay: 0,
control: 'hue',
defaultValue: '',
hide: null,
hideSpeed: 100,
inline: false,
letterCase: 'lowercase',
opacity: false,
position: 'default',
show: null,
showSpeed: 100,
swatchPosition: 'left',
textfield: true,
theme: 'default'
}
};
// Public methods
$.extend($.fn, {
minicolors: function(method, data) {
switch(method) {
// Destroy the control
case 'destroy':
$(this).each( function() {
destroy($(this));
});
return $(this);
// Hide the color picker
case 'hide':
hide();
return $(this);
// Get/set opacity
case 'opacity':
if( data === undefined ) {
// Getter
return $(this).attr('data-opacity');
} else {
// Setter
$(this).each( function() {
refresh($(this).attr('data-opacity', data));
});
return $(this);
}
// Get an RGB(A) object based on the current color/opacity
case 'rgbObject':
return rgbObject($(this), method === 'rgbaObject');
// Get an RGB(A) string based on the current color/opacity
case 'rgbString':
case 'rgbaString':
return rgbString($(this), method === 'rgbaString')
// Get/set settings on the fly
case 'settings':
if( data === undefined ) {
return $(this).data('minicolors-settings');
} else {
// Setter
$(this).each( function() {
var settings = $(this).data('minicolors-settings') || {};
destroy($(this));
$(this).minicolors($.extend(true, settings, data));
});
return $(this);
}
// Show the color picker
case 'show':
show( $(this).eq(0) );
return $(this);
// Get/set the hex color value
case 'value':
if( data === undefined ) {
// Getter
return $(this).val();
} else {
// Setter
$(this).each( function() {
refresh($(this).val(data));
});
return $(this);
}
// Initializes the control
case 'create':
default:
if( method !== 'create' ) data = method;
$(this).each( function() {
init($(this), data);
});
return $(this);
}
}
});
// Initialize input elements
function init(input, settings) {
var minicolors = $('<span class="minicolors" />'),
defaultSettings = $.minicolors.defaultSettings;
// Do nothing if already initialized
if( input.data('minicolors-initialized') ) return;
// Handle settings
settings = $.extend(true, {}, defaultSettings, settings);
// The wrapper
minicolors
.addClass('minicolors-theme-' + settings.theme)
.addClass('minicolors-swatch-position-' + settings.swatchPosition)
.toggleClass('minicolors-swatch-left', settings.swatchPosition === 'left')
.toggleClass('minicolors-with-opacity', settings.opacity);
// Custom positioning
if( settings.position !== undefined ) {
$.each(settings.position.split(' '), function() {
minicolors.addClass('minicolors-position-' + this);
});
}
// The input
input
.addClass('minicolors-input')
.data('minicolors-initialized', true)
.data('minicolors-settings', settings)
.prop('size', 7)
.prop('maxlength', 7)
.wrap(minicolors)
.after(
'<span class="minicolors-panel minicolors-slider-' + settings.control + '">' +
'<span class="minicolors-slider">' +
'<span class="minicolors-picker"></span>' +
'</span>' +
'<span class="minicolors-opacity-slider">' +
'<span class="minicolors-picker"></span>' +
'</span>' +
'<span class="minicolors-grid">' +
'<span class="minicolors-grid-inner"></span>' +
'<span class="minicolors-picker"><span></span></span>' +
'</span>' +
'</span>'
);
// Prevent text selection in IE
input.parent().find('.minicolors-panel').on('selectstart', function() { return false; }).end();
// Detect swatch position
if( settings.swatchPosition === 'left' ) {
// Left
input.before('<span class="minicolors-swatch"><span></span></span>');
} else {
// Right
input.after('<span class="minicolors-swatch"><span></span></span>');
}
// Disable textfield
if( !settings.textfield ) input.addClass('minicolors-hidden');
// Inline controls
if( settings.inline ) input.parent().addClass('minicolors-inline');
updateFromInput(input, false, true);
}
// Returns the input back to its original state
function destroy(input) {
var minicolors = input.parent();
// Revert the input element
input
.removeData('minicolors-initialized')
.removeData('minicolors-settings')
.removeProp('size')
.removeProp('maxlength')
.removeClass('minicolors-input');
// Remove the wrap and destroy whatever remains
minicolors.before(input).remove();
}
// Refresh the specified control
function refresh(input) {
updateFromInput(input);
}
// Shows the specified dropdown panel
function show(input) {
var minicolors = input.parent(),
panel = minicolors.find('.minicolors-panel'),
settings = input.data('minicolors-settings');
// Do nothing if uninitialized, disabled, inline, or already open
if( !input.data('minicolors-initialized') ||
input.prop('disabled') ||
minicolors.hasClass('minicolors-inline') ||
minicolors.hasClass('minicolors-focus')
) return;
hide();
minicolors.addClass('minicolors-focus');
panel
.stop(true, true)
.fadeIn(settings.showSpeed, function() {
if( settings.show ) settings.show.call(input);
});
}
// Hides all dropdown panels
function hide() {
$('.minicolors-input').each( function() {
var input = $(this),
settings = input.data('minicolors-settings'),
minicolors = input.parent();
// Don't hide inline controls
if( settings.inline ) return;
minicolors.find('.minicolors-panel').fadeOut(settings.hideSpeed, function() {
if(minicolors.hasClass('minicolors-focus')) {
if( settings.hide ) settings.hide.call(input);
}
minicolors.removeClass('minicolors-focus');
});
});
}
// Moves the selected picker
function move(target, event, animate) {
var input = target.parents('.minicolors').find('.minicolors-input'),
settings = input.data('minicolors-settings'),
picker = target.find('[class$=-picker]'),
offsetX = target.offset().left,
offsetY = target.offset().top,
x = Math.round(event.pageX - offsetX),
y = Math.round(event.pageY - offsetY),
duration = animate ? settings.animationSpeed : 0,
wx, wy, r, phi;
// Touch support
if( event.originalEvent.changedTouches ) {
x = event.originalEvent.changedTouches[0].pageX - offsetX;
y = event.originalEvent.changedTouches[0].pageY - offsetY;
}
// Constrain picker to its container
if( x < 0 ) x = 0;
if( y < 0 ) y = 0;
if( x > target.width() ) x = target.width();
if( y > target.height() ) y = target.height();
// Constrain color wheel values to the wheel
if( target.parent().is('.minicolors-slider-wheel') && picker.parent().is('.minicolors-grid') ) {
wx = 75 - x;
wy = 75 - y;
r = Math.sqrt(wx * wx + wy * wy);
phi = Math.atan2(wy, wx);
if( phi < 0 ) phi += Math.PI * 2;
if( r > 75 ) {
r = 75;
x = 75 - (75 * Math.cos(phi));
y = 75 - (75 * Math.sin(phi));
}
x = Math.round(x);
y = Math.round(y);
}
// Move the picker
if( target.is('.minicolors-grid') ) {
picker
.stop(true)
.animate({
top: y + 'px',
left: x + 'px'
}, duration, settings.animationEasing, function() {
updateFromControl(input, target);
});
} else {
picker
.stop(true)
.animate({
top: y + 'px'
}, duration, settings.animationEasing, function() {
updateFromControl(input, target);
});
}
}
// Sets the input based on the color picker values
function updateFromControl(input, target) {
function getCoords(picker, container) {
var left, top;
if( !picker.length || !container ) return null;
left = picker.offset().left;
top = picker.offset().top;
return {
x: left - container.offset().left + (picker.outerWidth() / 2),
y: top - container.offset().top + (picker.outerHeight() / 2)
};
}
var hue, saturation, brightness, rgb, x, y, r, phi,
hex = input.val(),
opacity = input.attr('data-opacity'),
// Helpful references
minicolors = input.parent(),
settings = input.data('minicolors-settings'),
panel = minicolors.find('.minicolors-panel'),
swatch = minicolors.find('.minicolors-swatch'),
// Panel objects
grid = minicolors.find('.minicolors-grid'),
slider = minicolors.find('.minicolors-slider'),
opacitySlider = minicolors.find('.minicolors-opacity-slider'),
// Picker objects
gridPicker = grid.find('[class$=-picker]'),
sliderPicker = slider.find('[class$=-picker]'),
opacityPicker = opacitySlider.find('[class$=-picker]'),
// Picker positions
gridPos = getCoords(gridPicker, grid),
sliderPos = getCoords(sliderPicker, slider),
opacityPos = getCoords(opacityPicker, opacitySlider);
// Handle colors
if( target.is('.minicolors-grid, .minicolors-slider') ) {
// Determine HSB values
switch(settings.control) {
case 'wheel':
// Calculate hue, saturation, and brightness
x = (grid.width() / 2) - gridPos.x;
y = (grid.height() / 2) - gridPos.y;
r = Math.sqrt(x * x + y * y);
phi = Math.atan2(y, x);
if( phi < 0 ) phi += Math.PI * 2;
if( r > 75 ) {
r = 75;
gridPos.x = 69 - (75 * Math.cos(phi));
gridPos.y = 69 - (75 * Math.sin(phi));
}
saturation = keepWithin(r / 0.75, 0, 100);
hue = keepWithin(phi * 180 / Math.PI, 0, 360);
brightness = keepWithin(100 - Math.floor(sliderPos.y * (100 / slider.height())), 0, 100);
hex = hsb2hex({
h: hue,
s: saturation,
b: brightness
});
// Update UI
slider.css('backgroundColor', hsb2hex({ h: hue, s: saturation, b: 100 }));
break;
case 'saturation':
// Calculate hue, saturation, and brightness
hue = keepWithin(parseInt(gridPos.x * (360 / grid.width())), 0, 360);
saturation = keepWithin(100 - Math.floor(sliderPos.y * (100 / slider.height())), 0, 100);
brightness = keepWithin(100 - Math.floor(gridPos.y * (100 / grid.height())), 0, 100);
hex = hsb2hex({
h: hue,
s: saturation,
b: brightness
});
// Update UI
slider.css('backgroundColor', hsb2hex({ h: hue, s: 100, b: brightness }));
minicolors.find('.minicolors-grid-inner').css('opacity', saturation / 100);
break;
case 'brightness':
// Calculate hue, saturation, and brightness
hue = keepWithin(parseInt(gridPos.x * (360 / grid.width())), 0, 360);
saturation = keepWithin(100 - Math.floor(gridPos.y * (100 / grid.height())), 0, 100);
brightness = keepWithin(100 - Math.floor(sliderPos.y * (100 / slider.height())), 0, 100);
hex = hsb2hex({
h: hue,
s: saturation,
b: brightness
});
// Update UI
slider.css('backgroundColor', hsb2hex({ h: hue, s: saturation, b: 100 }));
minicolors.find('.minicolors-grid-inner').css('opacity', 1 - (brightness / 100));
break;
default:
// Calculate hue, saturation, and brightness
hue = keepWithin(360 - parseInt(sliderPos.y * (360 / slider.height())), 0, 360);
saturation = keepWithin(Math.floor(gridPos.x * (100 / grid.width())), 0, 100);
brightness = keepWithin(100 - Math.floor(gridPos.y * (100 / grid.height())), 0, 100);
hex = hsb2hex({
h: hue,
s: saturation,
b: brightness
});
// Update UI
grid.css('backgroundColor', hsb2hex({ h: hue, s: 100, b: 100 }));
break;
}
// Adjust case
input.val( convertCase(hex, settings.letterCase) );
}
// Handle opacity
if( target.is('.minicolors-opacity-slider') ) {
if( settings.opacity ) {
opacity = parseFloat(1 - (opacityPos.y / opacitySlider.height())).toFixed(2);
} else {
opacity = 1;
}
if( settings.opacity ) input.attr('data-opacity', opacity);
}
// Set swatch color
swatch.find('SPAN').css({
backgroundColor: hex,
opacity: opacity
});
// Handle change event
doChange(input, hex, opacity);
}
// Sets the color picker values from the input
function updateFromInput(input, preserveInputValue, firstRun) {
var hex,
hsb,
opacity,
x, y, r, phi,
// Helpful references
minicolors = input.parent(),
settings = input.data('minicolors-settings'),
swatch = minicolors.find('.minicolors-swatch'),
// Panel objects
grid = minicolors.find('.minicolors-grid'),
slider = minicolors.find('.minicolors-slider'),
opacitySlider = minicolors.find('.minicolors-opacity-slider'),
// Picker objects
gridPicker = grid.find('[class$=-picker]'),
sliderPicker = slider.find('[class$=-picker]'),
opacityPicker = opacitySlider.find('[class$=-picker]');
// Determine hex/HSB values
hex = convertCase(parseHex(input.val(), true), settings.letterCase);
if( !hex ) hex = convertCase(parseHex(settings.defaultValue, true));
hsb = hex2hsb(hex);
// Update input value
if( !preserveInputValue ) input.val(hex);
// Determine opacity value
if( settings.opacity ) {
// Get from data-opacity attribute and keep within 0-1 range
opacity = input.attr('data-opacity') === '' ? 1 : keepWithin(parseFloat(input.attr('data-opacity')).toFixed(2), 0, 1);
if( isNaN(opacity) ) opacity = 1;
input.attr('data-opacity', opacity);
swatch.find('SPAN').css('opacity', opacity);
// Set opacity picker position
y = keepWithin(opacitySlider.height() - (opacitySlider.height() * opacity), 0, opacitySlider.height());
opacityPicker.css('top', y + 'px');
}
// Update swatch
swatch.find('SPAN').css('backgroundColor', hex);
// Determine picker locations
switch(settings.control) {
case 'wheel':
// Set grid position
r = keepWithin(Math.ceil(hsb.s * 0.75), 0, grid.height() / 2);
phi = hsb.h * Math.PI / 180;
x = keepWithin(75 - Math.cos(phi) * r, 0, grid.width());
y = keepWithin(75 - Math.sin(phi) * r, 0, grid.height());
gridPicker.css({
top: y + 'px',
left: x + 'px'
});
// Set slider position
y = 150 - (hsb.b / (100 / grid.height()));
if( hex === '' ) y = 0;
sliderPicker.css('top', y + 'px');
// Update panel color
slider.css('backgroundColor', hsb2hex({ h: hsb.h, s: hsb.s, b: 100 }));
break;
case 'saturation':
// Set grid position
x = keepWithin((5 * hsb.h) / 12, 0, 150);
y = keepWithin(grid.height() - Math.ceil(hsb.b / (100 / grid.height())), 0, grid.height());
gridPicker.css({
top: y + 'px',
left: x + 'px'
});
// Set slider position
y = keepWithin(slider.height() - (hsb.s * (slider.height() / 100)), 0, slider.height());
sliderPicker.css('top', y + 'px');
// Update UI
slider.css('backgroundColor', hsb2hex({ h: hsb.h, s: 100, b: hsb.b }));
minicolors.find('.minicolors-grid-inner').css('opacity', hsb.s / 100);
break;
case 'brightness':
// Set grid position
x = keepWithin((5 * hsb.h) / 12, 0, 150);
y = keepWithin(grid.height() - Math.ceil(hsb.s / (100 / grid.height())), 0, grid.height());
gridPicker.css({
top: y + 'px',
left: x + 'px'
});
// Set slider position
y = keepWithin(slider.height() - (hsb.b * (slider.height() / 100)), 0, slider.height());
sliderPicker.css('top', y + 'px');
// Update UI
slider.css('backgroundColor', hsb2hex({ h: hsb.h, s: hsb.s, b: 100 }));
minicolors.find('.minicolors-grid-inner').css('opacity', 1 - (hsb.b / 100));
break;
default:
// Set grid position
x = keepWithin(Math.ceil(hsb.s / (100 / grid.width())), 0, grid.width());
y = keepWithin(grid.height() - Math.ceil(hsb.b / (100 / grid.height())), 0, grid.height());
gridPicker.css({
top: y + 'px',
left: x + 'px'
});
// Set slider position
y = keepWithin(slider.height() - (hsb.h / (360 / slider.height())), 0, slider.height());
sliderPicker.css('top', y + 'px');
// Update panel color
grid.css('backgroundColor', hsb2hex({ h: hsb.h, s: 100, b: 100 }));
break;
}
// Handle change event
if( !firstRun ) doChange(input, hex, opacity);
}
// Runs the change and changeDelay callbacks
function doChange(input, hex, opacity) {
var settings = input.data('minicolors-settings');
// Only run if it actually changed
if( hex + opacity !== input.data('minicolors-lastChange') ) {
// Remember last-changed value
input.data('minicolors-lastChange', hex + opacity);
// Fire change event
if( settings.change ) {
if( settings.changeDelay ) {
// Call after a delay
clearTimeout(input.data('minicolors-changeTimeout'));
input.data('minicolors-changeTimeout', setTimeout( function() {
settings.change.call(input, hex, opacity);
}, settings.changeDelay));
} else {
// Call immediately
settings.change.call(input, hex, opacity);
}
}
}
}
// Generates an RGB(A) object based on the input's value
function rgbObject(input) {
var hex = parseHex($(input).val(), true),
rgb = hex2rgb(hex),
opacity = $(input).attr('data-opacity');
if( !rgb ) return null;
if( opacity !== undefined ) $.extend(rgb, { a: parseFloat(opacity) });
return rgb;
}
// Genearates an RGB(A) string based on the input's value
function rgbString(input, alpha) {
var hex = parseHex($(input).val(), true),
rgb = hex2rgb(hex),
opacity = $(input).attr('data-opacity');
if( !rgb ) return null;
if( opacity === undefined ) opacity = 1;
if( alpha ) {
return 'rgba(' + rgb.r + ', ' + rgb.g + ', ' + rgb.b + ', ' + parseFloat(opacity) + ')';
} else {
return 'rgb(' + rgb.r + ', ' + rgb.g + ', ' + rgb.b + ')';
}
}
// Converts to the letter case specified in settings
function convertCase(string, letterCase) {
return letterCase === 'uppercase' ? string.toUpperCase() : string.toLowerCase();
}
// Parses a string and returns a valid hex string when possible
function parseHex(string, expand) {
string = string.replace(/[^A-F0-9]/ig, '');
if( string.length !== 3 && string.length !== 6 ) return '';
if( string.length === 3 && expand ) {
string = string[0] + string[0] + string[1] + string[1] + string[2] + string[2];
}
return '#' + string;
}
// Keeps value within min and max
function keepWithin(value, min, max) {
if( value < min ) value = min;
if( value > max ) value = max;
return value;
}
// Converts an HSB object to an RGB object
function hsb2rgb(hsb) {
var rgb = {};
var h = Math.round(hsb.h);
var s = Math.round(hsb.s * 255 / 100);
var v = Math.round(hsb.b * 255 / 100);
if(s === 0) {
rgb.r = rgb.g = rgb.b = v;
} else {
var t1 = v;
var t2 = (255 - s) * v / 255;
var t3 = (t1 - t2) * (h % 60) / 60;
if( h === 360 ) h = 0;
if( h < 60 ) { rgb.r = t1; rgb.b = t2; rgb.g = t2 + t3; }
else if( h < 120 ) {rgb.g = t1; rgb.b = t2; rgb.r = t1 - t3; }
else if( h < 180 ) {rgb.g = t1; rgb.r = t2; rgb.b = t2 + t3; }
else if( h < 240 ) {rgb.b = t1; rgb.r = t2; rgb.g = t1 - t3; }
else if( h < 300 ) {rgb.b = t1; rgb.g = t2; rgb.r = t2 + t3; }
else if( h < 360 ) {rgb.r = t1; rgb.g = t2; rgb.b = t1 - t3; }
else { rgb.r = 0; rgb.g = 0; rgb.b = 0; }
}
return {
r: Math.round(rgb.r),
g: Math.round(rgb.g),
b: Math.round(rgb.b)
};
}
// Converts an RGB object to a hex string
function rgb2hex(rgb) {
var hex = [
rgb.r.toString(16),
rgb.g.toString(16),
rgb.b.toString(16)
];
$.each(hex, function(nr, val) {
if (val.length === 1) hex[nr] = '0' + val;
});
return '#' + hex.join('');
}
// Converts an HSB object to a hex string
function hsb2hex(hsb) {
return rgb2hex(hsb2rgb(hsb));
}
// Converts a hex string to an HSB object
function hex2hsb(hex) {
var hsb = rgb2hsb(hex2rgb(hex));
if( hsb.s === 0 ) hsb.h = 360;
return hsb;
}
// Converts an RGB object to an HSB object
function rgb2hsb(rgb) {
var hsb = { h: 0, s: 0, b: 0 };
var min = Math.min(rgb.r, rgb.g, rgb.b);
var max = Math.max(rgb.r, rgb.g, rgb.b);
var delta = max - min;
hsb.b = max;
hsb.s = max !== 0 ? 255 * delta / max : 0;
if( hsb.s !== 0 ) {
if( rgb.r === max ) {
hsb.h = (rgb.g - rgb.b) / delta;
} else if( rgb.g === max ) {
hsb.h = 2 + (rgb.b - rgb.r) / delta;
} else {
hsb.h = 4 + (rgb.r - rgb.g) / delta;
}
} else {
hsb.h = -1;
}
hsb.h *= 60;
if( hsb.h < 0 ) {
hsb.h += 360;
}
hsb.s *= 100/255;
hsb.b *= 100/255;
return hsb;
}
// Converts a hex string to an RGB object
function hex2rgb(hex) {
hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
return {
r: hex >> 16,
g: (hex & 0x00FF00) >> 8,
b: (hex & 0x0000FF)
};
}
// Handle events
$(document)
// Hide on clicks outside of the control
.on('mousedown.minicolors touchstart.minicolors', function(event) {
if( !$(event.target).parents().add(event.target).hasClass('minicolors') ) {
hide();
}
})
// Start moving
.on('mousedown.minicolors touchstart.minicolors', '.minicolors-grid, .minicolors-slider, .minicolors-opacity-slider', function(event) {
var target = $(this);
event.preventDefault();
$(document).data('minicolors-target', target);
move(target, event, true);
})
// Move pickers
.on('mousemove.minicolors touchmove.minicolors', function(event) {
var target = $(document).data('minicolors-target');
if( target ) move(target, event);
})
// Stop moving
.on('mouseup.minicolors touchend.minicolors', function() {
$(this).removeData('minicolors-target');
})
// Toggle panel when swatch is clicked
.on('mousedown.minicolors touchstart.minicolors', '.minicolors-swatch', function(event) {
var input = $(this).parent().find('.minicolors-input'),
minicolors = input.parent();
if( minicolors.hasClass('minicolors-focus') ) {
hide(input);
} else {
show(input);
}
})
// Show on focus
.on('focus.minicolors', '.minicolors-input', function(event) {
var input = $(this);
if( !input.data('minicolors-initialized') ) return;
show(input);
})
// Fix hex on blur
.on('blur.minicolors', '.minicolors-input', function(event) {
var input = $(this),
settings = input.data('minicolors-settings');
if( !input.data('minicolors-initialized') ) return;
// Parse Hex
input.val(parseHex(input.val(), true));
// Is it blank?
if( input.val() === '' ) input.val(parseHex(settings.defaultValue, true));
// Adjust case
input.val( convertCase(input.val(), settings.letterCase) );
})
// Handle keypresses
.on('keydown.minicolors', '.minicolors-input', function(event) {
var input = $(this);
if( !input.data('minicolors-initialized') ) return;
switch(event.keyCode) {
case 9: // tab
hide();
break;
case 27: // esc
hide();
input.blur();
break;
}
})
// Update on keyup
.on('keyup.minicolors', '.minicolors-input', function(event) {
var input = $(this);
if( !input.data('minicolors-initialized') ) return;
updateFromInput(input, true);
})
// Update on paste
.on('paste.minicolors', '.minicolors-input', function(event) {
var input = $(this);
if( !input.data('minicolors-initialized') ) return;
setTimeout( function() {
updateFromInput(input, true);
}, 1);
});
})(jQuery);

BIN
sources/libs/jquery.minicolors.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 76 KiB

150
sources/libs/main.css Normal file
View file

@ -0,0 +1,150 @@
body {
padding-top: 20px;
padding-bottom: 60px;
color: #5a5a5a;
}
.float_right {
float: right;
}
.float_left {
float: left;
}
.clear {
clear: both;
}
.center {
text-align: center;
}
/* Custom container */
.container {
margin: 0 auto;
max-width: 1000px;
}
.container > hr {
margin: 60px 0;
}
/* Main marketing message and sign up button */
.jumbotron {
margin: 80px 0px 40px 0px;
text-align: center;
}
.jumbotron h1 {
font-size: 100px;
line-height: 1;
}
.jumbotron .lead {
font-size: 24px;
line-height: 1.25;
}
.jumbotron .btn {
font-size: 21px;
padding: 14px 24px;
}
/* Customize the navbar links to be fill the entire space of the .navbar */
.navbar .navbar-inner {
padding: 0;
}
.navbar .nav {
margin: 0;
display: table;
width: 100%;
}
.navbar .nav li {
display: table-cell;
width: 1%;
float: none;
}
.navbar .nav li a {
font-weight: bold;
text-align: center;
border-left: 1px solid rgba(255,255,255,.75);
border-right: 1px solid rgba(0,0,0,.1);
}
.navbar .nav li:first-child a {
border-left: 0;
border-radius: 3px 0 0 3px;
}
.navbar .nav li:last-child a {
border-right: 0;
border-radius: 0 3px 3px 0;
}
/* MARKETING CONTENT -------------------------------------------------- */
/* Center align the text within the three columns below the carousel */
.marketing .span4 {
text-align: center;
}
.marketing h2 {
font-weight: normal;
}
.marketing .span4 p {
margin-left: 10px;
margin-right: 10px;
}
/* Featurettes ------------------------- */
.featurette-divider {
margin: 80px 0; /* Space out the Bootstrap <hr> more */
}
.featurette {
/*padding-top: 120px;*/ /* Vertically center images part 1: add padding above and below text. */
overflow: hidden; /* Vertically center images part 2: clear their floats. */
}
.featurette-image {
/*margin-top: -120px;*/ /* Vertically center images part 3: negative margin up the image the same amount of the padding to center it. */
}
/* Give some space on the sides of the floated elements so text doesn't run right into it. */
.featurette-image.pull-left {
margin-right: 40px;
}
.featurette-image.pull-right {
margin-left: 40px;
}
/* Thin out the marketing headings */
.featurette-heading {
font-size: 50px;
font-weight: 300;
line-height: 1;
letter-spacing: -1px;
}
/* RESPONSIVE CSS -------------------------------------------------- */
@media (max-width: 979px) {
.featurette {
height: auto;
padding: 0;
}
.featurette-image.pull-left,
.featurette-image.pull-right {
display: block;
float: none;
max-width: 40%;
margin: 0 auto 20px;
}
}
@media (max-width: 767px) {
.featurette-heading {
font-size: 30px;
}
.featurette .lead {
font-size: 18px;
line-height: 1.5;
}
}

30
sources/libs/main.js Normal file
View file

@ -0,0 +1,30 @@
//Navigation menu scroll
$(function() {
$('.navegable').click(function() {
$('#navigation li').removeClass('active');
$(this).parent('li').addClass('active');
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var $target = $(this.hash);
$target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');
if ($target.length) {
var targetOffset = $target.offset().top - 80;
$('html,body').animate({scrollTop: targetOffset}, 1000);
return false;
}
}
});
});
function GetSitePath() {
var rootPath = window.location.protocol + "//" + window.location.host;
var path = window.location.pathname;
if (path.lastIndexOf("/") == 0) {
path = path.substring(1);
}
path = path.substr(0,path.lastIndexOf("/"));
if (path != "") {
rootPath = rootPath + path + '/';
}
return rootPath;
}

0
sources/libs/plugin.css Normal file
View file

169
sources/plugin/jquery.postitall.css Normal file
View file

@ -0,0 +1,169 @@
.PIAtitle {
font-size: 14px;
margin-left: 5px;
}
.PIAdate {
float:left;
line-height:10px;
font-size: 9px;
}
.minicolors-panel {
border: solid 20px #555;
}
#chmenu {
position: absolute;
display: none;
z-index: 100000;
width: 275px;
height: 20px;
}
#chmenu label{
display: inline;
}
.PIAtoolbar .PIAchopt {
background-image: url(data:image/gif;base64,R0lGODlhDQANAMwAAF5eXm5ubktLS29vb0xMTFlZWVxcXFBQUGRkZE5OTqWlpbS0tLa1tU9PT01OTU1NTZSUlJOTk6Sjo6WmpaSkpLOzs2VlZaenp5GSkXBwcO/v7wAAAAAAAAAAAAAAAAAAACH5BAEAABoALAAAAAANAA0AAAU7IPQQZFkm12EAbNsW1pQNdG0zWq7vfM9HBIFwOEwoVK5kAaEYBJ7Q6MJHreYwQSLRIWmski8ExRktV0IAOw==);
float: right;
}
#chmenu ul {
top: 20px;
margin: 0;
list-style: none;
padding: 0;
position: absolute;
width: 275px;
}
#chmenu ul li {
font: 14px;
margin-right: -4px;
position: relative;
padding: 5px 20px;
cursor: pointer;
background: #555;
display: block;
color: #fff;
}
#chmenu ul li:hover { background: #666; }
.center { text-align: center; }
.float-left { float: left; }
.float-right { float: right; }
.vertical-bottom { vertical-align: bottom; }
.vertical-middle { vertical-align: middle; }
.vertical-top { vertical-align: top; }
.clear { clear: both; }
.red { color: red; }
.red a { color: red; font-weight: bold; text-decoration: none; }
.red a:hover { text-decoration: underline; }
/* Postit */
.PIApostit {
/*color: #333;
min-width:130px;
min-height:150px;*/
padding:4px;
font-size:85%;
position:absolute;
display: none;
z-index: 9995;
background: -moz-linear-gradient(top, rgba(255,255,255,0.46) 0%, rgba(255,255,255,0) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.46)), color-stop(100%,rgba(255,255,255,0)));
background: -webkit-linear-gradient(top, rgba(255,255,255,0.46) 0%,rgba(255,255,255,0) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,0.46) 0%,rgba(255,255,255,0) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,0.46) 0%,rgba(255,255,255,0) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,0.46) 0%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#75ffffff', endColorstr='#00ffffff',GradientType=0 );
}
.PIAicon {
cursor: pointer;
float: left;
width:20px;
height:20px;
background-position: center;
margin-right: 2px;
background-repeat: no-repeat;
/*background-color: #ffd;
-webkit-border-radius: 4px 4px 4px 4px;
-moz-border-radius: 4px 4px 4px 4px;
border-radius: 4px 4px 4px 4px;
border: 1px solid #bbb;*/
}
.PIApostit div.PIAtoolbar {
text-align:left;
cursor: move;
padding-bottom: 5px;
height: 16px;
color: #888;
}
.PIApostit div.PIAeditable {
clear: both;
cursor:pointer;
position:relative;
min-height:50px;
}
/** xxx **/
.PIAeditable > input, .PIAeditable > textarea, .PIAeditable[contenteditable="true"], .PIAeditable > select {
border: 0px;
background-color: transparent;
box-shadow: none;
}
.PIApostit div.PIAeditable:focus {
outline: none;
}
.PIApostit div.PIAcontent {
padding: 5px;
}
.ui-resizable-helper { border: 1px dotted gray; }
/* FLIP-CARD */
.panel {
float: left;
border:1px solid gray;
-moz-box-shadow:4px 4px 4px #999999;
-webkit-box-shadow:4px 4px 4px #999999;
box-shadow:4px 4px 4px #999999;
-webkit-perspective: 600px;
-moz-perspective: 600px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
/* -- make sure to declare a default for every property that you want animated -- */
/* -- general styles, including Y axis rotation -- */
.panel .front {
float: none;
position: absolute;
top: 5px;
width: 99%;
height: 99%;
-moz-transform: rotateX(0deg) rotateY(0deg); /* FF3.5/3.6 */
-o-transform: rotateX(0deg) rotateY(0deg); /* Opera 10.5 */
-webkit-transform: rotateX(0deg) rotateY(0deg); /* Saf3.1+ */
transform: rotateX(0deg) rotateY(0deg); /* Newer browsers (incl IE9) */
/*filter: progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476); /* IE6,IE7 */
/*-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(SizingMethod='auto expand', M11=0.7071067811865476, M12=-0.7071067811865475, M21=0.7071067811865475, M22=0.7071067811865476)"; /* IE8 */
-webkit-transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
-moz-transform-style: preserve-3d;
-moz-backface-visibility: hidden;
-o-transform-style: preserve-3d;
-o-backface-visibility: hidden;
transform-style: preserve-3d;
backface-visibility: hidden;
/* -- transition is the magic sauce for animation -- */
-o-transition: all .4s ease-in-out;
-ms-transition: all .4s ease-in-out;
-moz-transition: all .4s ease-in-out;
-webkit-transition: all .4s ease-in-out;
transition: all .4s ease-in-out;
}

465
sources/plugin/jquery.postitall.js Normal file
View file

@ -0,0 +1,465 @@
/**
* jquery.postitall.js specific to ChtickyNotes by chtixof
* written on the basis of jquery.postitall.js v0.1 - 2015
* Original notice:
* jQuery Post It All Plugin - released under MIT License
* Author: Javi Filella <txusko@gmail.com>
* http://github.com/txusko/PostItAll
* Copyright (c) 2013 Javi Filella
*
* Permission is hereby granted, free of charge, to any person
* obtaining a copy of this software and associated documentation
* files (the "Software"), to deal in the Software without
* restriction, including without limitation the rights to use,
* copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the
* Software is furnished to do so, subject to the following
* conditions:
*
* The above copyright notice and this permission notice shall be
* included in all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
* OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
* HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
* WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
* OTHER DEALINGS IN THE SOFTWARE.
*/
(function ($) {
"use strict";
// Global Vars
var options;
var nextid = -1;
var zindex=9995;
var tobesaved=false;
var cssidsave="";
var actson;
// for css color settings
function rgb2hex(rgb) {
if (/^#[0-9A-F]{6}$/i.test(rgb)) return rgb;
rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
function hex(x) {
return ("0" + parseInt(x).toString(16)).slice(-2);
}
return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
}
// actions in case of any change
function settobesaved() {
tobesaved=true;
if(cssidsave!=="") {
$(cssidsave).css("display", "");
}
}
// menu items to select color
function selcolor(idli,idinput,label,cssatt,optvar){
$(idli).html("");
$(idli).append($('<label />',{'for': idinput}).html(label+' &nbsp; '))
.append($('<input />', {
'class': 'minicolors',
'id': idinput,
'type': 'text',
'value': rgb2hex($(actson).css(cssatt)),
'width': '75px'
}));
$('#'+idinput).minicolors({
change: function (hex) {
$(actson).css(cssatt, hex);
$(actson).data('PIA-options')[optvar]=hex;
settobesaved();
}
});
}
// displays option menu
function chopt(e) {
//right position
$('#chmenu').css('left',$(this).offset().left);
$('#chmenu').css('top',$(this).offset().top);
//what note menu acts on
actson = $(this).parent().parent().parent();
//set bgcolor
selcolor('#chbg', 'minicolors_bg', 'Background-color','background-color','backgroundcolor');
//set text color
selcolor('#chco', 'minicolors_tx', 'Text-color','color','textcolor');
//set hide/show date
$('#chda').html(actson.data('PIA-options').showdate ? 'Hide the date' : 'Display the date');
//show
$('#chmenu').show();
}
// action menu delete
function chdelete(e) {
$('#chmenu').hide();
destroy($(actson));
e.preventDefault();
return(0);
}
// action menu clone
function chclone(e) {
var options = $.extend({},$(actson).data('PIA-options'));
$('#chmenu').hide();
options.posX=(parseInt(options.posX)+50)+"px";
options.posY=(parseInt(options.posY)-50)+"px";
delete options.id;
delete options.date;
$('#addanote_result').postitall(options);
return(0);
}
// action menu display date
function chdate(e) {
$('#chmenu').hide();
actson.data('PIA-options').showdate = !actson.data('PIA-options').showdate ;
if (actson.data('PIA-options').showdate) {
$(".PIAdate",actson).show();
} else {
$(".PIAdate",actson).hide();
}
return(0);
}
//Destroy object
function destroy(obj) {
var id = obj.data('PIA-id');
options = obj.data('PIA-options');
//Destroy object
obj
.removeData('PIA-id')
.removeData('PIA-settings')
.hide("slow", function () {
$(this).remove();
});
settobesaved();
}
//Autoresize postit
function autoresize(obj) {
var id = obj.data('PIA-id');
options = obj.data('PIA-options');
if (options.autoheight) {
var posY = $('#idPostIt_' + id).parent().css('left'),
posX = $('#idPostIt_' + id).parent().css('top'),
divWidth = $('#idPostIt_' + id).width(),
divHeight = $('#idPostIt_' + id).find('.PIAeditable').height(),
minDivHeight = options.minHeight;
if (divHeight >= minDivHeight) {
divHeight += 50;
options.height = divHeight;
obj.css('height', divHeight);
if ($.ui) {
if (options.resizable) {
obj.resizable({
minHeight: divHeight
});
}
}
} else if (divHeight < minDivHeight) {
options.height = minDivHeight;
minDivHeight += 50;
obj.css('height', minDivHeight);
}
options.posY = posY;
options.posX = posX;
options.width = divWidth;
}
}
// Set options
function setOptions(opt, save) {
if (typeof opt !== 'object') {
opt = {};
}
if (save === undefined) {
save = false;
}
options = $.extend(options, opt);
/*jslint unparam: true*/
$.each(['onChange', 'onSelect', 'onRelease', 'onDblClick'], function (i, e) {
if (typeof options[e] !== 'function') {
options[e] = function () { return undefined; };
}
});
/*jslint unparam: false*/
if (save) {
settobesaved();
}
}
//Create a postit
function create(obj, options) {
obj.data('PIA-id', nextid)
.data('PIA-options', options);
//Postit editable content
if (options.description === "") {
if (obj.html() !== "") {
options.description = obj.html();
}
}
//Front page: toolbar
var barCursor = "cursor: inherit;";
if (options.draggable) {
barCursor = "cursor: move;";
}
var toolbar = $('<div />', {
'id': 'pia_toolbar_' + nextid.toString(),
'class': 'PIAtoolbar',
'style': barCursor
});
//Drag support without jQuery UI
if (!$.ui) {
if (options.draggable) {
toolbar.drags();
}
}
toolbar.html('<span class="PIAdate">'+options.date+'</span><span class="PIAtitle"></span>');
//Menu icon
toolbar.append($('<div />', {'class': 'PIAchopt PIAicon'}).click(chopt));
//Front page: content
var content = $('<div />', {
'id': 'pia_editable_' + nextid.toString(),
'class': 'PIAeditable PIAcontent'
}).change(function () {
options.description = $(this).html();
obj.data('PIA-options', options);
autoresize(obj);
settobesaved();
}).attr('contenteditable', true).html(options.description);
//Create postit
var postit = $('<div />', { 'id': 'idPostIt_' + nextid.toString(), 'data-id': nextid })
.append(toolbar).append(content);
//Convert relative position to prevent height and width in html layout
if (options.position === "relative") {
options.position = "absolute";
options.posX = obj.offset().top + parseInt(options.posX, 10) ;
options.posX += "px";
options.posY = obj.offset().left + parseInt(options.posY, 10) ;
options.posY += "px";
}
//Modify final Postit Object
obj.removeClass()
.addClass('block panel PIApostit')
.css('z-index', zindex++)
.css('position', options.position)
.css('left', options.posY)
.css('top', options.posX)
.css('width', options.width + 'px')
.css('height', (options.height + 30) + 'px') //Increase 30 pixels for the toolbar
.css('background-color', options.backgroundcolor)
.css('color', options.textcolor);
obj.html(postit)
.on('focus', '[contenteditable]', function () {
var objeto = $(this);
objeto.data('before', objeto.html());
return objeto;
}).on('blur keyup paste', '[contenteditable]', function () {
var objeto = $(this);
if (objeto.data('before') !== objeto.html()) {
objeto.data('before', objeto.html());
objeto.trigger('change');
}
return objeto;
}).click(function () {
$(this).css('z-index', zindex++);
settobesaved();
}).load(function () {
//Autoresize to fit content when content load is done
autoresize($(this));
});
if ($.ui) {
if (options.draggable) {
obj.draggable({
handle: ".PIAtoolbar",
scroll: false,
start: function () {
$(this).css('z-index', zindex++);
$(this).draggable('disable');
},
stop: function () {
$(this).draggable('enable');
autoresize($(this));
settobesaved();
}
});
}
if (options.resizable) {
obj.resizable({
animate: false,
helper: 'ui-resizable-helper',
minHeight: options.minHeight,
minWidth: options.minWidth,
stop: function () {
autoresize($(this));
settobesaved();
}
});
}
}
obj.slideDown('slow', function () {
});
settobesaved();
//chaining
return obj;
}
// Initialize elements
function init(obj, opt) {
if (++nextid===0) {
obj.append($('<div />', { 'id' : 'chmenu'}).mouseleave(function(){$(this).hide();})
.append($('<ul/>')
.append($('<li/>',{'id': 'chbg'}))
.append($('<li/>',{'id': 'chco'}))
.append($('<li/>',{'id': 'chda'}).click(chdate))
.append($('<li/>').click(chclone).append('Clone'))
.append($('<li/>').click(chdelete).append('Delete'))
)
);
}
//Default options
options = $.extend({}, $.fn.postitall.defaults);
options.id=nextid;
options.date= (new Date ()).toLocaleDateString () +'<br>'+ (new Date ()).toLocaleTimeString();
//Set options
if (typeof opt !== 'object') {
opt = {};
}
setOptions(opt);
var PIAcontent = $('<div />', { 'id' : 'newPostIt_' + nextid });
obj.append(PIAcontent);
return create(PIAcontent, options);
}
// PLUGIN Public methods
$.extend($.fn, {
postitall: function (method, data) {
//Debugging
var debugging = true; // or true
if (typeof console === "undefined") {
console = {
log: function () { return undefined; }
};
} else if (!debugging || console.log === undefined) {
console.log = function () { return undefined; };
}
switch (method) {
// Destroy the control
case 'destroy':
$(this).each(function () {
destroy($(this));
});
return $(this);
// Get/set options on the fly
case 'options':
if (data === undefined) {
return $(this).data('PIA-options');
}
// Setter
$(this).each(function () {
options = $(this).data('PIA-options') || {};
destroy($(this));
$(this).postitall($.extend(true, options, data));
});
return $(this);
case 'isittosave':
var answer=tobesaved;
tobesaved=false;
if (data !== undefined) {
cssidsave=data;
}
return (answer);
// Initializes the control
default:
//case 'create' :
if (method !== 'create') {
data = method;
}
$(this).each(function () {
init($(this), data);
});
return $(this);
}
}
});
// Default Plugin Vars
$.fn.postitall.defaults = {
// Basic Settings
showdate : true,
backgroundcolor : '#FFFC7F', //Background color
textcolor : '#333333', //Text color
position : 'absolute', //Position absolute or relative
posX : '50px', //top position
posY : '15px', //left position
height : 180, //height
width : 200, //width
minHeight : 152, //resizable min-width
minWidth : 131, //resizable min-height
description : '', //content
title : '',
autoheight : true, //Set autoheight feature on or off
draggable : true, //Set draggable feature on or off
resizable : true, //Set resizable feature on or off
removable : true, //Set removable feature on or off
// Callbacks / Event Handlers
onChange: function () { return undefined; },
onSelect: function () { return undefined; },
onDblClick: function () { return undefined; },
onRelease: function () { return undefined; }
};
//Drag postits
//used if jQuery UI is not loaded
$.fn.drags = function (opt) {
opt = $.extend({handle: "", cursor: "move"}, opt);
var $el = this;
if (opt.handle !== "") {
$el = this.find(opt.handle);
}
return $el.css('cursor', opt.cursor).on("mousedown", function (e) {
var $drag;
if (opt.handle === "") {
$drag = $(this).parent().parent().parent().addClass('draggable');
} else {
$drag = $(this).parent().parent().parent().addClass('active-handle').parent().addClass('draggable');
}
var z_idx = $drag.css('z-index'),
drg_h = $drag.outerHeight(),
drg_w = $drag.outerWidth(),
pos_y = $drag.offset().top + drg_h - e.pageY,
pos_x = $drag.offset().left + drg_w - e.pageX;
$drag.css('z-index', 1000000).parents().on("mousemove", function (e) {
$('.draggable').offset({
top: e.pageY + pos_y - drg_h,
left: e.pageX + pos_x - drg_w
}).on("mouseup", function () {
$(this).removeClass('draggable').css('z-index', z_idx);
});
});
e.preventDefault(); // disable selection
}).on("mouseup", function () {
if (opt.handle === "") {
$(this).removeClass('draggable');
} else {
$(this).removeClass('active-handle').parent().removeClass('draggable');
}
});
};
}(jQuery));