├── .gitignore
├── CRM
    ├── Civisualize
    │   ├── Dashlet.mgd.php
    │   ├── Page
    │   │   ├── Doc.php
    │   │   └── Main.php
    │   └── VisualBundle.php
    └── Core
    │   └── Smarty
    │       └── plugins
    │           ├── function.crmRetrieve.php
    │           ├── function.crmSQL.php
    │           └── function.crmTitle.php
├── LICENSE
├── README.md
├── api
    └── v3
    │   ├── Activity
    │       └── Getstat.php
    │   ├── Contact
    │       └── Getstat.php
    │   ├── GroupContact
    │       └── Getstat.php
    │   ├── Participant
    │       └── Getstat.php
    │   └── Tag
    │       └── Getstat.php
├── civisualize.civix.php
├── civisualize.php
├── css
    └── style.css
├── examples
    ├── contacts.jpg
    ├── contribution.jpg
    ├── donortrends.jpg
    ├── event.jpg
    └── events.jpg
├── info.xml
├── js
    ├── civisualize.js
    ├── common.js
    ├── d3.min.v5.7.0.js
    ├── d3.v3.js
    ├── dc
    │   ├── crossfilter.min.js
    │   ├── dc.min.css
    │   └── dc.min.js
    ├── filesaver.js
    └── marked.min.js
├── queries
    ├── another.sql
    ├── contacts.sql
    ├── contribution_by_date.sql
    ├── donors.sql
    ├── eventdetails.json
    ├── eventparticipants.json
    ├── events.sql
    ├── mailing_click.json
    ├── mailing_event.js
    ├── mailing_open.json
    ├── mailings.json
    └── participants.sql
├── templates
    ├── CRM
    │   └── Civisualize
    │   │   └── Page
    │   │       ├── Doc.tpl
    │   │       └── Main.tpl
    └── dataviz
    │   ├── Contactcreateddate.tpl
    │   ├── Contactdashboard.tpl
    │   ├── Contacts.tpl
    │   ├── Contacttype.tpl
    │   ├── Contribute.tpl
    │   ├── ContributionByDate.tpl
    │   ├── Demo.tpl
    │   ├── Donortrends.tpl
    │   ├── Event.tpl
    │   ├── Events.tpl
    │   ├── Example.tpl
    │   ├── Groupbarchart.tpl
    │   ├── Lapseddonor.tpl
    │   ├── Mailing.tpl
    │   ├── Mailings.tpl
    │   ├── Tag.tpl
    │   └── Typebarchart.tpl
├── updateTpl
└── xml
    └── Menu
        └── civisualize.xml


/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules/*
2 | 


--------------------------------------------------------------------------------
/CRM/Civisualize/Dashlet.mgd.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | return array(
 4 |   array(
 5 |     'name'=>'dataviz_contact',
 6 |     'entity'=> 'Dashboard',
 7 |     'params'=> array(
 8 |       'version'=>'3',
 9 |       'name'=>'dataviz_contact',
10 |       'label'=> 'Dataviz of contacts',
11 |       'url' => 'civicrm/dataviz/contacts?snippet=4',
12 |     ),
13 |   ),
14 | 
15 |   array(
16 |     'name'=>'dataviz_events',
17 |     'entity'=> 'Dashboard',
18 |     'params'=> array(
19 |       'version'=>'3',
20 |       'name'=>'dataviz_event',
21 |       'label'=> 'Dataviz of events',
22 |       'url' => 'civicrm/dataviz/events?snippet=4',
23 |     ),
24 |   ),
25 | 
26 |   array(
27 |     'name'=>'dataviz_contribute',
28 |     'entity'=> 'Dashboard',
29 |     'params'=> array(
30 |       'version'=>'3',
31 |       'name'=>'dataviz_contribute',
32 |       'label'=> 'Dataviz of contributions',
33 |       'url' => 'civicrm/dataviz/contribute?snippet=4',
34 |     ),
35 |   ),
36 | 
37 | );
38 | 


--------------------------------------------------------------------------------
/CRM/Civisualize/Page/Doc.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | class CRM_Civisualize_Page_Doc extends CRM_Core_Page {
 4 | 
 5 |   public function run() {
 6 |    CRM_Core_Resources::singleton()
 7 |     ->addScriptFile('eu.tttp.civisualize', 'js/marked.min.js', 110, 'html-header', FALSE);
 8 | 
 9 |     $request = CRM_Utils_System::currentPath();
10 |     if (false !== strpos($request, '..')) {
11 |       die ("SECURITY FATAL: the url can't contain '..'. Please report the issue on the forum at civicrm.org");
12 |     }
13 | 
14 |     $request = explode('/',$request);
15 | //print_r($request);
16 |     $tplfile = NULL;
17 |     $smarty= CRM_Core_Smarty::singleton( );
18 |     $smarty->assign("options",array());
19 |     $path = "doc/";
20 |     if (CRM_Utils_Array::value(2, $request)) {
21 |       $tplfile = _civicrm_api_get_camel_name($request[2]);
22 |       $tplfile = explode('?', $tplfile);
23 |       $file = $tplfile[0].'.md';
24 |     }
25 |     if (CRM_Utils_Array::value(3, $request)) {
26 |       $r3 = _civicrm_api_get_camel_name($request[3]);
27 |       if (!is_numeric($r3)) {
28 |         $file = $r3 .'.md';
29 |         $path = $path.$tplfile[0].'/';
30 |       }
31 |       $smarty->assign("id",$r3);
32 |     }
33 |     
34 |     if (CIVISUALIZE_GITHUB_DOC) {
35 |       $smarty->assign("github",CIVISUALIZE_GITHUB_DOC);
36 |     } else {
37 |       $smarty->assign("github","TechToThePeople/civisualize");
38 |     }
39 |     
40 | //    $github = civicrm_api3('setting', 'getvalue', array('group' => 'Civisualize Preferences', 'name' => 'civisualize_github_doc'));
41 |     $md = file_get_contents($path.$file, FILE_USE_INCLUDE_PATH);
42 |     if (!$md) {
43 |       $md= "$path$file not found"; 
44 |       $smarty->assign("error","missing_file");
45 |     }
46 |     $smarty->assign("mdfile",$file);
47 |     $smarty->assign("path",$path);
48 |     $smarty->assign("md",$md);
49 | 
50 |     if (CRM_Utils_Array::value(4, $request)) {
51 |       $r3 = CRM_Utils_String::munge($request[4]);
52 |       $smarty->assign("id2",$r3);
53 |     }
54 |     if (!$tplfile) {
55 |       $tpl = "CRM/Civisualize/Page/Doc.tpl";
56 |     }
57 | 
58 |     parent::run();
59 |   }
60 | 
61 | }
62 | 


--------------------------------------------------------------------------------
/CRM/Civisualize/Page/Main.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | require_once 'CRM/Core/Page.php';
 4 | 
 5 | class CRM_Civisualize_Page_Main extends CRM_Core_Page {
 6 | 
 7 |   function getTemplateFileName () {
 8 |     $request = CRM_Utils_System::currentPath();
 9 |     if (false !== strpos($request, '..')) {
10 |       die ("SECURITY FATAL: the url can't contain '..'. Please report the issue on the forum at civicrm.org");
11 |     }
12 | 
13 |     $request = explode('/',$request);
14 |     $tplfile = NULL;
15 |     $smarty= CRM_Core_Smarty::singleton( );
16 |     $smarty->assign("options",array());
17 |     if (CRM_Utils_Array::value(2, $request)) {
18 |       $tplfile = _civicrm_api_get_camel_name($request[2]);
19 |       $tplfile = explode('?', $tplfile);
20 |       $tpl = 'dataviz/'.$tplfile[0].'.tpl';
21 |     }
22 |     if (CRM_Utils_Array::value(3, $request)) {
23 |       $r3 = _civicrm_api_get_camel_name($request[3]);
24 |       $smarty->assign("id",$r3);
25 |     }
26 |     if (CRM_Utils_Array::value(4, $request)) {
27 |       $r3 = CRM_Utils_String::munge($request[4]);
28 |       $smarty->assign("id2",$r3);
29 |     }
30 |     if (!$tplfile) {
31 |       $tpl = "CRM/Civisualize/Page/Main.tpl";
32 |     }
33 |     if( !$smarty->template_exists($tpl) ){
34 |       header("Status: 404 Not Found");
35 |       die ("Can't find the requested template file templates/$tpl");
36 |     }
37 |     return $tpl;
38 |   }
39 | 
40 |   function run() {
41 |     $smarty= CRM_Core_Smarty::singleton( );
42 |     CRM_Civisualize_VisualBundle::register();
43 | 
44 |     $dummy = NULL;
45 |     if (array_key_exists('id',$_GET)) {// special treatmenent, because it's often used
46 |       $smarty->assign ('id',(int)$_GET['id']);// an id is always positive
47 |     }
48 |     $pos = strpos (implode (array_keys ($_GET)),'<') ;
49 | 
50 |     if ($pos !== false) {
51 |       die ("SECURITY FATAL: one of the param names contains &lt;");
52 |     }
53 |     $param = array_map( 'htmlentities' , $_GET);
54 | //TODO: sql escape the params too
55 |     unset($param['q']);
56 |     $smarty->assign_by_ref("request", $param);
57 | 
58 |    CRM_Core_Resources::singleton()
59 |     ->addScriptFile('eu.tttp.civisualize', 'js/d3.min.v5.7.0.js', 110, 'html-header', FALSE)
60 |     ->addScriptFile('eu.tttp.civisualize', 'js/dc/dc.min.js', 110, 'html-header', FALSE)
61 |     ->addScriptFile('eu.tttp.civisualize', 'js/dc/crossfilter.min.js', 110, 'html-header', FALSE)
62 |     ->addScriptFile('eu.tttp.civisualize', 'js/filesaver.js', 110, 'html-header', FALSE)
63 |     ->addScriptFile('eu.tttp.civisualize', 'js/common.js', 110, 'html-header', FALSE)
64 |     ->addStyleFile('eu.tttp.civisualize', 'js/dc/dc.min.css')
65 |     ->addStyleFile('eu.tttp.civisualize', 'css/style.css')
66 |     ->addVars('civisualize', array(
67 |        'baseUrl' => CRM_Core_Resources::singleton()->getUrl('eu.tttp.civisualize'),
68 |    ));
69 | 
70 |     require_once 'CRM/Core/Smarty/plugins/function.crmSQL.php';
71 |     $smarty->register_function("crmSQL", "smarty_function_crmSQL");
72 | 
73 |     require_once 'CRM/Core/Smarty/plugins/function.crmRetrieve.php';
74 |     $smarty->register_function("crmRetrieve", "smarty_function_crmRetrieve");
75 | 
76 |     require_once 'CRM/Core/Smarty/plugins/function.crmTitle.php';
77 |     $smarty->register_function("crmTitle", "smarty_function_crmTitle");
78 | 
79 |     return parent::run();
80 |   }
81 | }
82 | 


--------------------------------------------------------------------------------
/CRM/Civisualize/VisualBundle.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | use CRM_Civisualize_ExtensionUtil as E;
 3 | /*
 4 |  +--------------------------------------------------------------------+
 5 |  | Copyright CiviCRM LLC. All rights reserved.                        |
 6 |  |                                                                    |
 7 |  | This work is published under the GNU AGPLv3 license with some      |
 8 |  | permitted exceptions and without any warranty. For full license    |
 9 |  | and copyright information, see https://civicrm.org/licensing       |
10 |  +--------------------------------------------------------------------+
11 |  */
12 | 
13 | /**
14 |  * This class defines the `civisualise-bundle.js` asset, which combines `dc.js`,
15 |  * `d3.js`, and `crossfilter.js` into one asset -- and puts the services
16 |  * in the `CRM.civisualise` namespace.
17 |  *
18 |  * @package CRM
19 |  * @copyright CiviCRM LLC https://civicrm.org/licensing
20 |  * $Id$
21 |  *
22 |  */
23 | class CRM_Civisualize_VisualBundle {
24 | 
25 |   public static function register() {
26 |     // We put the weight as -1 as we wish to be loaded before the scripts in our page run.
27 |     Civi::resources()->addScriptUrl(Civi::service('asset_builder')->getUrl('civisualize-bundle.min.js'), CRM_Core_Resources::DEFAULT_WEIGHT -1);
28 |     Civi::resources()->addStyleUrl(Civi::service('asset_builder')->getUrl('civisualize-bundle.css'), CRM_Core_Resources::DEFAULT_WEIGHT -1);
29 |   }
30 | 
31 |   /**
32 |    * Generate asset content (when accessed via AssetBuilder).
33 |    *
34 |    * @param \Civi\Core\Event\GenericHookEvent $event
35 |    * @see CRM_Utils_hook::buildAsset()
36 |    * @see \Civi\Core\AssetBuilder
37 |    */
38 |   public static function buildAssetJs($event) {
39 |     if ($event->asset !== 'civisualize-bundle.min.js') {
40 |       return;
41 |     }
42 | 
43 |     $file = E::path('js/civisualize.js');
44 |     $content = "// File: $file\n" . file_get_contents($file) . "\n";
45 |     $content .= "var crossfilter = this.crossfilter;\n";
46 | 
47 |     $content .= "(function(){\n";
48 | 
49 |     // Add crossfilter
50 |     $file = E::path('js/dc/crossfilter.min.js');
51 |     $content .= "// File: $file\n" . file_get_contents($file) . "\n";
52 |     $content .= "var crossfilter = this.crossfilter;\n";
53 | 
54 |     // Add d3
55 |     $file = E::path('js/d3.min.v5.7.0.js');
56 |     $content .= "// File: $file\n" . file_get_contents($file) . "\n";
57 |     $content .= "var d3 = this.d3;\n";
58 | 
59 |     // Add dc
60 |     $file = E::path('js/dc/dc.min.js');
61 |     $content .= "// File: $file\n" . file_get_contents($file) . "\n";
62 |     $content .= "this.dc = dc;\n";
63 | 
64 |     // End the anon function and call it with CRM.civisualize as its 'this' object.
65 |     $content .= "}).call(CRM.civisualize);";
66 | 
67 |     $event->mimeType = 'application/javascript';
68 |     $event->content = $content;
69 |   }
70 | 
71 |   /**
72 |    * Generate asset content (when accessed via AssetBuilder).
73 |    *
74 |    * @param \Civi\Core\Event\GenericHookEvent $event
75 |    * @see CRM_Utils_hook::buildAsset()
76 |    * @see \Civi\Core\AssetBuilder
77 |    */
78 |   public static function buildAssetCss($event) {
79 |     if ($event->asset !== 'civisualize-bundle.css') {
80 |       return;
81 |     }
82 | 
83 |     $files = [ 'dc' =>  'js/dc/dc.min.css' ];
84 | 
85 |     $content = [];
86 |     foreach ($files as $file) {
87 |       $file = E::path($file);
88 |       $content[] = "// File: $file";
89 |       $content[] = file_get_contents($file);
90 |     }
91 | 
92 |     $event->mimeType = 'text/css';
93 |     $event->content = implode("\n", $content);
94 |   }
95 | 
96 | }
97 | 
98 | 


--------------------------------------------------------------------------------
/CRM/Core/Smarty/plugins/function.crmRetrieve.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | function smarty_function_crmRetrieve($params, &$smarty) { 
 4 | 	if (!array_key_exists('var', $params) || !array_key_exists('type', $params) || !array_key_exists('name', $params)) { 
 5 | 		$smarty->trigger_error("crmRetrieve: missing car, name or type"); 
 6 | 		return;
 7 | 	}
 8 | 	$value = CRM_Utils_Request::retrieve($params['name'], $params['type']);
 9 | 	if($value===null){
10 | 		$smarty->trigger_error("crmRetrive: Cannot find a variable with matching name and type");
11 | 	}
12 | 	$smarty->assign($params['var'], $value);
13 | }


--------------------------------------------------------------------------------
/CRM/Core/Smarty/plugins/function.crmSQL.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | 
  3 | function smarty_function_crmSQL($params, &$smarty) { 
  4 |     $is_error = 0;
  5 |     $error = "";
  6 |     $values = "";
  7 |     $sql="";
  8 | 
  9 |     if (!array_key_exists('sql', $params) && !array_key_exists('file', $params) && !array_key_exists('json', $params)) { 
 10 |         $smarty->trigger_error("assign: missing 'sql', 'json' OR 'file' parameter"); 
 11 |         $error = "crmAPI: missing 'sql', 'json' or 'file' parameter"; 
 12 |         $is_error = 1;
 13 |     } 
 14 | 
 15 |     $parameters = array();
 16 | 
 17 |     try{
 18 | 	    if(array_key_exists('json', $params)){
 19 |                     $content=trim(str_replace(array("\t","\r\n","\r","\n")," ",file_get_contents('queries/'.$params["json"].".json", FILE_USE_INCLUDE_PATH)));
 20 | 		    $json=json_decode($content);
 21 |                 if (!$content){
 22 |                    $smarty->trigger_error("assign: invalid json file"); 
 23 | 		   $error = "crmSQL: empty json file";
 24 |                    return json_encode(array("is_error"=>1, "file"=> 'queries/'.$params["json"].".json", "error"=>$error, "values" => null), JSON_NUMERIC_CHECK);
 25 |                 }
 26 |                 if (!$json){
 27 |                    $smarty->trigger_error("assign: invalid json file"); 
 28 | 		   $error = "crmSQL: empty json file";
 29 |                    return json_encode(array("is_error"=>1, "file"=> 'queries/'.$params["json"].".json", "error"=>$error, "content"=>$content,"values" => null), JSON_NUMERIC_CHECK);
 30 |                 }
 31 | 		$sql=$json->query;
 32 |                 if (!$sql){
 33 |                    $smarty->trigger_error("assign: missing 'query' in the json file"); 
 34 | 		   $error = "crSQL: missing 'query' in the json"; 
 35 |                    return json_encode(array("is_error"=>1, "file"=> 'queries/'.$params["json"].".json", "error"=>$error, "values" => null), JSON_NUMERIC_CHECK);
 36 |                 }
 37 | 		foreach ($json->params as $key => $value) {
 38 | 		    $var=intval($key);
 39 | 		    $name=$value->name;
 40 | 		    $type=$value->type;
 41 | 		    if(array_key_exists($name, $params)){
 42 | 			$parameters[$var] = array($params[$name],$type);
 43 | 		    }
 44 | 		}
 45 | 	    }
 46 | 
 47 | 	    elseif(array_key_exists('sql', $params)){
 48 | 		$sql = $params["sql"];
 49 | 	    }
 50 | 
 51 | 	    elseif(array_key_exists('file', $params)){
 52 | 		$filename =  'queries/'.$params["file"].".sql";
 53 | 		$sql = file_get_contents($filename, true);
 54 | 		if (!$sql)  throw new Exception ("missing filename or empty ".$filename);
 55 | 
 56 | 	    }
 57 | 
 58 | 	    $forbidden=array("delete ", "drop ","update ","grant ");
 59 | 	    foreach ($forbidden as $check) {
 60 | 		if(strpos(strtolower($sql), $check)!==false){
 61 | 		    $smarty->trigger_error($check."command not allowed");
 62 | 		    $error = "crmAPI: you can not ".$check."using crmSQL";
 63 | 		    $is_error = 1;
 64 | 		    break;
 65 | 		}
 66 | 	    }
 67 | 
 68 |       if (array_key_exists('debug', $params)) { 
 69 |           $smarty->trigger_error("sql:". $params["sql"]); 
 70 |       }
 71 | 
 72 |         if($is_error==0){
 73 |             $errorScope = CRM_Core_TemporaryErrorScope::useException();
 74 | 	    CRM_Core_DAO::executeQuery("SET TRANSACTION ISOLATION LEVEL READ UNCOMMITTED ;");
 75 |             $dao = CRM_Core_DAO::executeQuery($sql,$parameters);
 76 |             $values = array();
 77 |             $keys= null;
 78 |             if (array_key_exists('sequential', $params)) { 
 79 |               while ($dao->fetch()) {
 80 |                 if (!$keys) $keys= array_keys($dao->toArray());
 81 |                 $values[] = array_values($dao->toArray());
 82 |               }
 83 |             } else {
 84 |               while ($dao->fetch()) {
 85 |                 $values[] = $dao->toArray();
 86 |               }
 87 |               $keys= array_keys($values[0]);
 88 |             }
 89 |           }
 90 |     }
 91 |     catch(Exception $e){
 92 |         $is_error=1;
 93 |         $error = "crmAPI: ".$e->getMessage();
 94 |         $values="";
 95 |     }
 96 | 
 97 |     if(array_key_exists('set', $params)){
 98 |         if($values!=""){
 99 |             //echo "console.log('string')";
100 |             $smarty->assign($params['set'], $values);
101 |         }
102 |     }
103 | 
104 |     if (array_key_exists('debug', $params)) {
105 |       return json_encode(array("is_error"=>$is_error, "keys"=> $keys, "error"=>$error, "values" => $values,"sql" => trim(preg_replace('/\s+/', ' ', $sql))), JSON_NUMERIC_CHECK);
106 |     }
107 |     if (!$smarty)
108 |       return array("is_error"=>$is_error, "keys"=> $keys, "error"=>$error, "values" => $values);
109 | 
110 |     return json_encode(array("is_error"=>$is_error, "keys"=> $keys, "error"=>$error, "values" => $values), JSON_NUMERIC_CHECK);
111 | }
112 | 


