1

以下は、会社が現在取り組んでいるプロジェクトの数に基づいて個別の div を作成するために使用するコードです。各 div には、プロジェクトの最新のビルドが成功したか失敗したかが含まれます。

現在、120 秒から 180 秒の間に自動的に更新されるように設定しています。現時点では、すべての div が同時に更新されます。各divがランダムに独自に更新されるようにしたいと思います。

div を作成する CSHMTL:

@if (Model.Client.ClientStatus != null && Model.Client.ClientStatus.Trim() != "InActive")
{
<div class="span4 dashboard-success">

<div class="well dashboard-well" style="display:none;">
    <div class="loading">Loading...</div>
    <div> 
        <div class="dashboard-link">

            <h3>@Html.ActionLink(Model.Client.ClientName, "Details", new { controller = "Client", ClientId = Model.Client.ClientID })</h3>
        </div>
    </div>
    @foreach (var project in Model.Client.Projects)
    {

        <div>        
            <div class="dashboard-link">
                <h4>@Html.ActionLink(project.ProjectName, "Details/" + project.ProjectID, "project", new { controller = "Client", ClientId = Model.Client.ClientID },
                    new { controller = "Project", ProjectId = project.ProjectID })</h4>

            </div>

      @if (project.ProjectStatus != null && project.ProjectStatus.Trim() != "InActive")
      {
            <table class="build table table-condensed">
                @foreach (var build in project.Builds)
                {          


                    <tr id="@project.ProjectName.Trim().ToLower().Replace(" ", "_").Replace(".", "").Replace("-", "").Replace("[", "").Replace("]", "")@build.BuildConfigID">
                        <td>                            
                            <!--Adds a link back to client project build details-->

                                <a href = @Url.Content("client/" + Model.Client.ClientID.ToString() + "/project/" +
                                        project.ProjectID + "/build/Details/" + build.BuildID)>@build.BuildName</a>

                        </td>
                        <td class="date">
                        </td>
                        <td class="user">   
                        </td>
                        <td class="status">
                        </td>
                    </tr>                 
                }
            </table>
      }
        </div> 
    }
</div>

ページの更新を処理する Javascript:

function random(x) {
  return Math.floor(x * (Math.random() % 1))
}

function randomBetween(MinV, MaxV) {
    return MinV + random(MaxV - MinV + 1)
}

$(function () {
    UpdateStatus();
    window.setInterval(UpdateStatus, randomBetween(120000, 180000))
})

現在、これらはすべて部分ビューに配置されています。どんな考えや提案も大歓迎です。

編集: UpdateStatus() の要求されたコード

function UpdateStatus() {
    $(".dashboard-well").show().css({ 'background-color': "black", 'overflow': "hidden" })
    $(".loading").show()
    $("td").hide()
    $(".status").hide()
    $.ajax
    ({
        url: "/Build/AllStatuses", //New ULRs
        dataType: 'json',
        success: function (buildstatuses) {

            for (var i in buildstatuses) {
                var status = buildstatuses[i];
                var statusColor = 'black';
                switch (status.status) {
                    case "SUCCESS":
                        statusColor = "green";
                        break;
                    case "FAILURE":
                        statusColor = "#99182C";
                        break;
                    case "ERROR":
                        statusColor = "#CD950C";
                        break;
                    default:
                        statusColor = "black";
                        break;
                }
                var rowID = $.trim(new String(status.teamCityProject).toLowerCase().replace(/ /g, "_").replace(/\./g, "").replace(/-/g, "").replace(/\[/g, "").replace(/]/g, "")) + status.id;


                $("tr#" + rowID + " td.status").html(status.status).css({ 'color': statusColor, 'font-weight': 'bolder' })
                if (status.status != "SUCCESS") {



                    var row = $("tr#" + rowID)

                    row.parent().parent().parent().parent().parent().removeClass("dashboard-success").addClass("dashboard-fail");

                    row.parent().parent().prepend(row.clone());  // Places Failure at the top by cloning then removing
                    row.remove();

                }

                $("tr#" + rowID + " td.date").html(status.date)
                $("tr#" + rowID + " td.user").html(status.user)

                // jQuery show hide
                $(".loading").hide()
                $(".dashboard-well").show().css({ 'background-color': "#D8D8D8", 'overflow': "auto" })
                $(".status").show()
                $("td").show()


            }

            //Sets Failed results to the left
            $("div.dashboard-fail").each(function () {

                var div = $(this);

                div.parent().prepend(div.clone());
                div.remove();

            });

            // Scroll to the bottom of the Div defined and scroll up --> See scroll function at top

            scrollDown();
            scrollUp();
            scrollDown();
        }

    })
}
</script>
4

2 に答える 2

1

次の行に沿って何かを試してください。

<script type="text/javascript">
$(function () {
    UpdateStatus("@Model.Client.ClientID")
    var random = randomBetween(120000, 180000)

    window.setInterval(function(){
        UpdateStatus("@Model.Client.ClientID")
    }, random)
})
 </script>

これはあなたの .cshtml ページに追加されます。これは UpdateStatus 関数を呼び出します。これは以前には発生していなかったと思います。これが機能するかどうかを教えてください。

于 2012-06-01T12:56:04.227 に答える
-1

これらのdivを完全にランダムに更新しないことをお勧めします。これは、ランダム性により、サーバーへのストレスを均等にする可能性が効果的に排除されるためです。

したがって、ランダムカウンターを使用してupdate-waveをトリガーすることをお勧めします。これにより、単一のdivが更新され、新しいバージョンが取得されてから、次のバージョンが更新されます。多くのdivがある場合は、一度に複数のコンテナーを更新する価値があるかもしれません(したがって、次のウェーブが始まる前にウェーブが実際に終了します)。ウェーブのランダムな開始を設定すると、複数のクライアントが異なる時間にdiv-containerを更新できるようになります。これにより、サーバーへの同時ストレスが均等になります。

単一のdivを更新するには、UpdateStatus()関数を変更して、ProjectIDで識別される特定のプロジェクトを更新することをお勧めします(この情報にアクセスできるようですので、使用しないでください)。UpdateStatus(ProjectID)関数が終了したら、このプロジェクトの情報を含むdivを取得し、それに応じて更新します。

于 2012-05-30T14:17:39.857 に答える