+++ /dev/null
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-<html>
-<head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
- <title>Upload Cropbox Dialog Example</title>
-
- <link rel="stylesheet" type="text/css" href="../../css/roojs-debug.css"/>
- <link rel="stylesheet" type="text/css" href="../../css-bootstrap/font-awesome.css"/>
- <link rel="stylesheet" type="text/css" href="../../css/upload-cropbox.css"/>
- <link rel="stylesheet" type="text/css" href="../../css/alert.css"/>
- <link rel="stylesheet" type="text/css" href="../../css/buttons.css"/>
- <link rel="stylesheet" type="text/css" href="../../css/button-groups.css"/>
- <link rel="stylesheet" type="text/css" href="../examples.css" />
-
- <script type="text/javascript" src="../../roojs-debug.js"></script>
- <script type="text/javascript" src="../../Roo/dialog/UploadCropbox.js"></script>
- <script language="javascript" src="test-2.js"></script>
- <script type="text/javascript" src="../examples.js"></script>
-
-</head>
-<body>
-
-<h1>Upload Cropbox Dialog</h1>
-<p>This example shows how to create a very simple BasicDialog with "UploadCropbox".</p>
-<input type="button" id="show-dialog-btn" value="test" /><br /><br />
-<p>Note that the js is not minified so it is readable. See
-<button type="button" onclick="RooDocs.viewSource.show('../../../Roo/dialog/UploadCropbox.js')">UploadCropbox.js</button>for the full source code.</p>
-
-</div>
-</body>
-</html>
+++ /dev/null
-var uploadCropbox = {
- dialog : false,
- callback : false,
-
- show : function(data, cb)
- {
- if (!this.dialog) {
- this.create();
- }
-
- this.callback = cb;
- this.data = data;
- this.dialog.show();
- },
-
- create : function()
- {
- var _this = this;
- this.dialog = Roo.factory({
- xns : Roo,
- xtype : 'LayoutDialog',
- width : 800,
- height : 600,
- center : {
- xns : Roo,
- xtype : 'LayoutRegion'
- },
- items : [
- {
- xtype: 'ContentPanel',
- xns: Roo,
- region : "center",
- items : [
- {
- xtype : 'UploadCropbox',
- xns : Roo.dialog,
- minWidth : 720,
- minHeight : 480,
- outputMaxWidth : 1300,
- url: 'http://localhost/web.MediaOutreach/press.local.php/Roo/Images.php',
- buttons: [],
- listeners : {
- render : function (_self)
- {
- _this.cropbox = _self;
- },
- loadcanvas : function (_self, imageEl)
- {
- if(imageEl.OriginWidth < 720) {
- Roo.Msg.show({
- title: 'Error',
- msg: "Image width should be at least 720",
- buttons: {ok : true},
- fn: function(res) {
- _this.cropbox.selectorEl.dom.value = '';
- _this.cropbox.selectorEl.dom.click();
- }
- });
- return false;
- }
- },
- arrange : function (_self, formData)
- {
- formData.append("onid", "43024");
- formData.append("ontable", "pressrelease_boilerplate");
- }
- }
- }
- ]
- }
- ],
- buttons : [
- {
- xtype : 'Button',
- xns : Roo,
- text : 'Save',
- listeners : {
- click : function () {
- _this.cropbox.crop();
- }
- }
- },
- {
- xtype : 'Button',
- xns : Roo,
- text : 'Cancel',
- listeners : {
- click : function () {
- _this.dialog.hide();
- }
- }
- }
- ]
- });
- }
-}
-
-var test = {
-
- dialog : false,
- callback : false,
-
- show : function(data, cb)
- {
- if (!this.dialog) {
- this.create();
- }
-
- this.callback = cb;
- this.data = data;
- this.dialog.show();
- },
-
- create : function()
- {
- var _this = this;
- this.dialog = Roo.factory({
- xns : Roo,
- xtype : 'LayoutDialog',
- width : 600,
- height : 450,
- center : {
- xns : Roo,
- xtype : 'LayoutRegion'
- },
- items : [
- {
- xns : Roo,
- xtype: 'GridPanel',
- region : "center",
- grid : {
- xns : Roo.grid,
- xtype : 'Grid',
- cm : [
- {
- xns : Roo.grid,
- xtype : 'ColumnModel',
- header : 'test'
- }
- ],
- ds : {
- xns: Roo.data,
- xtype: 'Store'
- },
- toolbar : {
- xns: Roo,
- xtype: 'Toolbar',
- items : [
- {
- xtype : 'Button',
- text : 'Add',
- listeners : {
- click : function () {
- uploadCropbox.show();
- document.body.onfocus = function(e) {
- if(!uploadCropbox.cropbox.selectorEl.dom.files.length) {
- uploadCropbox.dialog.hide();
- }
- }
- uploadCropbox.cropbox.selectorEl.dom.click();
- }
- }
- }
- ]
- }
- }
- }
- ],
- });
- }
-}
-
-Roo.onReady(function() {
-
- Roo.get('show-dialog-btn').on('click',function () {
- test.show({});
- });
-});
\ No newline at end of file
+++ /dev/null
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-<html>
-<head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
- <title>Upload Cropbox Dialog Example</title>
-
- <link rel="stylesheet" type="text/css" href="../../css/roojs-debug.css"/>
- <link rel="stylesheet" type="text/css" href="../../css-bootstrap/bootstrap.css"/>
- <link rel="stylesheet" type="text/css" href="../../css-bootstrap/font-awesome.css"/>
- <link rel="stylesheet" type="text/css" href="../../css-bootstrap/roojs-bootstrap-debug.css"/>
- <link rel="stylesheet" type="text/css" href="../examples.css" />
-
- <script type="text/javascript" src="../../roojs-debug.js"></script>
- <script type="text/javascript" src="../../roojs-bootstrap-debug.js"></script>
- <script language="javascript" src="test.js"></script>
- <script type="text/javascript" src="../examples.js"></script>
-
-</head>
-<body>
-
-<h1>Upload Cropbox Bootstrap</h1>
-<p>This example shows how to create a very simple modal BasicDialog with "autoTabs".</p>
-<input type="button" id="show-dialog-btn" value="test" /><br /><br />
-<p>Note that the js is not minified so it is readable. See
-<button type="button" onclick="RooDocs.viewSource.show('../../../Roo/bootstrap/UploadCropbox.js')">test.js</button>for the full source code.</p>
-
-</div>
-</body>
-</html>
+++ /dev/null
-var test = {
-
- dialog : false,
- callback : false,
-
- show : function(data, cb)
- {
- if (!this.dialog) {
- this.create();
- }
-
- this.callback = cb;
- this.data = data;
- this.dialog.show();
- },
-
- create : function()
- {
- var _this = this;
- this.dialog = Roo.factory({
- xtype : 'Modal',
- xns : Roo.bootstrap,
- title : 'Upload an Image',
- buttons : Roo.bootstrap.Modal.OKCANCEL,
- items: [
- {
- xtype : 'Row',
- xns : Roo.bootstrap,
- items: [
- {
- xtype : 'Column',
- xns : Roo.bootstrap,
- items: [
- {
- xtype : 'UploadCropbox',
- xns : Roo.bootstrap,
- minWidth : 720,
- minHeight: 480,
- listeners : {
- arrange : function (_self, formData)
- {
- console.log("ARRANGE");
- console.log(formData);
- },
- crop : function (_self, data)
- {
- console.log("CROP");
- console.log(data);
- },
- resize : function (_self)
- {
- console.log("RESIZE");
- },
- rotate : function (_self)
- {
- console.log("ROTATE");
- },
- render : function (_self)
- {
- console.log("RENDER");
- console.log(_self);
- _this.cropbox = _self;
- }
-
- }
- }
- ]
- }
- ]
- }
- ],
- listeners : {
- btnclick : function (e)
- {
- console.log(e);
- if(e == 'cancel') {
- _this.dialog.hide();
- return;
- }
-
- _this.cropbox.crop();
- }
- }
- });
- }
-}
-
-Roo.onReady(function() {
-
- Roo.get('show-dialog-btn').on('click',function () {
- test.show({});
- console.log(test);
- });
-});
\ No newline at end of file
projects / roojs1 / commitdiff