Web App Builder Widget: Crowdsource Voting or Spatial Reddit

[DavidWasserman]

Hi all,

Does anyone have any thoughts on what would be required to make a version of the Edit Widget that essentially has an up and a down vote buttons on existing comments? Something that happens a lot is people put overlapping comments but also they usually can't express disagreement as well with comments that might exist. I was curious if it is possible to essentially make a "Spatial Reddit"?

The widget would essentially do the following:

1. Allow voting that changes an attribute in the database based on votes.

2. Buttons would be in place that allow you to click on existing comments and upvote them or down vote them based their existing location.

3. The option exists to based the symbology based on this changing attribute.

4. Has some of the key features of the edit widget.

5. Ideally allows one vote per user (IP Address), at minimum one vote per map instance.

Robert Scheitlin, GISP​, your thoughts would be great, especially regarding level of effort or if something already exists.

David

[RobertScheitlin__GISP]

David,

  I have not had the need to go down this road before so I don't have any suggestions or code. But I do remember seeing a JS sample that had this type of up or down vote so if it can be done in the JS API you can do it in WAB.

[DavidWasserman]

Thanks Robert. Do you perhaps remember where this JS Sample was?

[RobertScheitlin__GISP]

David,

  This was the sample I was thinking of and it it not real close to what you were looking for but it may get you started:

ArcGIS API for JavaScript Sandbox

[DavidWasserman]

Thanks for sharing it. I think it will help a  lot.

[mazlianamohd_nordin]

Hi, 

I'm also try to create voting in Edit widget. Do you get the solution on it?

I try to calculate vote in editor widget, but the fiedvalue is not firing, no value are show in my text box.

can you help me?

here is my code

    var layerInfos = [

                        {

                            'featureLayer': layertemplate,

                            'showAttachments': true,

                            'isEditable': true,

                            'showDeleteButton': true,

                            'fieldInfos': [

                                { 'fieldName': 'NAMA_PELAPOR', 'isEditable': false, 'label': PL + ':' },

                                { 'fieldName': 'ADDRESS', 'isEditable': false, 'label': AD + ':' },

                                { 'fieldName': 'POI_NAME', 'isEditable': false, 'label': TT + ':' },

                                { 'fieldName': 'NO_TEL_PELAPOR', 'isEditable': false, 'label': TL + ':' },

                                { 'fieldName': 'CATATAN', 'isEditable': true, 'label': CT + ':' },

                                { 'fieldName': stat, 'isEditable': true, 'label': ST + ':' },

                                { 'fieldName': 'PUBLIC_VIEW', 'isEditable': true, 'label': PV + ':' },

                                { 'fieldName': 'ARAS_KEDALAMAN', 'isEditable': true, 'label': AK + ':' },

                                { 'fieldName': 'TYPE', 'isEditable': true, 'label': TY + ':' },

                                { 'fieldName': 'PENGEMASKINI', 'isEditable': false, 'label': UP + ':' },

                                { 'fieldName': 'LONGITUDE', 'isEditable': true, 'label': 'LONGITUDE' + ':' },

                                { 'fieldName': 'LATITUDE', 'isEditable': true, 'label': 'LATITUDE' + ':' }

                            ]

                        }

                    ];

                    var attInspector = new AttributeInspector({

                        layerInfos: layerInfos

                    }, domConstruct.create("div")); //"attributeDiv");

                    console.log({ attInspector });

                    selectQuery.objectIds = [evt.graphic.attributes.OBJECTID];

                    layertemplate.selectFeatures(selectQuery, FeatureLayer.SELECTION_NEW, function (features) {

                        if (features.length > 0) {

                            //store the current feature

                            updateFeature = features[0];

                            console.log(attInspector.domNode);

                            count_like = (updateFeature.attributes["COUNT_RATING"]) ? updateFeature.attributes["STAR_RATING"] : 0;

                            start_rating = (updateFeature.attributes["STAR_RATING"]) ? updateFeature.attributes["STAR_RATING"] : 0;

                            if (id == "33") {

                                content = "<br/><i><span id='numPeople'>" + count_like +

                                    "</span> <img style='cursor:pointer;height:20px;width:20px' src='../assets/img/thumbup.png'> Like this restaurant.</i><br/><hr/>";

                                content += attInspector.domNode.innerHTML;

                                content += "<br/><hr/>Average rating :" + start_rating;

                                console.log({ content });

                                map.infoWindow.setTitle(features[0].getLayer().name);

                                map.infoWindow.setContent(content);

                                map.infoWindow.resize(350, 200);

                                map.infoWindow.resize(350, 180);

                                map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));

                            }

It will be greate if you can share your thoughts and solutions.

Mazliana