locomotive-aloha-rails 0.20.1

data/vendor/assets/javascripts/aloha/plugins/common/image/LICENSE

@@ -0,0 +1,25 @@
+Aloha Editor Image plugin
+=========================
+
+Aloha Editor Image Plugin is meant to be an free and open source for all now and in future.
+
+We encourage continuous, selfsustainable development supported by both the open source
+community and commercial stakeholders. This way both parties (community and commercial users)
+profit from each other by code and financial ressources for core developement.
+Therefore we adopted a dual licensing approach for Aloha Editor.
+
+Opensource Software License
+===========================
+The Open Source version of Aloha Editor Image Plugin is released under the terms of AGPLv3 License.
+http://www.gnu.org/licenses/agpl.html
+
+Commercial Software License
+============================
+The commercial version of Aloha Editor Image Plugin allows to use, modify, copy and distrubute without
+any restrictions as stated in the commerical license agreement.
+
+Translation License
+===================
+All contributions to translations of dictionary entries apply to the Creative Commons
+Attribution License V3.0 BY. By contributing transaltions you agree to the license terms.
+http://creativecommons.org/licenses/by/3.0/

data/vendor/assets/javascripts/aloha/plugins/common/image/README.md

@@ -0,0 +1,83 @@
+
+# The AlohaEditor Image Plugin
+
+Image Plugin for enabling basic images manipulations in Aloha HTML5 Editor
+
+## Features
+
+* Insert image
+* Edit url and title
+* set align
+* Handles [DragnDropFiles Plugin](https://github.com/alohaeditor/Aloha-Plugin-DragAndDropFiles) events for image files dropped in current page.
+* css resize with controlbuttons or mousedrag
+* reset to natural size (DEV)
+* canvas crop (EXPERIMENTAL)
+
+## Example conf
+
+    config: {
+			'img': {
+				'max_width': '50px',
+				'max_height': '50px',
+				//Image manipulation options - ONLY in default config section
+				'ui': {
+					'align': true,       // Menu elements to show/hide in menu
+					'resize': true,		 //resize buttons
+					'meta': true,
+					'margin': true,
+					'crop':true,
+					'resizable': true,   //resizable ui-drag image
+					'aspectRatio': true
+				},
+				/**
+				 * crop callback is triggered after the user clicked accept to accept his crop
+				 * @param image jquery image object reference
+				 * @param props cropping properties
+				 */
+				'onCropped':function (image, props) {},
+				/**
+				 * reset callback is triggered before the internal reset procedure is applied
+				 * if this function returns true, then the reset has been handled by the callback
+				 * which means that no other reset will be applied
+				 * if false is returned the internal reset procedure will be applied
+				 * @param image jquery image object reference
+				 * @return true if a reset has been applied, false otherwise
+				 */
+				'onReset': function (image) { return false; }
+			}
+		}
+
+## TODO
+
+* resize slider
+* canvas resize
+
+Copyright (c) 2010-2011 Gentics Software GmbH, aloha@gentics.com 
+
+Author : [Nicolas Karageuzian](https://github.com/nka11)
+
+Contributors :
+
+* [Nils Dehl](https://github.com/mrsunshine) 
+* [Benjamin Athur Lupton](https://github.com/balupton)
+* [Christopher Hlubek](https://github.com/chlu)
+* [Thomas Lete](https://github.com/bistory)
+* [Haymo Meran](https://github.com/draftkraft)
+* [Clemens Prerovsky](https://github.com/cprerovsky) (base of crop and resize feature is a borrow from cropnresize plugin)
+* [Norbert Pomaroli](https://github.com/npomaroli) (for his patience explaining Selection and Range)
+* [Kirk Austin](http://www.kirkaustin.com/) who gave the impulsion to dive into html5 canvas	
+
+Licensed under the terms of http://www.aloha-editor.org/license.html
+
+Aloha Editor is free software: you can redistribute it and/or modify
+it under the terms of the GNU Affero General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.*
+
+Aloha Editor is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU Affero General Public License for more details.
+
+You should have received a copy of the GNU Affero General Public License
+along with this program. If not, see <http://www.gnu.org/licenses/>.

data/vendor/assets/javascripts/aloha/plugins/common/image/css/image.css

@@ -0,0 +1,124 @@
+
+/* Images */
+button.aloha-image-align-left {
+    background: url(../img/image-align-left.png);
+}
+
+button.aloha-image-align-right {
+    background: url(../img/image-align-right.png);
+}
+
+button.aloha-image-align-none {
+    background: url(../img/image-align-none.png);
+}
+
+button.aloha-img.aloha-image-title {
+    background: url(../img/image-title.png);
+}
+
+button.aloha-img.aloha-image-border {
+    background: url(../img/image-border.png);
+}
+
+button.aloha-image-insert {
+    background: url(../img/image.gif) !important;
+}
+
+button.aloha-img.aloha-image-padding-increase {
+	background: url(../img/padding-increase.gif);
+}
+
+button.aloha-img.aloha-image-padding-decrease {
+	background: url(../img/padding-decrease.gif);
+}
+
+button.aloha-img.aloha-image-size-increase {
+	background: url(../img/size-increase.gif);
+}
+
+button.aloha-img.aloha-image-size-decrease {
+	background: url(../img/size-decrease.gif);
+}
+
+.aloha-default-file-icon {
+	background: url(../img/page.png);
+
+	width: 16px;
+	height:16px;
+	margin: 0;
+	padding:0;
+}
+
+/* Crop and Resize */
+button.cnr-resize.x-btn-text, button.cnr-crop.x-btn-text, button.cnr-reset.x-btn-text {
+	background: url(../img/cropnresize.png);
+}
+
+button.cnr-crop {
+	background-position: -2px -2px !important;
+}
+
+button.cnr-reset {
+	background-position: -42px -2px !important;
+}
+
+.cnr-ratio {
+	background-image: url(../img/cropnresize.png) !important;
+	background-position: -60px -2px !important;
+}
+
+#aloha-CropNResize-btns {
+	z-index: 10000;
+	width: 70px;
+	display: none;
+	position: absolute;
+}
+
+#aloha-CropNResize-btns button {
+	background: #ededed;
+	border: 1px solid #c6c6c6;
+	cursor: pointer;
+	color: #96ca03;
+	text-shadow: -1px -1px 1px rgba(0,0,0,0.3);
+	font-size: 16px;
+	border-radius: 3px;
+	-webkit-border-radius: 3px;
+	-moz-border-radius: 3px;
+	padding: 0px;
+	width: 23px;
+	height: 23px;
+	margin-right: 3px;
+}
+
+#aloha-CropNResize-btns button.cnr-crop-apply {
+	padding-left: 2px;
+}
+
+#aloha-CropNResize-btns button.cnr-crop-cancel {
+	color: #c92404;
+}
+
+/*
+ * fix to use big resize handle for images
+ */
+.ui-resizable-se {
+	width: 16px;
+	height: 16px;
+	background-position: -80px -224px !important;
+}
+
+
+.aloha-image-box-active {
+	-moz-box-shadow:	0px 2px 8px rgba(0, 0, 0, 0.2);
+	-webkit-box-shadow:	0px 2px 8px rgba(0, 0, 0, 0.2);
+	box-shadow:			0px 2px 8px rgba(0, 0, 0, 0.2);
+}
+
+.aloha-image-box-active .ui-resizable-handle.ui-resizable-nw {
+}
+.aloha-image-box-active .ui-resizable-handle.ui-resizable-ne {
+}
+.aloha-image-box-active .ui-resizable-handle.ui-resizable-se {
+}
+.aloha-image-box-active .ui-resizable-handle.ui-resizable-sw {
+}

data/vendor/assets/javascripts/aloha/plugins/common/image/demo/crop.html

@@ -0,0 +1,76 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+	<title>Aloha, World!</title>
+	<script src="../../lib/require.js" data-main="../../lib/aloha.js" id="aloha-script-include" data-plugins="common/format,common/highlighteditables,common/list,common/undo,common/paste,common/image"></script>
+	<link rel="stylesheet" href="../../css/aloha.css" id="aloha-style-include">
+	<link rel="stylesheet" href="../../demo/common/index.css" type="text/css">
+	<script type="text/javascript">
+	if (window.Aloha === undefined || window.Aloha === null)
+		Aloha = {};
+
+		Aloha.settings = {
+		"plugins": {
+		 	"com.gentics.aloha.plugins.Image": {
+				onCropped : function (image, props) {
+					// invoke the image cropper crop.php
+					image
+						.width(props.w) // set width
+						.height(props.h) // and height to new values
+						.attr("src", "crop.php?src=" // and adjust src to the cropped image
+							+ image.attr('src')
+							+ "&x=" + props.x 
+							+ "&y=" + props.y
+							+ "&w=" + props.w
+							+ "&h=" + props.h
+						);
+					jQuery("#info").append("<li>Cropped \"" + image.attr("src") + "\"</li>");
+				},
+				onResized : function (image) {
+					// this is the point where you would add a server-side image-resizer
+					jQuery("#info").append("<li>Resized \"" + image.attr("src") + "\"</li>");
+				},
+				onReset : function (image) {
+					// handle resetting the image
+					jQuery("#info").append("<li>Resetted \"" + image.attr("src") + "\" to it's initial state</li>");
+				},
+				aspectRatio : false, // if set to false the aspectRatio will not be maintained anymore when resizing
+				maxHeight : 500, // supply a maximum height for resizing
+				minHeight : 200, // and a minimum height
+				maxWidth : 700, // maximum image width for resizing
+				minWidth : 200, // and minimum width
+				grid : 100 // snap to an invisible grid when resizing
+			}
+		}
+	};
+
+	require.ready(function() {
+		// Prepare
+		var	$ = window.jQuery,
+			$body = $('body');
+
+		$body.bind('aloha',function(){
+			$('#title').aloha();
+			$('#teaser').aloha();
+			$('#content').aloha();
+		});
+	});
+	</script>
+</head>
+<body>
+<div id="main"> 
+<h1 id="title">Aloha, Images! (Extended Version :)</h1>
+<div id="bodyContent">
+<div id="teaser" class="shorttext">
+<p>This <b>extended example</b> is intended for developers planning to use the the CropNResize plugin found at <a href="https://github.com/alohaeditor/Aloha-Plugin-CropNResize">https://github.com/alohaeditor/Aloha-Plugin-CropNResize</a>. It displays the whole set of configuration options currently available. Well, just take a look at the code.</p>
+</div>
+<div id="content" class="article">
+<p>Click the image to start resizing right away, as a resize handle will appear in it's south-east corner.</p>
+<p><img src="cropnresize.jpg" /></p>
+</div>
+</div>
+<ol id="info"></ol>
+</div>
+</body>
+</html>

data/vendor/assets/javascripts/aloha/plugins/common/image/demo/crop.php

@@ -0,0 +1,21 @@
+<?php
+/**
+ * Simple, very basic image cropper for CropNResize plugin demonstration
+ * @author Clemens Prerovsky
+ */
+header('Content-type: image/jpeg');
+
+// load parameters from url
+$src = $_GET["src"];
+$x = intval($_GET["x"]);
+$y = intval($_GET["y"]);
+$w = intval($_GET["w"]);
+$h = intval($_GET["h"]);
+
+// resize image
+$img = imagecreatefromjpeg($src) or die("Error: unknown src");
+$cropped = imagecreatetruecolor($w, $h);
+imagecopyresampled($cropped, $img, 0, 0, $x, $y, $w, $h, $w, $h);
+imagejpeg($cropped);
+imagedestroy($cropped);
+?>

data/vendor/assets/javascripts/aloha/plugins/common/image/demo/index.html

@@ -0,0 +1,120 @@
+<!doctype html>
+<html>
+<head>
+	<meta charset="UTF-8">
+	<title>Aloha, Images!</title>
+
+
+<script type="text/javascript">
+	
+	(function(window, undefined) {
+
+		function _onCropped(image, props) {
+
+			var canvas = document.createElement('canvas'),
+			 	context = canvas.getContext("2d"),
+			 	img = image.get(0),
+			 	finalprops = {},
+			 	ratio = {img:{}, disp: {}};
+			
+			ratio.img.h = img.height;// image natural height
+			ratio.img.w = img.width;// image natural width
+			ratio.disp.h = image.height(); // image diplay heigth
+			ratio.disp.w = image.width(); // image diplay width
+			ratio.h = (ratio.img.h / ratio.disp.h);
+			ratio.w = (ratio.img.w / ratio.disp.w);
+			
+			/* 
+			var sourceX = 150;
+	        var sourceY = 0;
+	        var sourceWidth = 150;
+	        var sourceHeight = 150;
+	        var destWidth = sourceWidth;
+	        var destHeight = sourceHeight;
+	        var destX = canvas.width / 2 - destWidth / 2;
+	        var destY = canvas.height / 2 - destHeight / 2;
+			context.drawImage(imageObj, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight);
+			 */
+			 
+			// props are related to displayed size of image.
+			// apply w/h ratio to props to get fprops which will be related to 'real' image dimensions
+			finalprops.x = props.x * ratio.w;
+			finalprops.y = props.y * ratio.h;
+			finalprops.w = props.w * ratio.w;
+			finalprops.h = props.h * ratio.h;
+			context.drawImage(img,
+					finalprops.x, finalprops.y,
+					finalprops.w, finalprops.h,
+					0,0,
+//					props.x2, props.y2,
+					props.w, props.h);
+			$('body').append(canvas);
+		}
+
+		if (window.Aloha === undefined || window.Aloha === null) {
+			var Aloha = window.Aloha = {};		
+		}
+		
+		Aloha.settings = {
+
+			logLevels: {'error': true, 'warn': true, 'info': true, 'debug': false},
+				
+			'plugins': {
+				'image': {
+					'fixedAspectRatio': false,
+					'maxWidth': 1024,
+					'minWidth': 10,
+					'maxHeight': 786,
+					'minHeight': 10,
+					'globalselector': '.global',
+					'ui': {
+						'oneTab': false
+					}
+				}
+			}
+		};
+    
+    })(window);
+	</script>
+
+	<script src="../../../../lib/aloha.js" data-aloha-plugins="common/format, common/highlighteditables, common/image"></script>
+
+	<link rel="stylesheet" href="../../../../css/aloha.css" id="aloha-style-include" type="text/css">
+	<link rel="stylesheet" href="../../../../demo/common/index.css" type="text/css">
+	
+</head>
+<body>
+  <div id="main">
+  
+		<div id="tree-div"></div>
+		<h1 id="title">Aloha, Images!</h1>
+		<div id="bodyContent">
+			<div id="teaser" class="shorttext">
+				<p>This example will show you how to use the Image plugin found at <a href="https://github.com/alohaeditor/Aloha-Plugin-Image">https://github.com/alohaeditor/Aloha-Plugin-Image</a>.</p>
+			</div>
+			<div id="content" class="article">
+			
+				<p><img src="cropnresize.jpg"></p>
+				<p>Click the image to start resizing right away, as a resize handle will appear in it's south-east corner.</p>
+			
+				<p><em>Note:</em> This is a very simple example, that will not allow subsequent cropping actions, or cropping combined with resizing.</p>
+			</div>
+			
+			Outside of the editable
+			<p><img class="global" src="cropnresize.jpg"></p>
+		</div>
+		
+		
+  </div>
+	
+	
+	<script type="text/javascript">
+	Aloha.ready( function(){
+		var $ = Aloha.jQuery;
+		$('#title').aloha();
+		$('#teaser').aloha();
+		$('#content').aloha();
+	});
+  </script>
+</body>
+</html>