@Anton,
Brother it solves all the JSON stuff for the "noticeTitle". GR8!!!
Thats the first JSON that I was looking for.
Now coming back to the securefile JSON problem:
As you said
Another hidden gem, in case you need to find exact path to file and cloak_url doesn't help:
Well a two part answer/query:
1. used the dump tag and was able to see the file_name parameter. But using the code:
- Code: Select all
<cms:show_securefile 'notices_image' ><cms:cloak_url link=file_name /></cms:show_securefile>
I get the output as:
- Code: Select all
"noticesImage": "http://localhost/TDCouch2/couch/download.php?auth=R3ZwPgNf55Gbba4789etbdao4w%3D%3D%7CemcefE12nE8iPbuAkDz16OkaQ5e8Nhgw%7C0%7C0%7C0%7C0%7C0%7C0%7Cac619555228b0fff0632dc06da98b3cf"
so cloak_url ain't solving the problem.
2.You got it right, I want the entire absolute path of the image uploaded through securefile, so that I can putput it into JSON. But am unable to comprehend where to apply what.
As a head start to use the
hidden gem (great work on that), I am having the template named 'add-notices.php' with a databound form, which is coded as:
- Code: Select all
<?php require_once( 'couch/cms.php' ); ?>
<cms:template title='Add Notice' order='7' clonable='1'>
<cms:editable name='notices_image' label='Image' type='securefile' show_preview='1' thumb_width='150' use_thumb_for_preview='1' allowed_ext='png, jpg, jpeg' order='1' />
<cms:editable name='notices_title' label='Notice Title' required='1' type='text' order='2' />
<cms:editable name='notices_content' label='Notice Content' required='1' type='textarea' order='3' />
<cms:editable name='notices_date' label='Notice Date' validator='exact_len=10' required='1' type='text' order='4' />
</cms:template>
<cms:if k_user_access_level ge '10' >
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>TDirectory - Add Notice</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="genxcoders-custom/css/font-awesome.min.css" />
<!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">-->
<link rel="stylesheet" href="dist/css/AdminLTE.min.css">
<link rel="stylesheet" href="dist/css/skins/skin-blue.min.css">
<link rel="stylesheet" href="genxcoders-custom/genxcoders.css">
<link rel="stylesheet" href="plugins/datepicker/datepicker3.css">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">
<!-- Main Header -->
<header class="main-header">
<!-- Logo -->
<a href="index2.html" class="logo">
<!-- mini logo for sidebar mini 50x50 pixels -->
<span class="logo-mini"><b>T</b>D</span>
<!-- logo for regular state and mobile devices -->
<span class="logo-lg"><b>T</b>Directory</span>
</a>
<!-- Header Navbar -->
<nav class="navbar navbar-static-top" role="navigation">
<!-- Sidebar toggle button-->
<a href="#" class="sidebar-toggle" data-toggle="offcanvas" role="button">
<span class="sr-only">Toggle navigation</span>
</a>
<!-- Navbar Right Menu -->
<div class="navbar-custom-menu">
<ul class="nav navbar-nav">
<!-- User Account Menu -->
<li class="dropdown user user-menu">
<!-- Menu Toggle Button -->
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<!-- The user image in the navbar-->
<img src="dist/img/TDirectoryLogo.png" class="user-image" alt="User Image">
<!-- hidden-xs hides the username on small devices so only the image appears. -->
<span class="hidden-xs">aashish@genxcoders.in</span>
</a>
<ul class="dropdown-menu">
<!-- The user image in the menu -->
<li class="user-header">
<img src="dist/img/TDirectoryLogo.png" class="img-circle" alt="User Image">
<p>
aashish@genxcoders.in
<small>Account Validity: OCT 2016</small>
</p>
</li>
<!-- Menu Footer-->
<li class="user-footer">
<div class="pull-left">
<a href="#" class="btn btn-default btn-flat"><i class="fa fa-user-secret"></i> Profile</a>
</div>
<div class="pull-right">
<a href="#" class="btn btn-default btn-flat"><i class="fa fa-sign-out"></i> Logout</a>
</div>
</li>
</ul>
</li>
<!-- Logout Button -->
<!--<li>
<a href="#" data-toggle="control-sidebar" alt="Logout"><i class="fa fa-sign-out"></i></a>
</li>-->
</ul>
</div>
</nav>
</header>
<!-- Left side column. contains the logo and sidebar -->
<aside class="main-sidebar">
<!-- sidebar: style can be found in sidebar.less -->
<section class="sidebar">
<!-- Sidebar user panel (optional) -->
<div class="user-panel">
<div class="pull-left image">
<img src="dist/img/TDirectoryLogo.png" class="img-circle" alt="User Image">
</div>
<div class="pull-left info">
<p>aashish@genxcoders.in</p>
<!-- Status -->
<a><!--<i class="fa fa-circle text-success"></i>--> <div id="date-display" class="white-text pull-left"></div></a>
</div>
</div>
<!-- search form (Optional) -->
<!--<form action="#" method="get" class="sidebar-form">
<div class="input-group">
<input type="text" name="q" class="form-control" placeholder="Search...">
<span class="input-group-btn">
<button type="submit" name="search" id="search-btn" class="btn btn-flat"><i class="fa fa-search"></i></button>
</span>
</div>
</form>-->
<!-- /.search form -->
<!-- Sidebar Menu -->
<ul class="sidebar-menu">
<li class="header">MAIN NAVIGATION</li>
<!-- Optionally, you can add icons to the links -->
<li><a href="index.html"><i class="fa fa-dashboard"></i> <span>Dashboard</span></a></li>
<li class="treeview">
<a href="#">
<i class="fa fa-dashboard"></i> <span>Department</span>
<span class="pull-right-container">
<i class="fa fa-angle-right pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li class="active"><a href="index.html"><i class="fa fa-eye"></i> View All</a></li>
<li><a href="index2.html"><i class="fa fa-plus"></i> Add Department</a></li>
</ul>
</li>
<li class="treeview">
<a href="#">
<i class="fa fa-dashboard"></i> <span>Employees/ Members List</span>
<span class="pull-right-container">
<i class="fa fa-angle-right pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li class="active"><a href="index.html"><i class="fa fa-eye"></i> View All</a></li>
<li><a href="index2.html"><i class="fa fa-plus"></i> Add Employee/ Member</a></li>
</ul>
</li>
<li class="treeview active">
<a href="#">
<i class="fa fa-dashboard"></i> <span>Notices</span>
<span class="pull-right-container">
<i class="fa fa-angle-right pull-right"></i>
</span>
</a>
<ul class="treeview-menu">
<li><a href="notices.html"><i class="fa fa-eye"></i> View All</a></li>
<li class="active"><a href="add-notices.html"><i class="fa fa-plus"></i> Add Notice</a></li>
</ul>
</li>
<li><a href="profile.html"><i class="fa fa-user-secret"></i> <span>Profile Settings</span></a></li>
</ul><!-- /.sidebar-menu -->
</section><!-- /.sidebar -->
</aside>
<!-- Content Wrapper. Contains page content -->
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<section class="content-header">
<h1>
Add Notice
<small>Add and Send Notice to all Employees/ Members</small>
</h1>
</section>
<!-- Main content -->
<section class="content">
<div class="box box-primary">
<div class="box-header">
<!-- Form to Add Notice -->
<cms:set submit_success="<cms:get_flash 'submit_success' />" />
<cms:form
masterpage=k_template_name
mode='create'
enctype='multipart/form-data'
method='post'
anchor='0'
>
<!-- Success -->
<cms:if k_success >
<cms:db_persist_form
_invalidate_cache='0'
_auto_title='1'
/>
<cms:if k_success >
<cms:set_flash name='submit_success' value='1' />
<div class="alert alert-success" role="alert" data-dismiss="alert">
<button class="close" type="button" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
Notice has been sent successfully :)
<br>
</div>
<cms:redirect 'notices.html' />
</cms:if>
</cms:if>
<!-- Success -->
<!-- Failure -->
<cms:if k_error >
<div class="alert alert-danger" role="alert">
<button class="close" type="button" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
Oops! The following problems were encountered :(
<br>
<div class="error">
<cms:each k_error >
<br><cms:show item />
</cms:each>
</div>
</div>
</cms:if>
<!-- Failure -->
</div>
<div class="box-body">
<div class="col-md-3">
Image Attachment
</div>
<div class="col-md-9">
<!--<img id="blah" src="#" />
<input type='file' onchange="readURL(this);" />-->
<img id="f_notices_image" src="#" style="width: 25%; margin: 10px auto; display: block;"/>
<cms:input name="notices_image" type="bound" onchange="readURL(this);" trust_mode='1' />
<div style="padding-top: 10px;"></div>
</div>
<div class="col-md-3">
Notice Title *
</div>
<div class="col-md-9">
<cms:input name="notices_title" type="bound" style="width: 100%;" />
<div style="padding-top: 10px;"></div>
</div>
<div class="col-md-3">
Notice Content *
<div style="padding-top: 10px;"></div>
</div>
<div class="col-md-9">
<cms:input type="bound" name="notices_content" style="width: 100%;" cols="" rows="5"></cms:input>
<div style="padding-top: 10px;"></div>
</div>
<div class="col-md-3">
Notice Date *
<div style="padding-top: 10px;"></div>
</div>
<div class="col-md-9">
<div class="input-group date">
<div class="input-group-addon">
<i class="fa fa-calendar"></i>
</div>
<cms:input name='notices_date' type="bound" class="form-control pull-right" id="f_notices_date" />
</div>
<div style="padding-top: 10px;"></div>
</div>
</div>
<div class="box-footer">
<div class="col-md-9"> </div>
<div class="col-md-3">
<cms:if "<cms:not submit_success />" >
<button type="submit" class="btn btn-success">Send Notice</button>
</cms:if>
<button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
</div>
</div>
</cms:form>
<!-- Form to Add Notice -->
</div>
</section>
<!-- /.content -->
</div>
<!-- /.content-wrapper -->
<!-- Main Footer -->
<footer class="main-footer">
<!-- To the right -->
<div class="pull-right hidden-xs">
Secured Intra-Organization Communication Application
</div>
<!-- Default to the left -->
<strong>Copyright © 2016 - 2017 <a href="http://www.tdirectory.in/">TDirectory</a> by <a href="http://www.genxcoders.in/">GenXCoders</a>.</strong> All rights reserved.
</footer>
</div><!-- ./wrapper -->
<!-- REQUIRED JS SCRIPTS -->
<script src="plugins/jQuery/jquery-2.2.3.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="dist/js/app.min.js"></script>
<script src="genxcoders-custom/typeahead.bundle.js"></script>
<script src="plugins/datepicker/bootstrap-datepicker.js"></script>
<script>
var nbaTeams = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('team'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
prefetch: 'https://twitter.github.io/typeahead.js/data/nba.json'
});
var nhlTeams = new Bloodhound({
datumTokenizer: Bloodhound.tokenizers.obj.whitespace('team'),
queryTokenizer: Bloodhound.tokenizers.whitespace,
prefetch: 'https://twitter.github.io/typeahead.js/data/nhl.json'
});
$('#multiple-datasets .typeahead').typeahead({
highlight: true
},
{
name: 'nba-teams',
display: 'team',
source: nbaTeams,
templates: {
header: '<h3 class="league-name">Departments</h3>'
}
},
{
name: 'nhl-teams',
display: 'team',
source: nhlTeams,
templates: {
header: '<h3 class="league-name">Members</h3>'
}
});
//Notice Image Thumbnail Generation
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#f_notices_image')
.attr('src', e.target.result)
};
reader.readAsDataURL(input.files[0]);
}
}
//Date picker
$('#f_notices_date').datepicker({
autoclose: true
});
<!-- Date Display -->
var dt = new Date();
document.getElementById("date-display").innerHTML = dt.toDateString();
</script>
</body>
</html>
<cms:else />
<cms:redirect 'couch/login.php' />
</cms:if>
<?php COUCH::invoke(); ?>
And from this i need to generate a JSON file which will actually need to provide the output as:
- Code: Select all
{
"notices": [
{
"noticesImage": "http://localhost/TDCouch2/couch/download.php?auth=R3ZwPgNf55Gbba4789etbdao4w%3D%3D%7CemcefE12nE8iPbuAkDz16OkaQ5e8Nhgw%7C0%7C0%7C0%7C0%7C0%7C0%7Cac619555228b0fff0632dc06da98b3cf",
"noticesTitle": "Test 14",
"noticesContent": "Content 14",
"noticesDate": "10/31/2016"
},
{
"noticesImage": "http://localhost/TDCouch2/couch/download.php?auth=cq4Brg9OuaAQ%2F%2Baj%7CEKTpFk5owmizsIwxcHcoWbjIqukBQueE%7C0%7C0%7C0%7C0%7C0%7C0%7Cf1d92a2922d7612d8656242c2bdd3d6b",
"noticesTitle": "Test 13",
"noticesContent": "Content 13",
"noticesDate": "10/30/2016"
}
]
}
where the "noticesImage" needs to have the exact path of the securefile something like:
- Code: Select all
"noticesImage" : "http//www.sitename.com/couch/uploads/attachments/FileName.jpg"
the above JSON that i have shown is being generated using the code, written in a file "/json/notices.php":
<?php require_once( '../couch/cms.php' ); ?>
<cms:content_type 'application/json'/>
{
"notices" :
[
<cms:pages masterpage='add-notices.php'>
{
"noticesImage" : "<cms:addslashes><cms:show_securefile 'notices_image' ><cms:cloak_url link=file_name /></cms:show_securefile></cms:addslashes>",
"noticesTitle" : "<cms:addslashes><cms:show notices_title /></cms:addslashes>",
"noticesContent" : "<cms:addslashes><cms:show notices_content /></cms:addslashes>",
"noticesDate" : "<cms:addslashes><cms:show notices_date /></cms:addslashes>"
}<cms:if "<cms:not k_paginated_bottom/>">,</cms:if>
</cms:pages>
]
}
<?php COUCH::invoke(); ?>
Where do i fit your code?
Please Comment!