--------------------------------------------------------------------------------
/CRM/Core/Smarty/plugins/function.crmTitle.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | function smarty_function_crmTitle($params, &$smarty) { 
 3 | 	if (array_key_exists('string', $params)) {
 4 | 		CRM_Utils_System::setTitle($params['string']);
 5 | 		return;
 6 | 	}
 7 | 	if (array_key_exists('title', $params)) {
 8 | 		CRM_Utils_System::setTitle($params['title']);
 9 | 		return;
10 | 	}
11 | 	if (array_key_exists('array', $params)&&array_key_exists('field', $params)) {
12 | 		CRM_Utils_System::setTitle($params['array'][0][$params['field']]);
13 | 		return;
14 | 	}
15 | }
16 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
  1 | **Hello**,
  2 | 
  3 | **We have moved the project space for civisualize to CiviCRM's Gitlab.
  4 | This includes both the issue tracking and support, and merge requests.**
  5 | 
  6 | **The new URL is: https://lab.civicrm.org/extensions/civisualize**
  7 | 
  8 | **All issues have been migrated to: https://lab.civicrm.org/extensions/civisualize/issues**
  9 | 
 10 | **If you do not already have an account on CiviCRM's Gitlab, you can create an account
 11 | by registering on https://civicrm.org/user**
 12 | 
 13 | **Thank you!**
 14 | 
 15 | 
 16 | CiviCRM Data Visualization Framework
 17 | ====================================
 18 | 
 19 | Civisualize is a CiviCRM extension which let you visualize your CiviCRM data with the power of [dc.js](http://dc-js.github.io/dc.js/) and [d3.js](http://d3js.org/). dc.js let users create graphs which enable filtering through the data with just a click on the graphs giving you a lot of powers. It's in beta, not going to hurt your data, do let us know if something works or doesn't.
 20 | 
 21 | Civisualize will help you out with ready to use visualizations that we have created and will provide you the right resources if you plan to create your own custom visualization. 
 22 | 
 23 | - [Installation](#installation)
 24 | - [Ready to use visualizations](#ready-to-use-visualizations)
 25 | - [Create your own visualizations](#create-your-own-visualizations)
 26 | - [Suggestions](#we-love-you)
 27 | 
 28 | Since 2023 this extension is now hosted on CiviCRM's Gitlab:  
 29 | https://lab.civicrm.org/extensions/civisualize
 30 | 
 31 | ***
 32 | Installation
 33 | ------------
 34 | Civisualize can be installed directly from within the CiviCRM user interface. See the user manual for details: [Installing extensions](https://docs.civicrm.org/user/en/latest/introduction/extensions/#installing-extensions).
 35 | 
 36 | If you are a developer you can clone Civisualize into your CiviCRM extension directory using:
 37 | 
 38 | `git clone https://lab.civicrm.org/extensions/civisualize.git`
 39 | 
 40 | Ready to Use Visualizations
 41 | ---------------------------
 42 | The list of core visualizations is available at **Reports** > **Civisualize**. The currently available visualizations include:
 43 | 
 44 | ## Contributions (/dataviz/contribute)
 45 | 
 46 | ![alt tag](https://raw.githubusercontent.com/TechToThePeople/civisualize/master/examples/contribution.jpg)
 47 | This provides an overview of contributions, type of contributors, the day of week the contribution was made, payment instrument, etc.
 48 | 
 49 | ## Contacts (/dataviz/contacts)
 50 | 
 51 | ![alt tag](https://raw.githubusercontent.com/TechToThePeople/civisualize/master/examples/contacts.jpg)
 52 | Contacts overview is a compilation of graphs showing types, gender, age, source of contact, contacts over the time etc. 
 53 | 
 54 | ## Events (/dataviz/events)
 55 | 
 56 | ![alt tag](https://raw.githubusercontent.com/TechToThePeople/civisualize/master/examples/events.jpg)
 57 | Events shows a lot of information about all the events of an organization and their participants. It shows events over time, participants over time, money generated from events, type of events, etc. It also displays a table listing all the events.
 58 | 
 59 | This table further links to specific event overview (/dataviz/event/<id>) showing participants, their status, their fee etc.
 60 | 
 61 | ![alt tag](https://raw.githubusercontent.com/TechToThePeople/civisualize/master/examples/event.jpg)
 62 | 
 63 | ## Donor Trends (/dataviz/donortrends)
 64 | 
 65 | ![alt tag](https://raw.githubusercontent.com/TechToThePeople/civisualize/master/examples/donortrends.jpg)
 66 | Based on the idea of [CiviCRM Donor Trends Extension](https://github.com/leez/org.eff.donortrends/), the donor trends overview showcases a Bar Chart with new, lapsed, upgraded, downgraded and maintained donors over the years. This further showcases the gender and age of the donors and a list of all the donors.  
 67 | 
 68 | Need not be mentioned, you can add more graphs and details to the above mentioned visualizations. 
 69 | 
 70 | Create your own visualizations
 71 | ------------------------------
 72 | If you are a developer you can customize or create your extensions with a little knowledge of mysql/crmAPI, d3.js/dc.js and crossfilter. Civisualize basically has two parts:
 73 | 
 74 | - Extract data from CiviCRM
 75 | - Display data using dc.js/d3
 76 | 
 77 | ## Extract data
 78 | 
 79 | For the first part, we are using the following methods:
 80 | 
 81 | ### {crmAPI}
 82 | 
 83 | ``{crmAPI entity="OptionValue" option_group_id="14"}``
 84 |   
 85 | You can add `getstat` as a new action on some entities in the api.
 86 | 
 87 | ### {crmSQL}
 88 | 
 89 | We have added a new crmSQL to run a mySQL query. For obvious reasons crmSQL only let you run SELECT queries. You can get your data using any of the following three methods:
 90 | 
 91 | - ##### SQL String
 92 |   `{crmSQL sql="SELECT count(*) ... group by ...."}`
 93 | 
 94 | - ##### SQL File
 95 |   `{crmSQL query="somethingcool"}`
 96 | 
 97 |   This will fetch the sql query from `/queries/somethingcool.sql`
 98 | 
 99 | - ##### JSON Object
100 |   `{crmSQL json="somethingcooler" cid=4 bla="hello"}`
101 | 
102 |   This will fetch a json object from `/queries/somethingcooler.json`
103 |   The format of the json is 
104 | 
105 |   ```json
106 |   {  "query":"SELECT * from ABC where id=%1 and bla=%2",
107 |      "params":{  "1":{ "name":"cid",
108 |                        "type":"Integer"},
109 |                  "2":{ "name":"bla",
110 |                        "type":"String"}
111 |               }
112 |   }
113 |   ```
114 |  
115 |    You can further use `{crmRetrieve var="a" name="b" type="Integer"}`.
116 |    This will assign the `POST` or `GET` variable named `b` into `a` which can then be given to `{crmSQL}`.
117 | 
118 |   ##### Optional Arguments
119 |   `{crmSQL set="varname"}` will assign the result of the sql query to a smarty variable named `varname`.
120 | 
121 |   ##### Return Value
122 |   `{crmSQL}` returns a json of the following format:
123 |   ```json
124 |      {"is_error":0,"error":"error_str","values":"Array of objects"}
125 |   ```
126 |   so we primarily use `{crmSQL}` values for our visualizations.
127 | 
128 | - #### {crmReport}
129 |   A 3rd option is to be able to fetch data from a report instance using `{crmReport...}`. Eileen has done (most of?) the work already. I think it's on 4.5.
130 | 
131 | ## Display data
132 | 
133 | The principle is to get the data in a template as a json, and apply dc on it until it looks awesome. You simply have to create a template into `templates/dataviz/Something.tpl`. Once you have the data from the above methods you can apply dc on it, and you can access it from `/civicrm/dataviz/something`.
134 | 
135 | To get you started, you can visit `/civicrm/dataviz/contribute` or any of the above mentioned visualizations.
136 | 
137 | This is using the wonderfully magic dc, that is a layer of love on the top of d3 and crossfilter. Click on the graphs to filter down. magic, I told you. No matter if you use {crmAPI} or {crmSQL}, you end up with a json and a d3 and dc loaded and ready to rock.
138 | 
139 | In the template, put:
140 | 
141 | ```html
142 | <div id="theplacetograph"></div>
143 | <script>
144 |   // Load the data into 'mydata' from Smarty.
145 |   var mydata={crmAPI or crmSQL};
146 |   // Turn off Smarty's interpreter from here, it gets confused by Javascript and CSS.
147 |   {literal}
148 |   // We do everything in an anonymous function so we are free to use any
149 |   // variable names we need without clobbering those in the global scope.
150 |   (function() {
151 |     // Define the function that will make your charts etc.
152 |     function bootViz() {
153 |       // Ensure we're using the up-to-date libraries, not the CiviCRM core ones.
154 |       var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
155 | 
156 |       //
157 |       // This is where you do your stuff.
158 |       //
159 |       d3("#theplacetograph").selectAll(...).data(mydata.values).domagic(...);
160 |     }
161 | 
162 |     // Boot our script as soon as ready.
163 |     CRM.civisualizeQueue = CRM.civisualizeQueue || [];
164 |     CRM.civisualizeQueue.push(bootViz);
165 | 
166 |   })(); // Immediately call our anonymous function.
167 | ```
168 | 
169 | We have also used `{crmTitle}` function which let you set the title of the page, and a `print_filter` function that will help you in playing around with crossfilter.
170 | 
171 | Check our resources at [dc.js](http://dc-js.github.io/dc.js/) and create your first visualization.
172 | 
173 | ## Reset links
174 | 
175 | You can include reset links in your charts to reset all the filters for a particular chart.
176 | 
177 | 1. after defining your chart, save a reference to it using a unique name like so:  
178 |    `CRM.civisualize.charts.yourChartsUniqueName = yourPieChart;`
179 | 
180 | 2. At the end of these, call `CRM.civisualize.bindResetLinks();` to make sure all the reset links are ready.
181 | 
182 | 3. Include links in your chart's container div like so:  
183 |    `<a class="reset civisualize-reset" href data-chart-name="yourChartsUniqueName" >Reset</a>`
184 | 
185 | The links should normally be hidden until you click to add a filter. See `Contacts.tpl` for an example use.
186 | 
187 | ## Documentation and help
188 | If you want to add a document, add a markdown file that has the same name as the template into the doc folder.
189 | 
190 | We love you
191 | -------
192 | xavier made this, sid helped him. You can find us on CiviCRM forum, [@eucampaign](http://twitter.com/eucampaign) and [@sid0_o](http://twitter.com/sid0_o) on Twitter, or in the dc mailing group. Be warned, d3 is awesome, but the learning curve is steep. Worthwhile, the view at the top is beautiful.
193 | 
194 | Changes
195 | -------
196 | 
197 | ## Version 6.1
198 | 
199 | - Update civix boilerplate to work with PHP 7.4 without warnings.
200 | 
201 | ## Version 6.0 brings changes that will probably break your custom visualisations.
202 | 
203 | It became apparent that version 5's library updates conflicted with CiviCRM's
204 | core libraries. To avoid this v6 now puts its own versions of dc, d3 and
205 | crossfilter under `CRM.civisualize` as a namespace.
206 | 
207 | There were also loading problems: we need the DOM loaded (not as simple as it
208 | sounds, given the three types: normal page loads, cached dashboard,
209 | refreshed/new dashboard) and we need `CRM.civisualize` to have been created
210 | already, which it might not.  To fix this we've implemented a queue similar to
211 | Google analytics etc.
212 | 
213 | And some issues with scripts using the global namespace for their vars.
214 | 
215 | And we tidied up the reset links.
216 | 
217 | So whereas before you might have just put your code in a `<script>` block and
218 | started calling `d3....` now you should wrap your code and boot it as shown
219 | [above](#create-your-own-visualizations).
220 | 
221 | **Note** you might find this breaks your dashboards. If this happens you'll
222 | need to clear your browser's "local storage".
223 | 
224 | ## Version 5.0 brings changes that will probably break your custom visualisations.
225 | 
226 | The libraries have been upgraded as follows:
227 | 
228 | - d3 from 3.5.17 to 5.7.0
229 | - dc from 3.0.10 to 2.0.2
230 | - crossfilter to 1.3.12
231 | 
232 | The d3 upgrade *requires changes to templates*. These are detailed at
233 | <https://github.com/d3/d3/blob/master/CHANGES.md>.
234 | 
235 | There's a PHP command line helper tool `updateTpl` which may help... or not. It
236 | doesn't cover everything (feel free to improve it!), but it was able to convert
237 | all the bundled visualisations. Top tip: if/when you run it and you get a
238 | warning about `d3.time.format().parse`, it's best to revert to the backup (the
239 | script makes a backup for you), edit your original to a format that the
240 | converter can then handle. Once you've understood it, it's not difficult. Then
241 | run the converter and test.
242 | 


--------------------------------------------------------------------------------
/api/v3/Activity/Getstat.php:
--------------------------------------------------------------------------------
1 | <?php
2 | function civicrm_api3_activity_getstat ($params) {
3 |   $sql="SELECT COUNT(id),DATE(register_date) as register from civicrm_participant group by DATE(register_date)";
4 |   return _civicrm_api3_basic_getsql ($params,$sql);
5 | }
6 | 
7 | 


--------------------------------------------------------------------------------
/api/v3/Contact/Getstat.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | function civicrm_api3_contact_getstat ($params) {
 4 |  // mostly copy pasted from contact_get and the functions called by it
 5 |   $options = array();
 6 |   _civicrm_api3_contact_get_supportanomalies($params, $options);
 7 | 
 8 |   $contacts = _civicrm_api3_get_using_query_object('contact', $params, $options);
 9 |   $options = _civicrm_api3_get_options_from_params($params, TRUE);
10 | 
11 |   $inputParams = CRM_Utils_Array::value('input_params', $options, array());
12 |   $returnProperties = CRM_Utils_Array::value('return', $options, array());
13 | 
14 |   if(!empty($params['check_permissions'])){
15 |     // we will filter query object against getfields
16 |     $fields = civicrm_api("contact", 'getfields', array('version' => 3, 'action' => 'get'));
17 |     // we need to add this in as earlier in this function 'id' was unset in favour of $entity_id
18 |     $fields['values'][$entity . '_id'] = array();
19 |     $varsToFilter = array('returnProperties', 'inputParams');
20 |     foreach ($varsToFilter as $varToFilter){
21 |       if(!is_array($$varToFilter)){
22 |         continue;
23 |       }
24 |       $$varToFilter = array_intersect_key($$varToFilter, $fields['values']);
25 |     }
26 |   }
27 | //  $options = array_merge($options,$additional_options);
28 |   $sort             = CRM_Utils_Array::value('sort', $options, NULL);
29 |   $returnSQL        = CRM_Utils_Array::value('sql', $options, CRM_Utils_Array::value('options_sql', $options['input_params']));
30 |   $smartGroupCache  = CRM_Utils_Array::value('smartGroupCache', $params);
31 | 
32 |   $newParams = CRM_Contact_BAO_Query::convertFormValues($inputParams);
33 |   $skipPermissions = CRM_Utils_Array::value('check_permissions', $params)? 0 :1;
34 | 
35 |   $query = new CRM_Contact_BAO_Query(
36 |     $params, $returnProperties,
37 |     NULL, TRUE, FALSE, 1,
38 |     $skipPermissions,
39 |     TRUE, $smartGroupCache
40 |   );
41 | 
42 |   //this should add a check for view deleted if permissions are enabled
43 |   if ($skipPermissions){
44 |     $query->_skipDeleteClause = TRUE;
45 |   }
46 |   $query->generatePermissionClause(FALSE, $count);
47 |   list($select, $from, $where, $having) = $query->query($count);
48 | 
49 |   if(!empty($query->_permissionWhereClause)){
50 |     if (empty($where)) {
51 |       $where = "WHERE $query->_permissionWhereClause";
52 |     } else {
53 |       $where = "$where AND $query->_permissionWhereClause";
54 |     }
55 |   }
56 | 
57 |   $sql = "$select $from $where $having";
58 | 
59 |   if (!empty($returnProperties)) {
60 |     $extra = array();
61 |     $sql = "SELECT count(*) AS total,". substr ($sql, 34,10000); //replace select contact_id, by select count(*)
62 |     $sql .= " GROUP BY ". implode (",",array_keys($returnProperties)) ;
63 |   } else {
64 |     $sql = "SELECT count(*) AS total  $from $where $having";
65 |     $extra = array ("tip"=>"if you need to group by a field, use the return param, eg return=contact_type,gender",
66 |                     "warning"=> "use getcount, getstat without param might be blocked in the future"); 
67 | 
68 |     if (!empty($sort)) {
69 |       $sql .= " ORDER BY $sort ";
70 |     } else {
71 |       $sql .= " ORDER BY total DESC ";
72 |     }
73 | 
74 |   }
75 | 
76 |   if ($returnSQL) {
77 |     return array("is_error"=>1,"sql"=>$sql,"from"=>$from,"where"=>$where,"having"=>$having);
78 |   }
79 |   $dao = CRM_Core_DAO::executeQuery($sql);
80 |   $values = array();
81 |   while ($dao->fetch()) {
82 |     $values[] = $dao->toArray();
83 |   }
84 |   
85 |   return civicrm_api3_create_success($values, $params, "contact", "getstat", $dao,$extra);
86 | }
87 | 


--------------------------------------------------------------------------------
/api/v3/GroupContact/Getstat.php:
--------------------------------------------------------------------------------
1 | <?php
2 | function civicrm_api3_group_contact_getstat ($params) {
3 |   $sql = "SELECT count(*) as total,civicrm_group.id, civicrm_group.name 
4 |           FROM civicrm_group_contact, civicrm_group 
5 |           WHERE civicrm_group_contact.group_id = civicrm_group.id
6 |           GROUP BY civicrm_group.id";
7 |   return _civicrm_api3_basic_getsql ($params,$sql);
8 | }
9 | 


--------------------------------------------------------------------------------
/api/v3/Participant/Getstat.php:
--------------------------------------------------------------------------------
1 | <?php
2 | function civicrm_api3_participant_getstat ($params) {
3 |   $sql="SELECT COUNT(id),DATE(register_date) as register from civicrm_participant group by DATE(register_date)";
4 |   return _civicrm_api3_basic_getsql ($params,$sql);
5 | }
6 | 
7 | 


--------------------------------------------------------------------------------
/api/v3/Tag/Getstat.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | function civicrm_api3_tag_getstat ($params) {
 4 |   $sql = "SELECT count(*) as total, civicrm_tag.id, civicrm_tag.name, civicrm_tag.parent_id, description
 5 |           FROM civicrm_tag, civicrm_entity_tag
 6 |           WHERE civicrm_tag.id = civicrm_entity_tag.tag_id AND entity_table = 'civicrm_contact'
 7 |           GROUP BY civicrm_tag.id";
 8 |   return _civicrm_api3_basic_getsql ($params,$sql);
 9 | }
10 | 
11 | 


--------------------------------------------------------------------------------
/civisualize.civix.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | 
  3 | // AUTO-GENERATED FILE -- Civix may overwrite any changes made to this file
  4 | 
  5 | /**
  6 |  * The ExtensionUtil class provides small stubs for accessing resources of this
  7 |  * extension.
  8 |  */
  9 | class CRM_Civisualize_ExtensionUtil {
 10 |   const SHORT_NAME = 'civisualize';
 11 |   const LONG_NAME = 'eu.tttp.civisualize';
 12 |   const CLASS_PREFIX = 'CRM_Civisualize';
 13 | 
 14 |   /**
 15 |    * Translate a string using the extension's domain.
 16 |    *
 17 |    * If the extension doesn't have a specific translation
 18 |    * for the string, fallback to the default translations.
 19 |    *
 20 |    * @param string $text
 21 |    *   Canonical message text (generally en_US).
 22 |    * @param array $params
 23 |    * @return string
 24 |    *   Translated text.
 25 |    * @see ts
 26 |    */
 27 |   public static function ts($text, $params = []) {
 28 |     if (!array_key_exists('domain', $params)) {
 29 |       $params['domain'] = [self::LONG_NAME, NULL];
 30 |     }
 31 |     return ts($text, $params);
 32 |   }
 33 | 
 34 |   /**
 35 |    * Get the URL of a resource file (in this extension).
 36 |    *
 37 |    * @param string|NULL $file
 38 |    *   Ex: NULL.
 39 |    *   Ex: 'css/foo.css'.
 40 |    * @return string
 41 |    *   Ex: 'http://example.org/sites/default/ext/org.example.foo'.
 42 |    *   Ex: 'http://example.org/sites/default/ext/org.example.foo/css/foo.css'.
 43 |    */
 44 |   public static function url($file = NULL) {
 45 |     if ($file === NULL) {
 46 |       return rtrim(CRM_Core_Resources::singleton()->getUrl(self::LONG_NAME), '/');
 47 |     }
 48 |     return CRM_Core_Resources::singleton()->getUrl(self::LONG_NAME, $file);
 49 |   }
 50 | 
 51 |   /**
 52 |    * Get the path of a resource file (in this extension).
 53 |    *
 54 |    * @param string|NULL $file
 55 |    *   Ex: NULL.
 56 |    *   Ex: 'css/foo.css'.
 57 |    * @return string
 58 |    *   Ex: '/var/www/example.org/sites/default/ext/org.example.foo'.
 59 |    *   Ex: '/var/www/example.org/sites/default/ext/org.example.foo/css/foo.css'.
 60 |    */
 61 |   public static function path($file = NULL) {
 62 |     // return CRM_Core_Resources::singleton()->getPath(self::LONG_NAME, $file);
 63 |     return __DIR__ . ($file === NULL ? '' : (DIRECTORY_SEPARATOR . $file));
 64 |   }
 65 | 
 66 |   /**
 67 |    * Get the name of a class within this extension.
 68 |    *
 69 |    * @param string $suffix
 70 |    *   Ex: 'Page_HelloWorld' or 'Page\\HelloWorld'.
 71 |    * @return string
 72 |    *   Ex: 'CRM_Foo_Page_HelloWorld'.
 73 |    */
 74 |   public static function findClass($suffix) {
 75 |     return self::CLASS_PREFIX . '_' . str_replace('\\', '_', $suffix);
 76 |   }
 77 | 
 78 | }
 79 | 
 80 | use CRM_Civisualize_ExtensionUtil as E;
 81 | 
 82 | /**
 83 |  * (Delegated) Implements hook_civicrm_config().
 84 |  *
 85 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_config
 86 |  */
 87 | function _civisualize_civix_civicrm_config(&$config = NULL) {
 88 |   static $configured = FALSE;
 89 |   if ($configured) {
 90 |     return;
 91 |   }
 92 |   $configured = TRUE;
 93 | 
 94 |   $template =& CRM_Core_Smarty::singleton();
 95 | 
 96 |   $extRoot = dirname(__FILE__) . DIRECTORY_SEPARATOR;
 97 |   $extDir = $extRoot . 'templates';
 98 | 
 99 |   if (is_array($template->template_dir)) {
100 |     array_unshift($template->template_dir, $extDir);
101 |   }
102 |   else {
103 |     $template->template_dir = [$extDir, $template->template_dir];
104 |   }
105 | 
106 |   $include_path = $extRoot . PATH_SEPARATOR . get_include_path();
107 |   set_include_path($include_path);
108 | }
109 | 
110 | /**
111 |  * (Delegated) Implements hook_civicrm_xmlMenu().
112 |  *
113 |  * @param $files array(string)
114 |  *
115 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_xmlMenu
116 |  */
117 | function _civisualize_civix_civicrm_xmlMenu(&$files) {
118 |   foreach (_civisualize_civix_glob(__DIR__ . '/xml/Menu/*.xml') as $file) {
119 |     $files[] = $file;
120 |   }
121 | }
122 | 
123 | /**
124 |  * Implements hook_civicrm_install().
125 |  *
126 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_install
127 |  */
128 | function _civisualize_civix_civicrm_install() {
129 |   _civisualize_civix_civicrm_config();
130 |   if ($upgrader = _civisualize_civix_upgrader()) {
131 |     $upgrader->onInstall();
132 |   }
133 | }
134 | 
135 | /**
136 |  * Implements hook_civicrm_postInstall().
137 |  *
138 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_postInstall
139 |  */
140 | function _civisualize_civix_civicrm_postInstall() {
141 |   _civisualize_civix_civicrm_config();
142 |   if ($upgrader = _civisualize_civix_upgrader()) {
143 |     if (is_callable([$upgrader, 'onPostInstall'])) {
144 |       $upgrader->onPostInstall();
145 |     }
146 |   }
147 | }
148 | 
149 | /**
150 |  * Implements hook_civicrm_uninstall().
151 |  *
152 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_uninstall
153 |  */
154 | function _civisualize_civix_civicrm_uninstall() {
155 |   _civisualize_civix_civicrm_config();
156 |   if ($upgrader = _civisualize_civix_upgrader()) {
157 |     $upgrader->onUninstall();
158 |   }
159 | }
160 | 
161 | /**
162 |  * (Delegated) Implements hook_civicrm_enable().
163 |  *
164 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_enable
165 |  */
166 | function _civisualize_civix_civicrm_enable() {
167 |   _civisualize_civix_civicrm_config();
168 |   if ($upgrader = _civisualize_civix_upgrader()) {
169 |     if (is_callable([$upgrader, 'onEnable'])) {
170 |       $upgrader->onEnable();
171 |     }
172 |   }
173 | }
174 | 
175 | /**
176 |  * (Delegated) Implements hook_civicrm_disable().
177 |  *
178 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_disable
179 |  * @return mixed
180 |  */
181 | function _civisualize_civix_civicrm_disable() {
182 |   _civisualize_civix_civicrm_config();
183 |   if ($upgrader = _civisualize_civix_upgrader()) {
184 |     if (is_callable([$upgrader, 'onDisable'])) {
185 |       $upgrader->onDisable();
186 |     }
187 |   }
188 | }
189 | 
190 | /**
191 |  * (Delegated) Implements hook_civicrm_upgrade().
192 |  *
193 |  * @param $op string, the type of operation being performed; 'check' or 'enqueue'
194 |  * @param $queue CRM_Queue_Queue, (for 'enqueue') the modifiable list of pending up upgrade tasks
195 |  *
196 |  * @return mixed
197 |  *   based on op. for 'check', returns array(boolean) (TRUE if upgrades are pending)
198 |  *   for 'enqueue', returns void
199 |  *
200 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_upgrade
201 |  */
202 | function _civisualize_civix_civicrm_upgrade($op, CRM_Queue_Queue $queue = NULL) {
203 |   if ($upgrader = _civisualize_civix_upgrader()) {
204 |     return $upgrader->onUpgrade($op, $queue);
205 |   }
206 | }
207 | 
208 | /**
209 |  * @return CRM_Civisualize_Upgrader
210 |  */
211 | function _civisualize_civix_upgrader() {
212 |   if (!file_exists(__DIR__ . '/CRM/Civisualize/Upgrader.php')) {
213 |     return NULL;
214 |   }
215 |   else {
216 |     return CRM_Civisualize_Upgrader_Base::instance();
217 |   }
218 | }
219 | 
220 | /**
221 |  * Search directory tree for files which match a glob pattern.
222 |  *
223 |  * Note: Dot-directories (like "..", ".git", or ".svn") will be ignored.
224 |  * Note: Delegate to CRM_Utils_File::findFiles(), this function kept only
225 |  * for backward compatibility of extension code that uses it.
226 |  *
227 |  * @param string $dir base dir
228 |  * @param string $pattern , glob pattern, eg "*.txt"
229 |  *
230 |  * @return array
231 |  */
232 | function _civisualize_civix_find_files($dir, $pattern) {
233 |   return CRM_Utils_File::findFiles($dir, $pattern);
234 | }
235 | 
236 | /**
237 |  * (Delegated) Implements hook_civicrm_managed().
238 |  *
239 |  * Find any *.mgd.php files, merge their content, and return.
240 |  *
241 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_managed
242 |  */
243 | function _civisualize_civix_civicrm_managed(&$entities) {
244 |   $mgdFiles = _civisualize_civix_find_files(__DIR__, '*.mgd.php');
245 |   sort($mgdFiles);
246 |   foreach ($mgdFiles as $file) {
247 |     $es = include $file;
248 |     foreach ($es as $e) {
249 |       if (empty($e['module'])) {
250 |         $e['module'] = E::LONG_NAME;
251 |       }
252 |       if (empty($e['params']['version'])) {
253 |         $e['params']['version'] = '3';
254 |       }
255 |       $entities[] = $e;
256 |     }
257 |   }
258 | }
259 | 
260 | /**
261 |  * (Delegated) Implements hook_civicrm_caseTypes().
262 |  *
263 |  * Find any and return any files matching "xml/case/*.xml"
264 |  *
265 |  * Note: This hook only runs in CiviCRM 4.4+.
266 |  *
267 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_caseTypes
268 |  */
269 | function _civisualize_civix_civicrm_caseTypes(&$caseTypes) {
270 |   if (!is_dir(__DIR__ . '/xml/case')) {
271 |     return;
272 |   }
273 | 
274 |   foreach (_civisualize_civix_glob(__DIR__ . '/xml/case/*.xml') as $file) {
275 |     $name = preg_replace('/\.xml$/', '', basename($file));
276 |     if ($name != CRM_Case_XMLProcessor::mungeCaseType($name)) {
277 |       $errorMessage = sprintf("Case-type file name is malformed (%s vs %s)", $name, CRM_Case_XMLProcessor::mungeCaseType($name));
278 |       throw new CRM_Core_Exception($errorMessage);
279 |     }
280 |     $caseTypes[$name] = [
281 |       'module' => E::LONG_NAME,
282 |       'name' => $name,
283 |       'file' => $file,
284 |     ];
285 |   }
286 | }
287 | 
288 | /**
289 |  * (Delegated) Implements hook_civicrm_angularModules().
290 |  *
291 |  * Find any and return any files matching "ang/*.ang.php"
292 |  *
293 |  * Note: This hook only runs in CiviCRM 4.5+.
294 |  *
295 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_angularModules
296 |  */
297 | function _civisualize_civix_civicrm_angularModules(&$angularModules) {
298 |   if (!is_dir(__DIR__ . '/ang')) {
299 |     return;
300 |   }
301 | 
302 |   $files = _civisualize_civix_glob(__DIR__ . '/ang/*.ang.php');
303 |   foreach ($files as $file) {
304 |     $name = preg_replace(':\.ang\.php$:', '', basename($file));
305 |     $module = include $file;
306 |     if (empty($module['ext'])) {
307 |       $module['ext'] = E::LONG_NAME;
308 |     }
309 |     $angularModules[$name] = $module;
310 |   }
311 | }
312 | 
313 | /**
314 |  * (Delegated) Implements hook_civicrm_themes().
315 |  *
316 |  * Find any and return any files matching "*.theme.php"
317 |  */
318 | function _civisualize_civix_civicrm_themes(&$themes) {
319 |   $files = _civisualize_civix_glob(__DIR__ . '/*.theme.php');
320 |   foreach ($files as $file) {
321 |     $themeMeta = include $file;
322 |     if (empty($themeMeta['name'])) {
323 |       $themeMeta['name'] = preg_replace(':\.theme\.php$:', '', basename($file));
324 |     }
325 |     if (empty($themeMeta['ext'])) {
326 |       $themeMeta['ext'] = E::LONG_NAME;
327 |     }
328 |     $themes[$themeMeta['name']] = $themeMeta;
329 |   }
330 | }
331 | 
332 | /**
333 |  * Glob wrapper which is guaranteed to return an array.
334 |  *
335 |  * The documentation for glob() says, "On some systems it is impossible to
336 |  * distinguish between empty match and an error." Anecdotally, the return
337 |  * result for an empty match is sometimes array() and sometimes FALSE.
338 |  * This wrapper provides consistency.
339 |  *
340 |  * @link http://php.net/glob
341 |  * @param string $pattern
342 |  *
343 |  * @return array
344 |  */
345 | function _civisualize_civix_glob($pattern) {
346 |   $result = glob($pattern);
347 |   return is_array($result) ? $result : [];
348 | }
349 | 
350 | /**
351 |  * Inserts a navigation menu item at a given place in the hierarchy.
352 |  *
353 |  * @param array $menu - menu hierarchy
354 |  * @param string $path - path to parent of this item, e.g. 'my_extension/submenu'
355 |  *    'Mailing', or 'Administer/System Settings'
356 |  * @param array $item - the item to insert (parent/child attributes will be
357 |  *    filled for you)
358 |  *
359 |  * @return bool
360 |  */
361 | function _civisualize_civix_insert_navigation_menu(&$menu, $path, $item) {
362 |   // If we are done going down the path, insert menu
363 |   if (empty($path)) {
364 |     $menu[] = [
365 |       'attributes' => array_merge([
366 |         'label'      => CRM_Utils_Array::value('name', $item),
367 |         'active'     => 1,
368 |       ], $item),
369 |     ];
370 |     return TRUE;
371 |   }
372 |   else {
373 |     // Find an recurse into the next level down
374 |     $found = FALSE;
375 |     $path = explode('/', $path);
376 |     $first = array_shift($path);
377 |     foreach ($menu as $key => &$entry) {
378 |       if ($entry['attributes']['name'] == $first) {
379 |         if (!isset($entry['child'])) {
380 |           $entry['child'] = [];
381 |         }
382 |         $found = _civisualize_civix_insert_navigation_menu($entry['child'], implode('/', $path), $item);
383 |       }
384 |     }
385 |     return $found;
386 |   }
387 | }
388 | 
389 | /**
390 |  * (Delegated) Implements hook_civicrm_navigationMenu().
391 |  */
392 | function _civisualize_civix_navigationMenu(&$nodes) {
393 |   if (!is_callable(['CRM_Core_BAO_Navigation', 'fixNavigationMenu'])) {
394 |     _civisualize_civix_fixNavigationMenu($nodes);
395 |   }
396 | }
397 | 
398 | /**
399 |  * Given a navigation menu, generate navIDs for any items which are
400 |  * missing them.
401 |  */
402 | function _civisualize_civix_fixNavigationMenu(&$nodes) {
403 |   $maxNavID = 1;
404 |   array_walk_recursive($nodes, function($item, $key) use (&$maxNavID) {
405 |     if ($key === 'navID') {
406 |       $maxNavID = max($maxNavID, $item);
407 |     }
408 |   });
409 |   _civisualize_civix_fixNavigationMenuItems($nodes, $maxNavID, NULL);
410 | }
411 | 
412 | function _civisualize_civix_fixNavigationMenuItems(&$nodes, &$maxNavID, $parentID) {
413 |   $origKeys = array_keys($nodes);
414 |   foreach ($origKeys as $origKey) {
415 |     if (!isset($nodes[$origKey]['attributes']['parentID']) && $parentID !== NULL) {
416 |       $nodes[$origKey]['attributes']['parentID'] = $parentID;
417 |     }
418 |     // If no navID, then assign navID and fix key.
419 |     if (!isset($nodes[$origKey]['attributes']['navID'])) {
420 |       $newKey = ++$maxNavID;
421 |       $nodes[$origKey]['attributes']['navID'] = $newKey;
422 |       $nodes[$newKey] = $nodes[$origKey];
423 |       unset($nodes[$origKey]);
424 |       $origKey = $newKey;
425 |     }
426 |     if (isset($nodes[$origKey]['child']) && is_array($nodes[$origKey]['child'])) {
427 |       _civisualize_civix_fixNavigationMenuItems($nodes[$origKey]['child'], $maxNavID, $nodes[$origKey]['attributes']['navID']);
428 |     }
429 |   }
430 | }
431 | 
432 | /**
433 |  * (Delegated) Implements hook_civicrm_alterSettingsFolders().
434 |  *
435 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_alterSettingsFolders
436 |  */
437 | function _civisualize_civix_civicrm_alterSettingsFolders(&$metaDataFolders = NULL) {
438 |   $settingsDir = __DIR__ . DIRECTORY_SEPARATOR . 'settings';
439 |   if (!in_array($settingsDir, $metaDataFolders) && is_dir($settingsDir)) {
440 |     $metaDataFolders[] = $settingsDir;
441 |   }
442 | }
443 | 
444 | /**
445 |  * (Delegated) Implements hook_civicrm_entityTypes().
446 |  *
447 |  * Find any *.entityType.php files, merge their content, and return.
448 |  *
449 |  * @link https://docs.civicrm.org/dev/en/latest/hooks/hook_civicrm_entityTypes
450 |  */
451 | function _civisualize_civix_civicrm_entityTypes(&$entityTypes) {
452 |   $entityTypes = array_merge($entityTypes, []);
453 | }
454 | 


--------------------------------------------------------------------------------
/civisualize.php:
--------------------------------------------------------------------------------
  1 | <?php
  2 | use CRM_Civisualize_ExtensionUtil as E;
  3 | //todo: move that to core
  4 | function _civicrm_api3_basic_getsql ($params,$sql) {
  5 |   $returnSQL        = CRM_Utils_Array::value('sql', $params, CRM_Utils_Array::value('options_sql', $params));
  6 |   if ($returnSQL) {
  7 |     return array("is_error"=>1,"sql"=>$sql);
  8 |   }
  9 |   $dao = CRM_Core_DAO::executeQuery($sql);
 10 |   $values = array();
 11 |   while ($dao->fetch()) {
 12 |     $values[] = $dao->toArray();
 13 |   }
 14 |   return civicrm_api3_create_success($values, $params, NULL, NULL, $dao);
 15 | }
 16 | 
 17 | 
 18 | require_once 'civisualize.civix.php';
 19 | 
 20 | function civisualize_civicrm_dashboard( $contactID, &$contentPlacement ) {
 21 |   CRM_Civisualize_VisualBundle::register();
 22 |   /*
 23 |    CRM_Core_Resources::singleton()
 24 |     ->addScriptFile('eu.tttp.civisualize', 'js/d3.min.v5.7.0.js', 110, 'html-header', FALSE)
 25 |     ->addScriptFile('eu.tttp.civisualize', 'js/dc/dc.min.js', 110, 'html-header', FALSE)
 26 |     ->addScriptFile('eu.tttp.civisualize', 'js/dc/crossfilter.min.js', 110, 'html-header', FALSE)
 27 |     ->addStyleFile('eu.tttp.civisualize', 'js/dc/dc.min.css')
 28 |     ->addStyleFile('eu.tttp.civisualize', 'css/style.css');
 29 |    */
 30 | }
 31 | 
 32 | 
 33 | /**
 34 |  * Implementation of hook_civicrm_config
 35 |  */
 36 | function civisualize_civicrm_config(&$config) {
 37 |   _civisualize_civix_civicrm_config($config);
 38 | }
 39 | /**
 40 |  * Implements hook_civicrm_container
 41 |  *
 42 |  * We register 2 hooks to copy CiviCRM tags to Mailchimp.
 43 |  *
 44 |  * @param \Symfony\Component\DependencyInjection\ContainerBuilder $container
 45 |  */
 46 | function civisualize_civicrm_container($container) {
 47 |   $container->findDefinition('dispatcher')
 48 |             ->addMethodCall('addListener', [ 'hook_civicrm_buildAsset', ['\CRM_Civisualize_VisualBundle', 'buildAssetJs']])
 49 |             ->addMethodCall('addListener', [ 'hook_civicrm_buildAsset', ['\CRM_Civisualize_VisualBundle', 'buildAssetCss']]);
 50 | }
 51 | 
 52 | 
 53 | /**
 54 |  * Implementation of hook_civicrm_xmlMenu
 55 |  *
 56 |  * @param $files array(string)
 57 |  */
 58 | function civisualize_civicrm_xmlMenu(&$files) {
 59 |   _civisualize_civix_civicrm_xmlMenu($files);
 60 | }
 61 | 
 62 | /**
 63 |  * Implementation of hook_civicrm_install
 64 |  */
 65 | function civisualize_civicrm_install() {
 66 |   return _civisualize_civix_civicrm_install();
 67 | }
 68 | 
 69 | /**
 70 |  * Implementation of hook_civicrm_uninstall
 71 |  */
 72 | function civisualize_civicrm_uninstall() {
 73 |   return _civisualize_civix_civicrm_uninstall();
 74 | }
 75 | 
 76 | /**
 77 |  * Implementation of hook_civicrm_enable
 78 |  */
 79 | function civisualize_civicrm_enable() {
 80 |   return _civisualize_civix_civicrm_enable();
 81 | }
 82 | 
 83 | /**
 84 |  * Implementation of hook_civicrm_disable
 85 |  */
 86 | function civisualize_civicrm_disable() {
 87 |   return _civisualize_civix_civicrm_disable();
 88 | }
 89 | 
 90 | /**
 91 |  * Implementation of hook_civicrm_upgrade
 92 |  *
 93 |  * @param $op string, the type of operation being performed; 'check' or 'enqueue'
 94 |  * @param $queue CRM_Queue_Queue, (for 'enqueue') the modifiable list of pending up upgrade tasks
 95 |  *
 96 |  * @return mixed  based on op. for 'check', returns array(boolean) (TRUE if upgrades are pending)
 97 |  *                for 'enqueue', returns void
 98 |  */
 99 | function civisualize_civicrm_upgrade($op, CRM_Queue_Queue $queue = NULL) {
100 |   return _civisualize_civix_civicrm_upgrade($op, $queue);
101 | }
102 | 
103 | /**
104 |  * Implementation of hook_civicrm_managed
105 |  *
106 |  * Generate a list of entities to create/deactivate/delete when this module
107 |  * is installed, disabled, uninstalled.
108 |  */
109 | function civisualize_civicrm_managed(&$entities) {
110 |   return _civisualize_civix_civicrm_managed($entities);
111 | }
112 | 
113 | /**
114 |  * Adds a navigation menu item under report.
115 |  *
116 |  * @param array $params
117 |  */
118 | function civisualize_civicrm_navigationMenu( &$params ) {
119 |   $path = "Reports";
120 |   $item = array(
121 |     'label' => 'Civisualize',
122 |     'name' => 'Civisualize',
123 |     'url' => 'civicrm/dataviz',
124 |     'permission' => 'access CiviReport',
125 |     'operator' => '',
126 |     'separator' => TRUE,
127 |     'active' => 1,
128 |   );
129 | 
130 |   _civisualize_civix_insert_navigation_menu($params, $path, $item);
131 | }
132 | 


--------------------------------------------------------------------------------
/css/style.css:
--------------------------------------------------------------------------------
 1 | table .header-fixed {
 2 |   position: fixed;
 3 |   top: 40px;
 4 |   z-index: 1020; /* 10 less than .navbar-fixed to prevent any overlap */
 5 |   border-bottom: 1px solid #d5d5d5;
 6 |   -webkit-border-radius: 0;
 7 |      -moz-border-radius: 0;
 8 |           border-radius: 0;
 9 |   -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
10 |      -moz-box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
11 |           box-shadow: inset 0 1px 0 #fff, 0 1px 5px rgba(0,0,0,.1);
12 |   filter: progid:DXImageTransform.Microsoft.gradient(enabled=false); /* IE6-9 */
13 | }
14 | 
15 | .eventsoverview #type svg { 
16 | 	width:400px; 
17 | }
18 | .eventsoverview #duration > svg > g > g.row > text {
19 | 	fill:black;
20 | }
21 | .eventsoverview #ismonetory svg {
22 | 	width: 300px; 
23 | }
24 | .dc_contacts #source > svg > g > g.row > text {
25 | 	fill:black;
26 | }
27 | 
28 | 


--------------------------------------------------------------------------------
/examples/contacts.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TechToThePeople/civisualize/2a2e2ebe0aa96a27f431de02e235275603122e42/examples/contacts.jpg


--------------------------------------------------------------------------------
/examples/contribution.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TechToThePeople/civisualize/2a2e2ebe0aa96a27f431de02e235275603122e42/examples/contribution.jpg


--------------------------------------------------------------------------------
/examples/donortrends.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TechToThePeople/civisualize/2a2e2ebe0aa96a27f431de02e235275603122e42/examples/donortrends.jpg


--------------------------------------------------------------------------------
/examples/event.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TechToThePeople/civisualize/2a2e2ebe0aa96a27f431de02e235275603122e42/examples/event.jpg


--------------------------------------------------------------------------------
/examples/events.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/TechToThePeople/civisualize/2a2e2ebe0aa96a27f431de02e235275603122e42/examples/events.jpg


--------------------------------------------------------------------------------
/info.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0"?>
 2 | <extension key="eu.tttp.civisualize" type="module">
 3 |   <file>civisualize</file>
 4 |   <name>Civisualize. The missing data visualization extension</name>
 5 |   <description>Framework to generate easily (as in, if you know SQL and d3 at least) better visualisation about what's happening in your CiviCRM</description>
 6 |   <license>aGPL</license>
 7 |   <maintainer>
 8 |     <author>Xavier</author>
 9 |     <email>xavier@tttp.eu</email>
10 |   </maintainer>
11 |   <releaseDate>2023-01-07</releaseDate>
12 |   <version>6.1</version>
13 |   <develStage>stable</develStage>
14 |   <compatibility>
15 |     <ver>5.24</ver>
16 |   </compatibility>
17 |   <civix>
18 |     <namespace>CRM/Civisualize</namespace>
19 |   </civix>
20 |   <urls>
21 |     <url desc="Main Extension Page">https://civicrm.org/extensions/civisualize-missing-data-visualization-extension</url>
22 |     <url desc="Documentation">https://lab.civicrm.org/extensions/civisualize/-/blob/master/README.md</url>
23 |     <url desc="Support">https://lab.civicrm.org/extensions/civisualize/-/issues</url>
24 |     <url desc="Licensing">https://civicrm.org/licensing</url>
25 |   </urls>
26 | </extension>
27 | 


--------------------------------------------------------------------------------
/js/civisualize.js:
--------------------------------------------------------------------------------
 1 | // In case we are called twice. (Shouldn't happen, but...)
 2 | if (!CRM.civisualize) {
 3 |   CRM.civisualize = {
 4 |     charts: {},
 5 |     boot: function(callback) {
 6 |       // console.log("civisualize boot running", callback);
 7 |       var callCallbackIfReady = function() {
 8 |         if (callback.hasBeenCalled) {
 9 |           return;
10 |         }
11 |         if (document.readyState === 'complete') {
12 |           // We only want to boot each one once.
13 |           callback.hasBeenCalled = true;
14 |           // Let it run.
15 |           callback();
16 |           // No harm in doing this.
17 |           CRM.civisualize.bindResetLinks();
18 |         }
19 |       };
20 | 
21 |       // We don't know what state the document is in. It could be loading,
22 |       // 'interactive', or complete already. This is complicated by the
23 |       // dashboard which behaves differently for cached dashlets as for
24 |       // newly added (e.g. Refresh Dashboard Data button).
25 |       // So we listen on readystatechange, and try our luck right away.
26 |       document.addEventListener('readystatechange', callCallbackIfReady);
27 |       callCallbackIfReady();
28 |     },
29 |     bindResetLinks: function() {
30 | 
31 |       [].forEach.call(document.querySelectorAll('a.civisualize-reset.reset'), function (el, index, array) {
32 |         // We only need to do this once per thing.
33 |         if (el.civisualizeProcessed) {
34 |           return;
35 |         }
36 |         el.civisualizeProcessed = true;
37 |         el.addEventListener('click', CRM.civisualize.resetItem);
38 |         // Hide by default.
39 |         el.style.display = 'none';
40 |       });
41 | 
42 |     },
43 |     resetItem: function(e) {
44 |       e.preventDefault();
45 |       e.stopPropagation();
46 |       e.target.dataset.chartName.split(',').forEach(function(chartName) {
47 |         CRM.civisualize.charts[chartName].filterAll();
48 |       });
49 |       CRM.civisualize.dc.redrawAll();
50 |     },
51 |   };
52 | 
53 |   // See if there's anything queued already.
54 |   if (CRM.civisualizeQueue) {
55 |     // Yes there was, boot each now.
56 |     CRM.civisualizeQueue.forEach(CRM.civisualize.boot);
57 |   }
58 |   // Replace the queue array with an object with a .push method
59 |   // that will immediately call our boot function for future scripts.
60 |   CRM.civisualizeQueue = {push: CRM.civisualize.boot};
61 | 
62 | }
63 | 


--------------------------------------------------------------------------------
/js/common.js:
--------------------------------------------------------------------------------
 1 | jQuery(function($){
 2 |   var url=window.location.href.replace("dataviz","datadoc");
 3 |   $(".menu.secondary").append('<li class="civisualize-help"><a href="'+url+'" title="Help" class="glyphicon glyphicon-question-sign" aria-hidden="true">Help</a></li>');
 4 |   $(".civisualize-help").click(function(event){
 5 |     event.preventDefault();
 6 |     if (typeof marqued == "function")
 7 |       CRM.loadPage(url);
 8 |     else 
 9 |       $.getScript(CRM.vars.civisualize.baseUrl + "js/marked.min.js", function(){
10 |         CRM.loadPage(url);
11 |       });
12 |   });
13 |   $('.table thead').addClass("header");
14 |   $('table.table').fixedHeader();  
15 | });
16 | 
17 | 
18 | (function($) {
19 | 
20 | $.fn.fixedHeader = function (options) {
21 |  var config = {
22 |    topOffset: 40,
23 |    bgColor: '#EEEEEE'
24 |  };
25 |  if (options){ $.extend(config, options); }
26 | 
27 |  return this.each( function() {
28 |   var o = $(this);
29 | 
30 |   var $win = $(window)
31 |     , $head = $('thead.header', o)
32 |     , isFixed = 0;
33 |   var headTop = $head.length && $head.offset().top - config.topOffset;
34 | 
35 |   function processScroll() {
36 |     if (!o.is(':visible')) return;
37 |     var i, scrollTop = $win.scrollTop();
38 |     var t = $head.length && $head.offset().top - config.topOffset;
39 |     if (!isFixed && headTop != t) { headTop = t; }
40 |     if      (scrollTop >= headTop && !isFixed) { isFixed = 1; }
41 |     else if (scrollTop <= headTop && isFixed) { isFixed = 0; }
42 |     isFixed ? $('thead.header-copy', o).removeClass('hide')
43 |             : $('thead.header-copy', o).addClass('hide');
44 |   }
45 |   $win.on('scroll', processScroll);
46 | 
47 |   // hack sad times - holdover until rewrite for 2.1
48 |   $head.on('click', function () {
49 |     if (!isFixed) setTimeout(function () {  $win.scrollTop($win.scrollTop() - 47) }, 10);
50 |   })
51 | 
52 |   $head.clone().removeClass('header').addClass('header-copy header-fixed').appendTo(o);
53 |   var ww = [];
54 |   o.find('thead.header > tr:first > th').each(function (i, h){
55 |     ww.push($(h).width());
56 |   });
57 |   $.each(ww, function (i, w){
58 |     o.find('thead.header > tr > th:eq('+i+'), thead.header-copy > tr > th:eq('+i+')').css({width: w});
59 |   });
60 | 
61 |   o.find('thead.header-copy').css({ margin:'0 auto',
62 |                                     width: o.width(),
63 |                                    'background-color':config.bgColor });
64 |   processScroll();
65 |  });
66 | };
67 | 
68 | })(jQuery);
69 | 


--------------------------------------------------------------------------------
/js/dc/crossfilter.min.js:
--------------------------------------------------------------------------------
1 | !function(r){function n(r){return r}function t(r,n){for(var t=0,e=n.length,u=Array(e);e>t;++t)u[t]=r[n[t]];return u}function e(r){function n(n,t,e,u){for(;u>e;){var f=e+u>>>1;r(n[f])<t?e=f+1:u=f}return e}function t(n,t,e,u){for(;u>e;){var f=e+u>>>1;t<r(n[f])?u=f:e=f+1}return e}return t.right=t,t.left=n,t}function u(r){function n(r,n,t){for(var u=t-n,f=(u>>>1)+1;--f>0;)e(r,f,u,n);return r}function t(r,n,t){for(var u,f=t-n;--f>0;)u=r[n],r[n]=r[n+f],r[n+f]=u,e(r,1,f,n);return r}function e(n,t,e,u){for(var f,o=n[--u+t],i=r(o);(f=t<<1)<=e&&(e>f&&r(n[u+f])>r(n[u+f+1])&&f++,!(i<=r(n[u+f])));)n[u+t]=n[u+f],t=f;n[u+t]=o}return n.sort=t,n}function f(r){function n(n,e,u,f){var o,i,a,c,l=Array(f=Math.min(u-e,f));for(i=0;f>i;++i)l[i]=n[e++];if(t(l,0,f),u>e){o=r(l[0]);do(a=r(c=n[e])>o)&&(l[0]=c,o=r(t(l,0,f)[0]));while(++e<u)}return l}var t=u(r);return n}function o(r){function n(n,t,e){for(var u=t+1;e>u;++u){for(var f=u,o=n[u],i=r(o);f>t&&r(n[f-1])>i;--f)n[f]=n[f-1];n[f]=o}return n}return n}function i(r){function n(r,n,u){return(N>u-n?e:t)(r,n,u)}function t(t,e,u){var f,o=0|(u-e)/6,i=e+o,a=u-1-o,c=e+u-1>>1,l=c-o,v=c+o,s=t[i],h=r(s),d=t[l],p=r(d),g=t[c],y=r(g),m=t[v],x=r(m),b=t[a],A=r(b);h>p&&(f=s,s=d,d=f,f=h,h=p,p=f),x>A&&(f=m,m=b,b=f,f=x,x=A,A=f),h>y&&(f=s,s=g,g=f,f=h,h=y,y=f),p>y&&(f=d,d=g,g=f,f=p,p=y,y=f),h>x&&(f=s,s=m,m=f,f=h,h=x,x=f),y>x&&(f=g,g=m,m=f,f=y,y=x,x=f),p>A&&(f=d,d=b,b=f,f=p,p=A,A=f),p>y&&(f=d,d=g,g=f,f=p,p=y,y=f),x>A&&(f=m,m=b,b=f,f=x,x=A,A=f);var k=d,O=p,w=m,E=x;t[i]=s,t[l]=t[e],t[c]=g,t[v]=t[u-1],t[a]=b;var M=e+1,U=u-2,z=E>=O&&O>=E;if(z)for(var N=M;U>=N;++N){var C=t[N],S=r(C);if(O>S)N!==M&&(t[N]=t[M],t[M]=C),++M;else if(S>O)for(;;){var q=r(t[U]);{if(!(q>O)){if(O>q){t[N]=t[M],t[M++]=t[U],t[U--]=C;break}t[N]=t[U],t[U--]=C;break}U--}}}else for(var N=M;U>=N;N++){var C=t[N],S=r(C);if(O>S)N!==M&&(t[N]=t[M],t[M]=C),++M;else if(S>E)for(;;){var q=r(t[U]);{if(!(q>E)){O>q?(t[N]=t[M],t[M++]=t[U],t[U--]=C):(t[N]=t[U],t[U--]=C);break}if(U--,N>U)break}}}if(t[e]=t[M-1],t[M-1]=k,t[u-1]=t[U+1],t[U+1]=w,n(t,e,M-1),n(t,U+2,u),z)return t;if(i>M&&U>a){for(var F,q;(F=r(t[M]))<=O&&F>=O;)++M;for(;(q=r(t[U]))<=E&&q>=E;)--U;for(var N=M;U>=N;N++){var C=t[N],S=r(C);if(O>=S&&S>=O)N!==M&&(t[N]=t[M],t[M]=C),M++;else if(E>=S&&S>=E)for(;;){var q=r(t[U]);{if(!(E>=q&&q>=E)){O>q?(t[N]=t[M],t[M++]=t[U],t[U--]=C):(t[N]=t[U],t[U--]=C);break}if(U--,N>U)break}}}}return n(t,M,U+1)}var e=o(r);return n}function a(r){for(var n=Array(r),t=-1;++t<r;)n[t]=0;return n}function c(r,n){for(var t=r.length;n>t;)r[t++]=0;return r}function l(r,n){if(n>32)throw Error("invalid array width!");return r}function v(r,n){return function(t){var e=t.length;return[r.left(t,n,0,e),r.right(t,n,0,e)]}}function s(r,n){var t=n[0],e=n[1];return function(n){var u=n.length;return[r.left(n,t,0,u),r.left(n,e,0,u)]}}function h(r){return[0,r.length]}function d(){return null}function p(){return 0}function g(r){return r+1}function y(r){return r-1}function m(r){return function(n,t){return n+ +r(t)}}function x(r){return function(n,t){return n-r(t)}}function b(){function r(r){var n=E,t=r.length;return t&&(b=b.concat(r),z=F(z,E+=t),S.forEach(function(e){e(r,n,t)})),l}function e(){for(var r=A(E,E),n=[],t=0,e=0;E>t;++t)z[t]?r[t]=e++:n.push(t);N.forEach(function(r){r(0,[],n)}),q.forEach(function(n){n(r)});for(var u,t=0,e=0;E>t;++t)(u=z[t])&&(t!==e&&(z[e]=u,b[e]=b[t]),++e);for(b.length=e;E>e;)z[--E]=0}function o(r){function e(n,e,u){T=n.map(r),V=$(k(u),0,u),T=t(T,V);var f,o=_(T),i=o[0],a=o[1];if(W)for(f=0;u>f;++f)W(T[f],f)||(z[V[f]+e]|=Y);else{for(f=0;i>f;++f)z[V[f]+e]|=Y;for(f=a;u>f;++f)z[V[f]+e]|=Y}if(!e)return P=T,Q=V,tn=i,en=a,void 0;var c=P,l=Q,v=0,s=0;for(P=Array(E),Q=A(E,E),f=0;e>v&&u>s;++f)c[v]<T[s]?(P[f]=c[v],Q[f]=l[v++]):(P[f]=T[s],Q[f]=V[s++]+e);for(;e>v;++v,++f)P[f]=c[v],Q[f]=l[v];for(;u>s;++s,++f)P[f]=T[s],Q[f]=V[s]+e;o=_(P),tn=o[0],en=o[1]}function o(r,n,t){rn.forEach(function(r){r(T,V,n,t)}),T=V=null}function a(r){for(var n,t=0,e=0;E>t;++t)z[n=Q[t]]&&(t!==e&&(P[e]=P[t]),Q[e]=r[n],++e);for(P.length=e;E>e;)Q[e++]=0;var u=_(P);tn=u[0],en=u[1]}function c(r){var n=r[0],t=r[1];if(W)return W=null,G(function(r,e){return e>=n&&t>e}),tn=n,en=t,X;var e,u,f,o=[],i=[];if(tn>n)for(e=n,u=Math.min(tn,t);u>e;++e)z[f=Q[e]]^=Y,o.push(f);else if(n>tn)for(e=tn,u=Math.min(n,en);u>e;++e)z[f=Q[e]]^=Y,i.push(f);if(t>en)for(e=Math.max(n,en),u=t;u>e;++e)z[f=Q[e]]^=Y,o.push(f);else if(en>t)for(e=Math.max(tn,t),u=en;u>e;++e)z[f=Q[e]]^=Y,i.push(f);return tn=n,en=t,N.forEach(function(r){r(Y,o,i)}),X}function l(r){return null==r?B():Array.isArray(r)?j(r):"function"==typeof r?D(r):C(r)}function C(r){return c((_=v(w,r))(P))}function j(r){return c((_=s(w,r))(P))}function B(){return c((_=h)(P))}function D(r){return _=h,G(W=r),tn=0,en=E,X}function G(r){var n,t,e,u=[],f=[];for(n=0;E>n;++n)!(z[t=Q[n]]&Y)^!!(e=r(P[n],n))&&(e?(z[t]&=Z,u.push(t)):(z[t]|=Y,f.push(t)));N.forEach(function(r){r(Y,u,f)})}function H(r){for(var n,t=[],e=en;--e>=tn&&r>0;)z[n=Q[e]]||(t.push(b[n]),--r);return t}function I(r){for(var n,t=[],e=tn;en>e&&r>0;)z[n=Q[e]]||(t.push(b[n]),--r),e++;return t}function J(r){function t(n,t,e,u){function f(){++T===L&&(m=R(m,K<<=1),B=R(B,K),L=O(K))}var l,v,s,h,p,g,y=j,m=A(T,L),x=H,k=J,w=T,M=0,U=0;for(X&&(x=k=d),j=Array(T),T=0,B=w>1?F(B,E):A(E,L),w&&(s=(v=y[0]).key);u>U&&!((h=r(n[U]))>=h);)++U;for(;u>U;){for(v&&h>=s?(p=v,g=s,m[M]=T,(v=y[++M])&&(s=v.key)):(p={key:h,value:k()},g=h),j[T]=p;!(h>g||(B[l=t[U]+e]=T,z[l]&Z||(p.value=x(p.value,b[l])),++U>=u));)h=r(n[U]);f()}for(;w>M;)j[m[M]=T]=y[M++],f();if(T>M)for(M=0;e>M;++M)B[M]=m[B[M]];l=N.indexOf(V),T>1?(V=o,W=a):(!T&&$&&(T=1,j=[{key:null,value:k()}]),1===T?(V=i,W=c):(V=d,W=d),B=null),N[l]=V}function e(){if(T>1){for(var r=T,n=j,t=A(r,r),e=0,u=0;E>e;++e)z[e]&&(t[B[u]=B[e]]=1,++u);for(j=[],T=0,e=0;r>e;++e)t[e]&&(t[e]=T++,j.push(n[e]));if(T>1)for(var e=0;u>e;++e)B[e]=t[B[e]];else B=null;N[N.indexOf(V)]=T>1?(W=a,V=o):1===T?(W=c,V=i):W=V=d}else if(1===T){if($)return;for(var e=0;E>e;++e)if(z[e])return;j=[],T=0,N[N.indexOf(V)]=V=W=d}}function o(r,n,t){if(r!==Y&&!X){var e,u,f,o;for(e=0,f=n.length;f>e;++e)z[u=n[e]]&Z||(o=j[B[u]],o.value=H(o.value,b[u]));for(e=0,f=t.length;f>e;++e)(z[u=t[e]]&Z)===r&&(o=j[B[u]],o.value=I(o.value,b[u]))}}function i(r,n,t){if(r!==Y&&!X){var e,u,f,o=j[0];for(e=0,f=n.length;f>e;++e)z[u=n[e]]&Z||(o.value=H(o.value,b[u]));for(e=0,f=t.length;f>e;++e)(z[u=t[e]]&Z)===r&&(o.value=I(o.value,b[u]))}}function a(){var r,n;for(r=0;T>r;++r)j[r].value=J();for(r=0;E>r;++r)z[r]&Z||(n=j[B[r]],n.value=H(n.value,b[r]))}function c(){var r,n=j[0];for(n.value=J(),r=0;E>r;++r)z[r]&Z||(n.value=H(n.value,b[r]))}function l(){return X&&(W(),X=!1),j}function v(r){var n=D(l(),0,j.length,r);return G.sort(n,0,n.length)}function s(r,n,t){return H=r,I=n,J=t,X=!0,S}function h(){return s(g,y,p)}function k(r){return s(m(r),x(r),p)}function w(r){function n(n){return r(n.value)}return D=f(n),G=u(n),S}function M(){return w(n)}function U(){return T}function C(){var r=N.indexOf(V);return r>=0&&N.splice(r,1),r=rn.indexOf(t),r>=0&&rn.splice(r,1),r=q.indexOf(e),r>=0&&q.splice(r,1),S}var S={top:v,all:l,reduce:s,reduceCount:h,reduceSum:k,order:w,orderNatural:M,size:U,dispose:C,remove:C};nn.push(S);var j,B,D,G,H,I,J,K=8,L=O(K),T=0,V=d,W=d,X=!0,$=r===d;return arguments.length<1&&(r=n),N.push(V),rn.push(t),q.push(e),t(P,Q,0,E),h().orderNatural()}function K(){var r=J(d),n=r.all;return delete r.all,delete r.top,delete r.order,delete r.orderNatural,delete r.size,r.value=function(){return n()[0].value},r}function L(){nn.forEach(function(r){r.dispose()});var r=S.indexOf(e);return r>=0&&S.splice(r,1),r=S.indexOf(o),r>=0&&S.splice(r,1),r=q.indexOf(a),r>=0&&q.splice(r,1),M&=Z,B()}var P,Q,T,V,W,X={filter:l,filterExact:C,filterRange:j,filterFunction:D,filterAll:B,top:H,bottom:I,group:J,groupAll:K,dispose:L,remove:L},Y=~M&-~M,Z=~Y,$=i(function(r){return T[r]}),_=h,rn=[],nn=[],tn=0,en=0;return S.unshift(e),S.push(o),q.push(a),M|=Y,(U>=32?!Y:M&-(1<<U))&&(z=R(z,U<<=1)),e(b,0,E),o(b,0,E),X}function a(){function r(r,n){var t;if(!h)for(t=n;E>t;++t)z[t]||(a=c(a,b[t]))}function n(r,n,t){var e,u,f;if(!h){for(e=0,f=n.length;f>e;++e)z[u=n[e]]||(a=c(a,b[u]));for(e=0,f=t.length;f>e;++e)z[u=t[e]]===r&&(a=l(a,b[u]))}}function t(){var r;for(a=v(),r=0;E>r;++r)z[r]||(a=c(a,b[r]))}function e(r,n,t){return c=r,l=n,v=t,h=!0,s}function u(){return e(g,y,p)}function f(r){return e(m(r),x(r),p)}function o(){return h&&(t(),h=!1),a}function i(){var t=N.indexOf(n);return t>=0&&N.splice(t),t=S.indexOf(r),t>=0&&S.splice(t),s}var a,c,l,v,s={reduce:e,reduceCount:u,reduceSum:f,value:o,dispose:i,remove:i},h=!0;return N.push(n),S.push(r),r(b,0,E),u()}function c(){return E}var l={add:r,remove:e,dimension:o,groupAll:a,size:c},b=[],E=0,M=0,U=8,z=C(0),N=[],S=[],q=[];return arguments.length?r(arguments[0]):l}function A(r,n){return(257>n?C:65537>n?S:q)(r)}function k(r){for(var n=A(r,r),t=-1;++t<r;)n[t]=t;return n}function O(r){return 8===r?256:16===r?65536:4294967296}b.version="1.3.12",b.permute=t;var w=b.bisect=e(n);w.by=e;var E=b.heap=u(n);E.by=u;var M=b.heapselect=f(n);M.by=f;var U=b.insertionsort=o(n);U.by=o;var z=b.quicksort=i(n);z.by=i;var N=32,C=a,S=a,q=a,F=c,R=l;"undefined"!=typeof Uint8Array&&(C=function(r){return new Uint8Array(r)},S=function(r){return new Uint16Array(r)},q=function(r){return new Uint32Array(r)},F=function(r,n){if(r.length>=n)return r;var t=new r.constructor(n);return t.set(r),t},R=function(r,n){var t;switch(n){case 16:t=S(r.length);break;case 32:t=q(r.length);break;default:throw Error("invalid array width!")}return t.set(r),t}),r.crossfilter=b}("undefined"!=typeof exports&&exports||this);


--------------------------------------------------------------------------------
/js/dc/dc.min.css:
--------------------------------------------------------------------------------
1 | .dc-chart path.dc-symbol,.dc-legend g.dc-legend-item.fadeout{fill-opacity:.5;stroke-opacity:.5}.dc-chart rect.bar{stroke:none;cursor:pointer}.dc-chart rect.bar:hover{fill-opacity:.5}.dc-chart rect.deselected{stroke:none;fill:#ccc}.dc-chart .pie-slice{fill:#fff;font-size:12px;cursor:pointer}.dc-chart .pie-slice.external{fill:#000}.dc-chart .pie-slice :hover,.dc-chart .pie-slice.highlight{fill-opacity:.8}.dc-chart .pie-path{fill:none;stroke-width:2px;stroke:#000;opacity:.4}.dc-chart .selected circle,.dc-chart .selected path{stroke-width:3;stroke:#ccc;fill-opacity:1}.dc-chart .deselected circle,.dc-chart .deselected path{stroke:none;fill-opacity:.5;fill:#ccc}.dc-chart .axis line,.dc-chart .axis path{fill:none;stroke:#000;shape-rendering:crispEdges}.dc-chart .axis text{font:10px sans-serif}.dc-chart .axis .grid-line,.dc-chart .axis .grid-line line,.dc-chart .grid-line,.dc-chart .grid-line line{fill:none;stroke:#ccc;shape-rendering:crispEdges}.dc-chart .brush rect.selection{fill:#4682b4;fill-opacity:.125}.dc-chart .brush .custom-brush-handle{fill:#eee;stroke:#666;cursor:ew-resize}.dc-chart path.line{fill:none;stroke-width:1.5px}.dc-chart path.area{fill-opacity:.3;stroke:none}.dc-chart path.highlight{stroke-width:3;fill-opacity:1;stroke-opacity:1}.dc-chart g.state{cursor:pointer}.dc-chart g.state :hover{fill-opacity:.8}.dc-chart g.state path{stroke:#fff}.dc-chart g.deselected path{fill:grey}.dc-chart g.deselected text{display:none}.dc-chart g.row rect{fill-opacity:.8;cursor:pointer}.dc-chart g.row rect:hover{fill-opacity:.6}.dc-chart g.row text{fill:#fff;font-size:12px;cursor:pointer}.dc-chart g.dc-tooltip path{fill:none;stroke:grey;stroke-opacity:.8}.dc-chart g.county path{stroke:#fff;fill:none}.dc-chart g.debug rect{fill:#00f;fill-opacity:.2}.dc-chart g.axis text{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}.dc-chart .node{font-size:.7em;cursor:pointer}.dc-chart .node :hover{fill-opacity:.8}.dc-chart .bubble{stroke:none;fill-opacity:.6}.dc-chart .highlight{fill-opacity:1;stroke-opacity:1}.dc-chart .fadeout{fill-opacity:.2;stroke-opacity:.2}.dc-chart .box text{font:10px sans-serif;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}.dc-chart .box line{fill:#fff}.dc-chart .box circle,.dc-chart .box line,.dc-chart .box rect{stroke:#000;stroke-width:1.5px}.dc-chart .box .center{stroke-dasharray:3,3}.dc-chart .box .data{stroke:none;stroke-width:0}.dc-chart .box .outlier{fill:none;stroke:#ccc}.dc-chart .box .outlierBold{fill:red;stroke:none}.dc-chart .box.deselected{opacity:.5}.dc-chart .box.deselected .box{fill:#ccc}.dc-chart .symbol{stroke:none}.dc-chart .heatmap .box-group.deselected rect{stroke:none;fill-opacity:.5;fill:#ccc}.dc-chart .heatmap g.axis text{pointer-events:all;cursor:pointer}.dc-chart .empty-chart .pie-slice{cursor:default}.dc-chart .empty-chart .pie-slice path{fill:#fee;cursor:default}.dc-data-count{float:right;margin-top:15px;margin-right:15px}.dc-data-count .filter-count,.dc-data-count .total-count{color:#3182bd;font-weight:700}.dc-legend{font-size:11px}.dc-legend .dc-legend-item{cursor:pointer}.dc-legend g.dc-legend-item.selected{fill:#00f}.dc-hard .number-display{float:none}div.dc-html-legend{overflow-y:auto;overflow-x:hidden;height:inherit;float:right;padding-right:2px}div.dc-html-legend .dc-legend-item-horizontal{display:inline-block;margin-left:5px;margin-right:5px;cursor:pointer}div.dc-html-legend .dc-legend-item-horizontal.selected{background-color:#3182bd;color:#fff}div.dc-html-legend .dc-legend-item-vertical{display:block;margin-top:5px;padding-top:1px;padding-bottom:1px;cursor:pointer}div.dc-html-legend .dc-legend-item-vertical.selected{background-color:#3182bd;color:#fff}div.dc-html-legend .dc-legend-item-color{display:table-cell;width:12px;height:12px}div.dc-html-legend .dc-legend-item-label{line-height:12px;display:table-cell;vertical-align:middle;padding-left:3px;padding-right:3px;font-size:.75em}.dc-html-legend-container{height:inherit}


--------------------------------------------------------------------------------
/js/filesaver.js:
--------------------------------------------------------------------------------
  1 | /* FileSaver.js
  2 |  * A saveAs() FileSaver implementation.
  3 |  * 1.3.2
  4 |  * 2016-06-16 18:25:19
  5 |  *
  6 |  * By Eli Grey, http://eligrey.com
  7 |  * License: MIT
  8 |  *   See https://github.com/eligrey/FileSaver.js/blob/master/LICENSE.md
  9 |  */
 10 | 
 11 | /*global self */
 12 | /*jslint bitwise: true, indent: 4, laxbreak: true, laxcomma: true, smarttabs: true, plusplus: true */
 13 | 
 14 | /*! @source http://purl.eligrey.com/github/FileSaver.js/blob/master/FileSaver.js */
 15 | 
 16 | var saveAs = saveAs || (function(view) {
 17 | 	"use strict";
 18 | 	// IE <10 is explicitly unsupported
 19 | 	if (typeof view === "undefined" || typeof navigator !== "undefined" && /MSIE [1-9]\./.test(navigator.userAgent)) {
 20 | 		return;
 21 | 	}
 22 | 	var
 23 | 		  doc = view.document
 24 | 		  // only get URL when necessary in case Blob.js hasn't overridden it yet
 25 | 		, get_URL = function() {
 26 | 			return view.URL || view.webkitURL || view;
 27 | 		}
 28 | 		, save_link = doc.createElementNS("http://www.w3.org/1999/xhtml", "a")
 29 | 		, can_use_save_link = "download" in save_link
 30 | 		, click = function(node) {
 31 | 			var event = new MouseEvent("click");
 32 | 			node.dispatchEvent(event);
 33 | 		}
 34 | 		, is_safari = /constructor/i.test(view.HTMLElement) || view.safari
 35 | 		, is_chrome_ios =/CriOS\/[\d]+/.test(navigator.userAgent)
 36 | 		, throw_outside = function(ex) {
 37 | 			(view.setImmediate || view.setTimeout)(function() {
 38 | 				throw ex;
 39 | 			}, 0);
 40 | 		}
 41 | 		, force_saveable_type = "application/octet-stream"
 42 | 		// the Blob API is fundamentally broken as there is no "downloadfinished" event to subscribe to
 43 | 		, arbitrary_revoke_timeout = 1000 * 40 // in ms
 44 | 		, revoke = function(file) {
 45 | 			var revoker = function() {
 46 | 				if (typeof file === "string") { // file is an object URL
 47 | 					get_URL().revokeObjectURL(file);
 48 | 				} else { // file is a File
 49 | 					file.remove();
 50 | 				}
 51 | 			};
 52 | 			setTimeout(revoker, arbitrary_revoke_timeout);
 53 | 		}
 54 | 		, dispatch = function(filesaver, event_types, event) {
 55 | 			event_types = [].concat(event_types);
 56 | 			var i = event_types.length;
 57 | 			while (i--) {
 58 | 				var listener = filesaver["on" + event_types[i]];
 59 | 				if (typeof listener === "function") {
 60 | 					try {
 61 | 						listener.call(filesaver, event || filesaver);
 62 | 					} catch (ex) {
 63 | 						throw_outside(ex);
 64 | 					}
 65 | 				}
 66 | 			}
 67 | 		}
 68 | 		, auto_bom = function(blob) {
 69 | 			// prepend BOM for UTF-8 XML and text/* types (including HTML)
 70 | 			// note: your browser will automatically convert UTF-16 U+FEFF to EF BB BF
 71 | 			if (/^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(blob.type)) {
 72 | 				return new Blob([String.fromCharCode(0xFEFF), blob], {type: blob.type});
 73 | 			}
 74 | 			return blob;
 75 | 		}
 76 | 		, FileSaver = function(blob, name, no_auto_bom) {
 77 | 			if (!no_auto_bom) {
 78 | 				blob = auto_bom(blob);
 79 | 			}
 80 | 			// First try a.download, then web filesystem, then object URLs
 81 | 			var
 82 | 				  filesaver = this
 83 | 				, type = blob.type
 84 | 				, force = type === force_saveable_type
 85 | 				, object_url
 86 | 				, dispatch_all = function() {
 87 | 					dispatch(filesaver, "writestart progress write writeend".split(" "));
 88 | 				}
 89 | 				// on any filesys errors revert to saving with object URLs
 90 | 				, fs_error = function() {
 91 | 					if ((is_chrome_ios || (force && is_safari)) && view.FileReader) {
 92 | 						// Safari doesn't allow downloading of blob urls
 93 | 						var reader = new FileReader();
 94 | 						reader.onloadend = function() {
 95 | 							var url = is_chrome_ios ? reader.result : reader.result.replace(/^data:[^;]*;/, 'data:attachment/file;');
 96 | 							var popup = view.open(url, '_blank');
 97 | 							if(!popup) view.location.href = url;
 98 | 							url=undefined; // release reference before dispatching
 99 | 							filesaver.readyState = filesaver.DONE;
100 | 							dispatch_all();
101 | 						};
102 | 						reader.readAsDataURL(blob);
103 | 						filesaver.readyState = filesaver.INIT;
104 | 						return;
105 | 					}
106 | 					// don't create more object URLs than needed
107 | 					if (!object_url) {
108 | 						object_url = get_URL().createObjectURL(blob);
109 | 					}
110 | 					if (force) {
111 | 						view.location.href = object_url;
112 | 					} else {
113 | 						var opened = view.open(object_url, "_blank");
114 | 						if (!opened) {
115 | 							// Apple does not allow window.open, see https://developer.apple.com/library/safari/documentation/Tools/Conceptual/SafariExtensionGuide/WorkingwithWindowsandTabs/WorkingwithWindowsandTabs.html
116 | 							view.location.href = object_url;
117 | 						}
118 | 					}
119 | 					filesaver.readyState = filesaver.DONE;
120 | 					dispatch_all();
121 | 					revoke(object_url);
122 | 				}
123 | 			;
124 | 			filesaver.readyState = filesaver.INIT;
125 | 
126 | 			if (can_use_save_link) {
127 | 				object_url = get_URL().createObjectURL(blob);
128 | 				setTimeout(function() {
129 | 					save_link.href = object_url;
130 | 					save_link.download = name;
131 | 					click(save_link);
132 | 					dispatch_all();
133 | 					revoke(object_url);
134 | 					filesaver.readyState = filesaver.DONE;
135 | 				});
136 | 				return;
137 | 			}
138 | 
139 | 			fs_error();
140 | 		}
141 | 		, FS_proto = FileSaver.prototype
142 | 		, saveAs = function(blob, name, no_auto_bom) {
143 | 			return new FileSaver(blob, name || blob.name || "download", no_auto_bom);
144 | 		}
145 | 	;
146 | 	// IE 10+ (native saveAs)
147 | 	if (typeof navigator !== "undefined" && navigator.msSaveOrOpenBlob) {
148 | 		return function(blob, name, no_auto_bom) {
149 | 			name = name || blob.name || "download";
150 | 
151 | 			if (!no_auto_bom) {
152 | 				blob = auto_bom(blob);
153 | 			}
154 | 			return navigator.msSaveOrOpenBlob(blob, name);
155 | 		};
156 | 	}
157 | 
158 | 	FS_proto.abort = function(){};
159 | 	FS_proto.readyState = FS_proto.INIT = 0;
160 | 	FS_proto.WRITING = 1;
161 | 	FS_proto.DONE = 2;
162 | 
163 | 	FS_proto.error =
164 | 	FS_proto.onwritestart =
165 | 	FS_proto.onprogress =
166 | 	FS_proto.onwrite =
167 | 	FS_proto.onabort =
168 | 	FS_proto.onerror =
169 | 	FS_proto.onwriteend =
170 | 		null;
171 | 
172 | 	return saveAs;
173 | }(
174 | 	   typeof self !== "undefined" && self
175 | 	|| typeof window !== "undefined" && window
176 | 	|| this.content
177 | ));
178 | // `self` is undefined in Firefox for Android content script context
179 | // while `this` is nsIContentFrameMessageManager
180 | // with an attribute `content` that corresponds to the window
181 | 
182 | if (typeof module !== "undefined" && module.exports) {
183 |   module.exports.saveAs = saveAs;
184 | } else if ((typeof define !== "undefined" && define !== null) && (define.amd !== null)) {
185 |   define("FileSaver.js", function() {
186 |     return saveAs;
187 |   });
188 | }
189 | 


--------------------------------------------------------------------------------
/queries/another.sql:
--------------------------------------------------------------------------------
1 | SELECT * from civicrm_contact;
2 | 


--------------------------------------------------------------------------------
/queries/contacts.sql:
--------------------------------------------------------------------------------
1 | SELECT COUNT(*) as count, source, gender_id, contact_type as type, DATE(created_date) as created_date from civicrm_contact as contact where is_deleted=0 AND created_date is not null group by DATE(created_date), contact_type, gender_id, source;
2 | 


--------------------------------------------------------------------------------
/queries/contribution_by_date.sql:
--------------------------------------------------------------------------------
1 | SELECT COUNT(*) as count,DATE(receive_date) as receive_date, contact_type,
2 | IF(contribution_recur_id is NULL, 0, 1) as recurring,
3 |   financial_type_id as financial_type, SUM(total_amount) as total, payment_instrument_id as instrument from civicrm_contribution JOIN civicrm_contact as contact ON contact_id=contact.id  WHERE receive_date is not null AND ( is_test = 0 OR is_test = NULL) AND receive_date <> '0000-00-00' group by DATE(receive_date),contact.contact_type, instrument,financial_type_id,IF(contribution_recur_id is NULL, 0, 1);
4 | 


--------------------------------------------------------------------------------
/queries/donors.sql:
--------------------------------------------------------------------------------
 1 | SELECT 
 2 | 	contact_id, contact.display_name, SUM(total_amount) as total_amount, YEAR(receive_date) as year, birth_date, contact_type, gender_id
 3 | FROM 
 4 | 	civicrm_contribution as contrib
 5 | 	INNER JOIN civicrm_contact as contact
 6 | 	ON
 7 | 		contrib.contact_id = contact.id AND contact.is_deleted=0
 8 | WHERE
 9 | 	total_amount>0
10 | GROUP BY
11 | 	YEAR(receive_date), contact_id
12 | ORDER BY
13 | 	YEAR(receive_date);


--------------------------------------------------------------------------------
/queries/eventdetails.json:
--------------------------------------------------------------------------------
1 | {"query":"SELECT title, event_type_id, created_date, end_date, start_date, registration_start_date, registration_end_date, is_monetary, is_active from civicrm_event as event where event.id=%1;","params":{"1":{"name":"eventid","type":"Integer"}}}


--------------------------------------------------------------------------------
/queries/eventparticipants.json:
--------------------------------------------------------------------------------
1 | {"query":"SELECT contact.display_name, contact.birth_date, contact.contact_type, contact.gender_id, participant.status_id, participant.fee_amount, participant.fee_currency, participant.register_date from civicrm_participant as participant INNER JOIN civicrm_contact as contact on participant.contact_id = contact.id and contact.is_deleted=0 where participant.event_id=%1 and participant.is_test=0;","params":{"1":{"name":"eventid","type":"Integer"}}}


--------------------------------------------------------------------------------
/queries/events.sql:
--------------------------------------------------------------------------------
 1 | SELECT
 2 | 	COUNT(*) as count,
 3 | 	event.id, 
 4 | 	event.title, 
 5 | 	event.event_type_id as tid, 
 6 | 	event.is_monetary as im,
 7 | 	event.start_date as sd, 
 8 | 	event.end_date as ed,
 9 | 	DATE(participant.register_date) as rd
10 | FROM
11 | 	civicrm_event as event
12 | 	INNER JOIN 
13 | 	civicrm_participant as participant 
14 | 	ON event.id=participant.event_id
15 | 	JOIN 
16 | 	civicrm_contact as contact
17 | 	ON participant.contact_id = contact.id and contact.is_deleted=0
18 | WHERE start_date IS NOT NULL AND end_date IS NOT NULL AND register_date IS NOT NULL
19 | GROUP BY event.id, register_date;


--------------------------------------------------------------------------------
/queries/mailing_click.json:
--------------------------------------------------------------------------------
 1 | {"query":"
 2 | SELECT DATE_FORMAT(time_stamp,'%Y-%m-%d %H:%i') as date, COUNT(civicrm_mailing_event_trackable_url_open.id) as clicked   FROM civicrm_mailing_event_trackable_url_open   JOIN  civicrm_mailing_event_queue ON  civicrm_mailing_event_trackable_url_open.event_queue_id = civicrm_mailing_event_queue.id   JOIN  civicrm_mailing_job ON  civicrm_mailing_event_queue.job_id = civicrm_mailing_job.id   JOIN  civicrm_mailing ON civicrm_mailing_job.mailing_id = civicrm_mailing.id  AND civicrm_mailing_job.is_test = 0  AND civicrm_mailing.is_completed= true where civicrm_mailing.id = %1 GROUP BY civicrm_mailing_event_queue.id, civicrm_mailing.id
 3 | 
 4 | select DATE_FORMAT(time_stamp,'%Y-%m-%d %H:%i') as date, count(*) as count 
 5 | from(
 6 | select contact_id, min(time_stamp) as time_stamp
 7 |   from civicrm_mailing_event_trackable_url_open
 8 |   join civicrm_mailing_event_queue q on event_queue_id=q.id 
 9 |   join civicrm_mailing_job j on q.job_id=j.id and j.is_test=false 
10 |   and mailing_id=%1 group by contact_id
11 | ) o group by date
12 | ","params":{"1":{"name":"mailing_id","type":"Integer"}}}
13 | 


--------------------------------------------------------------------------------
/queries/mailing_event.js:
--------------------------------------------------------------------------------
 1 | {"query":"
 2 | select DATE_FORMAT(time_stamp,'%Y-%m-%d %H:%i') as date, count(*) as count 
 3 | from(
 4 | select contact_id, min(time_stamp) as time_stamp
 5 |   from civicrm_mailing_event_opened 
 6 |   join civicrm_mailing_event_queue q on event_queue_id=q.id 
 7 |   join civicrm_mailing_job j on q.job_id=j.id and j.is_test=false 
 8 |   and mailing_id=%1 group by contact_id
 9 | ) o group by date
10 | ","params":{"1":{"name":"mailing_id","type":"Integer"}}}
11 | 


--------------------------------------------------------------------------------
/queries/mailing_open.json:
--------------------------------------------------------------------------------
1 | {"query":" select DATE_FORMAT(time_stamp,'%Y-%m-%d %H:%i') as date, count(*) as count  from( select contact_id, min(time_stamp) as time_stamp   from civicrm_mailing_event_opened    join civicrm_mailing_event_queue q on event_queue_id=q.id    join civicrm_mailing_job j on q.job_id=j.id and j.is_test=false and time_stamp < date_add(scheduled_date, interval 3 day)  and mailing_id=%1 group by contact_id ) o group by date","params":{"1":{"name":"mailing_id","type":"Integer"}}} 
2 | 


--------------------------------------------------------------------------------
/queries/mailings.json:
--------------------------------------------------------------------------------
 1 | {"query":"
 2 | SELECT m.id, m.name, subject, scheduled_date as date, m.created_id as owner_id, campaign_id,
 3 |   camp.name as campaign, camp.external_identifier, campaign_type_id,
 4 |   createdContact.first_name AS owner,
 5 |   (select count(r.id) from civicrm_mailing_recipients as r where r.mailing_id=m.id) as recipients,
 6 |   open,click
 7 | FROM civicrm_mailing as m
 8 | LEFT JOIN civicrm_campaign as camp ON m.campaign_id = camp.id
 9 | LEFT JOIN   civicrm_contact createdContact ON ( m.created_id = createdContact.id )
10 | LEFT JOIN (select count(*) as open ,id from (SELECT civicrm_mailing.id, COUNT(civicrm_mailing_event_opened.id) as opened 
11 |   FROM civicrm_mailing_event_opened 
12 |   JOIN  civicrm_mailing_event_queue ON  civicrm_mailing_event_opened.event_queue_id = civicrm_mailing_event_queue.id 
13 |   JOIN  civicrm_mailing_job ON  civicrm_mailing_event_queue.job_id = civicrm_mailing_job.id             
14 |   JOIN  civicrm_mailing ON civicrm_mailing_job.mailing_id = civicrm_mailing.id  AND civicrm_mailing_job.is_test = 0  AND civicrm_mailing.is_completed= true GROUP BY civicrm_mailing_event_queue.id, civicrm_mailing.id) as dist group by id) as opened on opened.id = m.id
15 | LEFT JOIN (select count(*) as click ,id from (SELECT civicrm_mailing.id, COUNT(civicrm_mailing_event_trackable_url_open.id) as clicked 
16 |   FROM civicrm_mailing_event_trackable_url_open 
17 |   JOIN  civicrm_mailing_event_queue ON  civicrm_mailing_event_trackable_url_open.event_queue_id = civicrm_mailing_event_queue.id 
18 |   JOIN  civicrm_mailing_job ON  civicrm_mailing_event_queue.job_id = civicrm_mailing_job.id              
19 |   JOIN  civicrm_mailing ON civicrm_mailing_job.mailing_id = civicrm_mailing.id  AND civicrm_mailing_job.is_test = 0  AND civicrm_mailing.is_completed= true GROUP BY civicrm_mailing_event_queue.id, civicrm_mailing.id) as dist group by id) as clicked on clicked.id = m.id
20 | 
21 | where is_completed = true;
22 | ","params":{"1":{"name":"campaign_id","type":"Integer"}}}
23 | 


--------------------------------------------------------------------------------
/queries/participants.sql:
--------------------------------------------------------------------------------
1 | SELECT count(*) as count, event_id, DATE(register_date) as register_date, status_id, date(event.start_date) as start_date, event.event_type_id from civicrm_participant, civicrm_event as event where event_id=event.id group by event_id, DATE(register_date), status_id;
2 | 


--------------------------------------------------------------------------------
/templates/CRM/Civisualize/Page/Doc.tpl:
--------------------------------------------------------------------------------
 1 | <textarea id="md" class="hidden">
 2 | {$md}
 3 | </textarea>
 4 | <script>
 5 | var error="{$error}";
 6 | {literal}
 7 | jQuery(function($){
 8 |   var md=$("#md").val();
 9 |   $("#content").html(marked(md));
10 | });
11 | </script>
12 | {/literal}
13 | <div id="content">
14 | 
15 | </div>
16 | {if $error}
17 | <div class="alert alert-danger" role="alert">
18 |   <span class="glyphicon glyphicon-exclamation-sign" aria-hidden="true"></span>
19 |   <span class="sr-only">Error:</span>
20 | To add it, create a <a href="https://github.com/{$github}/new/master/{$path}?filename={$mdfile}">{$mdfile}</a> and write the help you want (in markdown format).
21 | </div>
22 | {/if}
23 | <div>&nbsp;</div><div class="small pull-right">file: <a href="https://github.com/{$github}/blob/master/{$path}{$mdfile}">{$mdfile}</a></div>
24 | 


--------------------------------------------------------------------------------
/templates/CRM/Civisualize/Page/Main.tpl:
--------------------------------------------------------------------------------
 1 | {crmTitle string="Civisualize"}
 2 | 
 3 | You need to choose one of the following visualizations to start with:
 4 | <ul>
 5 | <li><a href="{crmURL p='civicrm/dataviz/contribute'}">Contributions</a></li>
 6 | <li><a href="{crmURL p='civicrm/dataviz/contacts'}">Contacts</a></li>
 7 | <li><a href="{crmURL p='civicrm/dataviz/events'}">Events</a></li>
 8 | <li><a href="{crmURL p='civicrm/dataviz/mailings'}">Mailings</a></li>
 9 | <li><a href="{crmURL p='civicrm/dataviz/donortrends'}">Donor Trends</a></li>
10 | </ul>
11 | <p>
12 | You might like to learn how to <a href="https://github.com/TechToThePeople/civisualize">build your own datavisualisation</a>
13 | </p>
14 | 


--------------------------------------------------------------------------------
/templates/dataviz/Contactcreateddate.tpl:
--------------------------------------------------------------------------------
  1 | {if !$embedded}
  2 | {php}CRM_Utils_System::setTitle('Contact Creation by Date');{/php}
  3 | <div id="dataviz">
  4 | </div>
  5 | {/if}
  6 | 
  7 | {crmScript ext="eu.tttp.civisualize" file="js/nvd3/nv.d3.js"}
  8 | {crmScript ext="eu.tttp.civisualize" file="js/nvd3/src/tooltip.js"}
  9 | {crmScript ext="eu.tttp.civisualize" file="js/nvd3/src/utils.js"}
 10 | {crmScript ext="eu.tttp.civisualize" file="js/nvd3/src/interactiveLayer.js"}
 11 | {crmScript ext="eu.tttp.civisualize" file="js/nvd3/src/models/legend.js"}
 12 | {crmScript ext="eu.tttp.civisualize" file="js/nvd3/src/models/axis.js"}
 13 | {crmScript ext="eu.tttp.civisualize" file="js/nvd3/src/models/scatter.js"}
 14 | {crmScript ext="eu.tttp.civisualize" file="js/nvd3/src/models/line.js"}
 15 | {crmScript ext="eu.tttp.civisualize" file="js/nvd3/src/models/lineChart.js"}
 16 | 
 17 | {literal}
 18 | <style>
 19 | 
 20 | body {
 21 |   overflow-y:scroll;
 22 | }
 23 | 
 24 | text {
 25 |   font: 12px sans-serif;
 26 | }
 27 | 
 28 | svg {
 29 |   display: block;
 30 | }
 31 | 
 32 | #chart1 svg {
 33 |   height: 500px;
 34 |   min-width: 200px;
 35 |   min-height: 100px;
 36 | /*
 37 |   margin: 50px;
 38 |   Minimum height and width is a good idea to prevent negative SVG dimensions...
 39 |   For example width should be =< margin.left + margin.right + 1,
 40 |   of course 1 pixel for the entire chart would not be very useful, BUT should not have errors
 41 | */
 42 | 
 43 | }
 44 | #chart1 {
 45 |   margin-top: 200px;
 46 |   margin-left: 100px;
 47 | }
 48 | </style>
 49 | <body class='with-3d-shadow with-transitions'>
 50 | 
 51 | <div id="chart1" >
 52 |   <svg style="height: 500px;"></svg>
 53 | </div>
 54 | 
 55 | <script>
 56 | 
 57 | // We need all our libraries loaded before we start.
 58 | (function() { function bootViz() {
 59 |   // Use our versions of the libraries.
 60 |   var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 61 | 
 62 |   // Wrapping in nv.addGraph allows for '0 timeout render', stores rendered charts in nv.graphs, and may do more in the future... it's NOT required
 63 |   var chart;
 64 | 
 65 |   nv.addGraph(function() {
 66 |       chart = nv.models.lineChart()
 67 |       .options({
 68 | margin: {left: 100, bottom: 100},
 69 | x: function(d,i) { return i},
 70 | showXAxis: true,
 71 | showYAxis: true,
 72 | transitionDuration: 250
 73 | })
 74 |       ;
 75 | 
 76 |       // chart sub-models (ie. xAxis, yAxis, etc) when accessed directly, return themselves, not the parent chart, so need to chain separately
 77 |       chart.xAxis
 78 |       .axisLabel("Time (s)")
 79 |       .tickFormat(d3.format(',.1f'));
 80 | 
 81 |       chart.yAxis
 82 |       .axisLabel('Voltage (v)')
 83 |       .tickFormat(d3.format(',.2f'))
 84 |       ;
 85 | 
 86 |   d3.select('#chart1 svg')
 87 | .datum(sinAndCos())
 88 |   .call(chart);
 89 | 
 90 |   //TODO: Figure out a good way to do this automatically
 91 |   nv.utils.windowResize(chart.update);
 92 |   //nv.utils.windowResize(function() { d3.select('#chart1 svg').call(chart) });
 93 | 
 94 |   chart.dispatch.on('stateChange', function(e) { nv.log('New State:', JSON.stringify(e)); });
 95 | 
 96 |   return chart;
 97 |   });
 98 | 
 99 | function sinAndCos() {
100 |   var sin = [],
101 |   cos = [],
102 |   rand = [],
103 |   rand2 = []
104 |     ;
105 | 
106 |   for (var i = 0; i < 100; i++) {
107 |     sin.push({x: i, y: i % 10 == 5 ? null : Math.sin(i/10) }); //the nulls are to show how defined works
108 |     cos.push({x: i, y: .5 * Math.cos(i/10)});
109 |     rand.push({x:i, y: Math.random() / 10});
110 |     rand2.push({x: i, y: Math.cos(i/10) + Math.random() / 10 })
111 |   }
112 | 
113 |   return [
114 |   {
115 | area: true,
116 |         values: sin,
117 |         key: "Sine Wave",
118 |         color: "#ff7f0e"
119 |   },
120 |   {
121 | values: cos,
122 |         key: "Cosine Wave",
123 |         color: "#2ca02c"
124 |   },
125 |   {
126 | values: rand,
127 |         key: "Random Points",
128 |         color: "#2222ff"
129 |   }
130 |   ,
131 |     {
132 | values: rand2,
133 |         key: "Random Cosine",
134 |         color: "#667711"
135 |     }
136 |   ];
137 | }
138 |   }
139 | 
140 |   // Boot our script as soon as ready.
141 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
142 |   CRM.civisualizeQueue.push(bootViz);
143 | })();
144 | </script>
145 | {/literal}
146 | 


--------------------------------------------------------------------------------
/templates/dataviz/Contactdashboard.tpl:
--------------------------------------------------------------------------------
 1 | {php}
 2 | CRM_Utils_System::setTitle('Overview of your CiviCRM');
 3 | 
 4 | $this->assign("options", array('width'=>200));
 5 | 
 6 | {/php}
 7 | 
 8 | <div id="dataviz">
 9 | </div>
10 | {include file="dataviz/Contacttype.tpl" embedded=1 name="contactTypeGraph" options=$options}
11 | 
12 | {include file="dataviz/Groupbarchart.tpl" embedded=1 name="GroupBarChart"}
13 | 
14 | {literal}
15 | <style>
16 | #GroupBarChart {position:absolute;left:320px;}
17 | </style>
18 | {/literal}
19 | 
20 | 


--------------------------------------------------------------------------------
/templates/dataviz/Contacts.tpl:
--------------------------------------------------------------------------------
  1 | {crmTitle string="Contacts Overview"}
  2 | 
  3 | <div class="dc_contacts" id="dataviz-contacts">
  4 | 	<div id="datacount" style="margin-bottom:20px;">
  5 | 	    <h2><strong><span class="filter-count"></span></strong> contacts selected from a total of <strong><span id="total-count"></span></strong> records</h2>
  6 | 	</div>
  7 | 	<div style="clear:both"></div>
  8 | 	<div id="type" style="width:350px;">
  9 | 	    <strong>Type</strong>
 10 | 	    <a class="reset civisualize-reset" href data-chart-name="contactsTypePie" >reset</a>
 11 | 	    <div class="clearfix"></div>
 12 | 	</div>
 13 | 		<div class="source">
 14 | 	    <strong>Source of Contact</strong>
 15 | 	    <a class="reset civisualize-reset" href data-chart-name="contactsSourceRow" >reset</a>
 16 | 	    <div class="clearfix"></div>
 17 | 	</div>
 18 | 	<div class="clear"></div>
 19 | 	<div id="gender" style="width:350px;">
 20 | 	    <strong>Gender</strong>
 21 | 	    <a class="reset civisualize-reset" href data-chart-name="contactsGenderPie" >reset</a>
 22 | 	    <div class="clearfix"></div>
 23 | 	</div>
 24 | 	<div id="dayofweek">
 25 | 	    <strong>Day - Contact Created</strong>
 26 | 	    <a class="reset civisualize-reset" href data-chart-name="contactsWeekRow" >reset</a>
 27 | 	    <div class="clearfix"></div>
 28 | 	</div>
 29 | 	<div class="clear"></div>
 30 | 	<div id="contacts-by-month">
 31 | 	    <strong>Date - Contact Created</strong>
 32 | 	    <a class="reset civisualize-reset" href data-chart-name="contactsMonthLine" >reset</a>
 33 | 	    <div class="clearfix"></div>
 34 | 	</div>
 35 | </div>
 36 | 
 37 | <script>
 38 | {literal}
 39 | 'use strict';
 40 | (function() { function bootViz() {
 41 |     console.log("Contacts dataviz: bootViz running");
 42 | (function(guid) {
 43 |   // Use our versions of the libraries.
 44 |   var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 45 | 
 46 |   {/literal}
 47 | 	var data = {crmSQL file="contacts"};
 48 | 	var gender = {crmAPI entity="contact" action="getoptions" field="gender_id"};
 49 | 	{literal}
 50 | 
 51 | 		if(!data.is_error){//Check for database error
 52 | 			var numberFormat = d3.format(".2f");
 53 | 			var genderLabel = {};
 54 | 
 55 | 			gender.values.forEach(function(d){
 56 | 				genderLabel[d.key]=d.value;
 57 | 			});
 58 | 
 59 | 			var dateFormat = d3.timeParse("%Y-%m-%d");
 60 | 
 61 | 			var genderPie=null, typePie=null, sourceRow=null, monthLine=null, weekRow=null;
 62 | 
 63 | 			cj(function($) {
 64 | 				var totalContacts = 0;
 65 | 
 66 | 				data.values.forEach(function(d){ 
 67 | 					totalContacts+=d.count;
 68 | 					d.gender=genderLabel[d.gender_id];
 69 | 					d.dd = dateFormat(d.created_date);
 70 | 					if(d.source=="")
 71 | 						d.source='None';
 72 | 					if(d.gender_id=="")
 73 | 						d.gender='None';
 74 | 				});
 75 | 
 76 | 				// data.values.forEach(function(d) {
 77 | 				// 	console.log(d);
 78 | 				// });
 79 | 
 80 | 				var min = d3.timeDay.offset(d3.min(data.values, function(d) { return d.dd;} ),-2);
 81 | 				var max = d3.timeDay.offset(d3.max(data.values, function(d) { return d.dd;} ), 2);
 82 | 
 83 | 				typePie 	= dc.pieChart("#type").innerRadius(10).radius(90);
 84 | 				genderPie 	= dc.pieChart('#gender').innerRadius(10).radius(90);
 85 | 				sourceRow 	= dc.rowChart(guid + '.source');
 86 | 				monthLine 	= dc.lineChart('#contacts-by-month');
 87 | 				weekRow 	= dc.rowChart('#dayofweek');
 88 | 
 89 | 				var ndx  = crossfilter(data.values), all = ndx.groupAll();
 90 | 
 91 | 				var totalCount = dc.dataCount("#datacount")
 92 | 			        .dimension(ndx)
 93 | 			        .group(all);
 94 | 
 95 | 			    document.getElementById("total-count").innerHTML=totalContacts;
 96 | 
 97 | 				var gender = ndx.dimension(function(d){if(d.gender!="") return d.gender; else return 3;});
 98 | 				var genderGroup = gender.group().reduceSum(function(d){return d.count;});
 99 | 
100 | 				var source = ndx.dimension(function(d){ return d.source;});
101 | 				var sourceGroup = source.group().reduceSum(function(d){return d.count;});
102 | 
103 | 				var type        = ndx.dimension(function(d) {return d.type;});
104 | 				var typeGroup   = type.group().reduceSum(function(d) { return d.count; });
105 | 
106 | 				var creationMonth = ndx.dimension(function(d) { return d.dd; });
107 | 				var creationMonthGroup = creationMonth.group().reduceSum(function(d) { return d.count; });
108 | 
109 | 				var creationWeek = ndx.dimension(function (d) { 
110 | 					var day = d.dd.getDay(); 
111 | 					var name=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"];
112 | 					return day+"."+name[day]; 
113 | 				});
114 | 
115 | 				var creationWeekGroup = creationWeek.group().reduceSum(function(d){return d.count;});
116 | 				
117 | 				var _group   = creationMonth.group().reduceSum(function(d) {return d.count;});
118 | 				var group = {
119 | 					all:function () {
120 | 						var cumulate = 0;
121 | 						var g = [];
122 | 						_group.all().forEach(function(d,i) {
123 | 							cumulate += d.value;
124 | 							g.push({key:d.key,value:cumulate})
125 | 						});
126 | 						return g;
127 | 					}
128 | 				};
129 | 
130 | 				typePie
131 | 					.width(250)
132 | 					.height(200)
133 | 					.dimension(type)
134 | 					.colors(d3.scaleOrdinal(d3.schemeCategory10))
135 | 					.group(typeGroup)
136 | 					.label(function(d){
137 | 						if (typePie.hasFilter() && !typePie.hasFilter(d.key))
138 | 			                return d.key + "(0%)";
139 | 						return d.key+"(" + Math.floor(d.value / all.reduceSum(function(d) {return d.count;}).value() * 100) + "%)";
140 | 					})
141 | 					.on('renderlet', function (chart) {			
142 | 					});
143 | 
144 | 				genderPie
145 | 					.width(250)
146 | 					.height(200)
147 | 					.dimension(gender)
148 | 					.colors(d3.scaleOrdinal(d3.schemeCategory10))
149 | 					.group(genderGroup)
150 | 					.label(function(d) {
151 | 						if (genderPie.hasFilter() && !genderPie.hasFilter(d.key))
152 | 			                return d.key + "(0%)";
153 | 						return d.key+"(" + Math.floor(d.value / all.reduceSum(function(d) {return d.count;}).value() * 100) + "%)";;
154 | 					})
155 | 					.on('renderlet', function (chart) {			
156 | 					});
157 | 
158 | 				sourceRow
159 | 					.width(300)
160 | 					.height(200)
161 | 					.margins({top: 20, left: 10, right: 10, bottom: 20})
162 | 					.dimension(source)
163 | 					.cap(5)
164 |           .ordering (function(d) {return d.count;})
165 | 					.colors(d3.scaleOrdinal(d3.schemeCategory10))
166 | 					.group(sourceGroup)
167 | 					.label(function(d){
168 | 						if (sourceRow.hasFilter() && !sourceRow.hasFilter(d.key))
169 | 			                return d.key + "(0%)";
170 | 						return d.key+"(" + Math.floor(d.value / all.reduceSum(function(d) {return d.count;}).value() * 100) + "%)";
171 | 					})
172 | 					.elasticX(true);
173 | 
174 | 				weekRow
175 | 					.width(300)
176 | 					.height(200)
177 | 					.margins({top: 0, left: 10, right: 10, bottom: 20})
178 | 					.group(creationWeekGroup)
179 | 					.dimension(creationWeek)
180 | 					.ordinalColors(["#d95f02","#1b9e77","#7570b3","#e7298a","#66a61e","#e6ab02","#a6761d"])
181 | 					.label(function (d) {
182 | 						return d.key.split(".")[1];
183 | 					})
184 | 					.title(function (d) {
185 | 						return d.value;
186 | 					})
187 | 					.elasticX(true)
188 | 					.xAxis().ticks(4);
189 | 
190 | 				monthLine
191 | 					.width(800)
192 | 					.height(200)
193 |            .margins({top: 10, right: 50, bottom: 30, left: 50})
194 | 					.dimension(creationMonth)
195 | 					.group(group)
196 | 					.x(d3.scaleTime().domain([min, max]))
197 | 					.round(d3.timeDay.round)
198 | 					.elasticY(true)
199 | 					.xUnits(d3.timeDays);
200 | 				
201 | 				dc.renderAll();
202 | 
203 |         // Provide access to our objects under unique names for the reset links.
204 |         CRM.civisualize.charts['contactsTypePie'] = typePie;
205 |         CRM.civisualize.charts['contactsSourceRow'] = sourceRow;
206 |         CRM.civisualize.charts['contactsGenderPie'] = genderPie;
207 |         CRM.civisualize.charts['contactsWeekRow'] = weekRow;
208 |         CRM.civisualize.charts['contactsMonthLine'] = monthLine;
209 |         CRM.civisualize.bindResetLinks();
210 | 			});
211 | 		}
212 | 		else{
213 | 			cj('.dc_contacts').html('<div style="color:red; font-size:18px;">There is a database error. Please Contact the administrator as soon as possible.</div>');
214 | 		}
215 | })("#dataviz-contacts");
216 | 
217 |   }
218 | 
219 |   // Boot our script as soon as ready.
220 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
221 |   CRM.civisualizeQueue.push(bootViz);
222 | })();
223 | {/literal}
224 | </script>
225 | <div class="clear"></div>
226 | 


--------------------------------------------------------------------------------
/templates/dataviz/Contacttype.tpl:
--------------------------------------------------------------------------------
  1 | {if !$embedded}
  2 | {php}CRM_Utils_System::setTitle('What type are your contacts?');{/php}
  3 | <div id="dataviz">
  4 | </div>
  5 | {/if}
  6 | 
  7 | 
  8 | <script>
  9 | {literal}
 10 | (function() { function bootViz() {
 11 |   // Use our versions of the libraries.
 12 |   var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 13 | (function (name,options) {
 14 | {/literal}
 15 | var types = {crmAPI entity="contact" action="getstat" return="contact_type"};
 16 | {literal}
 17 | 
 18 |   drawPie(types,options);
 19 | 
 20 | function drawPie(types,options) {
 21 |   options = options || {};
 22 |   width = options.width || 300;
 23 |   height = options.height || width;
 24 |   }
 25 | 
 26 |   radius = Math.min(width, height) / 2;
 27 | 
 28 |   var color = d3.scaleOrdinal()
 29 |       .range(["#98abc5", "#8a89a6", "#7b6888", "#6b486b", "#a05d56", "#d0743c", "#ff8c00"]);
 30 | 
 31 |   var arc = d3.arc()
 32 |       .outerRadius(radius - 10)
 33 |       .innerRadius(radius - 60);
 34 | 
 35 |   var pie = d3.pie()
 36 |       .sort(null)
 37 |       .value(function(d) { return d.total; });
 38 | 
 39 |   var svg = d3.select("#dataviz").append("svg")
 40 |       .attr("width", width*2)
 41 |       .attr("height", height);
 42 | 
 43 |   var g= svg.append("g")
 44 |       .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");
 45 | 
 46 |   var legend= d3.selectAll("#dataviz").append("ul")
 47 |       .attr("id","legend")
 48 |       .style("left", (width+10)+"px")
 49 |       .selectAll(".legendLine")
 50 |         .data(types.values)
 51 |         .enter()
 52 |         .append("li")
 53 |           .attr("class","legendLine")
 54 |           .style("background-color", function(d) { return color(d.contact_type); })
 55 |           .html(function(d) { return d.contact_type; });
 56 |     
 57 |     var a = g.selectAll(".arc")
 58 |         .data(pie(types.values))
 59 |       .enter()
 60 |         .append("path")
 61 |         .attr("d", arc)
 62 |         .attr("class", "arc")
 63 |         .style("fill", function(d) { return color(d.data.contact_type); })
 64 | 
 65 |     g.append("text")
 66 |       .attr("class","total")
 67 |       .style("text-anchor", "middle")
 68 |       .attr("font-size","10px")
 69 |       .text(function(d) { 
 70 |         var t=0; 
 71 |         types.values.forEach(function (e){ 
 72 |           t = t+parseFloat(e.total);});
 73 |           return t;
 74 |       })
 75 |       .transition()
 76 |       .duration(function (){return 2000;})
 77 |         .attr("font-size", (width /10) +"px");
 78 | 
 79 |   if (name) {
 80 |     window[name]=this;
 81 |   }
 82 | {/literal}
 83 | }("{$name}",{$options|@json_encode}));
 84 | {literal}
 85 |   }
 86 | 
 87 |   // Boot our script as soon as ready.
 88 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
 89 |   CRM.civisualizeQueue.push(bootViz);
 90 | })();
 91 | </script>
 92 | 
 93 | <style>
 94 | {literal}
 95 | 
 96 | #dataviz {position:relative;}
 97 | #legend {   
 98 |   position: absolute;           
 99 |   width: 120px;   
100 |   left:300px;
101 |   top:40px;                                
102 |   padding: 2px;             
103 |   font: 12px sans-serif;        
104 |   background: #eee;   
105 |   border: 0px;      
106 |   border-radius: 5px;           
107 |   pointer-events: none;         
108 |   border: 1px solid rgba(0,0,0,.2);
109 |   z-index: 10000;
110 | 
111 |   transition: opacity 500ms linear;
112 |   -moz-transition: opacity 500ms linear;
113 |   -webkit-transition: opacity 500ms linear;
114 | 
115 |   transition-delay: 500ms;
116 |   -moz-transition-delay: 500ms;
117 |   -webkit-transition-delay: 500ms;
118 | 
119 |   -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
120 |   -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
121 |   box-shadow: 0 5px 10px rgba(0,0,0,.2);
122 | 
123 |   -webkit-touch-callout: none;
124 |   -webkit-user-select: none;
125 |   -khtml-user-select: none;
126 |   -moz-user-select: none;
127 |   -ms-user-select: none;
128 |   user-select: none;
129 | }
130 | 
131 | #legend li {
132 | margin:0 0 5px 0;
133 | padding:10px 10px 10px 10px;
134 | list-style:none;
135 | color:white;
136 | border-radius: 5px;           
137 |   text-align: center;           
138 | }
139 | 
140 | #legend ul {
141 |   padding:5px 0 0 0;
142 |   margin:0;
143 | }
144 | 
145 | </style>
146 | {/literal}
147 | 
148 | 


--------------------------------------------------------------------------------
/templates/dataviz/Contribute.tpl:
--------------------------------------------------------------------------------
  1 | {crmTitle string="Contributions"}
  2 | <h1><span id="nbcontrib"></span> Contributions for a total of <span id="amount"></span></h1>
  3 | <div class="row">
  4 | <div id="recur" class="col-md-4">
  5 |     <strong>Recurring</strong>
  6 |     <a class="reset civisualize-reset" href data-chart-name="contributeRecur" >reset</a>
  7 |     <graph />
  8 |     <div class="clearfix"></div>
  9 | </div>
 10 | 
 11 | <div id="contact_type" class="col-md-4 hidden">
 12 |     <strong>Type</strong>
 13 |     <a class="reset civisualize-reset" href data-chart-name="contributePieType" >reset</a>
 14 |     <div class="clearfix"></div>
 15 | </div>
 16 | 
 17 | <div id="instrument" class="col-md-4">
 18 |     <strong>Payment instrument</strong>
 19 |     <a class="reset civisualize-reset" href data-chart-name="contributePieInstrument" >reset</a>
 20 |     <div class="clearfix"></div>
 21 | </div>
 22 | 
 23 | <div id="day-of-week-chart" class="col-md-4">
 24 |     <strong>Day of Week</strong>
 25 |     <a class="reset civisualize-reset" href data-chart-name="contributeDayOfWeekChart" >reset</a>
 26 |     <div class="clearfix"></div>
 27 | </div>
 28 | </div>
 29 | <div class="row clear">
 30 |     <div id="monthly-move-chart" class="col-md-12">
 31 |         <strong>Amount by month</strong>
 32 |         <span class="reset" style="display: none;">range: <span class="filter"></span></span>
 33 |         <a class="reset civisualize-reset" href data-chart-name="contributeMoveChart,contributionVolumeChart" >reset</a>
 34 |         <div class="clearfix"></div>
 35 |     </div>
 36 | </div>
 37 | 
 38 | <div id="monthly-volume-chart" class="col-md-12"></div>
 39 | 
 40 | <div class="clear"></div>
 41 | 
 42 | <script>
 43 |     'use strict';
 44 |     var data = {crmSQL file="contribution_by_date"};
 45 |     var i = {crmAPI entity="OptionValue" option_group_id="10"}; {*todo on 4.4, use the payment_instrument as id *}
 46 | 
 47 |     {literal}
 48 | (function() { function bootViz() {
 49 |       // Use our versions of the libraries.
 50 |       var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 51 | 
 52 |         if(!data.is_error){
 53 |             var instrumentLabel = {};
 54 |             i.values.forEach (function(d) {
 55 |                 instrumentLabel[d.value] = d.label;
 56 |             });
 57 | 
 58 |             var numberFormat = d3.format(".2f");
 59 |             var graphs = {};
 60 |             var volumeChart=null,dayOfWeekChart=null,moveChart=null,pieinstrument,pietype;  
 61 | 
 62 |             cj(function($) {
 63 | 
 64 |         function drawRecur(dom){
 65 |           var dim = ndx.dimension(function(d) {return d.recurring;});
 66 |           var group = dim.group().reduceSum(function(d) { return d.count; });
 67 |           var graph = dc.pieChart(dom)
 68 |             .innerRadius(20)
 69 |             .radius(90)
 70 |             .dimension(dim)
 71 |             .group(group)
 72 |             .label(function (d) { return d.key? "Recurring":"One Off";})
 73 |             .title(function (d) { return (d.key? "Recurring":"One Off") +": "+d.value;});
 74 |           ;
 75 |           return graph;
 76 |         }
 77 | 
 78 |                 // create a pie chart under #chart-container1 element using the default global chart group
 79 |                 pietype = dc.pieChart("#type").innerRadius(20).radius(90);
 80 |                 pieinstrument = dc.pieChart("#instrument").innerRadius(50).radius(90);
 81 |                 volumeChart = dc.barChart("#monthly-volume-chart");
 82 |                 dayOfWeekChart = dc.rowChart("#day-of-week-chart");
 83 |                 //var moveChart = dc.seriesChart("#monthly-move-chart");
 84 |                 moveChart = dc.lineChart("#monthly-move-chart");
 85 |                 var dateFormat = d3.timeFormat("%Y-%m-%d");
 86 |                 var dateFormatParse = d3.timeParse("%Y-%m-%d");
 87 |                 //data.values.forEach(function(d){data.values[i].dd = new Date(d.receive_date)});
 88 | 
 89 |                 data.values.forEach(function(d){d.dd = dateFormatParse(d.receive_date)});
 90 |                 var min = d3.min(data.values, function(d) { return d.dd;} );
 91 |                 var max = d3.max(data.values, function(d) { return d.dd;} );
 92 |                 var ndx                 = crossfilter(data.values),
 93 |                 all = ndx.groupAll();
 94 | 
 95 |                 var type        = ndx.dimension(function(d) {return d.financial_type;});
 96 |                 var typeGroup   = type.group().reduceSum(function(d) { return d.count; });
 97 | 
 98 |                 var instrument        = ndx.dimension(function(d) {return d.instrument;});
 99 |                 var instrumentGroup   = instrument.group().reduceSum(function(d) { return d.count; });
100 | 
101 |                 var byMonth     = ndx.dimension(function(d) { return d3.timeMonth(d.dd); });
102 |                 var byDay       = ndx.dimension(function(d) { return d.dd; });
103 |                 var volumeByMonthGroup  = byMonth.group().reduceSum(function(d) { return d.count; });
104 |                 var totalByDayGroup     = byDay.group().reduceSum(function(d) { return d.total; });
105 | 
106 |                 var dayOfWeek = ndx.dimension(function (d) { 
107 |                     var day = d.dd.getDay(); 
108 |                     var name=["Sun","Mon","Tue","Wed","Thu","Fri","Sat"];
109 |                     return day+"."+name[day]; 
110 |                 }); 
111 | 
112 | 
113 |                 var group=ndx.groupAll().reduce(
114 |                     function(a, d) { 
115 |                         a.total += d.total; 
116 |                         a.count += d.count; 
117 |                         return a;
118 |                     },
119 |                     function(a, d) { 
120 |                         a.total -= d.total; 
121 |                         a.count -= d.count; 
122 |                         return a; 
123 |                     },
124 |                     function() { 
125 |                         return {total:0, count:0};
126 |                     }
127 |                 );
128 | 
129 |                 var contribND   = dc.numberDisplay("#nbcontrib")
130 |                     .group(group)
131 |                     .valueAccessor(function (d) {
132 |                     return d.count;})
133 |                     .formatNumber(d3.format("3.3s"));
134 | 
135 |                 var amountND    = dc.numberDisplay("#amount")
136 |                     .group(group)
137 |                     .valueAccessor(function(d) {return d.total});
138 | 
139 | 
140 | 
141 |                 var dayOfWeekGroup = dayOfWeek.group(); 
142 |                 
143 |                 dayOfWeekChart.width(300)
144 |                     .height(220)
145 |                     .margins({top: 20, left: 10, right: 10, bottom: 20})
146 |                     .group(dayOfWeekGroup)
147 |                     .dimension(dayOfWeek)
148 |                     .ordinalColors(["#d95f02","#1b9e77","#7570b3","#e7298a","#66a61e","#e6ab02","#a6761d"])
149 |                     .label(function (d) {
150 |                         return d.key.split(".")[1];
151 |                     })
152 |                     .title(function (d) {
153 |                         return d.value;
154 |                     })
155 |                     .elasticX(true)
156 |                     .xAxis().ticks(4);
157 | 
158 | 
159 |                 pieinstrument
160 |                     .width(200)
161 |                     .height(200)
162 |                     .dimension(instrument)
163 |                     .group(instrumentGroup)
164 |                     .title(function(d) {
165 |                         return instrumentLabel[d.key]+":"+d.value;
166 |                     })
167 |                     .label(function(d) {
168 |                         return instrumentLabel[d.key];
169 |                     })
170 |                     .on('renderlet', function (chart) {
171 |                     });
172 | 
173 |                 pietype
174 |                     .width(200)
175 |                     .height(200)
176 |                     .dimension(type)
177 |                     .colors(d3.scaleOrdinal(d3.schemeCategory10)())
178 |                     .group(typeGroup)
179 |                     .on('renderlet', function (chart) {
180 |                     });
181 | 
182 |                 //.round(d3.timeMonth.round)
183 |                 //.interpolate('monotone')
184 |                 moveChart.width(850)
185 |                     .height(200)
186 |                     .transitionDuration(1000)
187 |                     .margins({top: 30, right: 50, bottom: 25, left: 40})
188 |                     .dimension(byDay)
189 |                     .mouseZoomable(true)
190 |                     .x(d3.scaleTime().domain([min,max]))
191 |                     .xUnits(d3.timeMonths)
192 |                     .elasticY(true)
193 |                     .renderHorizontalGridLines(true)
194 |                     .legend(dc.legend().x(800).y(10).itemHeight(13).gap(5))
195 |                     .brushOn(false)
196 |                     .rangeChart(volumeChart)
197 |                     .group(totalByDayGroup)
198 |                     .valueAccessor(function (d) { 
199 |                         return d.value;
200 |                     })
201 |                     .title(function (d) {
202 |                         var value = d.value;
203 |                         if (isNaN(value)) value = 0;
204 |                         return dateFormat(d.key) + "\n" + numberFormat(value);
205 |                     });
206 | 
207 |                 volumeChart.width(850)
208 |                     .height(200)
209 |                     .margins({top: 0, right: 50, bottom: 20, left:40})
210 |                     .dimension(byMonth)
211 |                     .group(volumeByMonthGroup)
212 |                     .centerBar(true)
213 |                     .gap(1)
214 |                     .x(d3.scaleTime().domain([min, max]))
215 |                     .round(d3.timeMonth.round)
216 |                     .xUnits(d3.timeMonths);
217 | 
218 |                 graphs.recur=drawRecur("#recur graph");
219 |                 dc.renderAll();
220 |                 //  pietype.render();
221 | 
222 |                 CRM.civisualize.charts['contributeRecur'] = graphs.recur;
223 |                 CRM.civisualize.charts['contributePieType'] = pietype;
224 |                 CRM.civisualize.charts['contributePieInstrument'] = pieinstrument;
225 |                 CRM.civisualize.charts['contributeDayOfWeekChart'] = dayOfWeekChart;
226 |                 CRM.civisualize.charts['contributeMoveChart'] = moveChart;
227 |                 CRM.civisualize.charts['contributeVolumeChart'] = volumeChart;
228 |             });//end cj
229 |         }
230 |         else{
231 |             cj('.eventsoverview').html('<div style="color:red; font-size:18px;">Civisualize Error. Please contact Admin.'+data.error+'</div>');
232 |         }
233 |   }
234 | 
235 |   // Boot our script as soon as ready.
236 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
237 |   CRM.civisualizeQueue.push(bootViz);
238 | })();
239 |     {/literal}
240 | </script>
241 | <div class="clear"></div>
242 | 


--------------------------------------------------------------------------------
/templates/dataviz/ContributionByDate.tpl:
--------------------------------------------------------------------------------
  1 | {crmScript ext="eu.tttp.civisualize" file="js/dc/dc.js"}
  2 | {crmScript ext="eu.tttp.civisualize" file="js/dc/crossfilter.js"}
  3 | 
  4 | <div id="your-chart">
  5 |     <!-- Title or anything you want to add above the chart -->
  6 |     <span>Days by Gain or Loss</span>
  7 | 
  8 | <span class="reset" style="display: none;">Current filter: <span class="filter"></span></span>
  9 | <!-- anchor div for data table -->
 10 | <div id="data-table">
 11 |     <!-- create a custom header -->
 12 |     <div class="header">
 13 |         <span>Date</span>
 14 |         <span>Open</span>
 15 |         <span>Close</span>
 16 |         <span>Change</span>
 17 |         <span>Volume</span>
 18 |     </div>
 19 |     <!-- data rows will filled in here -->
 20 | </div>
 21 | 
 22 | 
 23 | 
 24 | <script>
 25 | 
 26 | {literal}
 27 | (function(){
 28 |  function bootViz() {
 29 | 
 30 |  // Use our versions of the libraries.
 31 |  var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 32 |  var $ = CRM.$;
 33 | 
 34 |  {/literal}
 35 |  var data={crmSQL file="contribution_by_date"}.values;
 36 |  {literal}
 37 | 
 38 |  var gainOrLossChart = dc.pieChart("#gain-loss-chart");
 39 |  var fluctuationChart = dc.barChart("#fluctuation-chart");
 40 |  var quarterChart = dc.pieChart("#quarter-chart");
 41 |  var dayOfWeekChart = dc.rowChart("#day-of-week-chart");
 42 |  var moveChart = dc.compositeChart("#monthly-move-chart");
 43 |  var volumeChart = dc.barChart("#monthly-volume-chart");
 44 |  var yearlyBubbleChart = dc.bubbleChart("#yearly-bubble-chart");
 45 | 
 46 |  dateFormat = d3.time.format("%Y-%m-%d");
 47 |  data.forEach(function(e) { e.dd = dateFormat.parse(e.receive_date); });
 48 | 
 49 |  // feed it through crossfilter
 50 |  var ndx = crossfilter(data);
 51 | 
 52 |  // define group all for counting
 53 |  var all = ndx.groupAll();
 54 | 
 55 |  // define a dimension
 56 |  var volumeByMonth = ndx.dimension(function(d) { return d3.time.month(d.dd); });
 57 |  // map/reduce to group sum
 58 |  var volumeByMonthGroup = volumeByMonth.group().reduceSum(function(d) { return d.count; });
 59 |  var dayOfWeek = ndx.dimension(function (d) {
 60 |      var day = d.dd.getDay();
 61 |      switch (day) {
 62 |      case 0:
 63 |      return "0.Sun";
 64 |      case 1:
 65 |      return "1.Mon";
 66 |      case 2:
 67 |      return "2.Tue";
 68 |      case 3:
 69 |      return "3.Wed";
 70 |      case 4:
 71 |      return "4.Thu";
 72 |      case 5:
 73 |      return "5.Fri";
 74 |      case 6:
 75 |      return "6.Sat";
 76 |      }
 77 |      });
 78 |  var dayOfWeekGroup = dayOfWeek.group();
 79 | 
 80 | 
 81 |  var contactType = ndx.dimension(function(d) { return d.contact_type; });
 82 |  var contactTypeGroup=contactType.group();
 83 | 
 84 |  /* Create a pie chart and use the given css selector as anchor. You can also specify
 85 |   * an optional chart group for this chart to be scoped within. When a chart belongs
 86 |   * to a specific group then any interaction with such chart will only trigger redraw
 87 |   * on other charts within the same chart group. */
 88 |  dc.pieChart("#contact-type-chart", "chartGroup")
 89 |    .width(200) // (optional) define chart width, :default = 200
 90 |    .height(200) // (optional) define chart height, :default = 200
 91 |    .transitionDuration(500) // (optional) define chart transition duration, :default = 350
 92 |    // (optional) define color array for slices
 93 |    .colors(['#3182bd', '#6baed6', '#9ecae1', '#c6dbef', '#dadaeb'])
 94 |    // (optional) define color domain to match your data domain if you want to bind data or color
 95 |    .colorDomain([-1750, 1644])
 96 |    // (optional) define color value accessor
 97 |    .colorAccessor(function(d, i){return d.value;})
 98 |    .radius(90) // define pie radius
 99 |    // (optional) if inner radius is used then a donut chart will
100 |    // be generated instead of pie chart
101 |    .innerRadius(40)
102 |    .dimension(contactType) // set dimension
103 |    .group(contactTypeGroup) // set group
104 |    // (optional) by default pie chart will use group.key as it's label
105 |    // but you can overwrite it with a closure
106 |    .label(function(d) { return d.data.key + "(" + Math.floor(d.data.value / all.value() * 100) + "%)"; })
107 |    // (optional) whether chart should render labels, :default = true
108 |    .renderLabel(true)
109 |    // (optional) by default pie chart will use group.key and group.value as its title
110 |    // you can overwrite it with a closure
111 |    .title(function(d) { return d.data.key + "(" + Math.floor(d.data.value / all.value() * 100) + "%)"; })
112 |    // (optional) whether chart should render titles, :default = false
113 |    .renderTitle(true);
114 | 
115 |  return;
116 | 
117 |  /* Create a bar chart and use the given css selector as anchor. You can also specify
118 |   * an optional chart group for this chart to be scoped within. When a chart belongs
119 |   * to a specific group then any interaction with such chart will only trigger redraw
120 |   * on other charts within the same chart group. */
121 |  dc.barChart("#volume-month-chart")
122 |    .width(990) // (optional) define chart width, :default = 200
123 |    .height(250) // (optional) define chart height, :default = 200
124 |    .transitionDuration(500) // (optional) define chart transition duration, :default = 500
125 |    // (optional) define margins
126 |    .margins({top: 10, right: 50, bottom: 30, left: 40})
127 |    .dimension(volumeByMonth) // set dimension
128 |    .group(volumeByMonthGroup) // set group
129 |    // (optional) whether chart should rescale y axis to fit data, :default = false
130 |    .elasticY(true)
131 |    // (optional) when elasticY is on whether padding should be applied to y axis domain, :default=0
132 |    .yAxisPadding(100)
133 |    // (optional) whether chart should rescale x axis to fit data, :default = false
134 |    .elasticX(true)
135 |    // (optional) when elasticX is on whether padding should be applied to x axis domain, :default=0
136 |    .xAxisPadding(500)
137 |    // define x scale
138 |    .x(d3.time.scale().domain([new Date(1985, 0, 1), new Date(2012, 11, 31)]))
139 |    // (optional) set filter brush rounding
140 |    .round(d3.time.month.round)
141 |    // define x axis units
142 |    .xUnits(d3.time.months)
143 |    // (optional) whether bar should be center to its x value, :default=false
144 |    .centerBar(true)
145 |    // (optional) set gap between bars manually in px, :default=2
146 |    .barGap(1)
147 |    // (optional) render horizontal grid lines, :default=false
148 |    .renderHorizontalGridLines(true)
149 |    // (optional) render vertical grid lines, :default=false
150 |    .renderVerticalGridLines(true)
151 |    // (optional) add stacked group and custom value retriever
152 |    .stack(monthlyMoveGroup, function(d){return d.value;})
153 |    // (optional) you can add multiple stacked group with or without custom value retriever
154 |    // if no custom retriever provided base chart's value retriever will be used
155 |    .stack(monthlyMoveGroup)
156 |    // (optional) whether this chart should generate user interactive brush to allow range
157 |    // selection, :default=true.
158 |    .brushOn(true)
159 |    // (optional) whether svg title element(tooltip) should be generated for each bar using
160 |    // the given function, :default=no
161 |    .title(function(d) { return "Value: " + d.value; })
162 |    // (optional) whether chart should render titles, :default = false
163 |    .renderTitle(true);
164 | 
165 |  /* Create a row chart and use the given css selector as anchor. You can also specify
166 |   * an optional chart group for this chart to be scoped within. When a chart belongs
167 |   * to a specific group then any interaction with such chart will only trigger redraw
168 |   * on other charts within the same chart group. */
169 |  dc.rowChart("#days-of-week-chart", "chartGroup")
170 |    .width(180) // (optional) define chart width, :default = 200
171 |    .height(180) // (optional) define chart height, :default = 200
172 |    .group(dayOfWeekGroup) // set group
173 |    .dimension(dayOfWeek) // set dimension
174 |    // (optional) define margins
175 |    .margins({top: 20, left: 10, right: 10, bottom: 20})
176 |    // (optional) define color array for slices
177 |    .colors(['#3182bd', '#6baed6', '#9ecae1', '#c6dbef', '#dadaeb'])
178 |    // (optional) set gap between rows, default is 5
179 |    gap(7)
180 |    // (optional) set x offset for labels, default is 10
181 |    labelOffSetX(5)
182 |    // (optional) set y offset for labels, default is 15
183 |    labelOffSetY(10)
184 |    // (optional) whether chart should render labels, :default = true
185 |    .renderLabel(true)
186 |    // (optional) by default pie chart will use group.key and group.value as its title
187 |    // you can overwrite it with a closure
188 |    .title(function(d) { return d.data.key + "(" + Math.floor(d.data.value / all.value() * 100) + "%)"; })
189 |    // (optional) whether chart should render titles, :default = false
190 |    .renderTitle(true);
191 |  // (optional) specify the number of ticks for the X axis
192 |  //    .xAxis().ticks(4);
193 | 
194 | 
195 | 
196 |  /* Create a line chart and use the given css selector as anchor. You can also specify
197 |   * an optional chart group for this chart to be scoped within. When a chart belongs
198 |   * to a specific group then any interaction with such chart will only trigger redraw
199 |   * on other charts within the same chart group. */
200 |  dc.lineChart("#contribution-monthly-chart", "chartGroup")
201 |    .width(990) // (optional) define chart width, :default = 200
202 |    .height(200) // (optional) define chart height, :default = 200
203 |    .transitionDuration(500) // (optional) define chart transition duration, :default = 500
204 |    // (optional) define margins
205 |    .margins({top: 10, right: 50, bottom: 30, left: 40})
206 |    .dimension(monthly) // set dimension
207 |    .group(monthlyGroup) // set group
208 |    // (optional) whether chart should rescale y axis to fit data, :default = false
209 |    .elasticY(true)
210 |    // (optional) when elasticY is on whether padding should be applied to y axis domain, :default=0
211 |    .yAxisPadding(100)
212 |    // (optional) whether chart should rescale x axis to fit data, :default = false
213 |    .elasticX(true)
214 |    // (optional) when elasticX is on whether padding should be applied to x axis domain, :default=0
215 |    .xAxisPadding(500)
216 |    // define x scale
217 |    .x(d3.time.scale().domain([new Date(1985, 0, 1), new Date(2013, 11, 31)]))
218 |    // (optional) set filter brush rounding
219 |    .round(d3.time.month.round)
220 |    // define x axis units
221 |    .xUnits(d3.time.months)
222 |    // (optional) render horizontal grid lines, :default=false
223 |    .renderHorizontalGridLines(true)
224 |    // (optional) render vertical grid lines, :default=false
225 |    .renderVerticalGridLines(true)
226 |    // (optional) render as area chart, :default = false
227 |    .renderArea(true)
228 |    // (optional) add stacked group and custom value retriever
229 |    .stack(monthlyGroup, function(d){return d.total;})
230 |    // (optional) you can add multiple stacked group with or without custom value retriever
231 |    // if no custom retriever provided base chart's value retriever will be used
232 |    .stack(monthlyGroup)
233 |    // (optional) whether this chart should generate user interactive brush to allow range
234 |    // selection, :default=true.
235 |    .brushOn(true)
236 |    // (optional) whether dot and title should be generated on the line using
237 |    // the given function, :default=no
238 |    .title(function(d) { return "Value: " + d.value; })
239 |    // (optional) whether chart should render titles, :default = false
240 |    .renderTitle(true)
241 |    // (optional) radius used to generate title dot, :default = 5
242 |    .dotRadius(10);
243 | 
244 |  /* Create a composite chart and use the given css selector as anchor. You can also specify
245 |   * an optional chart group for this chart to be scoped within. When a chart belongs
246 |   * to a specific group then any interaction with such chart will only trigger redraw
247 |   * on other charts within the same chart group. */
248 |  dc.compositeChart("#montly-move-chart", "chartGroup")
249 |    .width(990) // (optional) define chart width, :default = 200
250 |    .height(200) // (optional) define chart height, :default = 200
251 |    .transitionDuration(500) // (optional) define chart transition duration, :default = 500
252 |    // (optional) define margins
253 |    .margins({top: 10, right: 50, bottom: 30, left: 40})
254 |    .dimension(monthlyMove) // set dimension
255 |    .group(monthlyMoveGroup) // set group
256 |    // (optional) whether chart should rescale y axis to fit data, :default = false
257 |    .elasticY(true)
258 |    // (optional) when elasticY is on whether padding should be applied to y axis domain, :default=0
259 |    .yAxisPadding(100)
260 |    // (optional) whether chart should rescale x axis to fit data, :default = false
261 |    .elasticX(true)
262 |    // (optional) when elasticX is on whether padding should be applied to x axis domain, :default=0
263 |    .xAxisPadding(500)
264 |    // define x scale
265 |    .x(d3.time.scale().domain([new Date(1985, 0, 1), new Date(2012, 11, 31)]))
266 |    // (optional) set filter brush rounding
267 |    .round(d3.time.month.round)
268 |    // define x axis units
269 |    .xUnits(d3.time.months)
270 |    // (optional) render horizontal grid lines, :default=false
271 |    .renderHorizontalGridLines(true)
272 |    // (optional) render vertical grid lines, :default=false
273 |    .renderVerticalGridLines(true)
274 |    // compose sub charts, currently composite chart only supports line chart & bar chart
275 |    .compose([
276 |        /* Pass the parent chart instance to sub-chart function instead of css selector.
277 |         * Sub-charts can have it's own group and dimension however usually it should
278 |         * share parent chart's dimension. If sub-chart's dimension or group is not
279 |         * explicitly defined here then it will simply inherent from it's parent. */
280 |        dc.barChart(volumeMoveChart).group(volumeByMonthGroup),
281 |        // you can even include stacked bar chart or line chart in a composite chart
282 |        dc.lineChart(volumeMoveChart).group(indexAvgByMonthGroup).valueAccessor(function(d){return d.value.avg;}).renderArea(true).stack(monthlyMoveGroup, function(d){return d.value;})
283 |    ])
284 |    // (optional) whether this chart should generate user interactive brush to allow range
285 |    // selection, :default=true.
286 |    .brushOn(true);
287 | 
288 | 
289 |  /* Create a data table widget and use the given css selector as anchor. You can also specify
290 |   * an optional chart group for this chart to be scoped within. When a chart belongs
291 |   * to a specific group then any interaction with such chart will only trigger redraw
292 |   * on other charts within the same chart group. */
293 |  dc.dataTable("#data-table")
294 |    // set dimension
295 |    .dimension(dateDimension)
296 |    // data table does not use crossfilter group but rather a closure
297 |    // as a grouping function
298 |    .group(function(d) {
299 |        return d.dd.getFullYear() + "/" + (d.dd.getMonth() + 1);
300 |        })
301 |  // (optional) max number of records to be shown, :default = 25
302 |  .size(10)
303 |    // dynamic columns creation using an array of closures
304 |    .columns([
305 |        function(d) { return d.date; },
306 |        function(d) { return d.open; },
307 |        function(d) { return d.close; },
308 |        function(d) { return Math.floor((d.close - d.open)/d.open*100) + "%"; },
309 |        function(d) { return d.volume; }
310 |    ])
311 |    // (optional) sort using the given field, :default = function(d){return d;}
312 |    .sortBy(function(d){ return d.dd; })
313 |    // (optional) sort order, :default ascending
314 |    .order(d3.ascending);
315 |  }
316 | 
317 |   // Boot our script as soon as ready.
318 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
319 |   CRM.civisualizeQueue.push(bootViz);
320 | })();
321 | </script>
322 | {/literal}
323 | 
324 | 


--------------------------------------------------------------------------------
/templates/dataviz/Demo.tpl:
--------------------------------------------------------------------------------
1 | <script>
2 | var total = {crmSQL sql="SELECT count(*) FROM civicrm_contact"};
3 | var anotherdata = {crmSQL file="another"};
4 | 
5 | d3.doyourmagic
6 | 
7 | </script>
8 | 


--------------------------------------------------------------------------------
/templates/dataviz/Donortrends.tpl:
--------------------------------------------------------------------------------
  1 | {crmTitle string="Donor Trends"}
  2 | 
  3 | {literal}
  4 |     <style>
  5 |         #donorBar{
  6 |             width: 100%;
  7 |         }
  8 |         #genderPie{
  9 |             width:50%;
 10 |         }
 11 |     </style>
 12 | {/literal}
 13 | 
 14 | <div id="donortrends">
 15 |     <div id="donorsCount" style="font-size:14px; margin-bottom:5px;"><span id="contactNumber"></span> selected from a total of <span id="contactTotal" style="font-weight:800;"></span>.</div>
 16 |     <div id="donorBar">
 17 |         <strong>Donor Trends</strong>
 18 |         <a class="reset civisualize-reset" href data-chart-name="donortrendsDonorBar" >reset</a>
 19 |         <div class="clearfix"></div>
 20 |     </div>
 21 |     <div id="genderPie">
 22 |         <strong>Gender</strong>
 23 |         <a class="reset civisualize-reset" href data-chart-name="donortrendsGenderPie" >reset</a>
 24 |         <div class="clearfix"></div>
 25 |     </div>
 26 |     <div id="ageRow">
 27 |         <strong>Age</strong>
 28 |         <a class="reset civisualize-reset" href data-chart-name="donortrendsAgeRow" >reset</a>
 29 |         <div class="clearfix"></div>
 30 |     </div>
 31 |     <div class="clear"></div>
 32 |     <table id="dc-data-table">
 33 |         <thead>
 34 |             <tr class="header">
 35 |                 <th>Participant Name</th>
 36 |                 <th>Gender</th>
 37 |                 <th>Age</th>
 38 |                 <th>Total Amount</th>
 39 |             </tr>
 40 |         </thead>
 41 |     </table>
 42 | </div>
 43 | <div class="clear"></div>
 44 | 
 45 | 
 46 | <script>
 47 | {literal}
 48 | 'use strict';
 49 | (function() { function bootViz() {
 50 |     // Use our versions of the libraries.
 51 |     var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 52 | 
 53 |     {/literal}
 54 |     var data        = {crmSQL file="donors"};
 55 |     {literal}
 56 | 
 57 |     var dateFormat  = d3.timeParse("%Y-%m-%d");
 58 |     var currentDate = new Date();
 59 | 
 60 |         if(!data.is_error){
 61 | 
 62 |             var contactNumber, contactTotal, donorBar, genderPie, ageRow, dataTable;
 63 | 
 64 |             cj(function($){
 65 | 
 66 |                 var genderLabel = {1:"Male",2:"Female"};
 67 | 
 68 |                 var contactList = {};
 69 |                 contactTotal    = 0;
 70 | 
 71 |                 data.values.forEach(function(d){
 72 |                     if(!contactList[d.contact_id]){
 73 |                         contactTotal+=1;
 74 |                         contactList[d.contact_id]=1;
 75 |                     }
 76 |                     if(!d.gender_id){
 77 |                         d.gender_id = "Unspecified";
 78 |                     }
 79 |                     else{
 80 |                         d.gender_id = genderLabel[d.gender_id];
 81 |                     }
 82 |                     d.birth_date = dateFormat(d.birth_date);
 83 |                     d.age=d3.timeYears(d.birth_date, currentDate).length-1;
 84 |                 });
 85 | 
 86 |                 cj("#contactTotal").text(contactTotal);
 87 | 
 88 |                 function print_filter(filter){var f=eval(filter);if(typeof(f.length)!="undefined"){}else{}if(typeof(f.top)!="undefined"){f=f.top(Infinity);}else{}if(typeof(f.dimension)!="undefined"){f=f.dimension(function(d){return "";}).top(Infinity);}else{}console.log(filter+"("+f.length+")="+JSON.stringify(f).replace("[", "[\n\t").replace(/}\,/g, "},\n\t").replace("]", "\n]"));}
 89 | 
 90 |                 /* Functions */
 91 | 
 92 |                 function Add(a,d){
 93 |                     var f=1, ug=0, dg=0, mtd=0; 
 94 |                     data.values.forEach(function(m){
 95 |                         if(m.year<d.year){
 96 |                             if(m.contact_id==d.contact_id){
 97 |                                 if(m.year===d.year-1){
 98 |                                     f=0;
 99 |                                     if(m.total_amount==d.total_amount){
100 |                                         mtd=1;
101 |                                     }
102 |                                     else if(m.total_amount>d.total_amount){
103 |                                         dg=1;
104 |                                     }
105 |                                     else if((m.total_amount<d.total_amount)){
106 |                                         ug=1;
107 |                                     }
108 |                                 }
109 |                             }
110 |                         }
111 |                     });
112 |                     a.fresh+=f;
113 |                     a.upgraded+=ug;
114 |                     a.downgraded+=dg;
115 |                     a.maintained+=mtd;
116 |                     return a;
117 |                 }
118 | 
119 |                 function Remove(a, d) {
120 |                     var f=1, ug=0, dg=0, mtd=0; 
121 |                     data.values.forEach(function(m){
122 |                         if(m.year!=d.year){
123 |                             if(m.contact_id==d.contact_id){
124 |                                 if(m.year<d.year){
125 |                                     f=0;
126 |                                 }
127 |                                 if(m.year===d.year-1){
128 |                                     if(m.total_amount==d.total_amount){
129 |                                         mtd=1;
130 |                                     }
131 |                                     else if(m.total_amount>d.total_amount){
132 |                                         dg=1;
133 |                                     }
134 |                                     else if(m.total_amount<d.total_amount){
135 |                                         ug=1;
136 |                                     }
137 |                                 }
138 |                             }
139 |                         }
140 |                     });
141 |                     a.fresh-=f;
142 |                     a.upgraded-=ug;
143 |                     a.downgraded-=dg;
144 |                     a.maintained-=mtd;
145 |                     return a;
146 |                 }
147 | 
148 |                 function Initial() {
149 |                     return { fresh:0, upgraded:0, downgraded:0, maintained:0, lapsed:0};
150 |                 }
151 | 
152 |                 function countAdd(a,d){
153 |                     if(a.contacts[d.contact_id]==0)
154 |                     {
155 |                         a.contacts[d.contact_id]++;
156 |                         a.count++;
157 |                     }
158 |                     else{
159 |                         a.contacts[d.contact_id]++;
160 |                     }
161 |                     return a;
162 |                 }
163 | 
164 |                 function removeCount(a,d){
165 |                     if(a.contacts[d.contact_id]>0){
166 |                         a.contacts[d.contact_id]--;
167 |                         if(a.contacts[d.contact_id]==0){
168 |                             a.count--;
169 |                         }
170 |                     }
171 |                     return a;
172 |                 }
173 | 
174 |                 function initialCount(){
175 |                     var c={};
176 |                     data.values.forEach(function(d){
177 |                         c[d.contact_id]=0;
178 |                     });
179 |                     return {count:0, contacts:c};
180 |                 }
181 | 
182 |                 var ndx         = crossfilter(data.values),
183 |                 all             = ndx.groupAll();
184 |                 var minYear     = d3.min(data.values, function(d){return d.year;});
185 |                 var maxYear     = d3.max(data.values, function(d){return d.year;});
186 | 
187 |                 donorBar        = dc.barChart("#donorBar");
188 |                 genderPie       = dc.pieChart("#genderPie").radius(80);
189 |                 ageRow          = dc.rowChart("#ageRow");
190 |                 dataTable       = dc.dataTable("#dc-data-table");
191 |                 contactNumber   = dc.numberDisplay("#contactNumber");
192 | 
193 |                 var byYear      = ndx.dimension(function(d) {return d.year;});
194 |                 var byYearGroup = byYear.group().reduce(Add, Remove, Initial);
195 |                 var group = {
196 |                     all:function () {
197 |                             var g=[];
198 |                             for(var i=minYear-1; i<=maxYear; i++){
199 |                                 var k={fresh:0, upgraded:0, downgraded:0, maintained:0, lapsed:0};
200 |                                 var flag=0;
201 |                                 var total=0;
202 |                                 byYearGroup.all().forEach(function(d,m) {
203 |                                     if(d.key==i-1){
204 |                                         total=d.value.fresh+d.value.upgraded+d.value.downgraded+d.value.maintained;
205 |                                     }
206 |                                     if(d.key==i){
207 |                                         d.value.lapsed=total-(d.value.upgraded+d.value.downgraded+d.value.maintained);
208 |                                         g.push({key:d.key,value:d.value});
209 |                                         flag=1;
210 |                                     }
211 |                                 });
212 |                                 if(flag==0){
213 |                                     k.lapsed=total;
214 |                                     g.push({key:i, value:k});
215 |                                 }
216 |                             }
217 |                             return g;
218 |                         }
219 |                 };
220 | 
221 |                 var gender      = ndx.dimension(function(d){return d.gender_id});
222 |                 var genderGroup = gender.group().reduce(countAdd,removeCount, initialCount);
223 | 
224 |                 var age         = ndx.dimension(function(d){
225 |                     if(d.birth_date=="")
226 |                         return "Unspecified";
227 |                     var a=d3.timeYears(d.birth_date, currentDate).length-1;
228 |                     if(a<10)
229 |                         return "1-10";
230 |                     if(a<20)
231 |                         return "10-20";
232 |                     if(a<30)
233 |                         return "20-30";
234 |                     if(a<40)
235 |                         return "30-40";
236 |                     if(a<50)
237 |                         return "40-50";
238 |                     if(a<60)
239 |                         return "50-60";
240 |                     if(a<70)
241 |                         return "60-70";
242 |                     if(a<80)
243 |                         return "70-80";
244 |                     if(a<90)
245 |                         return "80-90";
246 |                     else
247 |                         return "More than 90";
248 |                 });
249 |                 var ageGroup    = age.group().reduce(countAdd,removeCount, initialCount);
250 | 
251 |                 var list        = ndx.dimension(function(d){return d.contact_id});
252 | 
253 |                 var grouped=ndx.groupAll().reduce(countAdd,removeCount,initialCount);
254 | 
255 |                 contactNumber
256 |                     .group(grouped)
257 |                     .valueAccessor(function(d){
258 |                         return d.count;
259 |                     })
260 |                     .html({"some":"<span style='font-weight:800;'>%number</span> Donors","one":"<span style='font-weight:800;'>%number</span> Donor","none":"No Records"});
261 | 
262 |                 donorBar
263 |                     .height(200)
264 |                     .group(group,"New")
265 |                     .dimension(byYear)
266 |                     .valueAccessor(function(d) {
267 |                         return d.value.fresh;
268 |                     })
269 |                     .centerBar(true)
270 |                     .gap(10)
271 |                     .hidableStacks(true)
272 |                     .elasticY(true)
273 |                     .round(function(n) {
274 |                         return Math.floor(n)+0.5}
275 |                         )
276 |                     .x(d3.scaleLinear().domain([minYear-1, maxYear+1]))
277 |                     .legend(dc.legend().x(50).y(10).itemHeight(13).gap(5))
278 |                     .stack(group,"Upgraded", function(d){return d.value.upgraded;})
279 |                     .stack(group,"Downgraded", function(d){return d.value.downgraded;})
280 |                     .stack(group,"Maintained", function(d){return d.value.maintained;})
281 |                     .stack(group,"Lapsed", function(d){return d.value.lapsed;});
282 | 
283 |                 genderPie
284 |                     .dimension(gender)
285 |                     .height(250)
286 |                     .group(genderGroup)
287 |                     .valueAccessor(function(d){
288 |                         return d.value.count;
289 |                     });
290 | 
291 |                 ageRow
292 |                     .height(250)
293 |                     .dimension(age)
294 |                     .group(ageGroup)
295 |                     .valueAccessor(function(d){
296 |                         return d.value.count;
297 |                     });
298 | 
299 |                 dataTable
300 |                     .dimension(list)
301 |                     .group(function(d) {return d.year;})
302 |                 // dynamic columns creation using an array of closures
303 | 
304 |                 .columns([
305 |                     function(d) {return d.display_name; },
306 |                     function(d) {return d.gender_id;},
307 |                     function(d) {return d.age;},
308 |                     function(d) {return d.total_amount;}
309 |                     ])
310 |                     .sortBy(function (d) {
311 |                         return d.sd;
312 |                     });
313 | 
314 |                 dc.renderAll();
315 | 
316 |                 CRM.civisualize.charts['donortrendsDonorBar'] = donorBar;
317 |                 CRM.civisualize.charts['donortrendsGenderPie'] = genderPie;
318 |                 CRM.civisualize.charts['donortrendsAgeRow'] = ageRow;
319 |                 CRM.civisualize.bindResetLinks();
320 |             });
321 |         }
322 |         else {
323 |             cj('#donortrends').html('<div style="color:red; font-size:18px;">Civisualize Error. Please contact Admin.'+data.error+'</div>');
324 |         }
325 |   }
326 | 
327 |   // Boot our script as soon as ready.
328 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
329 |   CRM.civisualizeQueue.push(bootViz);
330 | })();
331 |     {/literal}
332 | </script>
333 | 


--------------------------------------------------------------------------------
/templates/dataviz/Event.tpl:
--------------------------------------------------------------------------------
  1 | {if !$id}
  2 |     <script type="text/javascript">
  3 |         location.replace('events');
  4 |     </script>
  5 | {/if}
  6 | 
  7 | {literal}
  8 |     <style type="text/css">
  9 |         .eventoverview{
 10 |             background-color: #ddd;
 11 |             padding: 10px;
 12 |             border-radius: 5px;
 13 |             margin-top: 10px;
 14 |             margin-bottom: 20px;
 15 |             overflow: auto;
 16 |             position: relative;
 17 |         }
 18 | 
 19 |         .eventDetails{
 20 |             width: 400px;z
 21 |             float: left;
 22 |         }
 23 | 
 24 |         .detailfield{
 25 |             font-size:14px;
 26 |             color:steelblue;
 27 |             display:inline;
 28 |             font-weight: 800;
 29 |             padding-right: 5px;
 30 |         }
 31 |         .detailvalue{
 32 |             font-size:14px;
 33 |             display:inline;
 34 |             font-weight: 800;
 35 |         }
 36 |         .detail{
 37 |             clear:both;
 38 |         }
 39 |         #noofparticipants{
 40 |             float: left;
 41 |             left:400px;
 42 |             position: absolute;
 43 |             bottom: 0;
 44 |         }
 45 |         #participants{
 46 |             width:100%;
 47 |         }
 48 |     </style>
 49 | {/literal}
 50 | 
 51 | <div id="eventoverview">
 52 |     <div class="eventoverview">
 53 |         <div class="eventDetails"></div>
 54 |         <div id="noofparticipants"></div>
 55 |     </div>
 56 | 
 57 |     <div class="clear"></div>
 58 |     <div id="participantsCount" style="font-size:14px; margin-bottom:10px;"></div>
 59 |     <div id="participants">
 60 |         <strong>Participants</strong>
 61 |         <a class="reset civisualize-reset" href data-chart-name="eventParticipantsLine" >reset</a>
 62 |         <div class="clearfix"></div>
 63 |     </div>
 64 |     <div id="gender">
 65 |         <strong>Gender</strong>
 66 |         <a class="reset civisualize-reset" href data-chart-name="eventGenderPie" >reset</a>
 67 |         <div class="clearfix"></div>
 68 |     </div>
 69 |     <div id="status">
 70 |         <strong>Participant Status</strong>
 71 |         <a class="reset civisualize-reset" href data-chart-name="eventStatusPie" >reset</a>
 72 |         <div class="clearfix"></div>
 73 |     </div>
 74 |     <div id="feeRow">
 75 |         <strong>Fee Paid</strong>
 76 |         <a class="reset civisualize-reset" href data-chart-name="eventFeeRow" >reset</a>
 77 |         <div class="clearfix"></div>
 78 |     </div>
 79 |     <table id="participantTable">
 80 |         <thead>
 81 |             <tr class="header">
 82 |                 <th>Name</th>
 83 |                 <th>Gender</th>
 84 |                 <th>Fee Paid</th>
 85 |                 <th>Status</th>
 86 |             </tr>
 87 |         </thead>
 88 |     </table>
 89 | </div>
 90 | 
 91 | <script>
 92 | {literal}
 93 | 'use strict';
 94 | (function() { function bootViz() {
 95 |   // Use our versions of the libraries.
 96 |   var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 97 | 
 98 |   {/literal}
 99 |   var eventDetails        = {crmSQL json="eventdetails" eventid=$id set="event"};
100 | 
101 |   var participantDetails  = {crmSQL json="eventparticipants" eventid=$id};
102 | 
103 |   {crmTitle array=$event field="title"}
104 | 
105 | 
106 | 
107 |   var i = {crmAPI entity="OptionValue" option_group_id="14"};
108 |   var s = {crmAPI entity='ParticipantStatusType' option_sort="is_counted desc"};
109 | 
110 |   var gender = {crmAPI entity="contact" action="getoptions" field="gender_id"};
111 | 
112 |   {literal}
113 | 
114 |   if((!eventDetails.is_error)&&(!participantDetails.is_error)){
115 | 
116 |     var genderLabel = {};
117 | 
118 |     gender.values.forEach(function(d){
119 |         genderLabel[d.key]=d.value;
120 |         });
121 | 
122 |     eventDetails = eventDetails.values[0];
123 | 
124 |     {/literal}
125 |     eventDetails['url'] = "{crmURL p='civicrm/event/info' q='id='}{$id}";
126 |     {literal}
127 | 
128 |     var statusLabel = {};
129 |     var typeLabel   = {};
130 | 
131 |     s.values.forEach (function(d) {
132 |         statusLabel[d.id] = d.label;
133 |         });
134 |     s=null;
135 |     i.values.forEach (function(d) {
136 |         typeLabel[d.value] = d.label;
137 |         });
138 |     i=null;
139 | 
140 |     cj('.eventDetails').html(
141 |         "<div class='detail'><div class='detailfield'>Name:</div><div class='detailvalue'><a href='"+eventDetails.url+"'>"+eventDetails.title+"</a></div></div>"
142 |         +"<div class='detail'><div class='detailfield'>Event Type:</div><div class='detailvalue'>"+typeLabel[eventDetails.event_type_id]+"</div></div>"
143 |         +"<div class='detail'><div class='detailfield'>Start Date:</div><div class='detailvalue'>"+eventDetails.start_date+"</div></div>"
144 |         +"<div class='detail'><div class='detailfield'>End Date:</div><div class='detailvalue'>"+eventDetails.end_date+"</div></div>"
145 |         +"<div class='detail'><div class='detailfield'>Registration Start Date:</div><div class='detailvalue'>"+eventDetails.registration_start_date+"</div></div>"
146 |         +"<div class='detail'><div class='detailfield'>Registration End Date:</div><div class='detailvalue'>"+eventDetails.registration_end_date+"</div></div>"
147 |         );
148 | 
149 |     var numberFormat        = d3.format("d");
150 |     var birthdateFormat     = d3.timeParse("%Y-%m-%d");
151 |     var registerdateFormat  = d3.timeParse("%Y-%m-%d %H:%M:%S");
152 |     var currentDate         = new Date();
153 | 
154 | 
155 |     participantDetails.values.forEach(function(d){
156 |         d.bd = birthdateFormat(d.birth_date);
157 |         d.rd = registerdateFormat(d.register_date);s
158 |         d.status = statusLabel[d.status_id];
159 |         if(d.gender_id!==""){
160 |         d.gender_id=genderLabel[d.gender_id];
161 |         }
162 |         else{
163 |         d.gender_id="Not Specified";
164 |         }
165 |         if(d.fee_amount==""){
166 |         d.fee_amount="0";
167 |         }
168 |         });
169 | 
170 |     var participantsLine, genderPie, feeRow, statusPie, dataTable, participantsNumber, participantsCount;
171 | 
172 |     cj(function($) {
173 | 
174 |         function print_filter(filter){var f=eval(filter);if(typeof(f.length)!="undefined"){}else{}if(typeof(f.top)!="undefined"){f=f.top(Infinity);}else{}if(typeof(f.dimension)!="undefined"){f=f.dimension(function(d){return "";}).top(Infinity);}else{}console.log(filter+"("+f.length+")="+JSON.stringify(f).replace("[", "[\n\t").replace(/}\,/g, "},\n\t").replace("]", "\n]"));}
175 | 
176 |         var ndx = crossfilter(participantDetails.values), all = ndx.groupAll();
177 |         var grouped=ndx.groupAll().reduce(function(p,v){ ++p.count; return p; }, function(p,v){p.count-=1;return p;}, function(){return {count:0};});
178 | 
179 |         var min = d3.timeDay.offset(d3.min(participantDetails.values, function(d) { return d.rd;} ),-1);
180 |         var max = d3.timeDay.offset(d3.max(participantDetails.values, function(d) { return d.rd;} ), 1);
181 | 
182 |         participantsLine    = dc.lineChart("#participants");
183 |         genderPie           = dc.pieChart("#gender").radius(100);
184 |         statusPie           = dc.pieChart("#status").radius(100);
185 |         feeRow              = dc.rowChart("#feeRow");
186 |         dataTable           = dc.dataTable("#participantTable");
187 |         participantsNumber  = dc.numberDisplay("#noofparticipants");
188 |         participantsCount   = dc.dataCount("#participantsCount");
189 | 
190 |         var RByDay      = ndx.dimension(function(d) { return d3.timeDay(d.rd);});
191 |         var RByDayGroup = RByDay.group().reduceCount();
192 |         var group       = {
193 | all:function () {
194 |       var cumulate = 0;
195 |       var g = [];
196 |       RByDayGroup.all().forEach(function(d,i) {
197 |           cumulate += d.value;
198 |           g.push({key:d.key,value:cumulate})
199 |           });
200 |       return g;
201 |     }
202 |         };
203 | 
204 |         var gender      = ndx.dimension(function(d){return d.gender_id});
205 |         var genderGroup = gender.group().reduceCount();
206 | 
207 |         var status      = ndx.dimension(function(d){return d.status});
208 |         var statusGroup = status.group().reduceCount();
209 | 
210 |         var Fee         = ndx.dimension(function(d){return d.fee_amount});
211 |         var FeeGroup    = Fee.group().reduceCount();
212 | 
213 |         var date        = ndx.dimension(function(d){return d.rd;});
214 | 
215 |         participantsCount
216 |           .dimension(ndx)
217 |           .group(all)
218 |           .html({"all":"All Records Selected","some":"<strong>%filter-count</strong> selected from <strong>%total-count</strong>"});
219 | 
220 |         participantsLine
221 |           .margins({top: 10, right: 50, bottom: 20, left:40})
222 |           .height(200)
223 |           .dimension(RByDay)
224 |           .group(group)
225 |           .brushOn(true)
226 |           .x(d3.scaleTime().domain([min, max]))
227 |           .round(d3.timeDay.round)
228 |           .elasticY(true)
229 |           .xUnits(d3.timeDays);
230 | 
231 |         genderPie
232 |           .width(220)
233 |           .height(220)
234 |           .dimension(gender)
235 |           .group(genderGroup);
236 | 
237 | 
238 |         statusPie
239 |           .width(220)
240 |           .height(220)
241 |           .dimension(status)
242 |           .group(statusGroup);
243 | 
244 |         feeRow
245 |           .height(220)
246 |           .width(300)
247 |           .elasticX(true)
248 |           .dimension(Fee)
249 |           .group(FeeGroup);
250 | 
251 |         dataTable
252 |           .dimension(date)
253 |           .group(function(d){ return ""; })
254 |           .size(9999)
255 |           .columns(
256 |               [
257 |               function (d) {
258 |               return d.display_name;
259 |               },
260 |               function (d) {
261 |               return d.gender_id;
262 |               },
263 |               function (d) {
264 |               return d.fee_amount;
265 |               },
266 |               function (d) {
267 |               return statusLabel[d.status_id];
268 |               }
269 |               ]
270 |               );
271 | 
272 | 
273 |         participantsNumber
274 |           .group(grouped)
275 |           .formatNumber(numberFormat)
276 |           .html({some:'<span style="font-size:90px; line-height:102px; color:steelblue;">%number</span> Participants', one:'<span style="font-size:90px;  line-height:102px; color: steelblue;">%number</span> Participant'})
277 |           .valueAccessor(function(d) {
278 |               return d.count;
279 |               });
280 | 
281 |         dc.renderAll();
282 | 
283 |         CRM.civisualize.charts['eventParticipantsLine'] = participantsLine;
284 |         CRM.civisualize.charts['eventGenderPie'] = genderPie;
285 |         CRM.civisualize.charts['eventStatusPie'] = statusPie;
286 |         CRM.civisualize.charts['eventFeeRow'] = feeRow;
287 |         CRM.civisualize.bindResetLinks();
288 | 
289 | 
290 | 
291 |   });
292 | }
293 | else{
294 |   cj('#eventoverview').html('<div style="color:red; font-size:18px;">Civisualize Error. Please contact Admin.'+eventDetails.error+participantDetails.error+'</div>');
295 | }
296 |   }
297 | 
298 |   // Boot our script as soon as ready.
299 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
300 |   CRM.civisualizeQueue.push(bootViz);
301 | })();
302 | {/literal}
303 | </script>
304 | <div class="clear"></div>
305 | 


--------------------------------------------------------------------------------
/templates/dataviz/Events.tpl:
--------------------------------------------------------------------------------
  1 | {crmTitle string="Events Overview"}
  2 | 
  3 | <div class="eventsoverview">
  4 |     <div style="font-size:20px; float:left; width:100%; text-align:center; height:90px;">
  5 |         <span id="pastevents"></span>,
  6 |         <span id="currentevents"></span> and
  7 |         <span id="upcomingevents"></span>
  8 |         with a total of <span id="nparticipants" style="color:steelblue; font-size:50px; line-height:80px"></span> Participants.
  9 |     </div>
 10 | 
 11 |     <div id="events" style="width:100%;">
 12 |         <strong>Events</strong>
 13 |         <a class="reset" href="javascript:eventsBar.filterAll();dc.redrawAll();" style="display: none;">reset</a>
 14 |         <div class="clearfix"></div>
 15 |     </div>
 16 | 
 17 |     <div id="participants" style="width:100%;">
 18 |         <strong>Participants</strong>
 19 |         <a class="reset" href="javascript:participantsLine.filterAll();dc.redrawAll();" style="display: none;">reset</a>
 20 |         <div class="clearfix"></div>
 21 |     </div>
 22 | 
 23 |     <div class="clear">
 24 | 
 25 |     <div id="type">
 26 |         <strong>Type</strong>
 27 |         <a class="reset" href="javascript:typePie.filterAll();dc.redrawAll();" style="display: none;">reset</a>
 28 |         <div class="clearfix"></div>
 29 |     </div>
 30 | 
 31 |     <div id="duration">
 32 |         <strong>Day of Week</strong>
 33 |         <a class="reset" href="javascript:startdayRow.filterAll();dc.redrawAll();" style="display: none;">reset</a>
 34 |         <div class="clearfix"></div>
 35 |     </div>
 36 | 
 37 |     <div id="ispaid">
 38 |         <strong>Paid event</strong>
 39 |         <a class="reset" href="javascript:ispaidPie.filterAll();dc.redrawAll();" style="display: none;">reset</a>
 40 |         <div class="clearfix"></div>
 41 |     </div>
 42 | 
 43 |     <div class="clear"></div>
 44 |     <table id="dc-data-table">
 45 |         <thead>
 46 |             <tr class="header">
 47 |                 <th>Event Name</th>
 48 |                 <th>Start Date</th>
 49 |                 <th>End Date</th>
 50 |                 <th>Participants</th>
 51 |             </tr>
 52 |         </thead>
 53 |     </table>
 54 |     <div class="clear"></div>
 55 | </div>
 56 | 
 57 | <script>
 58 |     'use strict';
 59 | 
 60 | {literal}
 61 | (function() { function bootViz() {
 62 |     // Use our versions of the libraries.
 63 |     var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 64 | {/literal}
 65 | 
 66 |     var data = {crmSQL file="events"};
 67 |     var i = {crmAPI entity="OptionValue" option_group_id="event_type"};
 68 |     var s = {crmAPI entity='ParticipantStatusType' option_sort="is_counted desc"};
 69 |     var URL = "{crmURL p='civicrm/dataviz/event/xx'}";
 70 | 
 71 |     {literal}
 72 | 
 73 |         if(!data.is_error){
 74 | 
 75 |             var statusLabel = {};
 76 |             s.values.forEach (function(d) {
 77 |                 statusLabel[d.id] = d.label;
 78 |             });
 79 |             s=null;
 80 | 
 81 |             var typeLabel = {};
 82 |             i.values.forEach (function(d) {
 83 |                 typeLabel[d.value] = d.label;
 84 |             });
 85 |             i=null;
 86 | 
 87 |             var numberFormat = d3.format(".2f");
 88 |             var datetimeFormat = d3.timeParse("%Y-%m-%d %H:%M:%S");
 89 |             var dateFormat = d3.timeParse("%Y-%m-%d");
 90 |             var currentDate = new Date();
 91 | 
 92 |             var Events={};
 93 | 
 94 |             data.values.forEach(function(d){
 95 |                 d.rd = dateFormat(d.rd);
 96 |                 d.ed = datetimeFormat(d.ed);
 97 |                 d.sd = datetimeFormat(d.sd);
 98 |                 if(d.im==1)
 99 |                     d.im='Paid';
100 |                 else
101 |                     d.im='Free';
102 |                 if(d.tid!="")
103 |                     d.tid = typeLabel[d.tid];
104 |                 else
105 |                     d.tid = "Unspecified";
106 |                 Events[d.id]={'title':d.title,'sd':d.sd,'ed':d.ed};
107 |             });
108 | 
109 |             console.log(data.values);
110 | 
111 |             var eventsBar, upcomingNumber, pastNumber, participantsLine, typePie, startdayRow, eventStatusPie, ispaidPie, dataTable;
112 | 
113 |             cj(function($) {
114 | 
115 |                 function print_filter(filter){var f=eval(filter);if(typeof(f.length)!="undefined"){}else{}if(typeof(f.top)!="undefined"){f=f.top(Infinity);}else{}if(typeof(f.dimension)!="undefined"){f=f.dimension(function(d){return "";}).top(Infinity);}else{}console.log(filter+"("+f.length+")="+JSON.stringify(f).replace("[", "[\n\t").replace(/}\,/g, "},\n\t").replace("]", "\n]"));}
116 | 
117 |                 function eventReduceAdd(a,d){
118 |                     if(!a.events[d.id]){
119 |                         a.events[d.id]=d.count;
120 |                         a.eventcount++;
121 |                     }
122 |                     else{
123 |                         a.events[d.id]+=d.count;
124 |                     }
125 |                     a.participantcount+=d.count;
126 |                     return a;
127 |                 }
128 | 
129 |                 function eventReduceRemove(a, d) {
130 |                     a.events[d.id]-=d.count;
131 |                     if(a.events[d.id]==0){
132 |                         a.eventcount--;
133 |                     }
134 |                     a.participantcount-=d.count;
135 |                     return a;
136 |                 }
137 | 
138 |                 function eventReduceInitial() {
139 |                     var eventlist = {}
140 |                     Object.keys(Events).forEach(function(a){
141 |                         eventlist[a]=0;
142 |                     });
143 |                     return {events:eventlist, eventcount:0, participantcount:0};
144 |                 }
145 | 
146 |                 var min = d3.timeMonth.offset(d3.min(data.values, function(d) { return d.rd;} ),-1);
147 |                 var max = d3.timeMonth.offset(d3.max(data.values, function(d) { return d.ed;} ), 1);
148 | 
149 |                 var firstEvent = d3.min(data.values, function(d) {return d.id});
150 | 
151 | 
152 |                 var ndx                 = crossfilter(data.values),
153 |                 all = ndx.groupAll();
154 | 
155 |                 eventsBar = dc.barChart("#events");
156 |                 participantsLine = dc.lineChart("#participants");
157 |                 typePie = dc.pieChart("#type").innerRadius(0).radius(90);
158 |                 startdayRow = dc.rowChart("#duration");
159 |                 dataTable = dc.dataTable("#dc-data-table");
160 |                 ispaidPie = dc.pieChart("#ispaid").innerRadius(20).radius(70);
161 | 
162 |                 var startMonth = ndx.dimension(function(d) { return d3.timeMonth(d.sd);});
163 |                 var startMonthGroup = startMonth.group().reduce(eventReduceAdd,eventReduceRemove,eventReduceInitial);
164 | 
165 |                 var registrationMonth = ndx.dimension(function(d) { return d3.timeMonth(d.rd);});
166 |                 var registrationMonthGroup = registrationMonth.group().reduce(eventReduceAdd,eventReduceRemove,eventReduceInitial);
167 | 
168 | 
169 | 
170 |                 var type        = ndx.dimension(function(d) {return d.tid; });
171 |                 var typeGroup   = type.group().reduce(eventReduceAdd,eventReduceRemove,eventReduceInitial);
172 | 
173 |                 var startDay = ndx.dimension(function (d) {
174 |                     var day = d.sd.getDay();
175 |                         switch (day) {
176 |                             case 0:
177 |                             return "Sunday";
178 |                             case 1:
179 |                             return "Monday";
180 |                             case 2:
181 |                             return "Tuesday";
182 |                             case 3:
183 |                             return "Wednesday";
184 |                             case 4:
185 |                             return "Thursday";
186 |                             case 5:
187 |                             return "Friday";
188 |                             case 6:
189 |                             return "Saturday";
190 |                         }
191 |                 });
192 |                 var startDayGroup = startDay.group().reduce(eventReduceAdd,eventReduceRemove,eventReduceInitial);
193 | 
194 |                 var ispaid = ndx.dimension(function(d){ return d.im; });
195 |                 var ispaidGroup = ispaid.group().reduce(eventReduceAdd,eventReduceRemove,eventReduceInitial);
196 | 
197 |                 var list = ndx.dimension(function(d){return d.id});
198 |                 var listGroup = list.group().reduceSum(function(d){return d.count});
199 | 
200 |                 var pseudoList = {
201 |                     top: function (x) {
202 |                         return listGroup.top(x)
203 |                             .map(function (d) { return {"id":d.key, "count":d.value, "title":Events[d.key].title, "sd":Events[d.key].sd, "ed":Events[d.key].ed}; });
204 |                     }
205 |                 };
206 | 
207 |                 var eventStatus = ndx.dimension(function(d)
208 |                 {
209 |                     if(d.sd>currentDate)
210 |                         return "Upcoming Event";
211 |                     if(d.ed>currentDate)
212 |                         return "Ongoing Event";
213 |                     return "Past Event";
214 |                 });
215 | 
216 |                 var eventStatusGroup = eventStatus.group().reduce(eventReduceAdd,eventReduceRemove,eventReduceInitial);
217 | 
218 |                 function statusevent(status){
219 |                     return {
220 |                         value:function(){
221 |                             var v = {'value':0};
222 |                             eventStatusGroup.all().forEach(function(d,i){
223 |                                 if (d.key == status)
224 |                                     {v.value=d.value.eventcount;}
225 |                             });
226 |                             return v;
227 |                         }
228 |                     };
229 |                 }
230 | 
231 |                 var grouped=ndx.groupAll().reduce(eventReduceAdd,eventReduceRemove,eventReduceInitial);
232 | 
233 |                 var eventsN = dc.numberDisplay("#nevents")
234 |                     .group(grouped)
235 |                     .formatNumber(d3.format("d"))
236 |                     .valueAccessor(function(d) {return d.eventcount;});
237 | 
238 |                 var participantsN = dc.numberDisplay("#nparticipants")
239 |                     .group(grouped)
240 |                     .valueAccessor(function(d) {return d.participantcount});
241 | 
242 |                 var pastNumber = dc.numberDisplay('#pastevents')
243 |                     .dimension(eventStatus)
244 |                     .html({some:"<span style='color:steelblue; font-size:50px; line-height:80px'>%number</span> past events",one:"<span style=\"color:steelblue; font-size:50px; line-height:80px\">%number</span> past event", none:"no past events"})
245 |                     .group(statusevent('Past Event'))
246 |                     .formatNumber(d3.format("d"));
247 | 
248 |                 var upcomingNumber = dc.numberDisplay('#upcomingevents')
249 |                     .dimension(eventStatus)
250 |                     .html({some:"<span style=\"color:steelblue; font-size:50px; line-height:80px\">%number</span> upcoming events",one:"<span style=\"color:steelblue; font-size:50px; line-height:80px\">%number</span> upcoming event", none:"no upcoming events"})
251 |                     .group(statusevent('Upcoming Event'))
252 |                     .formatNumber(d3.format("d"));
253 | 
254 |                 var ongoingNumber = dc.numberDisplay('#currentevents')
255 |                     .dimension(eventStatus)
256 |                     .html({some:"<div style=\"color:steelblue; font-size:50px; line-height:80px\">%number</div> ongoing events",one:"<span style=\"color:steelblue; font-size:50px; line-height:80px\">%number</span> ongoing event", none:"no ongoing events"})
257 |                     .group(statusevent('Ongoing Event'))
258 |                     .formatNumber(d3.format("d"));
259 | 
260 | 
261 |                 //Events
262 |                 eventsBar
263 |                     .height(200)
264 |                     .margins({top: 0, right: 50, bottom: 20, left:40})
265 |                     .dimension(startMonth)
266 |                     .group(startMonthGroup)
267 |                     .centerBar(true)
268 |                     .gap(1)
269 |                     .x(d3.scaleTime().domain([min, max]))
270 |                     .round(d3.timeMonth.round)
271 |                     .valueAccessor(function (d) {
272 |                         return d.value.eventcount;
273 |                     })
274 |                     .xUnits(d3.timeMonths);
275 | 
276 |                 participantsLine
277 |                     .margins({top: 0, right: 50, bottom: 20, left:40})
278 |                     .height(200)
279 |                     .dimension(registrationMonth)
280 |                     .valueAccessor(function (d) {
281 |                         return d.value.events[firstEvent];
282 |                     })
283 |                     .brushOn(false)
284 |                     .x(d3.scaleTime().domain([min, max]))
285 |                     .round(d3.timeMonth.round)
286 |                     .elasticY(true)
287 |                     .elasticX(true)
288 |                     .xUnits(d3.timeMonths);
289 | 
290 |                 var flag=1;
291 | 
292 |                 Object.keys(Events).forEach(function(a){
293 |                     if(flag==1){
294 |                         participantsLine
295 |                             .group(registrationMonthGroup);
296 |                             flag=2;
297 |                     }
298 |                     else{
299 |                         if(a!=firstEvent){
300 |                             participantsLine
301 |                                 .stack(registrationMonthGroup,Events[a],function(d){return d.value.events[a];})
302 |                                 .title(Events[a], function(d) {
303 |                                     return Events[a]+" "+d.value.events[a];
304 |                                 });
305 |                         }
306 |                     }
307 |                 });
308 | 
309 |                 typePie
310 |                     .width(200)
311 |                     .height(200)
312 |                     .dimension(type)
313 |                     .group(typeGroup)
314 |                     .valueAccessor(function (d) {
315 |                         return d.value.eventcount;
316 |                     })
317 |                     .legend(dc.legend().x(200).y(10).itemHeight(13).gap(5))
318 |                     .on('renderlet', function(chart){});
319 | 
320 |                 startdayRow
321 |                     .width(300)
322 |                     .height(200)
323 |                     .dimension(startDay)
324 |                     .group(startDayGroup)
325 |                     .valueAccessor(function (d) {
326 |                         return d.value.eventcount;
327 |                     })
328 |                     .xAxis().ticks(1);
329 | 
330 |                 ispaidPie
331 |                     .width(200)
332 |                     .height(200)
333 |                     .dimension(ispaid)
334 |                     .group(ispaidGroup)
335 |                     .valueAccessor(function(d){
336 |                         return d.value.eventcount;
337 |                     })
338 |                     .on('renderlet', function(chart){});
339 | 
340 |                 dataTable
341 |                     .dimension(pseudoList)
342 |                     .group(function(d) {
343 |                         return d.sd.getFullYear();
344 |                     })
345 |                     .size(9999)
346 |                     .order(d3.descending)
347 |                     .columns([
348 |                         function(d) {return "<a href='"+URL.replace('xx',d.id)+"'>"+d.title+"</a>"; },
349 |                         function(d) {return d.sd.getDate()+"/"+(d.sd.getMonth()+1)+"/"+d.sd.getFullYear();},
350 |                         function(d) {return d.ed.getDate()+"/"+(d.ed.getMonth()+1)+"/"+d.ed.getFullYear();},
351 |                         function(d) {return d.count;}
352 |                     ])
353 |                     .sortBy(function (d) {
354 |                         return d.sd;
355 |                     });
356 | 
357 |                 dc.renderAll();
358 |             });
359 |         }
360 |         else{
361 |             cj('.eventsoverview').html('<div style="color:red; font-size:18px;">Civisualize Error. Please contact Admin.'+data.error+'</div>')
362 |         }
363 |   }
364 | 
365 |   // Boot our script as soon as ready.
366 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
367 |   CRM.civisualizeQueue.push(bootViz);
368 | })();
369 | {/literal}
370 | </script>
371 | <div class="clear"></div>
372 | 


--------------------------------------------------------------------------------
/templates/dataviz/Example.tpl:
--------------------------------------------------------------------------------
 1 | {crmTitle title="Here be dragons"}
 2 | This is a demo
 3 | 
 4 |     <div id="type" class="clear">
 5 |       <strong>Musician</strong>
 6 |       <a class="reset civisualize-reset" href data-chart-name="exampleTypePie" >reset</a>
 7 |       <div class="clearfix"></div>
 8 |   </div>
 9 |   <div class="clear"></div>
10 |   <div id="gender" style="width:350px;">
11 |       <strong>Gender</strong>
12 |       <a class="reset civisualize-reset" href data-chart-name="exampleGenderPie" >reset</a>
13 |       <div class="clearfix"></div>
14 |   </div>
15 |   <div class="clear"></div>
16 | 
17 | 
18 | <script>
19 | //var data = {crmSQL sql="SELECT something, somethingelse, count(*) as total from civicrm_table where whatever group by something, somethingelse"};
20 | 
21 | {literal}
22 | (function() { function bootViz() {
23 |   // Use our versions of the libraries.
24 |   var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
25 | 
26 |   var data = {
27 | is_error:0,
28 |          values:[
29 |          {type:"Guitarist",gender:"M",qty:58},
30 |          {type:"Guitarist",gender:"F",qty:19},
31 |          {type:"Violonist",gender:"M",qty:10},
32 |          {type:"Violonist",gender:"F",qty:23},
33 |          {type:"Pianist",gender:"M",qty:30},
34 |          {type:"Pianist",gender:"F",qty:33},
35 |          {type:"Drummer",gender:"M",qty:18},
36 |          {type:"Bassist",gender:"M",qty:17},
37 |          {type:"Bassist",gender:"F",qty:9}
38 |          ]};
39 | 
40 |   var ndx  = crossfilter(data.values)
41 |     , all = ndx.groupAll();
42 | 
43 |   var totalCount = dc.dataCount("#datacount")
44 |     .dimension(ndx)
45 |     .group(all);
46 | 
47 |   var gender = ndx.dimension(function(d){if(d.gender!="") return d.gender; else return 3;});
48 |   var genderGroup = gender.group().reduceSum(function(d){return d.qty;});
49 |   var genderPie   = dc.pieChart('#gender')
50 |     .innerRadius(10).radius(90)
51 |     .width(250)
52 |     .height(200)
53 |     .dimension(gender)
54 |     .colors(d3.scaleOrdinal(d3.schemeCategory10))
55 |     .group(genderGroup);
56 |   /*
57 |      .label(function(d) {
58 |      if (genderPie.hasFilter() && !genderPie.hasFilter(d.key))
59 |      return d.key + "(0%)";
60 |      return d.key+"(" + Math.floor(d.value / all.reduceSum(function(d) {return d.qty;}).value() * 100) + "%)";;
61 |      });
62 |    */
63 | 
64 |   var type = ndx.dimension(function(d) {return d.type;});
65 |   var typeGroup= type.group().reduceSum(function(d){return d.qty;});
66 |   var typeRow = dc.rowChart('#type')
67 |     .height(200)
68 |     .margins({top: 20, left: 10, right: 10, bottom: 20})
69 |     .dimension(type)
70 |     .cap(5)
71 |     .ordering (function(d) {return d.qty;})
72 |     .colors(d3.scaleOrdinal(d3.schemeCategory10))
73 |     .group(typeGroup)
74 |     .elasticX(true);
75 | 
76 | 
77 |   //var typePie   = dc.pieChart("#type").innerRadius(10).radius(90);
78 |   dc.renderAll();
79 |   CRM.civisualize.charts['exampleTypePie'] = typePie;
80 |   CRM.civisualize.charts['exampleGenderPie'] = genderPie;
81 |   CRM.civisualize.bindResetLinks();
82 | 
83 |   }
84 | 
85 |   // Boot our script as soon as ready.
86 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
87 |   CRM.civisualizeQueue.push(bootViz);
88 | })();
89 | </script>
90 | 
91 | <style>
92 | .clear {clear:both;}
93 | 
94 | </style>
95 | {/literal}
96 | 


--------------------------------------------------------------------------------
/templates/dataviz/Groupbarchart.tpl:
--------------------------------------------------------------------------------
  1 | {if !$embedded}
  2 | {php}CRM_Utils_System::setTitle('What type are your contacts?');{/php}
  3 | <div id="dataviz"></div>
  4 | {/if}
  5 | 
  6 | <script>
  7 | {literal}
  8 | (function() { function bootViz() {
  9 | // Use our versions of the libraries.
 10 | var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 11 | 
 12 | (function (name) {
 13 | 
 14 | {/literal}
 15 | var groups = {crmAPI entity="group_contact" action="getstat"};
 16 | {literal}
 17 | 
 18 | drawGroup(groups.values);
 19 | 
 20 | function drawGroup (data) {
 21 |   var valueLabelWidth = 40; // space reserved for value labels (right)
 22 |   var barHeight = 20; // height of one bar
 23 |   var barLabelWidth = 200; // space reserved for bar labels
 24 |   var barLabelPadding = 5; // padding between bar and bar labels (left)
 25 |   var gridLabelHeight = 18; // space reserved for gridline labels
 26 |   var gridChartOffset = 3; // space between start of grid and first bar
 27 |   var maxBarWidth = 340; // width of the bar with the max value
 28 |    
 29 |   var barLabel = function(d) { return d.name; };
 30 |   var barValue = function(d) { return parseFloat(d.total) };
 31 |   
 32 | // scales
 33 |   var yScale = d3.scaleBand().domain(d3.range(0, data.length)).range([0, data.length * barHeight]);
 34 | 
 35 |   var y = function(d, i) { return yScale(i); };
 36 |   var yText = function(d, i) { return y(d, i) + yScale.bandwidth() / 2; };
 37 |   var x = d3.scaleLinear().domain([0, d3.max(data, barValue)]).range([0, maxBarWidth]);
 38 | 
 39 |   var chart = d3.select('#dataviz').append("svg")
 40 |     .attr("id",name)
 41 |     .attr('width', maxBarWidth + barLabelWidth + valueLabelWidth)
 42 |     .attr('height', gridLabelHeight + gridChartOffset + data.length * barHeight);
 43 |   // grid line labels
 44 |   var gridContainer = chart.append('g')
 45 |     .attr('transform', 'translate(' + barLabelWidth + ',' + gridLabelHeight + ')'); 
 46 |   gridContainer.selectAll("text").data(x.ticks(10)).enter().append("text")
 47 |     .attr("x", x)
 48 |     .attr("dy", -3)
 49 |     .attr("text-anchor", "middle")
 50 |     .text(String);
 51 |   // vertical grid lines
 52 |   gridContainer.selectAll("line").data(x.ticks(10)).enter().append("line")
 53 |     .attr("x1", x)
 54 |     .attr("x2", x)
 55 |     .attr("y1", 0)
 56 |     .attr("y2", yScale.range()[1] + gridChartOffset)
 57 |     .style("stroke", "#ccc");
 58 |   // bar labels
 59 |   var labelsContainer = chart.append('g')
 60 |     .attr('transform', 'translate(' + (barLabelWidth - barLabelPadding) + ',' + (gridLabelHeight + gridChartOffset) + ')'); 
 61 |   labelsContainer.selectAll('text').data(data).enter().append('text')
 62 |     .attr('y', yText)
 63 |     .attr('stroke', 'none')
 64 |     .attr('fill', 'black')
 65 |     .attr("dy", ".35em") // vertical-align: middle
 66 |     .attr('text-anchor', 'end')
 67 |     .text(barLabel);
 68 |   // bars
 69 |   var barsContainer = chart.append('g')
 70 |     .attr('transform', 'translate(' + barLabelWidth + ',' + (gridLabelHeight + gridChartOffset) + ')'); 
 71 |   barsContainer.selectAll("rect").data(data).enter().append("rect")
 72 |     .attr('y', y)
 73 |     .attr('height', yScale.bandwidth())
 74 |     .attr('width', function(d) { return x(barValue(d)); })
 75 |     .attr('stroke', 'white')
 76 |     .attr('fill', 'steelblue');
 77 |   // bar value labels
 78 |   barsContainer.selectAll("text").data(data).enter().append("text")
 79 |     .attr("x", function(d) { return x(barValue(d)); })
 80 |     .attr("y", yText)
 81 |     .attr("dx", 3) // padding-left
 82 |     .attr("dy", ".35em") // vertical-align: middle
 83 |     .attr("text-anchor", "start") // text-align: right
 84 |     .attr("fill", "black")
 85 |     .attr("stroke", "none")
 86 |     .text(function(d) { return d3.round(barValue(d), 2); });
 87 |   // start line
 88 |   barsContainer.append("line")
 89 |     .attr("y1", -gridChartOffset)
 90 |     .attr("y2", yScale.range()[1] + gridChartOffset)
 91 |     .style("stroke", "#000");
 92 | }
 93 |   if (name) {
 94 |     window[name]=this;
 95 |   }
 96 | 
 97 | }{/literal}("{$name}"));{literal}
 98 |   }
 99 | 
100 |   // Boot our script as soon as ready.
101 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
102 |   CRM.civisualizeQueue.push(bootViz);
103 | })();
104 | {/literal}
105 | </script>
106 | 
107 | 


--------------------------------------------------------------------------------
/templates/dataviz/Lapseddonor.tpl:
--------------------------------------------------------------------------------
 1 | <div>
 2 | <h2>Look, a unicorn</h2>
 3 | <table>
 4 | <tr>
 5 | <th>Recovered</th>
 6 | <th>Prior</th>
 7 | </tr><tr>
 8 | <td id="recovered"></td>
 9 | <td id="prior"></td>
10 | </tr></table>
11 | <script>
12 | 'use strict';
13 | //var data = {crmAPI entity="reportinstance"...};
14 | {literal}
15 | (function() { function bootViz() {
16 | // Use our versions of the libraries.
17 | var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
18 | 
19 | var data = {"is_error":0,"version":3,"count":2,"values":[{"from_date":"2010-01-01","to_date":"2011-07-01","recovered":780,"prior":"508"},{"from_date":"2011-07-01","to_date":"2012-12-30","recovered":"9999","prior":"845"}]};
20 | 
21 | 
22 | dc.pieChart("#recovered")
23 |   .width(300)
24 |   .height(300)
25 |   .innerRadius(50)
26 |   .dimension({}).group({})
27 |   .title(function(d) { return d.from_date + "\n->" + d.to_date; })
28 |   .label(function(d) { return d.from_date })
29 |   .keyAccessor(function(d) { return d.from_date + "\n->" + d.to_date; })
30 |   .valueAccessor(function(d) { return d.recovered;})
31 |   .data(function() { return data.values});
32 | 
33 | dc.pieChart("#prior")
34 |   .width(300)
35 |   .height(300)
36 |   .innerRadius(50)
37 |   .dimension({}).group({})
38 |   .title(function(d) { return d.from_date + "\n->" + d.to_date; })
39 |   .label(function(d) { return d.from_date })
40 |   .keyAccessor(function(d) { return d.from_date + "\n->" + d.to_date; })
41 |   .valueAccessor(function(d) { return d.prior;})
42 |   .data(function() { return data.values});
43 | 
44 | dc.renderAll();
45 |   }
46 | 
47 |   // Boot our script as soon as ready.
48 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
49 |   CRM.civisualizeQueue.push(bootViz);
50 | })();
51 | {/literal}
52 | //http://wiki.civicrm.org/confluence/display/CRM/CiviEngage+Enhancements+for+fund-raising#CiviEngageEnhancementsforfund-raising-2.LapsedandRecoveredDonorsChart
53 | </script>
54 | <div style="clear:both;"></div>
55 | </div>
56 | 


--------------------------------------------------------------------------------
/templates/dataviz/Mailing.tpl:
--------------------------------------------------------------------------------
  1 | {crmTitle string="Mailing details"}
  2 | 
  3 | <a class="reset civisualize-reset" href data-chart-name="mailingGraph" >reset</a>
  4 | 
  5 | <div class="row">
  6 | <div id="open" class="col-md-12"><h3>Date Open</h3><div class="graph"></div><div class="avg"></div></div>
  7 | </div>
  8 | 
  9 | <div class="row">
 10 | </div>
 11 | 
 12 | <script>
 13 | var data = {crmSQL json="mailing_open" mailing_id=$id};
 14 | 
 15 | {literal}
 16 | (function() { function bootViz() {
 17 | // Use our versions of the libraries.
 18 | var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 19 | 
 20 | var dateFormatParser = d3.timeParse("%Y-%m-%d %H:%M");
 21 | var currentDate = new Date();
 22 | 
 23 | 
 24 | 
 25 | var prettyDate = function (dateString){
 26 |   var date = new Date(dateString);
 27 |   var d = date.getDate();
 28 |   var m = ('0' + (date.getMonth()+1)).slice(-2);
 29 |   var y = date.getFullYear();
 30 |   var min = ('0' + date.getMinutes()).slice(-2);
 31 |   return d+'/'+m+'/'+y +' ' +date.getHours() + ':'+min;
 32 | }
 33 | 
 34 | 
 35 | function lookupTable(data,key,value) {
 36 |   var t= {}
 37 |   data.forEach(function(d){t[d[key]]=d[value]});
 38 |   return t;
 39 | }
 40 | 
 41 | data.values.forEach(function(d){
 42 |   d.date = dateFormatParser(d.date);
 43 | });
 44 | 
 45 | 
 46 | 
 47 | var ndx  = crossfilter(data.values)
 48 |   , all = ndx.groupAll();
 49 | 
 50 | var totalCount = dc.dataCount("h1 .data_count")
 51 |       .dimension(ndx)
 52 |       .group(all);
 53 | 
 54 | function drawOpen (dom) {
 55 |   var dim = ndx.dimension(function(d){return d.date});
 56 |   //var group = dim.group().reduceSum(function(d){return 1;});
 57 |   var _group = dim.group().reduceSum(function(d){return d.count;});
 58 | 
 59 |   var group = {
 60 |     all:function () {
 61 |      var cumulate = 0;
 62 |      var g = [];
 63 |      _group.all().forEach(function(d,i) {
 64 |        cumulate += d.value;
 65 |        g.push({key:d.key,value:cumulate})
 66 |      });
 67 |      return g;
 68 |     }
 69 |   }; 
 70 |   var graph=dc.lineChart(dom)
 71 |    .margins({top: 10, right: 10, bottom: 20, left:50})
 72 |     .height(200)
 73 |     .dimension(dim)
 74 |     .renderArea(true)
 75 |     .group(group)
 76 |     .brushOn(false)
 77 |     .x(d3.scaleTime().domain(d3.extent(dim.top(3000), function(d) { return d.date; })))
 78 |     //.round(d3.time.day.round)
 79 |     .elasticY(true)
 80 |     .xUnits(d3.timeDays);
 81 | 
 82 |    graph.yAxis().ticks(5);
 83 |    graph.xAxis().ticks(12);
 84 |   return graph;
 85 | }
 86 | 
 87 | 
 88 | CRM.civisualize.charts['mailingGraph'] = drawOpen("#open .graph");
 89 | 
 90 | dc.renderAll();
 91 | CRM.civisualize.bindResetLinks();
 92 | 
 93 |   }
 94 | 
 95 |   // Boot our script as soon as ready.
 96 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
 97 |   CRM.civisualizeQueue.push(bootViz);
 98 | })();
 99 | </script>
100 | 
101 | <style>
102 | .clear {clear:both;}
103 | 
104 | </style>
105 | {/literal}
106 | 


--------------------------------------------------------------------------------
/templates/dataviz/Mailings.tpl:
--------------------------------------------------------------------------------
  1 | {crmTitle string="<span class='data_count'><span class='filter-count'></span> Mailings out of <span class='total-count'></span></span>"}
  2 | 
  3 | <div class="row" >
  4 | <div id="campaign" class="col-md-2"><h3>Campaign</h3><div class="graph"></div></div>
  5 | <div id="sender" class="col-md-2"><h3>Crew</h3><div class="graph"></div></div>
  6 | <div id="open" class="col-md-2"><h3>% Open</h3><div class="graph"></div><div class="avg"></div></div>
  7 | <div id="click" class="col-md-2"><h3>% Click</h3><div class="graph"></div><div class="avg"></div></div>
  8 | <div id="date" class="col-md-4"><h3>Date sent</h3><div class="graph"></div></div>
  9 | </div>
 10 | 
 11 | <div class="row">
 12 | <table class="table table-striped" id="table">
 13 | 
 14 | <thead><tr>
 15 | <th>Date</th>
 16 | <th>Name</th>
 17 | <th>Campaign</th>
 18 | <th>Creator</th>
 19 | <th>Recipients</th>
 20 | <th>Open</th>
 21 | <th>Clicks</th>
 22 | </tr></thead>
 23 | </table>
 24 | </div>
 25 | 
 26 | <div class="row">
 27 | </div>
 28 | 
 29 | <script>
 30 | {literal}
 31 | (function() { function bootViz() {
 32 | // Use our versions of the libraries.
 33 | var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
 34 | 
 35 | {/literal}
 36 | var data = {crmSQL json="mailings"};
 37 | {literal}
 38 | var dateFormat = d3.timeParse("%Y-%m-%d %H:%M:%S");
 39 | var currentDate = new Date();
 40 | 
 41 | var prettyDate = function (dateString){
 42 |   var date = new Date(dateString);
 43 |   var d = date.getDate();
 44 |   var m = ('0' + (date.getMonth()+1)).slice(-2);
 45 |   var y = date.getFullYear();
 46 |   var min = ('0' + date.getMinutes()).slice(-2);
 47 |   return d+'/'+m+'/'+y +' ' +date.getHours() + ':'+min;
 48 | }
 49 | 
 50 | 
 51 | function lookupTable(data,key,value) {
 52 |   var t= {}
 53 |   data.forEach(function(d){t[d[key]]=d[value]});
 54 |   return t;
 55 | }
 56 | 
 57 | data.values.forEach(function(d){
 58 |   d.date = dateFormat(d.date);
 59 | });
 60 | 
 61 | 
 62 | 
 63 | var ndx  = crossfilter(data.values)
 64 |   , all = ndx.groupAll();
 65 | 
 66 | var totalCount = dc.dataCount("h1 .data_count")
 67 |       .dimension(ndx)
 68 |       .group(all);
 69 | 
 70 | function drawCampaign (dom) {
 71 |   var dim = ndx.dimension(function(d){return d.campaign});
 72 |   var group = dim.group().reduceSum(function(d){return 1;});
 73 |   var graph  = dc.pieChart(dom)
 74 |     .innerRadius(10).radius(50)
 75 |     .width(100)
 76 |     .height(100)
 77 |     .dimension(dim)
 78 |     .colors(d3.scaleOrdinal(d3.schemeCategory10))
 79 |     .group(group);
 80 | 
 81 |   return graph;
 82 | }
 83 | 
 84 | function drawSender (dom) {
 85 |   var dim = ndx.dimension(function(d){return d.owner});
 86 |   var group = dim.group().reduceSum(function(d){return 1;});
 87 |   var graph  = dc.pieChart(dom)
 88 |     .innerRadius(10).radius(50)
 89 |     .width(100)
 90 |     .height(100)
 91 |     .dimension(dim)
 92 |     .colors(d3.scaleOrdinal(d3.schemeCategory10))
 93 |     .group(group);
 94 | 
 95 |   return graph;
 96 | }
 97 | function drawType (dom) {
 98 |   var dim = ndx.dimension(function(d){return activityType[d.activity_type_id]});
 99 |   var group = dim.group().reduceSum(function(d){return 1;});
100 |   var graph  = dc.pieChart(dom)
101 |     .innerRadius(10).radius(90)
102 |     .width(250)
103 |     .height(200)
104 |     .dimension(dim)
105 |     .colors(d3.scaleOrdinal(d3.schemeCategory10))
106 |     .group(group);
107 | 
108 |   return graph;
109 | }
110 | 
111 | function drawDate (dom) {
112 |   var dim = ndx.dimension(function(d){return d3.timeDay(d.date)});
113 |   //var group = dim.group().reduceSum(function(d){return 1;});
114 |   var group = dim.group().reduceSum(function(d){return d.recipients;});
115 |   var graph=dc.lineChart(dom)
116 |    .margins({top: 10, right: 10, bottom: 20, left:50})
117 |     .height(100)
118 |     .dimension(dim)
119 |     .renderArea(true)
120 |     .group(group)
121 |     .brushOn(true)
122 |     .x(d3.scaleTime().domain(d3.extent(dim.top(2000), function(d) { return d.date; })))
123 |     .round(d3.timeDay.round)
124 |     .elasticY(true)
125 |     .xUnits(d3.timeDays);
126 | 
127 |    graph.yAxis().ticks(3);
128 |    graph.xAxis().ticks(5);
129 |   return graph;
130 | }
131 | 
132 | 
133 | function drawPercent (dom,attr,name) {
134 |   //var dim = ndx.dimension(function(d){return 10 * Math.floor((accessor(d)/d.recipients* 10)) });
135 |   var dim = ndx.dimension(function(d){return 10 * Math.floor((attr(d)/d.recipients* 10)) });
136 |   var group = dim.group().reduceSum(function(d){return 1;});
137 |   //var group = dim.group().reduceSum(function(d){return d.recipients;});
138 | 
139 | 
140 |   var graph = dc.barChart(dom+ " .graph")
141 |     .height(100)
142 |     .width(150)
143 |     .gap(0)
144 |     .margins({top: 10, right: 0, bottom: 20, left: 20})
145 |     .colorCalculator(function(d, i) {
146 |         return "#f85631";
147 |         })
148 |     .x(d3.scaleOrdinal())
149 |     .xUnits(dc.units.ordinal)
150 |     .brushOn(false)
151 |     .elasticY(true)
152 |     .yAxisLabel(name)
153 |     .dimension(dim)
154 |     .group(group)
155 |     .on('renderlet', function(chart) {
156 | 	    var d = chart.dimension().top(Number.POSITIVE_INFINITY);
157 | 	    var total = nb = recipients = 0;
158 | 	    d.forEach(function(a) {
159 | 		++nb;
160 |                 recipients += a.recipients;
161 |                 if (a.recipients)
162 | 	  	  total += attr(a);
163 | 	    });
164 | 	    if (nb) {
165 | 		//var avg = 100 * total / nb;
166 | 		var avg = 100 * total / recipients;
167 | 		jQuery(dom + " .avg").text(Math.round(avg) + "%");
168 | 	    } else {
169 | 		jQuery(dom +" .avg").text("");
170 | 	    }
171 |       }
172 |     );
173 | 
174 | 
175 |    graph.yAxis().ticks(3);
176 |    graph.xAxis().ticks(4);
177 |    return graph;
178 | }
179 | 
180 | 
181 | function drawTable(dom) {
182 |   var dim = ndx.dimension (function(d) {return d.id});
183 |   var graph = dc.dataTable(dom)
184 |     .dimension(dim)
185 |     .size(2000)
186 |     .group(function(d){ return ""; })
187 |     .sortBy(function(d){ return d.date; })
188 |     .order(d3.descending)
189 |     .columns(
190 | 	[
191 | 	    function (d) {
192 | 		return prettyDate(d.date);
193 | 	    },
194 | 	    function (d) {
195 |              return "<a title='"+d.subject+"' href='/civicrm/mailing/report?mid="+d.id+"' target='_blank'>"+d.name+"</a> <small><a title='Date Open graph' href='/civicrm/dataviz/mailing/"+d.id+"' >(details)</a></small>";
196 | 	    },
197 | 	    function (d) {
198 | 		return "<a href='/civicrm/campaign/add?reset=1&action=update&id="+d.campaign_id+"' target='_blank'>"+d.campaign+"</a>";
199 | 	    },
200 | 	    function (d) {
201 |               return d.owner;
202 | 	    },
203 | 	    function (d) {
204 |               return d.recipients;
205 | 	    },
206 | 	    function (d) {
207 |               return "<span title='"+d.open+" contacts' >"+Math.round (100*d.open/d.recipients)+"%</span>";
208 | 	    },
209 | 	    function (d) {
210 |               return "<span title='"+d.click+" contacts' >"+Math.round (100*d.click/d.recipients)+"%</span>";
211 | 	    },
212 | 	]
213 |     );
214 | 
215 |   return graph;
216 | }
217 | 
218 |  
219 | drawPercent("#open", function(d){return d.open});
220 | drawPercent("#click", function(d){return d.click});
221 | drawTable("#table");
222 | //drawType("#type .graph");
223 | drawDate("#date .graph");
224 | //drawStatus("#status .graph");
225 | drawSender("#sender .graph");
226 | drawCampaign("#campaign .graph");
227 | 
228 | dc.renderAll();
229 |   }
230 | 
231 |   // Boot our script as soon as ready.
232 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
233 |   CRM.civisualizeQueue.push(bootViz);
234 | 
235 | })();
236 | </script>
237 | 
238 | <style>
239 | .row {
240 |   display: flex;
241 |   flex-wrap: wrap;
242 |   margin: 0 -1rem;
243 | }
244 | .row > div {
245 |   padding: 1rem;
246 |   flex: 1 0 auto;
247 | }
248 | </style>
249 | {/literal}
250 | 


--------------------------------------------------------------------------------
/templates/dataviz/Tag.tpl:
--------------------------------------------------------------------------------
  1 | {*crmScript ext=eu.tttp.civisualize file=bar.js*}
  2 | <div id="dataviz"></div>
  3 | <script>
  4 | var data={crmAPI entity="tag" action="getstat"};
  5 | {literal}
  6 | (function() { function bootViz() {
  7 | // Use our versions of the libraries.
  8 | var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
  9 | 
 10 | function tree(nodes,p) {
 11 |   var p = p || function (d){return d.parent_id};
 12 |   var nodeById = {};
 13 | 
 14 |   // Index the nodes by id, in case they come out of order.
 15 |   nodes.forEach(function(d) {
 16 |     nodeById[d.id] = d;
 17 |   });
 18 | 
 19 |   // Lazily compute children.
 20 |   nodes.forEach(function(d) {
 21 |     if ("manager" in d) {
 22 |       var parent = nodeById[p(d)];
 23 |       if (parent.children) manager.children.push(d);
 24 |       else manager.children = [d];
 25 |     }
 26 |   });
 27 | 
 28 |   return nodes[0];
 29 | }
 30 | 
 31 | var t = tree (data.values);
 32 | 
 33 | 
 34 | 
 35 | var drawTable = (function(data) {
 36 | /*d3.selectAll("#dataviz").append("ul").attr("id","data-list")
 37 |   .selectAll(".data-item")
 38 |   .data(data.values)
 39 |   .enter()
 40 |     .append("li")
 41 |     .attr("id",function(d){return "tag-"+d.id;})
 42 |     .html(function(d){return d.name});
 43 | */
 44 | 
 45 |   var columns = d3.keys(data[0]);
 46 | 
 47 | var table = d3.selectAll("#dataviz").append("table").attr("id","data-list")
 48 |       ,thead = table.append("thead")
 49 |       ,tbody = table.append("tbody");
 50 | 
 51 |     // append the header row
 52 |  thead.append("tr")
 53 |    .selectAll("th")
 54 |    .data(columns)
 55 |    .enter()
 56 |    .append("th")
 57 |      .text(function(column) { return column; });
 58 | 
 59 |   
 60 | var tr= tbody.selectAll("tr")  
 61 |   .data(data)
 62 |   .enter()
 63 |     .append("tr")
 64 |     .attr("id",function(d){return "tag-"+d.id;})
 65 | 
 66 | tr.selectAll("td")
 67 |   .data(function(row) {
 68 |     return columns.map(function(column) { return row[column]})})
 69 |   .enter()
 70 |   .append("td")
 71 |     .text(function(d) {return d});
 72 | 
 73 | });
 74 |   
 75 | drawTable(data.values);
 76 | 
 77 | function drawBubble() {
 78 | var diameter = 960,
 79 |     format = d3.format(",d"),
 80 |     color = d3.scale.category20c();
 81 | 
 82 | var bubble = d3.layout.pack()
 83 |     .sort(null)
 84 |     .size([diameter, diameter])
 85 |     .padding(1.5);
 86 | 
 87 | var svg = d3.select("body").append("svg")
 88 |     .attr("width", diameter)
 89 |     .attr("height", diameter)
 90 |     .attr("class", "bubble");
 91 | 
 92 |   var node = svg.selectAll(".node")
 93 |       .data(bubble.nodes(data.values))
 94 |     .enter().append("g")
 95 |       .attr("class", "node")
 96 |       .attr("transform", function(d) { return "translate(" + d.x + "," + d.y + ")"; });
 97 | 
 98 |   node.append("title")
 99 |       .text(function(d) { return d.name; });
100 | 
101 |   node.append("circle")
102 |       .attr("r", function(d) { return d.r; })
103 |       .style("fill", function(d) { return color(d.packageName); });
104 | 
105 |   node.append("text")
106 |       .attr("dy", ".3em")
107 |       .style("text-anchor", "middle")
108 |       .text(function(d) { return d.name.substring(0, d.r / 3); });
109 | 
110 | 
111 | };
112 | 
113 |   }
114 | 
115 |   // Boot our script as soon as ready.
116 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
117 |   CRM.civisualizeQueue.push(bootViz);
118 | })();
119 | {/literal}
120 | </script>
121 | 


--------------------------------------------------------------------------------
/templates/dataviz/Typebarchart.tpl:
--------------------------------------------------------------------------------
  1 | <div id="dataviz">
  2 | </div>
  3 | 
  4 | <script>
  5 | {literal}
  6 | (function() { function bootViz() {
  7 |   // Use our versions of the libraries.
  8 |   var d3 = CRM.civisualize.d3, dc = CRM.civisualize.dc, crossfilter = CRM.civisualize.crossfilter;
  9 |   (function () {
 10 |   {/literal}
 11 |   var types = {crmAPI entity="contact" action="getstat" return="contact_type"};
 12 |   var groups = {crmAPI entity="group_contact" action="getstat"};
 13 |   {literal}
 14 | 
 15 |   drawType(types);
 16 |   drawGroup(groups.values);
 17 | 
 18 |   function drawType(types) {
 19 |     var width = 300,
 20 |         height = 300,
 21 |         radius = Math.min(width, height) / 2;
 22 | 
 23 |     var color = d3.scaleOrdinal()
 24 |         .range(["#98abc5", "#8a89a6", "#7b6888", "#6b486b", "#a05d56", "#d0743c", "#ff8c00"]);
 25 | 
 26 |     var arc = d3.arc()
 27 |         .outerRadius(radius - 10)
 28 |         .innerRadius(radius - 60);
 29 | 
 30 |     var pie = d3.pie()
 31 |         .sort(null)
 32 |         .value(function(d) { return d.total; });
 33 | 
 34 |     var svg = d3.select("#dataviz").append("svg")
 35 |         .attr("width", width*2)
 36 |         .attr("height", height);
 37 | 
 38 |     var g= svg.append("g")
 39 |         .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");
 40 | 
 41 |     var legend= d3.selectAll("#dataviz").append("ul")
 42 |         .attr("id","legend")
 43 |         .selectAll(".legendLine")
 44 |           .data(types.values)
 45 |           .enter()
 46 |           .append("li")
 47 |             .attr("class","legendLine")
 48 |             .style("background-color", function(d) { return color(d.contact_type); })
 49 |             .html(function(d) { return d.contact_type; });
 50 | 
 51 |       var a = g.selectAll(".arc")
 52 |           .data(pie(types.values))
 53 |         .enter()
 54 |           .append("path")
 55 |           .attr("d", arc)
 56 |           .attr("class", "arc")
 57 |           .style("fill", function(d) { return color(d.data.contact_type); })
 58 |     /*
 59 |           .append("text")
 60 |           .attr("transform", function(d) { return "translate(" + arc.centroid(d) + ")"; })
 61 |           .attr("dy", ".35em")
 62 |           .style("text-anchor", "middle")
 63 |           .text(function(d) { return d.data.contact_type; });
 64 |     */
 65 | 
 66 |     //    pie.value(function(d) { return d.total; });
 67 |     //    g.transition().duration(750).attrTween("d", arcTween);
 68 | 
 69 |       g.append("text")
 70 |         .attr("class","total")
 71 |         .style("text-anchor", "middle")
 72 |         .attr("font-size","10px")
 73 |         .text(function(d) {
 74 |           var t=0;
 75 |           types.values.forEach(function (e){
 76 |             t = t+parseFloat(e.total);});
 77 |             return t;
 78 |         })
 79 |         .transition()
 80 |         .duration(function (){return 2000;})
 81 |           .attr("font-size","40px");
 82 |   }
 83 | 
 84 |   function drawGroup (data) {
 85 |   console.log(data);
 86 |     var valueLabelWidth = 40; // space reserved for value labels (right)
 87 |     var barHeight = 20; // height of one bar
 88 |     var barLabelWidth = 200; // space reserved for bar labels
 89 |     var barLabelPadding = 5; // padding between bar and bar labels (left)
 90 |     var gridLabelHeight = 18; // space reserved for gridline labels
 91 |     var gridChartOffset = 3; // space between start of grid and first bar
 92 |     var maxBarWidth = 420; // width of the bar with the max value
 93 | 
 94 |     var barLabel = function(d) { return d.name; };
 95 |     var barValue = function(d) { return parseFloat(d.total) };
 96 | 
 97 |   // scales
 98 |     var yScale = d3.scaleBand().domain(d3.range(0, data.length)).range([0, data.length * barHeight]);
 99 |     window.xx = yScale;
100 |     var y = function(d, i) { return yScale(i); };
101 |     var yText = function(d, i) { return y(d, i) + yScale.bandwidth() / 2; };
102 |     var x = d3.scaleLinear().domain([0, d3.max(data, barValue)]).range([0, maxBarWidth]);
103 | 
104 |     var chart = d3.select('#dataviz').append("svg")
105 |       .attr('width', maxBarWidth + barLabelWidth + valueLabelWidth)
106 |       .attr('height', gridLabelHeight + gridChartOffset + data.length * barHeight);
107 |     // grid line labels
108 |     var gridContainer = chart.append('g')
109 |       .attr('transform', 'translate(' + barLabelWidth + ',' + gridLabelHeight + ')');
110 |     gridContainer.selectAll("text").data(x.ticks(10)).enter().append("text")
111 |       .attr("x", x)
112 |       .attr("dy", -3)
113 |       .attr("text-anchor", "middle")
114 |       .text(String);
115 |     // vertical grid lines
116 |     gridContainer.selectAll("line").data(x.ticks(10)).enter().append("line")
117 |       .attr("x1", x)
118 |       .attr("x2", x)
119 |       .attr("y1", 0)
120 |       .attr("y2", yScale.range()[1] + gridChartOffset)
121 |       .style("stroke", "#ccc");
122 |     // bar labels
123 |     var labelsContainer = chart.append('g')
124 |       .attr('transform', 'translate(' + (barLabelWidth - barLabelPadding) + ',' + (gridLabelHeight + gridChartOffset) + ')');
125 |     labelsContainer.selectAll('text').data(data).enter().append('text')
126 |       .attr('y', yText)
127 |       .attr('stroke', 'none')
128 |       .attr('fill', 'black')
129 |       .attr("dy", ".35em") // vertical-align: middle
130 |       .attr('text-anchor', 'end')
131 |       .text(barLabel);
132 |     // bars
133 |     var barsContainer = chart.append('g')
134 |       .attr('transform', 'translate(' + barLabelWidth + ',' + (gridLabelHeight + gridChartOffset) + ')');
135 |     barsContainer.selectAll("rect").data(data).enter().append("rect")
136 |       .attr('y', y)
137 |       .attr('height', yScale.bandwidth())
138 |       .attr('width', function(d) { return x(barValue(d)); })
139 |       .attr('stroke', 'white')
140 |       .attr('fill', 'steelblue');
141 |     // bar value labels
142 |     barsContainer.selectAll("text").data(data).enter().append("text")
143 |       .attr("x", function(d) { return x(barValue(d)); })
144 |       .attr("y", yText)
145 |       .attr("dx", 3) // padding-left
146 |       .attr("dy", ".35em") // vertical-align: middle
147 |       .attr("text-anchor", "start") // text-align: right
148 |       .attr("fill", "black")
149 |       .attr("stroke", "none")
150 |       .text(function(d) { return d3.round(barValue(d), 2); });
151 |     // start line
152 |     barsContainer.append("line")
153 |       .attr("y1", -gridChartOffset)
154 |       .attr("y2", yScale.range()[1] + gridChartOffset)
155 |       .style("stroke", "#000");
156 |   }
157 | 
158 |   }());
159 |   }
160 | 
161 |   // Boot our script as soon as ready.
162 |   CRM.civisualizeQueue = CRM.civisualizeQueue || [];
163 |   CRM.civisualizeQueue.push(bootViz);
164 | })();
165 | </script>
166 | 
167 | <style>
168 | 
169 | #dataviz {position:relative;}
170 | #legend {
171 |   position: absolute;
172 |   width: 120px;
173 |   left:300px;
174 |   top:40px;
175 |   padding: 2px;
176 |   font: 12px sans-serif;
177 |   background: #eee;
178 |   border: 0px;
179 |   border-radius: 5px;
180 |   pointer-events: none;
181 |   border: 1px solid rgba(0,0,0,.2);
182 |   z-index: 10000;
183 | 
184 |   transition: opacity 500ms linear;
185 |   -moz-transition: opacity 500ms linear;
186 |   -webkit-transition: opacity 500ms linear;
187 | 
188 |   transition-delay: 500ms;
189 |   -moz-transition-delay: 500ms;
190 |   -webkit-transition-delay: 500ms;
191 | 
192 |   -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
193 |   -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
194 |   box-shadow: 0 5px 10px rgba(0,0,0,.2);
195 | 
196 |   -webkit-touch-callout: none;
197 |   -webkit-user-select: none;
198 |   -khtml-user-select: none;
199 |   -moz-user-select: none;
200 |   -ms-user-select: none;
201 |   user-select: none;
202 | }
203 | 
204 | #legend li {
205 | margin:0 0 5px 0;
206 | padding:10px 10px 10px 10px;
207 | list-style:none;
208 | color:white;
209 | border-radius: 5px;
210 |   text-align: center;
211 | }
212 | 
213 | #legend ul {
214 |   padding:5px 0 0 0;
215 |   margin:0;
216 | }
217 | 
218 | </style>
219 | {/literal}
220 | 
221 | 


