.Net Programming in Simple: June 2013

Thursday, 27 June 2013

DECLARE @Dt DATETIME

SET @Dt = GETDATE()
if (DATEPART(mm, @Dt)=2 and DATEPART(DD, @Dt)=26)
BEGIN
select * from tbl_Backup
END
else
begin
select * from tbl_MarkDetails
end

Check wheather a table is present in database or not

IF object_id('tbl23', 'U') is not null
PRINT 'Present!'
ELSE
PRINT 'Not accounted for'

avascript function to validate date format dd/mm/yyyy

var chkdate = document.getElementById("date_slot").value
    if(document.getElementById("date_slot").value == "")
    {
        alert("Please enter the Date..!!")
        hh.date_slot.focus();
        return false;
    }
  else if(!chkdate.match(/^(0[1-9]|[12][0-9]|3[01])[\- \/.](?:(0[1-9]|1[012])[\- \/.](19|20)[0-9]{2})$/))
        {
          alert('date format is wrong');
          hh.date_slot.focus();
        return false;
        }

Count the number of columns of a table

SELECT count(*)
FROM information_schema.columns
WHERE table_name = 'SIS_STUDENT_MST'

stylish popup in jquery

http://csscody.com/demo/wp-content/demo/popup/demo.htm

Fomatting date in boundfiled of gridview

<asp:BoundField DataField="remarksdate" DataFormatString="{0:d}">
<ItemStyle Width="20%" CssClass="DetailsContent" />
</asp:BoundField>

Opening a page in new tab on button click

<asp:Button ID="hlnkgoprint" runat="server" Text="Print"
CssClass= "submit btn primary-btn" OnClientClick="aspnetForm.target ='_blank';"
onclick="hlnkgoprint_Click"/>

Getting Distinct Records from datatable and dataset

Following single line of code will avoid the duplicate rows of a DataTable:

dataTable.DefaultView.ToTable(true, "employeeid");

Where:

first parameter in ToTable() is a boolean which indicates whether you want distinct rows or not.
second option in the ToTable() is the column name based on which we have to select distinct rows.

The same can be done from a DataSet, by accessing a specific DataTable:

dataSet.Tables["Employee"].DefaultView.ToTable(t

Changing Connectionstring string at runtime

for appsetting

Configuration configFile = ConfigurationManager.OpenExeConfiguration(Application.ExecutablePath);
configFile.AppSettings.Settings["User"].Value = "Hello World"; //User is the key variable name
configFile.Save();

for ConnectionString

Configuration config = ConfigurationManager.OpenExeConfiguration(ConfigurationUserLevel.None);
config.ConnectionStrings.ConnectionStrings.Remove("MyConnection");
config.ConnectionStrings.ConnectionStrings.Add(new ConnectionStringSettings(
"MyConnection",
String.Format("Provider={0};Data Source={1}",
"Microsoft.JET.OlEDB.4.0", "D:\\Database\\EQMAN.mdb")));
config.Save(ConfigurationSaveMode.Modified, true);
ConfigurationManager.RefreshSection("connectionStrings");

Getting created date and modified date of procedure

SELECT name, create_date, modify_date
FROM sys.objects
WHERE type = 'P'
AND name = 'spselectforallstutemp'

Convert date to particular format

Datetime TodayDate=system.datetime.now;
string TodayDates = TodayDate.ToString("yyyy-MM-dd");

Best jquery popup box

http://smashingspy.com/32-best-jquery-popup-window-dialog-box-example/

Rounded corner fieldset css

Datetime format in Access

DateTime TodayDate = System.DateTime.Today.Date;

DateTime DATE1 = Convert.ToDateTime(dateTimePicker1.Text.ToString());
string StartDate = objCommon.ReturnDate(DATE1);
DateTime DATE2 = Convert.ToDateTime(dateTimePicker2.Text.ToString());
string EndDate = objCommon.ReturnDate(DATE2);

public string ReturnDate(DateTime datetoCompare)
{
string NewDate = datetoCompare.ToString();
string[] NewDateArray = NewDate.Split('/');
int date = Convert.ToInt32(NewDateArray[0].ToString());
if (date > 12)
{
NewDate = datetoCompare.ToString("dd/MM/yyyy");
}
else
{
NewDate = datetoCompare.ToString("MM/dd/yyyy");
}
return NewDate;
}

Using sqlserver agent in sqlserver

http://databases.about.com/od/sqlserver/ss/sql_server_agent_6.htm

Query to determine end of month

DECLARE @Dt DATETIME

SET @Dt = '2013-02-28'

IF MONTH(@Dt) != MONTH(DATEADD(DAY,1,@Dt))
BEGIN
PRINT 'End Of Month'
END
else
begin
print 'Middle of Month'
end

Stylish tabs in jquery

http://yensdesign.com/tutorials/tabs/

http://os.alfajango.com/easytabs/#tabs1-js

Webpage translator to different Language

http://www.microsoft.com/web/solutions/mstranslator.aspx

http://www.microsofttranslator.com/widget/

<div id="google_translate_element">
</div>
<script type="text/javascript">
function googleTranslateElementInit()
{
new google.translate.TranslateElement({ pageLanguage: 'hi', layout: google.translate.TranslateElement.InlineLayout.SIMPLE }, 'google_translate_element');
}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit">
</script>

Binding Chart In Asp.net

<asp:Chart ID="Chart1" runat="server" Width="600px">
<series>
<asp:Series BorderWidth="5" ChartArea="ChartArea1" ChartType="Line" Name="Present">
</asp:Series>
<asp:Series BorderWidth="5" ChartArea="ChartArea1" ChartType="Line" Color="Tomato" Name="Absent">
</asp:Series>
<asp:Series BorderWidth="5" ChartArea="ChartArea1" ChartType="Line" Color="#33cc00" Name="Leave">
</asp:Series>
</series>
<chartareas>
<asp:ChartArea Name="ChartArea1">
<axisx islabelautofit="false">
<LabelStyle Interval="1" />
</axisx>
</asp:ChartArea>
</chartareas>
</asp:Chart>

public void bindChart(DataTable dtChartForBinding)
{
Chart1.Series["Present"].XValueMember = "";
Chart1.Series["Present"].YValueMembers = "";
//Chart1.Series["Series1"].IsValueShownAsLabel = true ;
Chart1.ChartAreas["ChartArea1"].AxisY.Minimum = 0;
Chart1.ChartAreas["ChartArea1"].AxisY.Maximum = 100;
Chart1.ChartAreas["ChartArea1"].AxisY.Interval = 10;

Chart1.DataSource = dtChartForBinding;
Chart1.Legends.Add("Present Percentage").Title = "Percentage";
// here i am giving the title of the x-axis
Chart1.ChartAreas["ChartArea1"].AxisX.Title = "Month";
Chart1.ChartAreas["ChartArea1"].AxisX.TitleForeColor = System.Drawing.Color.Red;
Chart1.ChartAreas["ChartArea1"].AxisX.TitleFont = new System.Drawing.Font("Verdana", 10, System.Drawing.FontStyle.Bold);
// here i am giving the title of the y-axis
Chart1.ChartAreas["ChartArea1"].AxisY.Title = "Attendance Percentage";
Chart1.ChartAreas["ChartArea1"].AxisY.TitleForeColor = System.Drawing.Color.Red;
Chart1.ChartAreas["ChartArea1"].AxisY.TitleFont = new System.Drawing.Font("Verdana", 10, System.Drawing.FontStyle.Bold);
// here i am binding the x-axisvalue with the chart control
Chart1.Series["Present"].XValueMember = "Month";
Chart1.Series["Absent"].XValueMember = "Month";
Chart1.Series["Leave"].XValueMember = "Month";
// here i am binding the y-axisvalue with the chart control
Chart1.Series["Present"].YValueMembers = "Present Percentage";
Chart1.Series["Absent"].YValueMembers = "Absent Percentage";
Chart1.Series["Leave"].YValueMembers = "Leave Percentage";
Chart1.DataBind();

}

Show Loading image on page load

Follow this link

http://aspsnippets.com/Articles/Display-loading-progress-image-when-Page-Loads-or-does-PostBack-using-ASPNet.aspx

Creating set up file in windows application

Follow the steps given in below link

http://www.msdotnet.co.in/2012/06/how-to-create-setup-fileexe-file-from.html

Send email at regular interval in .Net

In Global.asax file Write Following code

<%@ Application Language="C#" %>
<%@ Import Namespace="System.Timers" %>
<script runat="server">

void Application_Start(object sender, EventArgs e)
{
// Code that runs on application startup
System.Timers.Timer myTimer = new System.Timers.Timer();
// Set the Interval to 5 seconds (5000 milliseconds).
DayOfWeek xyz = System.DateTime.Now.DayOfWeek;
if (xyz.ToString() == "Monday")
{
myTimer.Interval = 604800;
myTimer.AutoReset = true;
myTimer.Elapsed += new ElapsedEventHandler(myTimer_Elapsed);
myTimer.Enabled = true;
}
}

public void myTimer_Elapsed(object source, System.Timers.ElapsedEventArgs e)
{
clsScheduleMail objScheduleMail = new clsScheduleMail();
objScheduleMail.SendScheduleMail("sis","sunil@jupsoft.org","","CheckEmail","CheckEmail","","For Testing Purpose");

}

void Application_End(object sender, EventArgs e)
{
// Code that runs on application shutdown

}

void Application_Error(object sender, EventArgs e)
{
// Code that runs when an unhandled error occurs

}

void Session_Start(object sender, EventArgs e)
{
// Code that runs when a new session is started

}

void Session_End(object sender, EventArgs e)
{
// Code that runs when a session ends.
// Note: The Session_End event is raised only when the sessionstate mode
// is set to InProc in the Web.config file. If session mode is set to StateServer
// or SQLServer, the event is not raised.

}

</script>

Restricting Special Characters in Textbox

Query to copy one table to another

Copy data from one table to another in different database

INSERT INTO DestinationDB..MyDestinationTable
SELECT * FROM SourceDB..MySourceTable

Copy data from one table to another in same database

select * into DestinationTablename from SourceTablename

Download Crystal Report Setup file for Visual Studio 2010

Click on the First link for Standard version. This version can install in your system and you can start crystal report.

https://www.sap.com/campaign/ne/free_trial/crystal_reports_visual_studio/wty_int_crvs.epx?Level=1&FormResultID=91c2d627-6436-443b-9be2-64559651bba8&ContinueURL=%2fcampaign%2fne%2ffree_trial%2fcrystal_reports_visual_studio%2findex.epx%3furl_id%3dtext-na-sapcom-crvs-trial-landing%26kNtBzmUK9zU%3d1&kNtBzmUK9zU=1

What is delay signing ?

Delay signing allows you to place a shared assembly in the GAC by signing the assembly with just the public key. This allows the assembly to be signed with the private key at a later stage, when the development process is complete and the component or assembly is ready to be deployed. This process enables developers to work with shared assemblies as if they were strongly named, and it secures the private key of the signature from being accessed at different stages of development.

Wednesday, 26 June 2013

Beautiful Paging in Gridview

Creating zip file in .net

->Download Ionic.zip.reduced.dll
-> Give reference to it.

public void DownloadFiles()
{
try
{
using (ZipFile zip = new ZipFile())
{

for (int i = 0; i < gvManageWorksheet.Rows.Count; i++)
{
CheckBox cbox = (CheckBox)gvManageWorksheet.Rows[i].FindControl("chkdelete");
if (cbox.Checked)
{
LinkButton lbtn_FileName = (LinkButton)gvManageWorksheet.Rows[i].FindControl("LinkButton1");
string fileName = lbtn_FileName.Text;
if (fileName != "")
{
LinkButton lbtn_UploadedBy = (LinkButton)gvManageWorksheet.Rows[i].FindControl("LinkButton3");
string UploadedBy = lbtn_UploadedBy.Text;
string fileToAdd = "";
fileToAdd = Server.MapPath(".\\Worksheet\\" + (Session["SchoolId"]).ToString() + "\\" + fileName + "");

FileInfo fileExist = new FileInfo(fileToAdd);
if (fileExist.Exists)
{
zip.AddFile(fileToAdd, "xyz");
}
}
}
else
{

}
}
Response.Clear();
Response.BufferOutput = false;
string zipName = String.Format("Zip_{0}.zip", DateTime.Now.ToString("yyyy-MMM-dd-HHmmss"));
Response.ContentType = "application/zip";
Response.AddHeader("content-disposition", "attachment; filename=" + zipName);
//zip.Save();
zip.Save(HttpContext.Current.Response.OutputStream);
HttpContext.Current.ApplicationInstance.CompleteRequest();
//Response.End();
}
}
catch (Exception ex)
{

}
}

Get Different Record Between two Datatable

private DataTable getDifferentRecords(DataTable FirstDataTable, DataTable SecondDataTable)
{
//Create Empty Table
DataTable ResultDataTable = new DataTable("ResultDataTable");

//use a Dataset to make use of a DataRelation object
using (DataSet ds = new DataSet())
{
//Add tables
ds.Tables.AddRange(new DataTable[] { FirstDataTable.Copy(), SecondDataTable.Copy() });

//Get Columns for DataRelation
DataColumn[] firstColumns = new DataColumn[ds.Tables[0].Columns.Count];
for (int i = 0; i < firstColumns.Length; i++)
{
firstColumns[i] = ds.Tables[0].Columns[i];
}

DataColumn[] secondColumns = new DataColumn[ds.Tables[1].Columns.Count];
for (int i = 0; i < secondColumns.Length; i++)
{
secondColumns[i] = ds.Tables[1].Columns[i];
}

//Create DataRelation
DataRelation r1 = new DataRelation(string.Empty, firstColumns, secondColumns, false);
ds.Relations.Add(r1);

DataRelation r2 = new DataRelation(string.Empty, secondColumns, firstColumns, false);
ds.Relations.Add(r2);

//Create columns for return table
for (int i = 0; i < FirstDataTable.Columns.Count; i++)
{
ResultDataTable.Columns.Add(FirstDataTable.Columns[i].ColumnName, FirstDataTable.Columns[i].DataType);
}

//If FirstDataTable Row not in SecondDataTable, Add to ResultDataTable.
ResultDataTable.BeginLoadData();
foreach (DataRow parentrow in ds.Tables[0].Rows)
{
DataRow[] childrows = parentrow.GetChildRows(r1);
if (childrows == null || childrows.Length == 0)
ResultDataTable.LoadDataRow(parentrow.ItemArray, true);
}

//If SecondDataTable Row not in FirstDataTable, Add to ResultDataTable.
foreach (DataRow parentrow in ds.Tables[1].Rows)
{
DataRow[] childrows = parentrow.GetChildRows(r2);
if (childrows == null || childrows.Length == 0)
ResultDataTable.LoadDataRow(parentrow.ItemArray, true);
}
ResultDataTable.EndLoadData();
}

return ResultDataTable;
}

Making Ajax Control to work on server

Download ajax toolkit by searching "ajaxcontroltoolkit.binary. net 4 download" from google

Recommended Web.config Settings

<?xml version="1.0"?>
<configuration>
<connectionStrings>

</connectionStrings>
<system.web>

<sessionState mode="InProc" timeout="120">
</sessionState>
<trust level="Full"/>

<compilation debug="true" targetFramework="4.0">
<assemblies>







<add assembly="System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
<add assembly="System.Design, Version=4.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
<add assembly="System.Web.Extensions.Design, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
<add assembly="System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
<add assembly="System.Data, Version=4.0.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
<add assembly="System, Version=4.0.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
<add assembly="System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
<add assembly="System.Xml, Version=4.0.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
<add assembly="System.Drawing, Version=4.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
<add assembly="System.Web.Services, Version=4.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
<add assembly="WindowsBase, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
<add assembly="System.Management, Version=4.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
<add assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/></assemblies>
</compilation>
<httpHandlers>
<add path="ChartImage.axd" verb="*" type="Telerik.Web.UI.ChartHttpHandler" validate="false"/>
<add path="Telerik.Web.UI.DialogHandler.aspx" verb="*" type="Telerik.Web.UI.DialogHandler" validate="false"/>
<add path="Telerik.RadUploadProgressHandler.ashx" verb="*" type="Telerik.Web.UI.RadUploadProgressHandler" validate="false"/>
<add path="Telerik.Web.UI.WebResource.axd" verb="*" type="Telerik.Web.UI.WebResource" validate="false"/>
<add path="Telerik.Web.UI.SpellCheckHandler.axd" verb="*" type="Telerik.Web.UI.SpellCheckHandler" validate="false"/>
<add path="ChartImg.axd" verb="GET,HEAD,POST" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false"/>
<add verb="GET,HEAD,POST,DEBUG" path="ScriptResource.axd" type="System.Web.Handlers.ScriptResourceHandler, System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" validate="false" />
</httpHandlers>
<httpModules>
<add name="ScriptModule" type="System.Web.Handlers.ScriptModule, System.Web.Extensions, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
</httpModules>
<httpRuntime executionTimeout="330" maxRequestLength="1048576" enable="true"/>

<customErrors mode="Off"/>
<pages controlRenderingCompatibilityVersion="3.5" clientIDMode="AutoID">
<controls>
<add tagPrefix="asp" namespace="System.Web.UI.DataVisualization.Charting" assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
</controls>
</pages></system.web>
<system.webServer>
<validation validateIntegratedModeConfiguration="false"/>
<handlers>
<remove name="ChartImageHandler"/>
<add name="Telerik_Web_UI_SpellCheckHandler_axd" verb="*" preCondition="integratedMode" path="Telerik.Web.UI.SpellCheckHandler.axd" type="Telerik.Web.UI.SpellCheckHandler"/>
<add name="Telerik_Web_UI_DialogHandler_aspx" preCondition="integratedMode" path="Telerik.Web.UI.DialogHandler.aspx" type="Telerik.Web.UI.DialogHandler" verb="*"/>
<add name="ChartImageHandler" preCondition="integratedMode" verb="GET,HEAD,POST" path="ChartImg.axd" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
</handlers>

</system.webServer>
<location allowOverride="true">
<appSettings>

</appSettings>
</location>
</configuration>

Image Cropping using Jquery

<head>
<link href="css/jquery.Jcrop.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript" src="script/jquery.Jcrop.js"></script>
<script type="text/javascript">
jQuery(document).ready(function () {
jQuery('#ContentPlaceHolder1_imgCrop').Jcrop({
onSelect: storeCoords
});
});

function storeCoords(c) {
jQuery('#ContentPlaceHolder1_X').val(c.x);
jQuery('#ContentPlaceHolder1_Y').val(c.y);
jQuery('#ContentPlaceHolder1_W').val(c.w);
jQuery('#ContentPlaceHolder1_H').val(c.h);
};

</script>
</head>

<body>
<div>
<asp:Panel ID="pnlUpload" runat="server">
<asp:FileUpload ID="Upload" runat="server" />
<br />
<asp:Button ID="btnUpload" runat="server" OnClick="btnUpload_Click" Text="Upload" />
<asp:Label ID="lblError" runat="server" Visible="false" />
</asp:Panel>
<asp:Panel ID="pnlCrop" runat="server" Visible="false">
<asp:Image ID="imgCrop" runat="server" />
<br />
<asp:HiddenField ID="X" runat="server" />
<asp:HiddenField ID="Y" runat="server" />
<asp:HiddenField ID="W" runat="server" />
<asp:HiddenField ID="H" runat="server" />
<asp:Button ID="btnCrop" runat="server" Text="Crop" OnClick="btnCrop_Click" />
</asp:Panel>
<asp:Panel ID="pnlCropped" runat="server" Visible="false">
<asp:Image ID="imgCropped" runat="server" />
</asp:Panel>
</div>
</body>

jcrop.css
----------------------
/* jquery.Jcrop.css v0.9.12 - MIT License */
/*
The outer-most container in a typical Jcrop instance
If you are having difficulty with formatting related to styles
on a parent element, place any fixes here or in a like selector

You can also style this element if you want to add a border, etc
A better method for styling can be seen below with .jcrop-light
(Add a class to the holder and style elements for that extended class)
*/
.jcrop-holder {
direction: ltr;
text-align: left;
}
/* Selection Border */
.jcrop-vline,
.jcrop-hline {
background: #ffffff url("Jcrop.gif");
font-size: 0;
position: absolute;
}
.jcrop-vline {
height: 100%;
width: 1px !important;
}
.jcrop-vline.right {
right: 0;
}
.jcrop-hline {
height: 1px !important;
width: 100%;
}
.jcrop-hline.bottom {
bottom: 0;
}
/* Invisible click targets */
.jcrop-tracker {
height: 100%;
width: 100%;
/* "turn off" link highlight */
-webkit-tap-highlight-color: transparent;
/* disable callout, image save panel */
-webkit-touch-callout: none;
/* disable cut copy paste */
-webkit-user-select: none;
}
/* Selection Handles */
.jcrop-handle {
background-color: #333333;
border: 1px #eeeeee solid;
width: 7px;
height: 7px;
font-size: 1px;
}
.jcrop-handle.ord-n {
left: 50%;
margin-left: -4px;
margin-top: -4px;
top: 0;
}
.jcrop-handle.ord-s {
bottom: 0;
left: 50%;
margin-bottom: -4px;
margin-left: -4px;
}
.jcrop-handle.ord-e {
margin-right: -4px;
margin-top: -4px;
right: 0;
top: 50%;
}
.jcrop-handle.ord-w {
left: 0;
margin-left: -4px;
margin-top: -4px;
top: 50%;
}
.jcrop-handle.ord-nw {
left: 0;
margin-left: -4px;
margin-top: -4px;
top: 0;
}
.jcrop-handle.ord-ne {
margin-right: -4px;
margin-top: -4px;
right: 0;
top: 0;
}
.jcrop-handle.ord-se {
bottom: 0;
margin-bottom: -4px;
margin-right: -4px;
right: 0;
}
.jcrop-handle.ord-sw {
bottom: 0;
left: 0;
margin-bottom: -4px;
margin-left: -4px;
}
/* Dragbars */
.jcrop-dragbar.ord-n,
.jcrop-dragbar.ord-s {
height: 7px;
width: 100%;
}
.jcrop-dragbar.ord-e,
.jcrop-dragbar.ord-w {
height: 100%;
width: 7px;
}
.jcrop-dragbar.ord-n {
margin-top: -4px;
}
.jcrop-dragbar.ord-s {
bottom: 0;
margin-bottom: -4px;
}
.jcrop-dragbar.ord-e {
margin-right: -4px;
right: 0;
}
.jcrop-dragbar.ord-w {
margin-left: -4px;
}
/* The "jcrop-light" class/extension */
.jcrop-light .jcrop-vline,
.jcrop-light .jcrop-hline {
background: #ffffff;
filter: alpha(opacity=70) !important;
opacity: .70!important;
}
.jcrop-light .jcrop-handle {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background-color: #000000;
border-color: #ffffff;
border-radius: 3px;
}
/* The "jcrop-dark" class/extension */
.jcrop-dark .jcrop-vline,
.jcrop-dark .jcrop-hline {
background: #000000;
filter: alpha(opacity=70) !important;
opacity: 0.7 !important;
}
.jcrop-dark .jcrop-handle {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background-color: #ffffff;
border-color: #000000;
border-radius: 3px;
}
/* Simple macro to turn off the antlines */
.solid-line .jcrop-vline,
.solid-line .jcrop-hline {
background: #ffffff;
}
/* Fix for twitter bootstrap et al. */
.jcrop-holder img,
img.jcrop-preview {
max-width: none;
}

jquery.Jcrop.js
-----------------------
/**
* jquery.Jcrop.js v0.9.12
* jQuery Image Cropping Plugin - released under MIT License
* Author: Kelly Hallman <khallman@gmail.com>
* http://github.com/tapmodo/Jcrop
* Copyright (c) 2008-2013 Tapmodo Interactive LLC {{{
*
* 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 ($) {

$.Jcrop = function (obj, opt) {
var options = $.extend({}, $.Jcrop.defaults),
docOffset,
_ua = navigator.userAgent.toLowerCase(),
is_msie = /msie/.test(_ua),
ie6mode = /msie [1-6]\./.test(_ua);

// Internal Methods {{{
function px(n) {
return Math.round(n) + 'px';
}
function cssClass(cl) {
return options.baseClass + '-' + cl;
}
function supportsColorFade() {
return $.fx.step.hasOwnProperty('backgroundColor');
}
function getPos(obj) //{{{
{
var pos = $(obj).offset();
return [pos.left, pos.top];
}
//}}}
function mouseAbs(e) //{{{
{
return [(e.pageX - docOffset[0]), (e.pageY - docOffset[1])];
}
//}}}
function setOptions(opt) //{{{
{
if (typeof(opt) !== 'object') opt = {};
options = $.extend(options, opt);

$.each(['onChange','onSelect','onRelease','onDblClick'],function(i,e) {
if (typeof(options[e]) !== 'function') options[e] = function () {};
});
}
//}}}
function startDragMode(mode, pos, touch) //{{{
{
docOffset = getPos($img);
Tracker.setCursor(mode === 'move' ? mode : mode + '-resize');

if (mode === 'move') {
return Tracker.activateHandlers(createMover(pos), doneSelect, touch);
}

var fc = Coords.getFixed();
var opp = oppLockCorner(mode);
var opc = Coords.getCorner(oppLockCorner(opp));

Coords.setPressed(Coords.getCorner(opp));
Coords.setCurrent(opc);

Tracker.activateHandlers(dragmodeHandler(mode, fc), doneSelect, touch);
}
//}}}
function dragmodeHandler(mode, f) //{{{
{
return function (pos) {
if (!options.aspectRatio) {
switch (mode) {
case 'e':
pos[1] = f.y2;
break;
case 'w':
pos[1] = f.y2;
break;
case 'n':
pos[0] = f.x2;
break;
case 's':
pos[0] = f.x2;
break;
}
} else {
switch (mode) {
case 'e':
pos[1] = f.y + 1;
break;
case 'w':
pos[1] = f.y + 1;
break;
case 'n':
pos[0] = f.x + 1;
break;
case 's':
pos[0] = f.x + 1;
break;
}
}
Coords.setCurrent(pos);
Selection.update();
};
}
//}}}
function createMover(pos) //{{{
{
var lloc = pos;
KeyManager.watchKeys();

return function (pos) {
Coords.moveOffset([pos[0] - lloc[0], pos[1] - lloc[1]]);
lloc = pos;

Selection.update();
};
}
//}}}
function oppLockCorner(ord) //{{{
{
switch (ord) {
case 'n':
return 'sw';
case 's':
return 'nw';
case 'e':
return 'nw';
case 'w':
return 'ne';
case 'ne':
return 'sw';
case 'nw':
return 'se';
case 'se':
return 'nw';
case 'sw':
return 'ne';
}
}
//}}}
function createDragger(ord) //{{{
{
return function (e) {
if (options.disabled) {
return false;
}
if ((ord === 'move') && !options.allowMove) {
return false;
}

// Fix position of crop area when dragged the very first time.
// Necessary when crop image is in a hidden element when page is loaded.
docOffset = getPos($img);

btndown = true;
startDragMode(ord, mouseAbs(e));
e.stopPropagation();
e.preventDefault();
return false;
};
}
//}}}
function presize($obj, w, h) //{{{
{
var nw = $obj.width(),
nh = $obj.height();
if ((nw > w) && w > 0) {
nw = w;
nh = (w / $obj.width()) * $obj.height();
}
if ((nh > h) && h > 0) {
nh = h;
nw = (h / $obj.height()) * $obj.width();
}
xscale = $obj.width() / nw;
yscale = $obj.height() / nh;
$obj.width(nw).height(nh);
}
//}}}
function unscale(c) //{{{
{
return {
x: c.x * xscale,
y: c.y * yscale,
x2: c.x2 * xscale,
y2: c.y2 * yscale,
w: c.w * xscale,
h: c.h * yscale
};
}
//}}}
function doneSelect(pos) //{{{
{
var c = Coords.getFixed();
if ((c.w > options.minSelect[0]) && (c.h > options.minSelect[1])) {
Selection.enableHandles();
Selection.done();
} else {
Selection.release();
}
Tracker.setCursor(options.allowSelect ? 'crosshair' : 'default');
}
//}}}
function newSelection(e) //{{{
{
if (options.disabled) {
return false;
}
if (!options.allowSelect) {
return false;
}
btndown = true;
docOffset = getPos($img);
Selection.disableHandles();
Tracker.setCursor('crosshair');
var pos = mouseAbs(e);
Coords.setPressed(pos);
Selection.update();
Tracker.activateHandlers(selectDrag, doneSelect, e.type.substring(0,5)==='touch');
KeyManager.watchKeys();

e.stopPropagation();
e.preventDefault();
return false;
}
//}}}
function selectDrag(pos) //{{{
{
Coords.setCurrent(pos);
Selection.update();
}
//}}}
function newTracker() //{{{
{
var trk = $('<div></div>').addClass(cssClass('tracker'));
if (is_msie) {
trk.css({
opacity: 0,
backgroundColor: 'white'
});
}
return trk;
}
//}}}

// }}}
// Initialization {{{
// Sanitize some options {{{
if (typeof(obj) !== 'object') {
obj = $(obj)[0];
}
if (typeof(opt) !== 'object') {
opt = {};
}
// }}}
setOptions(opt);
// Initialize some jQuery objects {{{
// The values are SET on the image(s) for the interface
// If the original image has any of these set, they will be reset
// However, if you destroy() the Jcrop instance the original image's
// character in the DOM will be as you left it.
var img_css = {
border: 'none',
visibility: 'visible',
margin: 0,
padding: 0,
position: 'absolute',
top: 0,
left: 0
};

var $origimg = $(obj),
img_mode = true;

if (obj.tagName == 'IMG') {
// Fix size of crop image.
// Necessary when crop image is within a hidden element when page is loaded.
if ($origimg[0].width != 0 && $origimg[0].height != 0) {
// Obtain dimensions from contained img element.
$origimg.width($origimg[0].width);
$origimg.height($origimg[0].height);
} else {
// Obtain dimensions from temporary image in case the original is not loaded yet (e.g. IE 7.0).
var tempImage = new Image();
tempImage.src = $origimg[0].src;
$origimg.width(tempImage.width);
$origimg.height(tempImage.height);
}

var $img = $origimg.clone().removeAttr('id').css(img_css).show();

$img.width($origimg.width());
$img.height($origimg.height());
$origimg.after($img).hide();

} else {
$img = $origimg.css(img_css).show();
img_mode = false;
if (options.shade === null) { options.shade = true; }
}

presize($img, options.boxWidth, options.boxHeight);

var boundx = $img.width(),
boundy = $img.height(),

$div = $('<div />').width(boundx).height(boundy).addClass(cssClass('holder')).css({
position: 'relative',
backgroundColor: options.bgColor
}).insertAfter($origimg).append($img);

if (options.addClass) {
$div.addClass(options.addClass);
}

var $img2 = $('<div />'),

$img_holder = $('<div />')
.width('100%').height('100%').css({
zIndex: 310,
position: 'absolute',
overflow: 'hidden'
}),

$hdl_holder = $('<div />')
.width('100%').height('100%').css('zIndex', 320),

$sel = $('<div />')
.css({
position: 'absolute',
zIndex: 600
}).dblclick(function(){
var c = Coords.getFixed();
options.onDblClick.call(api,c);
}).insertBefore($img).append($img_holder, $hdl_holder);

if (img_mode) {

$img2 = $('<img />')
.attr('src', $img.attr('src')).css(img_css).width(boundx).height(boundy),

$img_holder.append($img2);

}

if (ie6mode) {
$sel.css({
overflowY: 'hidden'
});
}

var bound = options.boundary;
var $trk = newTracker().width(boundx + (bound * 2)).height(boundy + (bound * 2)).css({
position: 'absolute',
top: px(-bound),
left: px(-bound),
zIndex: 290
}).mousedown(newSelection);

/* }}} */
// Set more variables {{{
var bgcolor = options.bgColor,
bgopacity = options.bgOpacity,
xlimit, ylimit, xmin, ymin, xscale, yscale, enabled = true,
btndown, animating, shift_down;

docOffset = getPos($img);
// }}}
// }}}
// Internal Modules {{{
// Touch Module {{{
var Touch = (function () {
// Touch support detection function adapted (under MIT License)
// from code by Jeffrey Sambells - http://github.com/iamamused/
function hasTouchSupport() {
var support = {}, events = ['touchstart', 'touchmove', 'touchend'],
el = document.createElement('div'), i;

try {
for(i=0; i<events.length; i++) {
var eventName = events[i];
eventName = 'on' + eventName;
var isSupported = (eventName in el);
if (!isSupported) {
el.setAttribute(eventName, 'return;');
isSupported = typeof el[eventName] == 'function';
}
support[events[i]] = isSupported;
}
return support.touchstart && support.touchend && support.touchmove;
}
catch(err) {
return false;
}
}

function detectSupport() {
if ((options.touchSupport === true) || (options.touchSupport === false)) return options.touchSupport;
else return hasTouchSupport();
}
return {
createDragger: function (ord) {
return function (e) {
if (options.disabled) {
return false;
}
if ((ord === 'move') && !options.allowMove) {
return false;
}
docOffset = getPos($img);
btndown = true;
startDragMode(ord, mouseAbs(Touch.cfilter(e)), true);
e.stopPropagation();
e.preventDefault();
return false;
};
},
newSelection: function (e) {
return newSelection(Touch.cfilter(e));
},
cfilter: function (e){
e.pageX = e.originalEvent.changedTouches[0].pageX;
e.pageY = e.originalEvent.changedTouches[0].pageY;
return e;
},
isSupported: hasTouchSupport,
support: detectSupport()
};
}());
// }}}
// Coords Module {{{
var Coords = (function () {
var x1 = 0,
y1 = 0,
x2 = 0,
y2 = 0,
ox, oy;

function setPressed(pos) //{{{
{
pos = rebound(pos);
x2 = x1 = pos[0];
y2 = y1 = pos[1];
}
//}}}
function setCurrent(pos) //{{{
{
pos = rebound(pos);
ox = pos[0] - x2;
oy = pos[1] - y2;
x2 = pos[0];
y2 = pos[1];
}
//}}}
function getOffset() //{{{
{
return [ox, oy];
}
//}}}
function moveOffset(offset) //{{{
{
var ox = offset[0],
oy = offset[1];

if (0 > x1 + ox) {
ox -= ox + x1;
}
if (0 > y1 + oy) {
oy -= oy + y1;
}

if (boundy < y2 + oy) {
oy += boundy - (y2 + oy);
}
if (boundx < x2 + ox) {
ox += boundx - (x2 + ox);
}

x1 += ox;
x2 += ox;
y1 += oy;
y2 += oy;
}
//}}}
function getCorner(ord) //{{{
{
var c = getFixed();
switch (ord) {
case 'ne':
return [c.x2, c.y];
case 'nw':
return [c.x, c.y];
case 'se':
return [c.x2, c.y2];
case 'sw':
return [c.x, c.y2];
}
}
//}}}
function getFixed() //{{{
{
if (!options.aspectRatio) {
return getRect();
}
// This function could use some optimization I think...
var aspect = options.aspectRatio,
min_x = options.minSize[0] / xscale,

//min_y = options.minSize[1]/yscale,
max_x = options.maxSize[0] / xscale,
max_y = options.maxSize[1] / yscale,
rw = x2 - x1,
rh = y2 - y1,
rwa = Math.abs(rw),
rha = Math.abs(rh),
real_ratio = rwa / rha,
xx, yy, w, h;

if (max_x === 0) {
max_x = boundx * 10;
}
if (max_y === 0) {
max_y = boundy * 10;
}
if (real_ratio < aspect) {
yy = y2;
w = rha * aspect;
xx = rw < 0 ? x1 - w : w + x1;

if (xx < 0) {
xx = 0;
h = Math.abs((xx - x1) / aspect);
yy = rh < 0 ? y1 - h : h + y1;
} else if (xx > boundx) {
xx = boundx;
h = Math.abs((xx - x1) / aspect);
yy = rh < 0 ? y1 - h : h + y1;
}
} else {
xx = x2;
h = rwa / aspect;
yy = rh < 0 ? y1 - h : y1 + h;
if (yy < 0) {
yy = 0;
w = Math.abs((yy - y1) * aspect);
xx = rw < 0 ? x1 - w : w + x1;
} else if (yy > boundy) {
yy = boundy;
w = Math.abs(yy - y1) * aspect;
xx = rw < 0 ? x1 - w : w + x1;
}
}

// Magic %-)
if (xx > x1) { // right side
if (xx - x1 < min_x) {
xx = x1 + min_x;
} else if (xx - x1 > max_x) {
xx = x1 + max_x;
}
if (yy > y1) {
yy = y1 + (xx - x1) / aspect;
} else {
yy = y1 - (xx - x1) / aspect;
}
} else if (xx < x1) { // left side
if (x1 - xx < min_x) {
xx = x1 - min_x;
} else if (x1 - xx > max_x) {
xx = x1 - max_x;
}
if (yy > y1) {
yy = y1 + (x1 - xx) / aspect;
} else {
yy = y1 - (x1 - xx) / aspect;
}
}

if (xx < 0) {
x1 -= xx;
xx = 0;
} else if (xx > boundx) {
x1 -= xx - boundx;
xx = boundx;
}

if (yy < 0) {
y1 -= yy;
yy = 0;
} else if (yy > boundy) {
y1 -= yy - boundy;
yy = boundy;
}

return makeObj(flipCoords(x1, y1, xx, yy));
}
//}}}
function rebound(p) //{{{
{
if (p[0] < 0) p[0] = 0;
if (p[1] < 0) p[1] = 0;

if (p[0] > boundx) p[0] = boundx;
if (p[1] > boundy) p[1] = boundy;

return [Math.round(p[0]), Math.round(p[1])];
}
//}}}
function flipCoords(x1, y1, x2, y2) //{{{
{
var xa = x1,
xb = x2,
ya = y1,
yb = y2;
if (x2 < x1) {
xa = x2;
xb = x1;
}
if (y2 < y1) {
ya = y2;
yb = y1;
}
return [xa, ya, xb, yb];
}
//}}}
function getRect() //{{{
{
var xsize = x2 - x1,
ysize = y2 - y1,
delta;

if (xlimit && (Math.abs(xsize) > xlimit)) {
x2 = (xsize > 0) ? (x1 + xlimit) : (x1 - xlimit);
}
if (ylimit && (Math.abs(ysize) > ylimit)) {
y2 = (ysize > 0) ? (y1 + ylimit) : (y1 - ylimit);
}

if (ymin / yscale && (Math.abs(ysize) < ymin / yscale)) {
y2 = (ysize > 0) ? (y1 + ymin / yscale) : (y1 - ymin / yscale);
}
if (xmin / xscale && (Math.abs(xsize) < xmin / xscale)) {
x2 = (xsize > 0) ? (x1 + xmin / xscale) : (x1 - xmin / xscale);
}

if (x1 < 0) {
x2 -= x1;
x1 -= x1;
}
if (y1 < 0) {
y2 -= y1;
y1 -= y1;
}
if (x2 < 0) {
x1 -= x2;
x2 -= x2;
}
if (y2 < 0) {
y1 -= y2;
y2 -= y2;
}
if (x2 > boundx) {
delta = x2 - boundx;
x1 -= delta;
x2 -= delta;
}
if (y2 > boundy) {
delta = y2 - boundy;
y1 -= delta;
y2 -= delta;
}
if (x1 > boundx) {
delta = x1 - boundy;
y2 -= delta;
y1 -= delta;
}
if (y1 > boundy) {
delta = y1 - boundy;
y2 -= delta;
y1 -= delta;
}

return makeObj(flipCoords(x1, y1, x2, y2));
}
//}}}
function makeObj(a) //{{{
{
return {
x: a[0],
y: a[1],
x2: a[2],
y2: a[3],
w: a[2] - a[0],
h: a[3] - a[1]
};
}
//}}}

return {
flipCoords: flipCoords,
setPressed: setPressed,
setCurrent: setCurrent,
getOffset: getOffset,
moveOffset: moveOffset,
getCorner: getCorner,
getFixed: getFixed
};
}());

//}}}
// Shade Module {{{
var Shade = (function() {
var enabled = false,
holder = $('<div />').css({
position: 'absolute',
zIndex: 240,
opacity: 0
}),
shades = {
top: createShade(),
left: createShade().height(boundy),
right: createShade().height(boundy),
bottom: createShade()
};

function resizeShades(w,h) {
shades.left.css({ height: px(h) });
shades.right.css({ height: px(h) });
}
function updateAuto()
{
return updateShade(Coords.getFixed());
}
function updateShade(c)
{
shades.top.css({
left: px(c.x),
width: px(c.w),
height: px(c.y)
});
shades.bottom.css({
top: px(c.y2),
left: px(c.x),
width: px(c.w),
height: px(boundy-c.y2)
});
shades.right.css({
left: px(c.x2),
width: px(boundx-c.x2)
});
shades.left.css({
width: px(c.x)
});
}
function createShade() {
return $('<div />').css({
position: 'absolute',
backgroundColor: options.shadeColor||options.bgColor
}).appendTo(holder);
}
function enableShade() {
if (!enabled) {
enabled = true;
holder.insertBefore($img);
updateAuto();
Selection.setBgOpacity(1,0,1);
$img2.hide();

setBgColor(options.shadeColor||options.bgColor,1);
if (Selection.isAwake())
{
setOpacity(options.bgOpacity,1);
}
else setOpacity(1,1);
}
}
function setBgColor(color,now) {
colorChangeMacro(getShades(),color,now);
}
function disableShade() {
if (enabled) {
holder.remove();
$img2.show();
enabled = false;
if (Selection.isAwake()) {
Selection.setBgOpacity(options.bgOpacity,1,1);
} else {
Selection.setBgOpacity(1,1,1);
Selection.disableHandles();
}
colorChangeMacro($div,0,1);
}
}
function setOpacity(opacity,now) {
if (enabled) {
if (options.bgFade && !now) {
holder.animate({
opacity: 1-opacity
},{
queue: false,
duration: options.fadeTime
});
}
else holder.css({opacity:1-opacity});
}
}
function refreshAll() {
options.shade ? enableShade() : disableShade();
if (Selection.isAwake()) setOpacity(options.bgOpacity);
}
function getShades() {
return holder.children();
}

return {
update: updateAuto,
updateRaw: updateShade,
getShades: getShades,
setBgColor: setBgColor,
enable: enableShade,
disable: disableShade,
resize: resizeShades,
refresh: refreshAll,
opacity: setOpacity
};
}());
// }}}
// Selection Module {{{
var Selection = (function () {
var awake,
hdep = 370,
borders = {},
handle = {},
dragbar = {},
seehandles = false;

// Private Methods
function insertBorder(type) //{{{
{
var jq = $('<div />').css({
position: 'absolute',
opacity: options.borderOpacity
}).addClass(cssClass(type));
$img_holder.append(jq);
return jq;
}
//}}}
function dragDiv(ord, zi) //{{{
{
var jq = $('<div />').mousedown(createDragger(ord)).css({
cursor: ord + '-resize',
position: 'absolute',
zIndex: zi
}).addClass('ord-'+ord);

if (Touch.support) {
jq.bind('touchstart.jcrop', Touch.createDragger(ord));
}

$hdl_holder.append(jq);
return jq;
}
//}}}
function insertHandle(ord) //{{{
{
var hs = options.handleSize,

div = dragDiv(ord, hdep++).css({
opacity: options.handleOpacity
}).addClass(cssClass('handle'));

if (hs) { div.width(hs).height(hs); }

return div;
}
//}}}
function insertDragbar(ord) //{{{
{
return dragDiv(ord, hdep++).addClass('jcrop-dragbar');
}
//}}}
function createDragbars(li) //{{{
{
var i;
for (i = 0; i < li.length; i++) {
dragbar[li[i]] = insertDragbar(li[i]);
}
}
//}}}
function createBorders(li) //{{{
{
var cl,i;
for (i = 0; i < li.length; i++) {
switch(li[i]){
case'n': cl='hline'; break;
case's': cl='hline bottom'; break;
case'e': cl='vline right'; break;
case'w': cl='vline'; break;
}
borders[li[i]] = insertBorder(cl);
}
}
//}}}
function createHandles(li) //{{{
{
var i;
for (i = 0; i < li.length; i++) {
handle[li[i]] = insertHandle(li[i]);
}
}
//}}}
function moveto(x, y) //{{{
{
if (!options.shade) {
$img2.css({
top: px(-y),
left: px(-x)
});
}
$sel.css({
top: px(y),
left: px(x)
});
}
//}}}
function resize(w, h) //{{{
{
$sel.width(Math.round(w)).height(Math.round(h));
}
//}}}
function refresh() //{{{
{
var c = Coords.getFixed();

Coords.setPressed([c.x, c.y]);
Coords.setCurrent([c.x2, c.y2]);

updateVisible();
}
//}}}

// Internal Methods
function updateVisible(select) //{{{
{
if (awake) {
return update(select);
}
}
//}}}
function update(select) //{{{
{
var c = Coords.getFixed();

resize(c.w, c.h);
moveto(c.x, c.y);
if (options.shade) Shade.updateRaw(c);

awake || show();

if (select) {
options.onSelect.call(api, unscale(c));
} else {
options.onChange.call(api, unscale(c));
}
}
//}}}
function setBgOpacity(opacity,force,now) //{{{
{
if (!awake && !force) return;
if (options.bgFade && !now) {
$img.animate({
opacity: opacity
},{
queue: false,
duration: options.fadeTime
});
} else {
$img.css('opacity', opacity);
}
}
//}}}
function show() //{{{
{
$sel.show();

if (options.shade) Shade.opacity(bgopacity);
else setBgOpacity(bgopacity,true);

awake = true;
}
//}}}
function release() //{{{
{
disableHandles();
$sel.hide();

if (options.shade) Shade.opacity(1);
else setBgOpacity(1);

awake = false;
options.onRelease.call(api);
}
//}}}
function showHandles() //{{{
{
if (seehandles) {
$hdl_holder.show();
}
}
//}}}
function enableHandles() //{{{
{
seehandles = true;
if (options.allowResize) {
$hdl_holder.show();
return true;
}
}
//}}}
function disableHandles() //{{{
{
seehandles = false;
$hdl_holder.hide();
}
//}}}
function animMode(v) //{{{
{
if (v) {
animating = true;
disableHandles();
} else {
animating = false;
enableHandles();
}
}
//}}}
function done() //{{{
{
animMode(false);
refresh();
}
//}}}
// Insert draggable elements {{{
// Insert border divs for outline

if (options.dragEdges && $.isArray(options.createDragbars))
createDragbars(options.createDragbars);

if ($.isArray(options.createHandles))
createHandles(options.createHandles);

if (options.drawBorders && $.isArray(options.createBorders))
createBorders(options.createBorders);

//}}}

// This is a hack for iOS5 to support drag/move touch functionality
$(document).bind('touchstart.jcrop-ios',function(e) {
if ($(e.currentTarget).hasClass('jcrop-tracker')) e.stopPropagation();
});

var $track = newTracker().mousedown(createDragger('move')).css({
cursor: 'move',
position: 'absolute',
zIndex: 360
});

if (Touch.support) {
$track.bind('touchstart.jcrop', Touch.createDragger('move'));
}

$img_holder.append($track);
disableHandles();

return {
updateVisible: updateVisible,
update: update,
release: release,
refresh: refresh,
isAwake: function () {
return awake;
},
setCursor: function (cursor) {
$track.css('cursor', cursor);
},
enableHandles: enableHandles,
enableOnly: function () {
seehandles = true;
},
showHandles: showHandles,
disableHandles: disableHandles,
animMode: animMode,
setBgOpacity: setBgOpacity,
done: done
};
}());

//}}}
// Tracker Module {{{
var Tracker = (function () {
var onMove = function () {},
onDone = function () {},
trackDoc = options.trackDocument;

function toFront(touch) //{{{
{
$trk.css({
zIndex: 450
});

if (touch)
$(document)
.bind('touchmove.jcrop', trackTouchMove)
.bind('touchend.jcrop', trackTouchEnd);

else if (trackDoc)
$(document)
.bind('mousemove.jcrop',trackMove)
.bind('mouseup.jcrop',trackUp);
}
//}}}
function toBack() //{{{
{
$trk.css({
zIndex: 290
});
$(document).unbind('.jcrop');
}
//}}}
function trackMove(e) //{{{
{
onMove(mouseAbs(e));
return false;
}
//}}}
function trackUp(e) //{{{
{
e.preventDefault();
e.stopPropagation();

if (btndown) {
btndown = false;

onDone(mouseAbs(e));

if (Selection.isAwake()) {
options.onSelect.call(api, unscale(Coords.getFixed()));
}

toBack();
onMove = function () {};
onDone = function () {};
}

return false;
}
//}}}
function activateHandlers(move, done, touch) //{{{
{
btndown = true;
onMove = move;
onDone = done;
toFront(touch);
return false;
}
//}}}
function trackTouchMove(e) //{{{
{
onMove(mouseAbs(Touch.cfilter(e)));
return false;
}
//}}}
function trackTouchEnd(e) //{{{
{
return trackUp(Touch.cfilter(e));
}
//}}}
function setCursor(t) //{{{
{
$trk.css('cursor', t);
}
//}}}

if (!trackDoc) {
$trk.mousemove(trackMove).mouseup(trackUp).mouseout(trackUp);
}

$img.before($trk);
return {
activateHandlers: activateHandlers,
setCursor: setCursor
};
}());
//}}}
// KeyManager Module {{{
var KeyManager = (function () {
var $keymgr = $('<input type="radio" />').css({
position: 'fixed',
left: '-120px',
width: '12px'
}).addClass('jcrop-keymgr'),

$keywrap = $('<div />').css({
position: 'absolute',
overflow: 'hidden'
}).append($keymgr);

function watchKeys() //{{{
{
if (options.keySupport) {
$keymgr.show();
$keymgr.focus();
}
}
//}}}
function onBlur(e) //{{{
{
$keymgr.hide();
}
//}}}
function doNudge(e, x, y) //{{{
{
if (options.allowMove) {
Coords.moveOffset([x, y]);
Selection.updateVisible(true);
}
e.preventDefault();
e.stopPropagation();
}
//}}}
function parseKey(e) //{{{
{
if (e.ctrlKey || e.metaKey) {
return true;
}
shift_down = e.shiftKey ? true : false;
var nudge = shift_down ? 10 : 1;

switch (e.keyCode) {
case 37:
doNudge(e, -nudge, 0);
break;
case 39:
doNudge(e, nudge, 0);
break;
case 38:
doNudge(e, 0, -nudge);
break;
case 40:
doNudge(e, 0, nudge);
break;
case 27:
if (options.allowSelect) Selection.release();
break;
case 9:
return true;
}

return false;
}
//}}}

if (options.keySupport) {
$keymgr.keydown(parseKey).blur(onBlur);
if (ie6mode || !options.fixedSupport) {
$keymgr.css({
position: 'absolute',
left: '-20px'
});
$keywrap.append($keymgr).insertBefore($img);
} else {
$keymgr.insertBefore($img);
}
}

return {
watchKeys: watchKeys
};
}());
//}}}
// }}}
// API methods {{{
function setClass(cname) //{{{
{
$div.removeClass().addClass(cssClass('holder')).addClass(cname);
}
//}}}
function animateTo(a, callback) //{{{
{
var x1 = a[0] / xscale,
y1 = a[1] / yscale,
x2 = a[2] / xscale,
y2 = a[3] / yscale;

if (animating) {
return;
}

var animto = Coords.flipCoords(x1, y1, x2, y2),
c = Coords.getFixed(),
initcr = [c.x, c.y, c.x2, c.y2],
animat = initcr,
interv = options.animationDelay,
ix1 = animto[0] - initcr[0],
iy1 = animto[1] - initcr[1],
ix2 = animto[2] - initcr[2],
iy2 = animto[3] - initcr[3],
pcent = 0,
velocity = options.swingSpeed;

x1 = animat[0];
y1 = animat[1];
x2 = animat[2];
y2 = animat[3];

Selection.animMode(true);
var anim_timer;

function queueAnimator() {
window.setTimeout(animator, interv);
}
var animator = (function () {
return function () {
pcent += (100 - pcent) / velocity;

animat[0] = Math.round(x1 + ((pcent / 100) * ix1));
animat[1] = Math.round(y1 + ((pcent / 100) * iy1));
animat[2] = Math.round(x2 + ((pcent / 100) * ix2));
animat[3] = Math.round(y2 + ((pcent / 100) * iy2));

if (pcent >= 99.8) {
pcent = 100;
}
if (pcent < 100) {
setSelectRaw(animat);
queueAnimator();
} else {
Selection.done();
Selection.animMode(false);
if (typeof(callback) === 'function') {
callback.call(api);
}
}
};
}());
queueAnimator();
}
//}}}
function setSelect(rect) //{{{
{
setSelectRaw([rect[0] / xscale, rect[1] / yscale, rect[2] / xscale, rect[3] / yscale]);
options.onSelect.call(api, unscale(Coords.getFixed()));
Selection.enableHandles();
}
//}}}
function setSelectRaw(l) //{{{
{
Coords.setPressed([l[0], l[1]]);
Coords.setCurrent([l[2], l[3]]);
Selection.update();
}
//}}}
function tellSelect() //{{{
{
return unscale(Coords.getFixed());
}
//}}}
function tellScaled() //{{{
{
return Coords.getFixed();
}
//}}}
function setOptionsNew(opt) //{{{
{
setOptions(opt);
interfaceUpdate();
}
//}}}
function disableCrop() //{{{
{
options.disabled = true;
Selection.disableHandles();
Selection.setCursor('default');
Tracker.setCursor('default');
}
//}}}
function enableCrop() //{{{
{
options.disabled = false;
interfaceUpdate();
}
//}}}
function cancelCrop() //{{{
{
Selection.done();
Tracker.activateHandlers(null, null);
}
//}}}
function destroy() //{{{
{
$div.remove();
$origimg.show();
$origimg.css('visibility','visible');
$(obj).removeData('Jcrop');
}
//}}}
function setImage(src, callback) //{{{
{
Selection.release();
disableCrop();
var img = new Image();
img.onload = function () {
var iw = img.width;
var ih = img.height;
var bw = options.boxWidth;
var bh = options.boxHeight;
$img.width(iw).height(ih);
$img.attr('src', src);
$img2.attr('src', src);
presize($img, bw, bh);
boundx = $img.width();
boundy = $img.height();
$img2.width(boundx).height(boundy);
$trk.width(boundx + (bound * 2)).height(boundy + (bound * 2));
$div.width(boundx).height(boundy);
Shade.resize(boundx,boundy);
enableCrop();

if (typeof(callback) === 'function') {
callback.call(api);
}
};
img.src = src;
}
//}}}
function colorChangeMacro($obj,color,now) {
var mycolor = color || options.bgColor;
if (options.bgFade && supportsColorFade() && options.fadeTime && !now) {
$obj.animate({
backgroundColor: mycolor
}, {
queue: false,
duration: options.fadeTime
});
} else {
$obj.css('backgroundColor', mycolor);
}
}
function interfaceUpdate(alt) //{{{
// This method tweaks the interface based on options object.
// Called when options are changed and at end of initialization.
{
if (options.allowResize) {
if (alt) {
Selection.enableOnly();
} else {
Selection.enableHandles();
}
} else {
Selection.disableHandles();
}

Tracker.setCursor(options.allowSelect ? 'crosshair' : 'default');
Selection.setCursor(options.allowMove ? 'move' : 'default');

if (options.hasOwnProperty('trueSize')) {
xscale = options.trueSize[0] / boundx;
yscale = options.trueSize[1] / boundy;
}

if (options.hasOwnProperty('setSelect')) {
setSelect(options.setSelect);
Selection.done();
delete(options.setSelect);
}

Shade.refresh();

if (options.bgColor != bgcolor) {
colorChangeMacro(
options.shade? Shade.getShades(): $div,
options.shade?
(options.shadeColor || options.bgColor):
options.bgColor
);
bgcolor = options.bgColor;
}

if (bgopacity != options.bgOpacity) {
bgopacity = options.bgOpacity;
if (options.shade) Shade.refresh();
else Selection.setBgOpacity(bgopacity);
}

xlimit = options.maxSize[0] || 0;
ylimit = options.maxSize[1] || 0;
xmin = options.minSize[0] || 0;
ymin = options.minSize[1] || 0;

if (options.hasOwnProperty('outerImage')) {
$img.attr('src', options.outerImage);
delete(options.outerImage);
}

Selection.refresh();
}
//}}}
//}}}

if (Touch.support) $trk.bind('touchstart.jcrop', Touch.newSelection);

$hdl_holder.hide();
interfaceUpdate(true);

var api = {
setImage: setImage,
animateTo: animateTo,
setSelect: setSelect,
setOptions: setOptionsNew,
tellSelect: tellSelect,
tellScaled: tellScaled,
setClass: setClass,

disable: disableCrop,
enable: enableCrop,
cancel: cancelCrop,
release: Selection.release,
destroy: destroy,

focus: KeyManager.watchKeys,

getBounds: function () {
return [boundx * xscale, boundy * yscale];
},
getWidgetSize: function () {
return [boundx, boundy];
},
getScaleFactor: function () {
return [xscale, yscale];
},
getOptions: function() {
// careful: internal values are returned
return options;
},

ui: {
holder: $div,
selection: $sel
}
};

if (is_msie) $div.bind('selectstart', function () { return false; });

$origimg.data('Jcrop', api);
return api;
};
$.fn.Jcrop = function (options, callback) //{{{
{
var api;
// Iterate over each object, attach Jcrop
this.each(function () {
// If we've already attached to this object
if ($(this).data('Jcrop')) {
// The API can be requested this way (undocumented)
if (options === 'api') return $(this).data('Jcrop');
// Otherwise, we just reset the options...
else $(this).data('Jcrop').setOptions(options);
}
// If we haven't been attached, preload and attach
else {
if (this.tagName == 'IMG')
$.Jcrop.Loader(this,function(){
$(this).css({display:'block',visibility:'hidden'});
api = $.Jcrop(this, options);
if ($.isFunction(callback)) callback.call(api);
});
else {
$(this).css({display:'block',visibility:'hidden'});
api = $.Jcrop(this, options);
if ($.isFunction(callback)) callback.call(api);
}
}
});

// Return "this" so the object is chainable (jQuery-style)
return this;
};
//}}}
// $.Jcrop.Loader - basic image loader {{{

$.Jcrop.Loader = function(imgobj,success,error){
var $img = $(imgobj), img = $img[0];

function completeCheck(){
if (img.complete) {
$img.unbind('.jcloader');
if ($.isFunction(success)) success.call(img);
}
else window.setTimeout(completeCheck,50);
}

$img
.bind('load.jcloader',completeCheck)
.bind('error.jcloader',function(e){
$img.unbind('.jcloader');
if ($.isFunction(error)) error.call(img);
});

if (img.complete && $.isFunction(success)){
$img.unbind('.jcloader');
success.call(img);
}
};

//}}}
// Global Defaults {{{
$.Jcrop.defaults = {

// Basic Settings
allowSelect: true,
allowMove: true,
allowResize: true,

trackDocument: true,

// Styling Options
baseClass: 'jcrop',
addClass: null,
bgColor: 'black',
bgOpacity: 0.6,
bgFade: false,
borderOpacity: 0.4,
handleOpacity: 0.5,
handleSize: null,

aspectRatio: 0,
keySupport: true,
createHandles: ['n','s','e','w','nw','ne','se','sw'],
createDragbars: ['n','s','e','w'],
createBorders: ['n','s','e','w'],
drawBorders: true,
dragEdges: true,
fixedSupport: true,
touchSupport: null,

shade: null,

boxWidth: 0,
boxHeight: 0,
boundary: 2,
fadeTime: 400,
animationDelay: 20,
swingSpeed: 3,

minSelect: [0, 0],
maxSize: [0, 0],
minSize: [0, 0],

// Callbacks / Event Handlers
onChange: function () {},
onSelect: function () {},
onDblClick: function () {},
onRelease: function () {}
};

// }}}
}(jQuery));

.Net Programming in Simple