--------------------------------------------------------------------------------
/updateTpl:
--------------------------------------------------------------------------------
  1 | #!/usr/bin/php
  2 | <?php
  3 | if (php_sapi_name() !== 'cli') {
  4 |   // Fail with 404 if not called from CLI.
  5 |   if (isset($_SERVER['HTTP_PROTOCOL'])) {
  6 |     header("$_SERVER[HTTP_PROTOCOL] 404 Not Found");
  7 |   }
  8 |   exit;
  9 | }
 10 | // Note: options MUST be given before positional parameters.
 11 | 
 12 | function die_with_help($error=NULL) {
 13 |   global $argv;
 14 |   if ($error !== NULL) {
 15 |     fwrite(STDERR, "$error\n");
 16 |   }
 17 |   echo <<<TXT
 18 | Usage: $argv[0] [-h] path/to/your/dataviz/template.tpl [another.tpl ...]
 19 | 
 20 | This attempts to convert d3 from version 3 to 5 which has a different API.
 21 | 
 22 | TXT;
 23 |   exit(1);
 24 | }
 25 | 
 26 | $optind = null;
 27 | // getopt format:
 28 | //
 29 | // - single letter on its own is a boolean
 30 | // - follow with : for a required value
 31 | // - follow with :: for an optional value
 32 | //
 33 | // Test for an option with isset()
 34 | // @see http://php.net/getopt
 35 | $options = getopt('u::p::s');
 36 | $optind = 1 + count($options);
 37 | $pos_args = array_slice($argv, $optind);
 38 | 
 39 | if (count($pos_args) === 0) {
 40 |   die_with_help("No template filename.");
 41 | }
 42 | 
 43 | foreach ($pos_args as $tpl) {
 44 |   $warnings = [];
 45 | 
 46 |   if (!file_exists($tpl)) {
 47 |     fwrite(STDERR, "Skipping file: Not found: '$tpl'\n");
 48 |     continue;
 49 |   }
 50 |   if (!is_writeable($tpl)) {
 51 |     fwrite(STDERR, "Skipping file: Missing write permission: '$tpl'\n");
 52 |     continue;
 53 |   }
 54 |   if (!is_writeable(dirname($tpl))) {
 55 |     fwrite(STDERR, "Skipping file: Missing write permission on the directory: '" . dirname($tpl) . "'\n");
 56 |     continue;
 57 |   }
 58 |   // Create a backup.
 59 |   $i = 1;
 60 |   while (file_exists("$tpl.backup.$i")) { $i++; }
 61 |   if (!copy($tpl, "$tpl.backup.$i")) {
 62 |     fwrite(STDERR, "Skipping file: failed to create backup file for '$tpl'\n");
 63 |     continue;
 64 |   }
 65 | 
 66 |   // Go go go.
 67 |   $html = file_get_contents($tpl);
 68 |   //"timeFormat, timeParse, timeInterval, timeMillisecond, timeMilliseconds, timeSecond, timeSeconds, timeMinute, timeMinutes, timeHour, timeHours, timeDay, timeDays, timeWeek, timeWeeks, timeSunday, timeSundays, timeMonday, timeMondays, timeTuesday, timeTuesdays, timeWednesday, timeWednesdays, timeThursday, timeThursdays, timeFriday, timeFridays, timeSaturday, timeSaturdays, timeMonth, timeMonths, timeYear, timeYears, timeFormatDefaultLocale, timeFormatLocale, timer, timerFlush, timeout"
 69 | 
 70 |   // Convert time.format(...).parse to timeParse(...)
 71 |   $html = preg_replace('/d3\.time\.format(\([^)]+\)).parse/', 'd3.timeParse$1', $html);
 72 | 
 73 |   // Convert remaining time.format to timeFormat, along with these others.
 74 |   // Convert time.something to timeSomething.
 75 |   $html = preg_replace_callback('/d3\.time\.(format|interval|millisecond|milliseconds|second|seconds|minute|minutes|hour|hours|day|days|week|weeks|sunday|sundays|monday|mondays|tuesday|tuesdays|wednesday|wednesdays|thursday|thursdays|friday|fridays|saturday|saturdays|month|months|year|years|formatdefaultlocale|formatlocale)/', 
 76 |     function ($matches) {
 77 |       return 'd3.time' . ucfirst($matches[1]);
 78 |     },
 79 |     $html);
 80 | 
 81 |   if (strpos($html, '.parse') !== FALSE) {
 82 |     $warnings[] = "Search for .parse, this may be something that needs changing.\n"
 83 |       ."\td3.time.format(...).parse needs to be replaced with d3.timeParse(...)\n"
 84 |       ."\tIf you revert to the original and change code like\n"
 85 |       ."\t\tvar f = d3.time.format('%y');\n"
 86 |       ."\t\tvar d = f.parse(mydate);\n"
 87 |       ."\twith code like\n"
 88 |       ."\t\tvar f = d3.time.format('%y').parse;\n"
 89 |       ."\t\tvar d = f(mydate);\n"
 90 |       ."\tthen this converter should handle it ok\n";
 91 |   }
 92 | 
 93 |   // Convert time.scale.utc to scaleUtc
 94 |   $html = str_replace('d3.time.scale.utc', 'd3.scaleUtc', $html);
 95 |   // Convert time.scale to scaleTime
 96 |   $html = str_replace('d3.time.scale', 'd3.scaleTime', $html);
 97 |   // svg.arc
 98 |   $html = str_replace('d3.svg.arc', 'd3.arc', $html);
 99 |   $html = str_replace('d3.layout.pie', 'd3.pie', $html);
100 | 
101 |   // Convert time.scale.linear to scaleLinear etc.
102 |   $html = preg_replace_callback('/d3\.scale\.(linear|sqrt|pow|log|quantize|threshold|quantile|identity|ordinal)/',
103 |     function ($matches) {
104 |       return 'd3.scale' . ucfirst($matches[1]);
105 |     },
106 |     $html);
107 | 
108 | 
109 |   // schemeCategory (whatever that is!)
110 |   $html = preg_replace_callback('/d3\.scale\.(category(?:10|20[bc]?))\(\)/',
111 |     function ($matches) {
112 |       return 'd3.scaleOrdinal(d3.scheme' . ucfirst($matches[1]) . ')';
113 |     },
114 |     $html);
115 | 
116 | 
117 |   // renderlet(function) -> on('renderlet', function)
118 |   $html = str_replace('.renderlet(', ".on('renderlet', ", $html);
119 | 
120 |   if (!$html) {
121 |     // Just in case.
122 |     fwrite(STDERR, "Failed to convert file '$tpl'\n");
123 |     continue;
124 |   }
125 | 
126 |   print "$tpl: ";
127 |   if ($warnings) {
128 |     print "WARNINGS\n";
129 |     foreach ($warnings as $_) { print "Warning: $_\n";}
130 |     print "\n";
131 |   }
132 |   else {
133 |     print "no errors or warnings.\n";
134 |   }
135 |   if (!file_put_contents($tpl, $html)) {
136 |     fwrite(STDERR, "Failed to write file '$tpl'\n");
137 |   }
138 | }
139 | 


--------------------------------------------------------------------------------
/xml/Menu/civisualize.xml:
--------------------------------------------------------------------------------
 1 | <?xml version="1.0"?>
 2 | <menu>
 3 |   <item>
 4 |     <path>civicrm/dataviz</path>
 5 |     <page_callback>CRM_Civisualize_Page_Main</page_callback>
 6 |     <title>Datavisualize</title>
 7 |     <access_arguments>access CiviReport</access_arguments>
 8 |   </item>
 9 |   <item>
10 |     <path>civicrm/datadoc</path>
11 |     <page_callback>CRM_Civisualize_Page_Doc</page_callback>
12 |     <title>Documentation</title>
13 |     <access_arguments>access CiviReport</access_arguments>
14 |   </item>
15 | </menu>
16 | 


--------------------------------------------------------------------------------